24 K-Digital Training 웹 풀스택 데브코스 6기

데브코스 지원 기간이 늘어나고 난 다음 일정이라 제가 지원 했던 기간을 말씀드리면 서류 지원 ~12/2 14시 | 실력 확인 테스트 12/2 17시 ~ 12/3 23:59 | 유선 인터뷰 12/6 | 최종 발표 12/9 이었습니다.프로그래머스 데브코스를 지원한 동기가

🎯 TIL이란 Today I Learned로 오늘 새로 배운 내용과 고민해서 배운 점들을 기록하는 성장 일지입니다. 💡 오늘 배운 것 한 줄 요약 오늘은 프로젝트 관리에서 중요한 마크다운 문법(리드미 작성법)과 버전 관리 시스템에 대해 알아보았습니다. 📙 T

🎯 분산식 처리 관리 시스템인 Git의 명령어를 익혀 버전 관리를 하고 협업 환경 구성을 합니다. 오늘은 Git을 다루기 위해서 알아야 하는 CLI, GUI의 차이점과 Git Command에 대해 알아보았습니다.컴퓨터에 명령하는 방식의 차이에 따라 분류됩니다.CLI

🎯 프로젝트 협업과 버전 관리를 돕는 Github를 익혀 코드를 올리고 내려받는 git command를 공부합니다.오늘은 프로젝트 협업을 위해 알아야 하는 Github Repository와 그에 관련된 git command 및 개념 등에 대해 알아보았습니다.GitHu

🎯 Git을 활용한 효과적인 협업과 버전 관리를 익히고, 충돌 해결 능력을 향상시켜 팀 프로젝트에서 원활한 개발 진행을 목표합니다.협업에서 가장 중요하다고 할 수 있는 Git branch 생성과 병합, 충돌 해결에 대해 실습하였습니다. 기능 개발 : feature/l

🎯 웹에 대해 이해하고, 프로젝트의 첫 단계인 로그인 화면 구성을 제작합니다.

🎯 지난 시간에 만든 로그인 페이지에 CSS와 JavaScript를 적용하여 동적인 상호작용을 구현합니다.CSS(Cascading Style Sheets)는 HTML을 꾸며주는 언어로 웹 페이지의 디자인을 설정합니다.인라인 스타일(Inline Style)HTML 태그

🎯 Backend 개념을 익히고 Node.js(WAS)를 사용하여 웹 서버를 구현합니다.

🎯 데이터베이스(DB) 개념을 익히고, 구축한 DB와 연결된 웹을 구현합니다.

🎯 데이터베이스 관계 다이어그램(ERD)를 생성하고, 이를 바탕으로 데이터베이스를 직접 설계하여 쿼리를 작성합니다. 각 테이블에 데이터를 입력, 수정, 조회할 수 있는 SQL문을 작성합니다 dbdiagram 사용공연 정보를 저장합니다. 공연 아이디 공연 날짜 공연 이

🎯 REST API 개념과 올바른 URL 설계 원칙을 이해하고 정리합니다.다른 소프트웨어 시스템을 중간에서 연결하고 데이터를 주고받을 수 있도록 해주는 인터페이스입니다.인터페이스(interface)서로 다른 시스템이 소통할 수 있도록 중재하는 역할입니다. 예시CLI

🎯 Node.js의 작동 원리를 이해하고, 외부 모듈을 통해 실습하며 npm 사용법을 익힙니다.하나의 스레드로 모든 요청을 처리하는 방식입니다. 요청(이벤트)이 들어와야 작업을 시작하고, 없으면 대기합니다.불필요한 자원 낭비 없이 필요한 순간에만 반응합니다.하나의 작

🎯 express 웹 프레임워크를 통해 웹 서버를 구축하고 URL 파라미터를 통해 데이터를 전송합니다. Node.js를 활용한 미니멀한 웹 프레임워크입니다. 🧐 왜 많이 사용하는 걸까? 간결하게 웹 서버를 구축할 수 있습니다. <span style="colo

🎯 URL 파라미터와 쿼리를 활용하여 Map 객체로 동적 데이터 관리를 학습합니다.express 예제 코드에서 req.params.n은 문자열로 출력됩니다.다시 코드를 실행시켰더니 갑자기 오류가 발생했습니다. 😦⚠️ 발생한 오류 코드를 실행하니 Error: list

🎯 express-generator를 사용하여 Express 프로젝트를 생성하고 실행하는 과정을 정리합니다. 📙 Today I Learned Express 실습 Express 프로젝트 생성 Express 공식 홈페이지를 참고하여 express-generator를

