프로그래머스 웹 풀스택 데브코스 TIL

특강 이확영 CTO님의 좋은 개발자란?Markdown 기반 문서 정리 방법 강의백트래킹 알고리즘 문제풀이종료 조건 설정(백트래킹)아직 구현 능력이 많이 부족한 것 같다. 더 많은 알고리즘 문제를 풀어봐야겠다.좋은 개발자가 되기 위해서는 코드만 잘 작성하기 보다 문제 정

Git 기본 이론 강의백트래킹 알고리즘 문제풀이기술 블로그 게시글 읽기먼저 전체 경우의 수를 어떻게 구할 수 있는지 생각해보기직방 기술블로그에서 TypeORM 도구를 사용할 때, Slow Query가 발생한다면, 어떻게 모니터링할 수 있는지에 대한 글을 읽었다.Type

Branch 이해하기HTTP 완벽 가이드메인 프로젝트를 가상으로 복사한 것여러 개발자들이 동시에 작업할 수 있도록 도와주는 기능이다새로운 기능을 개발할 때ex) feature/login, feature/select-product 등출시를 준비할 때ex) release-

웹의 이해웹의 구조전 세계의 모든 컴퓨터를 하나의 통신망 안에서 연결한다는 의미이다인터넷에 연결된 컴퓨터를 통해 정보를 공유하는 공간1980년대, 스위스 유럽 입자 물리 연구소(CERN)의 컴퓨터 과학자팀 버너스-리에 의해서 탄생연구원들 간의 신속한 정보교환을 위해 탄

HTML의 요소를 꾸며주는 CSS와 HTML의 요소에 역할을 부여하는 Javascript에 대해서 알아보고 어떻게 적용할 수 있는지 살펴보자 HTML을 꾸며주는 언어문서를 통째로 한번에 꾸며주는 것이 아니라 태그(요소) 하나하나를 꾸며준다

데이터베이스(Database)SQL(Structured Query Language)Node.js 서버와 DB 연결하기데이터를 정보 저장소로 통합하여 효율적으로 관리하기 위한 데이터 집합체(모음집)데이터를 구조화하여 관리함으로써 데이터 중복을 막고, 효율적이고 빠른 데이

API란?REST API란?애플리케이션들이 서로 통신할 때, 중간에서 매개체 역할을 한다ex. 휴대폰의 날씨 앱은 API를 통해 기상청 데이터베이스의 날씨 데이터를 요청한다인터페이스(Interface)란?중간에서 상호간의 소통을 위해 만들어진 매개체이다과거의 개발자들은

📕오늘의 학습 내용 > Node.js란? 라이브러리와 프레임워크 npm이란? Node.js란? Javascript를 웹 브라우저 밖에서 프로그래밍 언어 역할을 할 수 있도록 지원하는 플랫폼(런타임)이다. Javascript가 구동될 수 있는 환경을 구축해준다 넷

