Written by Jieun
Home
  • 전체 (129)
    • Git (1)
    • React, Next (57)
    • HTML & CSS (2)
    • JavaScript, TypeScript (24)
    • Node.js (11)
    • MongoDB (4)
    • AWS (2)
    • 코딩테스트, 알고리즘 (17)
    • etc (8)
    • 일상 (1)
블로그 내 검색

Written by Jieun

👩🏻‍💻 내 마음대로 Today I Learned

  • React, Next

    [Next] Next.js란?

    2023. 8. 16.

    by. 지은이: 김지은

    728x90

    이제 React보다 더 많이 뜨고 있는 Next를 알아보자!

     

    1. Next.js 란?

    React 프레임워크로 SSR(Server Side Rendering) 와 SSG(Server Side Generation)를 지원하며 검색 엔진 최적화(SEO)를 향상시킨다. 

    여기서 React와 비교하자면, React는 CSR(Client Side Rendering)을 지원하는데 초기 로딩 성능과 검색 엔진 최적화에 취약하다는 단점이 있다. 렌더 과정을 더 자세히 알고 싶다면? 👉 SPA 렌더링 전략과 렌더 과정(CSR, SSR, SSG)👈

     

    2. Next.js 또 다른 기능

    1) 라우팅

    Next는 내장된 라우팅 시스템을 제공해서 클라이언트 사이드 라우팅을 간단하게 구현할 수 있다.

     

    2) API 라우팅

    내부적으로 서버리스(Serverless), 서버가 없다는 게 아니고 서버 관리를 직접 하지 않아도 되는 백엔드 역할이 가능하다.

     

    3) 타입스크립트

    TypeScript를 공식적으로 지원하며 Next를 설치할 때 TypeScript를 사용할거냐고 묻는다.

     

     

    4) 플러그인

    플러그인 시스템을 제공하기 때문에 쉽게 통합하고 확장이 가능하다.

    5) CSS-in-JS 지원

    CSS 모듈과 CSS-in-JS를 기본적으로 지원하여 스타일링을 간편하게 관리할 수 있도록 도와준다.

     

    그래서 Next.js는 성능, 사용자 경험, 개발 생산성, SEO 등의 이유들로 유용한 도구로 평가받는다.

     

    저작자표시 (새창열림)

    'React, Next' 카테고리의 다른 글

    [Next] Next.js 13 라우팅 (1)  (0) 2023.08.18
    [Next] Next.js 13 시작하기  (0) 2023.08.17
    [React] Redux-Persist로 새로고침해도 데이터 유지하기  (0) 2023.08.05
    [React] 리덕스 툴킷 Redux Toolkit 사용하기  (0) 2023.08.04
    react, react-native로 Tailwind CSS 사용하기  (0) 2023.07.23

    댓글

    관련글

    • [Next] Next.js 13 라우팅 (1) 2023.08.18
    • [Next] Next.js 13 시작하기 2023.08.17
    • [React] Redux-Persist로 새로고침해도 데이터 유지하기 2023.08.05
    • [React] 리덕스 툴킷 Redux Toolkit 사용하기 2023.08.04
    맨 위로
전체 글 보기
Tistory 로그인
Tistory 로그아웃
로그아웃 글쓰기 관리

Today

Total

Designed by Nana
블로그 이미지
지은이: 김지은

티스토리툴바