🎯 Postman을 활용하여 Express의 CRUD 기능을 구현하고 테스트해보았습니다. API를 개발하고 사용하는 플랫폼으로 API 라이프사이클의 각 단계를 간소화하고 협업을 원활하게 하여 더 나은 API를 더 빠르게 만들 수 있도록 돕습니다. <span st

🎯 Express를 사용한 CRUD API를 구현하고, HTTP 상태 코드 개념을 이해합니다.책이 존재하지 않으면 "요청하신 id번 책을 찾을 수 없습니다." 메시지를 반환합니다.책이 존재하면 db.delete(id)로 데이터를 삭제하고 "${book.title} 책

🎯 회원 API에 대한 예외 처리를 HTTP 상태 코드를 활용하여 만듭니다. 로그인 : POST /loginrequest: body(id, pwd)response: ${name}님 환영합니다 ⇒ 메인 페이지로 이동회원 가입 : POST /joinrequest: bo

🎯 빈 객체 확인하는 방법 3가지1\. Object.keys() -> 이 방법으로 하는 것이 좋음 2\. for in3\. lodash 라이브러리 : isEmpty채널 생성 : POST /channelsrequest : body (channelTitle)respons

🎯 라우팅을 통해 파일을 분리하고, 각 api가 연결될 수 있도록 userId를 활용합니다. 라우팅(Routing) 이란?클라이언트 요청을 처리할 적절한 경로를 찾아 응답을 반환하는 것입니다.🤔 왜 파일을 분리할까?코드의 가독성유지보수 용이확장성app.js app.

🎯 관계형 데이터베이스의 개념을 익히고, 테이블 간 관계를 고려한 데이터 설계를 연습합니다.관계형 데이터베이스 관리 시스템(Relational Database Management System, RDBMS)은 데이터가 열과 행의 테이블 형태로 저장하고 체계적으로 관리하

🎯 설계한 DB를 직접 생성해보고, 외래 키를 설정하여 테이블을 연결합니다.DB 생성을 위해 터미널을 통해 mariadb에 접속해줍니다.<span style="color: <span style="color: <span style="color: 1\.

🎯 MySQL Workbench를 설치하고, 기존 코드에 DB를 연동합니다. 📙 Today I Learned GUI로 MariaDB 접속하기 MySQL Workbench MySQL을 쉽게 관리할 수 있도록 도와주는 프로그램 (MySQL 전용 GUI 도구)입니다

🎯 express-validator 라이브러리를 통해 사용자 요청의 유효성을 검증합니다. 📙 Today I Learned 유효성 검사 (Validation) 유효성 검사란 사용자가 입력한 값이 타당한지 확인하는 과정입니다. express-validator 유효

🎯 JWT 기반으로 인증, 인가하는 개념을 정리하고, 코드에 반영합니다.사용자가 사이트에 가입된 사용자임을 증명하는 과정입니다.

🎯 도서 구매 사이트 프로젝트를 위한 준비 목록을 정리합니다.Node.js 기반의 REST API 구현을 위한 프로젝트를 제작합니다.

🎯 도서 구매 사이트 화면을 통해 API를 설계합니다.Method : POSTURL : /joinHTTP Status Code : 201 CreatedRequest BodyResponse Body : xMethod : POSTURL : /loginHTTP Status

🎯 ERD를 설계하며 API를 수정합니다.어제 작성했던 API를 수정하고, ERD를 작성합니다.👉 수정한 부분은 주황색 글씨로 나타냅니다.Method : POSTURL : /joinHTTP Status Code : 201 CreatedRequest BodyRespo

🎯 협업 툴의 대표 Trello, Jira, Notion의 사용법을 배우고, scrum의 기본적인 개념을 정리합니다.template Agile Sprint Board를 사용해서 기본적이고, 응용할 수 있는 기능이 많고, 복잡한 기능은 없음scrum의 특징을 많이 반영

🎯 도서 구매 프로젝트 셋팅(패키지 다운로드, 구조 설계, api 수정 등)을 합니다.👉 수정한 부분은 주황색 글씨로 나타냅니다.Method : POSTURL : /users/joinHTTP Status Code : 201 CreatedRequest BodyResp

🎯 라우터와 컨트롤러를 분리하여 유지보수성을 높이고, crypto 내장 모듈을 통해 비밀번호를 암호화합니다. http-status-code 패키지를 설치하여 상태 코드를 변수명으로 참조할 수 있도록 합니다.controller를 통해서 라우터는 경로 설정만 담당하고,

