본문 바로가기

전체 글384

RESTful API의 핵심 설계 원칙 REST는 자원 중심(Resource-Oriented) 이기 때문에,URL은 "무엇을" 다루는지 (명사)를 표현하고,HTTP 메서드(GET, POST 등)는 "어떻게" 처리할지를 표현해야 함.잘못된 방식 (행위 중심)GET /getItemPOST /createItemDELETE /deleteItem?id=1메서드 이름을 URL에 표현하는 건 RESTful하지 않음HTTP 메서드 자체가 이미 의미를 내포하고 있기 때문에 중복바람직한 방식 (자원 중심)GET /items // 아이템 목록 조회GET /items/123 // 특정 아이템 조회POST /items // 아이템 생성PUT /items/123 // 아이템 수정DELETE /items/123 .. 2025. 3. 21.
원시값(Primitive)과 객체의 차이 typeof value === "object"는 객체({})나 배열([]) 같은 참조 타입을 의미함하지만 원시값(number, string, boolean, null, undefined, symbol, bigint)은 객체가 아님원시값과 객체 비교 예제console.log(typeof 42); // "number"console.log(typeof "hello"); // "string"console.log(typeof true); // "boolean"console.log(typeof null); // "object" (JS의 버그, 실제로는 원시값!)console.log(typeof {}); // "object"console.log(typeof []); // "object" 2025. 3. 20.
... (Spread Operator)로 얕은 복사(Shallow Copy)하기 스프레드 연산자는 얕은 복사를 수행한다.하지만, 모든 값이 복사되는 방식이 다름!Primitive 타입(원시값) → 새로운 값이 복사됨Object 타입 (참조값) → 기존 객체의 참조(reference) 가 복사됨코드 실행 결과const test = { name: "bob", profile: { email: "test@", },};// 얕은 복사 (Shallow Copy)const test2 = { ...test };test2.name = "w"; // (1) 새로운 값으로 변경test2.profile.email = "changed@"; // (2) 중첩 객체 내부 값 변경console.log(test); // 원본 객체console.log(test2); // 복사된 객체출력 결과// 원본 .. 2025. 3. 18.
소프트웨어 버전 관리하기 - 시맨틱 버전(Semantic Versioning, SemVer)이란? X.Y.Z (메이저.마이너.패치) 버전 관리 규칙소프트웨어 버전 관리는 보통 시맨틱 버전(Semantic Versioning, SemVer)을 따릅니다.크롬 익스텐션뿐만 아니라, 대부분의 소프트웨어에서 X.Y.Z 형식을 사용합니다.X.Y.Z (Major.Minor.Patch)              버전 형식                      의미                                예시X (Major, 메이저 버전)기존과 호환되지 않는 큰 변경1.0.0 → 2.0.0Y (Minor, 마이너 버전)새로운 기능 추가 (기존 기능과 호환 가능)1.0.0 → 1.1.0Z (Patch, 패치 버전)버그 수정, 성능 개선 (기능 변화 없음)1.1.0 → 1.1.1X (Major, 메이저 .. 2025. 3. 15.
JavaScript에서 export와 import의 개념과 사용법 JavaScript의 모듈 시스템 (ES6 Modules) 에서 export와 import는 코드의 재사용성과 유지보수성을 높이는 중요한 기능입니다.이를 통해 하나의 파일에서 정의한 변수, 함수, 클래스 등을 다른 파일에서도 사용할 수 있습니다.1. export의 종류JavaScript에서는 두 가지 방식으로 모듈을 내보낼 수 있습니다.(1) Named Export (이름을 지정한 내보내기)Named Export는 하나의 파일에서 여러 개의 변수, 함수, 클래스를 개별적으로 내보낼 수 있는 방식입니다. 사용법// utils.jsexport const add = (a, b) => a + b;export const subtract = (a, b) => a - b;export const multiply = (.. 2025. 3. 15.
ReactNode란? ReactNode는 React에서 렌더링할 수 있는 모든 요소의 타입을 의미합니다.React에서 반환할 수 있는 모든 JSX 요소, 문자열, 숫자, 배열, null, undefined, boolean 등을 포함하는 최상위 타입이라고 보면 됩니다.ReactNode의 정의import { ReactNode } from "react";ReactNode는 다음과 같이 정의됩니다:type ReactNode = | ReactElement // JSX 요소 (컴포넌트) | string // 문자열 | number // 숫자 | boolean // true, false (렌더링되지 않음) | null // 렌더링되지 않음 | undefined // 렌더링되지 .. 2025. 3. 10.

티스토리툴바