Express란?Express 시작하기Node.js를 위한 웹 프레임워크 중 하나로 웹 애플리케이션, API 개발을 위해 설계되었다. 즉, 서버측에서 애플리케이션을 쉽게 구축하고 관리할 수 있게 도와주는 도구이다.npm install expressapp.METHOD(P

비구조화 할당(구조분해 할당)네이밍 케이스Map객체의 키에 대응되는 값 할당존재하지 않는 키의 값은 undefined 반환배열의 원소를 새로운 변수에 순차적으로 할당할당할 값이 없다면, undefined 반환Kebab-Case모두 소문자로 표현단어와 단어 사이를 -(하

자바스크립트 함수의 종류기본 함수함수 표현식화살표 함수(Arrow Function) - 'function' 대신 '=>' 사용화살표 함수 사용한 단축 표현식

map에 저장한 데이터를 json으로 바꿔 전송하기foreach와 mapPUT, DELETEHTTP 상태 코드배열을 순회하며 각 요소에 대해 지정된 함수를 실행하는 메서드이다.배열의 각 요소에 대해 특정 동작을 수행할 때 사용된다.forEach 메서드는 콜백 함수를 실

RDBMS란?데이터베이스 설계행과 열로 구성된 테이블에 데이터를 저장스키마(Schema)라는 틀에 따라 데이터를 저장테이블 간 형성된 관계를 통해, 데이터를 찾아갈 수 있다관계형 데이터베이스의 설계에서 중복을 최소화하게 데이터를 구조화하는 프로세스예를 들어, 게시글 테

인증과 인가인증 방식JWT의 인증/인가 절차사용자가 사이트에 가입된 사용자라는 것을 증명하는 것을 말한다즉, 사용자의 신원을 검증하는 것이다예를 들어, 쇼핑몰의 장바구니를 담거나 상품을 구매할 때 그리고 마이 페이지를 들어가기 위해서 사용된다인증 이후, 특정 리소스나

Query String이란?URL 뒤에 작성하여 입력 데이터를 전달하는 방법 중 하나서버에 여러 가지의 추가적인 정보를 전달하기 위해 사용한다? 이후, key-value 형태로 작성여러 가지의 추가 정보를 전달하기 위해 & 사용예시q, page, sort 는 매개 변수

CryptoBycrptNode.js 내장 모듈. 해쉬 함수를 이용하여 암호화하는 기능 제공단방향 암호화이기 때문에, 복호화가 불가능하다길이가 10인 무작위 바이트 생성하고 base64로 인코딩한 후, salt 생성pbkdf2 메소드를 이용하여 비밀번호 해싱비밀번호를 해

BULK INSERT비동기 처리비동기 처리

MySQL 데이터 삭제 방법MySQL IN 연산자조건이 있다면, 조건에 맞는 행만 삭제한다조건이 없다면, 모든 행을 삭제한다(테이블은 남아있음)테이블을 통째로 삭제한다모든 행을 삭제한다 (테이블은 남아있음)DELETE는 조건 설정 가능하지만, TRUNCATE는 불가능하

쿼리 결과의 전체 수를 가져오는 방법객체의 속성에 접근하는 방법SQL_CALC_FOUND_ROWS는 SELECT 쿼리에 의해 반환되는 전체 row의 수를 임시로 저장한다.SELECT found_rows()는 임시로 저장한 값을 불러오는 쿼리이다.점(.)과 대괄호(\[]

코드 전체를 한번에 해석해서 컴퓨터가 실행할 수 있는 파일로 변환시켜주는 언어한 라인씩 해석하며 바로 실행시키는 언어앞으로 배울 타입스크립트는 컴파일 과정을 거친다컴파일 언어를 이해하면 메모리 구조와 동작 원리를 이해하는데 많은 도움이 된다프로그램을 만드는 과정즉, 개

특정 작업을 수행하는 코드의 집합데이터 타입은 return 값의 타입 void > return 값 없음을 의미한다매개 변수 또한 타입 지정해줘야한다 ex) (int a, int b)가독성 향상코드의 중복을 줄이고 재사용성을 높인다수정과 확장이 용이하도록 만든다프로그래밍

여러개의 다른 타입의 연관된 데이터를 묶어서 하나의 새로운 데이터 타입을 정의하는 것같은 타입의 데이터를 한번에 선언하기 위해서 배열을 사용할 수 있다struct 키워드 : 구조체라는 데이터 타입을 의미한다student : 내가 만든 타입(구조체)의 이름name, ag

멤버 변수와 멤버 메서드로 구성된 사용자 정의 타입이다사전적 의미는 학급이다변수와 메소드를 사용자가 정의한 타입이기 때문에, 추상적인 데이터 타입이다사물의 공통적인 특성을 정리하여 속성(필드)과 행동(메소드)으로 표현하는 과정추상화된 클래스의 데이터를 외부에서 직접 접

자바스크립트 기반의 언어이며, 자바스크립트의 기능을 포함하면서 타입 체크를 지원한다자바스크립트를 보완하고, 지저분한 코드를 깔끔하게 작성할 수 있도록 도와준다브라우저는 자바스크립트 언어만을 이해하는데, 타입스크립트로 작성한 코드를 자바스크립트 언어로 컴파일하는 컴파일러

사용자 인터페이스를 만들기 위한 JavaScript 라이브러리싱글 페이지 애플리케이션을 만들 때 사용한다바닐라 자바스크립트로도 구현할 수 있으나, 코드가 너무 길어지기 때문에 리액트를 사용한다서버로부터 새로운 페이지를 가져오지 않고, 현재 페이지를 동적으로 다시 작성하

배열의 각 요소에 대해 특정 작업을 수행하고, 그 결과로 새로운 배열을 생성하는 자바스크립트 배열 메서드이다첫 번째 인자로 콜백 함수를 받는다콜백 함수는 배열의 각 요소, 해당 요소의 인덱스, 원본 배열을 인자로 받을 수 있다콜백 함수의 반환 값은 새로운 배열의 요소가

스타일을 컴포넌트 범위로 한정하여 충돌을 방지할 수 있다props를 통해 전달받은 값으로 스타일을 동적으로 변경 가능하다자바스크립트에서 바로 스타일을 넣을 수 있기 때문에, 페이지 로딩 시간이 단축된다스타일이 자바스크립트 코드에 내장되기때문에, 재사용할 수 없고, 가독

actions이라는 이벤트를 사용하여 상태를 관리하고 업데이트하기 위한 라이브러리전역 state를 관리하기 위해 사용한다state 는 앱을 구동하는 정보의 원천view 는 현재 상태를 기반으로 한 UI에 대한 선언적(declarative) 설명 \- 선언적(decl

이미지가 안보이거나 출력이 안되는 등 에러가 발생했을 때, 원인을 찾기 위해서는 일일이 확인해봐야한다브라우저로 확인한다면, React코드는 화면에서Html\` 코드로 변환되기 때문에, 어떤 부분이 잘못된건지 확인하기 힘들다React Developer Tools을 이용하

ReactRouter 설치 방법ReactRouter 사용 방법createBrowserRouter를 이용하여 router를 만든다클라이언트가 어떠한 경로로 접근했을 때, 보여줄 컴포넌트를 설정한다RouterProvider를 이용하여 Router 인스턴스를 제공한다브라우저

React Router 라이브러리에서 제공하는 HookURL 쿼리 스티링을 관리하는 데 유용하게 사용현재 브라우저의 위치(location)을 반환현재 URL의 정보를 담고 있으며, 경로(pathname), 검색 쿼리(search), 해시(hash) 등의 정보를 포함us

React는 단방향 데이터 흐름에 따라, 상태(state)와 같은 데이터가 항상 상위 컴포넌트에서 하위 컴포넌트로 흐른다.그렇다면, 하위 컴포넌트에서 상위 컴포넌트의 상태(state)를 변경할 수 있는 방법은 없을까?여기서 사용할 수 있는 방법이 상태 끌어올리기(Lif

requestHandler에 payload에 대한 타입은 제네릭 <T>로 설정하였지만, 반환받는 응답 데이터의 타입도 같은 제네릭<T>로 설정되기 때문에, 발생한 문제다.requestHandler의 반환값인 응답 데이터에도 타입을 지정해주기 위해서는 <

react-query의 Hook중 하나사용자가 스크롤을 내릴 때마다 추가 데이터를 불러올 수 있는 무한 스크롤을 쉽게 구현할 수 있다queryKey \- 쿼리를 식별하는 데 사용되는 고유 키 \- 여기서 쿼리란, 웹 애플리케이션에서 서버로부터 데이터를 비동기적으로

Q-1) 외부에서 컨테이너에 접속할 때, 접속되지 않는 이유는?Q-2) 외부에서 컨테이너에 접속하기 위해서 어떻게 해야하나?Q-3) 바인드 마운트란 무엇인가?Q-4) 볼륨이란 무엇인가?Q-5) 바인드 마운트와 볼륨의 차이는 무엇인가?Q-6) 쿠버네티스란 무엇인가?Q-7

이 문서는 데브코스 교육 과정 중 학습한 주요 주제들에 대해 이해를 돕고 복습용도로 사용하기 위해 질문과 답변 형식으로 정리되었습니다.Q-1) 폭포수 방법론이란 무엇이고 장단점은?Q-2) 애자일 방법론이란 무엇이고 장단점은?Q-3) 폭포수 방법론과 애자일 방법론을 각각

이 문서는 데브코스 교육 과정 중 학습한 주요 주제들에 대해 이해를 돕고 복습용도로 사용하기 위해 질문과 답변 형식으로 정리되었습니다.Q-1) 아키텍쳐란 무엇인가?Q-2) 아키텍쳐가 중요한 이유는?Q-1) 서비스(Service)란 무엇인가?Q-2) 서비스의 종류 어떤