🎯 도서 API와 카테고리 API를 설계하고 구현합니다.🤔 도서 이미지 링크는 어떻게 받을까? Lorem Picsum을 활용해서 이미지의 주소값을 int값으로 활용할 예정입니다.Lorem Picsum은 샘플 이미지🖼️가 필요할 때 URL 기반 요청으로 무료 이미지

🎯 도서 API에 페이징 처리를 적용시킵니다.👉 수정한 부분은 주황색 글씨로 나타냅니다.Method : GETURL : /books?limit=개수&currentPage=페이지번호HTTP Status Code : 200 OkRequest Body : xRes

🎯 books 테이블 SELECT 시에 칼럼으로 넘겨줄 때 id 이름이 중복되어 category_id로 이름을 변경해주었습니다.likes는 likes 테이블에서 가져와 칼럼으로 추가할 것이기 때문에 삭제하였습니다.조건에 해당하는 행의 개수를 반환합니다. 조건에 만족하

🎯 장바구니 API를 설계하고 코드에 적용합니다. IN 연산자로 리스트값을 받아 데이터를 조회할 수 있습니다.⚠️ 발생한 오류외래키 지정 시에 error: 121 Duplicate key on write or update 오류가 발생하였습니다.동일한 이름의 FK 제약

🎯 주문 API를 설계하고 코드로 구현합니다. 특정 테이블에서 현재 존재하는 가장 큰 PK 값을 가져옵니다.🤔 왜 Last_insert_id()는 사용하지 않을까?❌ 한 세션에서만 작동 : 다른 사용자가 INSERT한 데이터는 보이지 않게 됩니다.<span s

🎯 Async/await 을 통해 비동기 코드를 작성하였습니다.OrderController.js에서 비동기로 인해 오류가 생겼기 때문에 Promise를 통해서 코드가 올바르게 작동되도록 수정하겠습니다.⚠️ 발생한 오류실행 시간이 긴 코드가 완료되지 않은 상태에서 다음

🎯 주문 API를 promise를 활용하여 구현합니다. 조건이 있으면 해당 조건에 맞는 행만 삭제되며, 조건이 없으면 모든 행이 삭제됩니다.테이블을 삭제합니다.모든 행이 삭제되지만, 테이블 구조는 유지됩니다.AUTO_INCREMENT 값을 초기화합니다. ⚠️ 발생한

🎯 API에 JWT를 받아오는 것을 적용시키고, try/catch를 통해 오류를 처리합니다. 수정한 부분은 주황색 글씨로 나타냅니다.Method : POSTURL : /likes/:bookIdHTTP Status Code : 200 OkRequest Headers :

🎯 모든 API를 정리하고 원하는 사용자 수만큼 가짜 데이터 만들어주는 API로 수정합니다.👉 수정한 부분은 주황색 글씨로 나타냅니다.Method : GETURL :/books?limit=개수&currentPage=페이지번호HTTP Status Code :

🎯 JavaScript의 전반적인 개념에 대해 알아봅니다. 📗 Today I Learned 자바스크립트 특징 인터프리터 언어 인터프리터 언어는 별도의 컴파일 과정 없이 실행되므로 코드 작성 후 바로 실행하는 언어입니다. 📌 특징 컴파일 단계가 없습니다.

🎯 Flow control은 명령형 프로그램의 개별 명령문, 명령 또는 함수 호출이 실행되거나 평가되는 순서를 나타냅니다. 일부 조건이 충족되는 경우에만 일련의 명령문을 실행합니다.논리조건의 참/거짓에 따라 명령문을 실행해야 할 경우 사용합니다. if문의 논리조건에는

🎯 프로그래밍의 기본 원리를 알아봅니다.개발자가 소프트웨어를 개발하는 과정입니다.구상해결하려는 문제를 정의하고 요구사항을 분석하는 단계입니다. 설계프로그램의 구조와 동작 방식을 계획하는 단계입니다. 구현프로그래밍 언어를 사용하여 코드를 작성하고 실행 가능한 소프트

🎯 컴파일 언어인 C언어의 문법에 대해 정리합니다. 연산자는 정적인 데이터들을 유기적으로 행동하게 하여 새로운 가치를 창출해내는 것입니다.\+ : 왼쪽과 오른쪽에 있는 값을 더합니다.\- : 왼쪽의 값에서 오른쪽의 값을 뺍니다.\* : 왼쪽과 오른쪽의 값을 곱합니다.

🎯 객체 지향 프로그래밍과 개발 필수 개념을 정리합니다.

🎯 TypeScript의 기본 개념을 정리합니다.

🎯 자바스크립트 라이브러리인 React에 대해 정리합니다.

🎯 React 관련 개념(컴포넌트, 상태, 훅 등)을 정리합니다.

