<aside> 🔖 next js 공식문서 요약본

</aside>

시작하기

• next js는 빠른 웹 어플리케이션 구축을 위한 기본 구성을 제공하는 유연한 react 프레임 워크임.
• 이게 뭔소리지?
• 요즘의 어플리케이션을 만들려면 다음과 같은 걸 생각해야 함.
  • UI, 라우팅, data fetching, 렌더링, integrations, etc..
• 리액트는 인터렉티브한 UI를 만들 때 사용하는 라이브러리임.
• 물론 리액트가 UI를 만들 때 유용한 기능을 제공하지만, 이러한 기능을 어디에 놓을지는 개발자들이 정하게 됨.
• 어쩌면 이런 게 서드파티와 다른 솔루션들이 범람하는 생태계를 만든 요인일지도!?
• 이는 즉, 개발자들은 여러 툴을 학습하느라 시간을 보내야 한다는 뜻임.
• 그래서 next js가 이러한 문제를 해결하려 등장함!
  • 최종 사용자들의 경험을 향상시키기 위한 routing, data fetching 것들 지원함.

Next.js의 장점

• 다음을 중점적으로 보자!
  • 어디에서 코드가 돌아가는지 : Development vs. Production
  • 언제 코드가 돌아가는지 : Build Time vs. Runtime
  • 어디서 렌더링이 되는지 : Client vs. Server
  • network

어디에서 코드가 돌아가는지 : Development vs. Production

• next js는 개발 단계 그리고 프로덕션 단계에서 다음과 같은 장점이 있음.

  • 개발 단계) DX 향상 : TypeScript, ESLint integration, Fast Refresh, compiled, bundled, minified, code split
  • 프로덕션 단계) 실유저에게 코드를 더 접근 가능하게 보여줌.

• Compiling

  • 컴파일링은 한 언어에서 다른 언어나 버전으로 옮기는 과정임.

    

• Minifying

  • 개발자는 코드를 인간 친화적이게 작성함.

  • 하지만 이런 코드는 코드를 동작하는데 불필요한 추가 정보를 포함함. ex) 주석, 공백, 줄바꿈

  • Minifying은 코드의 기능을 바꾸지 않고 불필요한 포맷팅 코드와 주석을 제거하는 과정을 말함.