patchnotes

1. 리액트 소개리액트(React)는 페이스북(현 Meta)에서 개발한 사용자 인터페이스(UI)를 구축하기 위한 자바스크립트 라이브러리이다. 웹뿐만 아니라, 리액트 네이티브(React Native)를 통해 모바일 앱 인터페이스까지 구축할 수 있다.프레임워크가 아닌 라이브러리인 이유리액트는 종종 프레임워크로 오해받지만, 스스로를 라이브러리라고 정의한다. 그 이유는 다음과 같다.최소한의 기능만 내장: 리액트는 UI를 렌더링하고 상태를 관리하는 핵심 기능에만 집중한다. 라우팅(화면 전환), 전역 상태 관리, 데이터 통신과 같은 필수적인 기능들은 내장되어 있지 않아 React Router, Redux, Axios와 같은 서드파티(Third-party) 라이브러리에 의존해야 한다.높은 자유도와 책임: 프레임워크는..

1. 리터럴 타입 (Literal Types)리터럴 타입은 특정 값 자체를 타입으로 사용하는 것이다. 이는 변수에 할당될 수 있는 값을 정확히 지정하여, 코드의 안정성을 높이는 데 사용된다.문자열 리터럴지정된 문자열 값만 허용하는 타입이다.let userRole: 'admin' | 'user';userRole = 'admin'; // ouserRole = 'guest'; // error: 'admin' 또는 'user'만 할당 가능하다.숫자 리터럴지정된 숫자 값만 허용하는 타입이다.let httpStatusCode: 200 | 404 | 500;httpStatusCode = 404; // ohttpStatusCode = 301; // error: 200, 404, 500만 할당 가능하다.Boolean 리..

1. 언어 개요 (타입스크립트란?)타입스크립트(TypeScript)는 Microsoft가 개발한 오픈소스 프로그래밍 언어이다. 이는 자바스크립트의 슈퍼셋(Superset)으로, 자바스크립트의 모든 기능을 포함하면서 정적 타입(Static Type) 문법을 추가한 것이 가장 큰 특징이다.역사 및 등장 배경: 초기의 웹과 달리 현대의 웹 애플리케이션은 규모가 매우 커지고 복잡해졌다. 순수 자바스크립트는 동적 타입 언어이므로, 코드가 실행되는 시점(런타임)에야 타입 오류를 발견할 수 있었다. 이러한 대규모 프로젝트의 안정성과 유지보수성을 높이기 위해 2012년 타입스크립트가 등장했다. 컴파일 단계에서 미리 오류를 잡아낼 뿐만 아니라, 코드 자동 완성(IntelliSense), 안전한 리팩토링 등 강력한 도구를..

1. 프로젝트 개요https://github.com/JHParrrk/book_market GitHub - JHParrrk/book_marketContribute to JHParrrk/book_market development by creating an account on GitHub.github.com Book Market은 사용자가 도서를 검색하고, 장바구니에 담아 주문하며, 리뷰를 작성하고 다른 사용자와 소통할 수 있는 기능을 갖춘 온라인 서점 플랫폼입니다. 이 프로젝트는 백엔드 시스템을 중심으로 견고한 데이터베이스 구조와 확장성을 고려한 아키텍처 설계를 목표로 진행되었습니다.주요 기능으로는 사용자 인증 및 권한 관리, 계층형 카테고리, 도서 관리, 장바구니, 주문 처리, 리뷰 및 좋아요 기능 등이 ..

1. 함수 포인터 (Function Pointers)C/C++의 함수 포인터는 함수의 메모리 주소를 저장하여 호출하는 방식입니다. TypeScript(및 JavaScript)에는 직접적인 포인터 개념이 없지만, 함수를 일급 객체(First-class Citizen)로 취급하므로 유사한 기능을 구현할 수 있습니다.개념: 함수를 변수에 할당하거나, 다른 함수의 인자로 전달하거나, 함수의 반환 값으로 사용할 수 있습니다.TS에서의 사용: 함수 시그니처를 타입으로 정의하여 변수에 할당하거나 매개변수 타입을 지정합니다.// (a: number, b: number) => number 라는 타입 시그니처를 정의type MathOperation = (a: number, b: number) => number;// 이 타..

