[내배캠] 6/17

프로젝트 진행 방식

api 선택

지도api

컨셉 선택

카페 추천

전역상태관리

• RTK

챌린지 반 강의

App Router는 next.js의 새로운 라우팅 시스템이다.

회사에서 이미 Pages Router로 만들어 둔것이 있기 때문에 Pages Router를 아직 지원 하지만 App Router를 쓴다.

프레임 워크

다양한 정의가 있지만, 일반적으로 다음의 특징이 있을 때 프레임 워크라고 한다.

제어역전 : 소프트웨어를 만드는 데의 통제권, 제어권이 나(개발자)에게 있지 않고, 만들어진 틀에 맞춰서 개발을 진행해야 된다.

next.js는 React 기반의 프레임워크 라서 정해져있는 방식이 있다.

💡 프레임 워크를 쓰는 이유? > **robust** 하기 때문에

• robust : 튼튼한, 탄탄한

검증이 된 소프트웨어이다.

Next.js 특징

1. 서버 사이드 렌더링(SSR): 초기 페이지 로딩 시 서버에서 HTML을 렌더링하여 제공. SEO 및 성능 향상에 기여
2. 정적 사이트 생성(SSG): 빌드 타임에 HTML 페이지를 생성하여, 빠른 로딩 속도와 효율적인 서버 부하 관리를 제공한다.
3. 파일 기반 라우팅과 App Router:
4. API 라우트 지원 : 백엔드 로직을 위한 api 라우트를 쉽게 구성할 수 있다.

SEO의 성능 향상이 가장 이점?

app 밑 폴더가 router의 주소로 되고 그 폴더안에 있는 page.txsx가 페이지로 나온다

Link 태그는 client side에서 doc을 그린다.

a 태그는 server side로 다시 doc을 그린다.

처음 불러올 때는 ssr로, (seo가 중요해서)

그 다음에는 csr로 하는게 좋다.

그렇게 하기 위해 Link 태그를 쓰는듯.

폴더안에 page가 있는데

layout은 자기가 위치해있는 경로 페이지와 그 아래에있는 모든 페이지를 감싼다.

: ui를 공통으로 묶어준다.

공통된 비즈니스 로직을 묶을 수 있다.

내가 맡은 부분

지도, 필터