고양이의 손난로

RESTful API는 Representational State Transfer의 줄임말로, 클라이언트와 서버가 웹 표준인 HTTP와 URL을 이용해 정보를 주고받는 방식입니다. 쉽게 말해, 웹의 기본 기술만으로도 다양한 시스템이 서로 정보를 주고받을 수 있게 도와주는 설계 스타일입니다.REST에서는 몇 가지 중요한 규칙(제약 조건)을 따릅니다:클라이언트-서버 구조클라이언트(사용자 측)와 서버(데이터 제공 측)의 역할이 분리됩니다. 이렇게 분리함으로써 서로 독립적으로 개발하고 유지보수할 수 있습니다.Stateless (상태 비저장성)서버는 클라이언트의 이전 요청 상태를 기억하지 않습니다. 매번 독립적인 요청으로 처리하기 때문에 서버가 훨씬 단순해지고, 확장하기도 쉬워집니다.캐시 처리 가능서버의 응답이 캐..

Next.js를 React보다 선호하는 주요 이유항목React (기본)Next.js라우팅수동 설정 (react-router-dom 등 설치 필요)파일 기반 자동 라우팅서버 사이드 렌더링 (SSR)기본 지원 없음 (직접 구현 필요)기본 지원 (SSR, SSG, ISR 등)정적 사이트 생성 (SSG)불편함getStaticProps 등으로 간단하게 가능API 라우트별도 서버 필요 (예: Express)API Routes 내장이미지 최적화직접 처리next/image 컴포넌트 제공SEO 최적화CSR로 인해 불리SSR/SSG로 훨씬 유리성능 최적화수동 설정 많음자동 코드 분할, lazy loading 등 기본 제공배포본인이 세팅해야 함 (Vite, Webpack 등)Vercel 같은 플랫폼과 최적화되어 있음📌 구..

1. 웹페이지 렌더링 방식 CSR, SSR, SSG🔷 1. CSR (Client-Side Rendering, 클라이언트 사이드 렌더링)✅ 설명:HTML, CSS, JS 등 최소한의 파일만 서버에서 전달하고, 실제 페이지 렌더링은 브라우저(클라이언트)에서 JavaScript로 수행합니다.대표적인 예: React, Vue 같은 SPA(Single Page Application)✅ 특징:초기 로딩은 느릴 수 있음 (JS 다운로드 + 실행 필요)이후 페이지 전환은 매우 빠름 (서버 요청 없이 JS로 처리)SEO(검색 최적화)에 불리 (검색 엔진이 JS 실행 못할 경우)✅ 흐름:브라우저가 최소 HTML과 JS를 받음JS 실행 → 데이터 API 요청 → 렌더링 진행🔷 2. SSR (Server-Side Rend..

컴포넌트가 생성, 업데이트, 제거되는 일련의 과정을 의미합니다. 이 생명주기를 이해하면 상태(state), 속성(props), DOM 처리 등에서 정확한 타이밍에 코드 실행이 가능해집니다. React의 생명주기는 클래스형 컴포넌트와 함수형 컴포넌트에서 조금 다르게 적용됩니다.1. 함수형 컴포넌트의 생명주기 (React Hooks 기준)함수형 컴포넌트에서는 useEffect, useLayoutEffect 등의 Hook을 사용해 생명주기를 제어합니다.생명주기 흐름 (메서드)생명 주기메서드 이름설명마운트 (Mount)useEffect(() => {}, [])컴포넌트가 DOM에 처음 렌더링업데이트 (Update)useEffect(() => {}, [state])상태(state)나 props가 변경되어 재렌더링언..

key를 설정하는 이유React는 배열을 렌더링할 때 Virtual DOM을 사용해서 변경된 부분만 실제 DOM에 반영합니다.이때 어떤 요소가 추가되었는지, 삭제되었는지, 변경되었는지를 빠르게 파악하려면 각 항목을 식별할 수 있는 고유한 값이 필요합니다. 이 값이 바로 key입니다.예시:여기서 key={item}을 통해 React는 각 항목을 고유하게 식별할 수 있습니다.key를 설정하지 않으면?React는 요소의 위치 기준으로 업데이트를 시도합니다.배열 항목의 순서가 바뀌거나 삽입/삭제되면 예상치 못한 방식으로 컴포넌트를 재사용할 수 있음결과적으로 렌더링 오류, 상태 꼬임, 입력값 초기화 등의 버그가 발생할 수 있음⚠️ key 설정 시 주의할 점고유한 값을 사용해야 함가능하면 데이터의 고유 ID를 ke..

데이터베이스 정규화(Database Normalization)는 데이터의 중복을 최소화하고, 무결성을 유지하며, 효율적으로 데이터를 관리하기 위해 테이블을 구조화하는 과정입니다. 주로 관계형 데이터베이스 설계 시 사용됩니다. 관계형 데이터베이스에서 속성은 다른 속성과 관계를 가집니다.특정 튜플을 구분할 수 있는 속성을 기본키로 설정하게 되고 이 기본키를 통해 데이터를 찾습니다.특정 속성이 정해졌을 때 다른 속성도 함께 정해지는 것을 종속이라고 부르는데,기본키가 아닌 속성들의 종속을 최대한 줄이는 것이 정규화의 주된 목적입니다. (라고 저는 알고 있습니다.) 종속을 없애게 되면 이상(Anomaly) 방지, 데이터 무결성, 중복 최소화 등의 효과를 얻을 수 있습니다.✅ 정규화의 목적 (=종속 제거)데이터 중..

보호되어 있는 글입니다.

보호되어 있는 글입니다.

보호되어 있는 글입니다.

보호되어 있는 글입니다.