🎯 React의 props 개념에 대해 배우고, Modals 인터페이스를 생성합니다.

🎯 React와 TypeScript를 활용한 Trello 클론 프로젝트를 시작하기 전, 필요한 환경을 세팅합니다.

🎯 Component를 생성하면서 @reduxjs/toolkit, react-redux 라이브러리를 익힙니다.

🎯 @vanilla-extract/css 라이브러리와 redux를 활용하여 Trello 화면을 구현합니다.

🎯 @react-beautiful-dnd 라이브러리를 통해 drag and drop 기능을 구현하고, Firebase로 Login 기능을 구현하고 배포합니다.

🎯 북스토어 프로젝트의 기반을 CRA로 설정하고, 초기 폴더 구조를 구성합니다.

🎯 레이아웃 구성을 잡고 sanitize.css와 styled-components를 사용해서 테마를 적용시킵니다.

🎯 컴포넌트를 만들고 테스트 코드를 통해 검증합니다.

🎯 리액트 라우터(React Router)를 통해서 경로를 설정하고, API 통신과 데이터 레이어를 통해 회원가입 페이지를 제작합니다.

🎯 Zustand를 통해 전역상태를 관리하고 로그인 페이지와 도서 목록 페이지를 제작합니다.

🎯 도서 상세 페이지를 제작합니다.

🎯 장바구니 목록과 주문서 작성 페이지를 제작합니다.

🎯 KPT 회고를 통해 현재 문제점과 해야할 일을 파악하여 코드를 리팩토링합니다.

🎯 모킹 서버를 통해 리뷰 기능을 제작하고, 드랍다운, 탭, 토스트, 모달, 무한 스크롤까지 다양한 UI를 적용시킵니다.

🎯 리뷰, 신간, 베스트셀러, 배너 등으로 메인 화면을 제작하고, 모바일 대응을 구현합니다.

🎯 오픈 소스와 오픈 소스 라이선스에 대해 정리합니다.

🎯 오픈 소스의 커뮤니티 스탠다드에 대해 정리합니다.

🎯 오픈 소스 프로젝트를 구성하는 다양한 역할과 참여할 수 있는 기여(컨트리뷰션) 방법을 정리합니다.

🎯 오픈 소스 프로젝트들의 라이선스 변경 이슈와 오픈 소스 프로젝트를 효율적으로 탐색하는 방법을 정리하였습니다.

🎯 오픈 소스 저작자가 되는 방법, 오픈 소스 사용 체크리스트에 대해 정리합니다.

🎯 CI/CD와 자동화 파이프라인을 배우고 파이프라인 자동화 도구인 Docker에 대해 정리합니다.

🎯 Kubernetes에 대해 정리합니다.

🎯 Jenkins에 대해 정리합니다.

🎯 인수 테스트에 대해 정리합니다.

🎯 구성 관리의 핵심 원리와 Terraform을 활용한 IaC 실습을 정리합니다.

🎯 오픈 소스 기여를 통해 얻을 수 있는 장점과 구체적인 시작 방법을 정리합니다.

🎯 MDN Web Docs 기여 방법에 대해 정리합니다.

🎯 모던 JavaScript 튜토리얼 기여 방법에 대해 정리합니다.

🎯 first-contributions 프로젝트에 기여하는 방법을 정리합니다.

🎯 open source workflow를 생성하는 방법을 정리합니다.

🎯 npm을 통해 오픈 소스를 배포하는 실습을 합니다.

🎯 웹 기반 문서 편집기 제작 프로젝트를 제작합니다.

🎯 웹 기반 문서 편집기 제작 프로젝트의 개발 환경 구성을 정리합니다.

🎯 백엔드 - 프론트엔드 디렉토리 구조를 설계하고 테스트 데이터베이스를 구성합니다.

🎯 단위 테스트부터 컨테이너화, 로컬 클러스터 배포까지 전 과정을 자동화합니다.

🎯 Selenium을 통해 E2E 테스트 하는 방법을 정리합니다.

🎯 AWS CLI를 활용해 이미지 배포부터 인증까지 실습하며 자동화 기반 배포 흐름을 정리합니다.

🎯 프론트엔드·백엔드 애플리케이션을 빌드, 테스트, 패키징, 배포, 검증하는 CI/CD 파이프라인 구축을 정리합니다.

🎯 Computer Science와 관련된 내용을 정리합니다.

🎯 Computer Science에 대해 정리합니다.

> 🎯 Computer Science에 대해 정리합니다.

🎯 Computer Science에 대해 정리합니다.

🎯 Computer Science에 대해 정리합니다.