03-1. 파일 기반 라우팅 & 페이지
·
스터디/Udemy) NextJS 15 & React
◆ 파일 기반 라우팅각 페이지는 `page.js`라는 파일에 정의되고, 이 파일은 NextJS에게 페이지를 렌더링해야 한다는 것을 알려줍니다.이것은 NextJS의 강력한 기능 중 하나이며, 파일 시스템을 사용하여 애플리케이션의 구조를 자연스럽게 관리할 수 있습니다. ◆ 파일 시스템을 통한 경로 추가새로운 경로를 추가하기 위해 `app` 폴더 내에 새 폴더를 만들고 하위에 `page.js` 파일을 생성하면 됩니다.예를 들어 `/app/about/page.js` 파일을 생성하면 `/about` 페이지가 추가됩니다. ◆ 페이지 간 이동Server-side(Backend) : 서버 컴포넌트 함수를 실행하는 과정에서 최종적으로 렌더링될 HTML 코드를 생성합니다.Client-side(Frontend) : 렌더링될..
01. NextJS란 무엇이며, 왜 사용하는가?
·
스터디/Udemy) NextJS 15 & React
◆ NextJS란?: React 프레임워크의 확장판이며, 서버 사이드 렌더링(SSR), 정적 사이트 생성(SSG), API 라우팅 등을 쉽게 구현할 수 있도록 도와주는 도구입니다. ◆ NextJS의 필요성: NextJS는풀스택 리액트 프레임워크이기 때문에 리액트로 풀스택 애플리케이션을 구축하는 과정을 단순화합니다.풀스택 애플리케이션을 구축하는데 필요한 라우팅, 폼 제출, 데이터 처리, 인증 등의 기능을 제공합니다. ◆ NextJS 주요기능 및 장점풀스택 애플리케이션 구축프론트엔드와 백엔드에서 실행되는 코드를 모두 작성할 수 있어 풀스택 애플리케이션을 쉽게 구축할 수 있습니다.파일 시스템 기반의 경로 설정 (File-based Routing)파일 시스템을 사용하여 페이지의 경로를 설정할 수 있어 코드 기반..
유데미(Udemy) 러닝크루 / [ Next.js 15 & React - 완벽 가이드 ]
·
스터디/Udemy) NextJS 15 & React
유데미 러닝크루 1기 및 스터디 리더를 맡아 진행하게 되었습니다. 이번 스터디에서 진행할 강의는 'Next.js 15 & React - 완벽 가이드' 입니다. 강의는 외국인 강사님이 진행하시지만, 한글 자막이 제공되기 때문에 수강하는데 어려움은 없을 것 같습니다. [한글자막] Next.js 15 & React - 완벽 가이드   이 스터디는 총 10주 동안 진행되며, 매주 계획된 Section을 학습한 후, 포스팅을 통해 공부한 내용을 정리하고,Q&A 시간을 가져 어려운 점이나 궁금한 점을 함께 공유할 예정입니다. 각 주차마다 Next.js 15 버전과 React를 활용해 애플리케이션을 구현하는 방법을 단계별로 배울 수 있습니다.단순히 이론만 배우는 것이 아니라 실제 프로젝트를 통해 배운 내용을 실습으로..