1. 포인터(Pointer)란 무엇인가? (C언어)컴퓨터의 메모리는 데이터가 저장되는 수많은 ‘번지수’로 구성되어 있습니다. 포인터란, 일반적인 데이터(값) 대신 이 메모리의 번지수(주소)를 값으로 저장하는 특별한 변수입니다.즉, 포인터는 데이터가 어디에 있는지를 가리키는 ‘지시자’ 역할을 합니다. 이를 통해 데이터에 직접 접근하는 대신, 데이터의 위치를 참조하여 간접적으로 값을 읽거나 수정할 수 있습니다.C언어에서 포인터를 다루기 위해 다음과 같은 핵심 연산자가 사용됩니다.주소 연산자 (&): 변수 앞에 붙여 해당 변수의 메모리 주소값을 가져옵니다.역참조 연산자 (*): 포인터 변수 앞에 붙여, 포인터가 가리키는 주소에 저장된 실제 데이터 값에 접근합니다.포인터 예시 코드#include int main..

컴파일 언어와 인터프리터 언어프로그래밍 언어는 코드를 실행하는 방식에 따라 컴파일 언어와 인터프리터 언어로 나눌 수 있다. JavaScript(JS)와 같은 인터프리터 언어를 사용하는 개발자일지라도, 컴파일 언어의 동작 원리를 이해하는 것은 매우 중요하다. 특히, 현대 웹 개발에서 널리 사용되는 TypeScript(TS)가 컴파일(정확히는 트랜스파일) 방식을 채택하고 있기 때문이다.인터프리터(Interpreter) 언어인터프리터 언어는 소스 코드를 한 줄씩 읽어 내려가며 즉시 기계어로 번역하고 실행하는 방식이다. 대표적으로 JavaScript, Python이 여기에 속한다.장점: 별도의 컴파일 과정이 없어 개발 중 빠른 코드 수정과 테스트가 가능하며, 디버깅이 용이하다.단점: 런타임(실행 시점)에 매번 ..

JavaScript 핵심 개념 리포트1. 브라우저와 개발자 도구브라우저의 역할브라우저는 단순히 웹 페이지를 보여주는 프로그램을 넘어, 그 자체가 하나의 거대한 API 요청 프로그램이다. 사용자가 주소창에 URL을 입력하고 엔터를 치는 순간, 브라우저는 해당 주소의 서버에 콘텐츠를 요청(Request)한다. 서버는 이 요청에 응답(Response)하여 데이터를 보내주는데, 브라우저가 다른 API 클라이언트(Postman 등)와 다른 가장 큰 특징은 주로 HTML 형식의 데이터를 리턴받아 사용자에게 시각적인 형태로 렌더링한다는 점이다. 이 과정에서 HTML은 문서의 뼈대를, CSS는 디자인을, JavaScript는 동적인 상호작용을 담당한다.개발자 도구(Developer Tools) 활용법console.lo..

** 인증 로직 모듈화: 유틸과 미들웨어의 역할 분리**프로젝트의 인증 로직은 toker.utils.js와 authorize.middleware.js 두 파일로 명확하게 분리되어 있다. 이는 단일 책임 원칙(Single Responsibility Principle)에 따라 코드의 재사용성과 유지보수성을 높이기 위한 설계이다.** toker.utils.js: 토큰 생성의 책임 (도구의 역할)**역할: Access Token과 Refresh Token을 생성(Generation)하는 책임을 가진다.분리 이유:순수 함수: 토큰 생성 로직은 사용자 정보를 입력받아 JWT 문자열을 반환하는 순수 함수에 가깝다. 이는 HTTP 요청-응답 사이클(req, res, next)에 의존하지 않는다.재사용성: 로그인(log..

시나리오 1: 정상적인 인증 흐름 (Happy Path)사용자가 회원가입 후 로그인하여 발급받은 accessToken으로 보호된 API에 성공적으로 접근하는 가장 기본적인 흐름입니다.실행 간단 흐름도클라이언트 → 서버 (회원가입): POST /users/register클라이언트 → 서버 (로그인): POST /users/login → accessToken, refreshToken 수신클라이언트 → 서버 (장바구니 추가): POST /carts (헤더에 accessToken 포함)미들웨어 (authenticateJWT): 토큰 검증 성공 → req.user에 사용자 정보 저장 후 next()Controller: req.user.id를 사용하여 장바구니 추가 로직 실행Service & Repository: ..