반응형

2024/05 3

Next.js 블로그 앱 만들기

Next.js 블로그 앱 만들기Next.js를 사용하여 블로그 애플리케이션을 만들어보겠습니다. 블로그 애플리케이션은 다음과 같은 기능을 구현할 수 있습니다.- 블로그 앱 구조블로그 애플리케이션은 다음과 같은 구조로 구성됩니다.next-blog/├── components/│ ├── Layout/│ │ └── Layout│ │ └── Header│ │ └── Footer│ ├── Post/│ │ └── PostList│ │ └── PostItem│ │ └── PostDetail│ │ └── PostEdit│ │ └── PostNew├── pages/│ ├── index│ ├── post│ │ ├── index│ │ ├── ..

Front/React 2024.05.05

Next.js 기초 및 설정

Next.jsNext.js 란?Next.js는 React 기반의 웹 프레임워크로, 서버 사이드 렌더링과 정적 파일 생성 등을 지원하여 개발자가 보다 효율적으로 웹 애플리케이션을 구축할 수 있도록 도와줍니다. 이 프레임워크는 React의 기능을 확장하여 더욱 강력한 기능을 제공하며, SSR(Server-Side Rendering), CSR(Client-Side Rendering), Static Site Generation 등의 다양한 렌더링 방식을 지원합니다.서버사이드 렌더링: 서버에서 HTML 을 생성하여 클라이언트에 전달하는 방식으로, 초기 로딩 속도를 개선할 수 있습니다.정적 파일 생성: 미리 HTML 파일을 생성하여 클라이언트에 전달하는 방식으로, 빌드 시간에 미리 페이지를 생성할 수 있습니다.Ne..

Front/React 2024.05.05

Rudux로 전역 상태 관리하기

Redux로 전역 상태 관리하기Redux 소개Redux는 상태 관리 라이브러리로, React와 함께 사용하기 좋습니다. Redux를 사용하면 컴포넌트 간에 상태를 쉽게 공유할 수 있습니다.- Redux 특징Single Source of Truth: 애플리케이션의 상태는 하나의 스토어에 저장됩니다.State is Read-Only: 상태를 직접 변경할 수 없습니다. 상태를 변경하는 유일한 방법은 액션을 디스패치하는 것입니다.Changes are Made with Pure Functions: 상태를 변경하는 함수인 리듀서는 순수 함수여야 합니다.- Redux 구조Actions: 상태 변경을 위한 객체Reducers: 상태를 변경하는 함수Store: 애플리케이션의 상태를 저장하는 객체store/|-- acti..

Front/React 2024.05.04
반응형
티스토리 친구하기