티스토리 뷰

웹개발

nextjs 시작하기

그래도널좋아해 2020. 8. 1. 15:58

nextjs 공식문서를 참고하여 개인적으로 브랜드사이트를 만들어보려고 합니다 아래사이트에서 Docs를 클릭하면 nextjs의 공식문서를 참고할 수 있습니다

 

https://nextjs.org/

 

Next.js by Vercel - The React Framework

Production grade React applications that scale. The world’s leading companies use Next.js by Vercel to build static and dynamic websites and web applications.

nextjs.org

 

설치

npx create-next-app
# or
yarn create next-app

 

저는 yarn을 사용하기때문에 아래의 코드로 설치하였습니다

 

nextjs는 기본적으로 git과 index 페이지, hello api를 가지고 생성되게 됩니다

 

실행하기

yarn dev

 

 

nextjs를 실행하면 기본으로 제공되는 index페이지를 localhost:3000 주소로 접속하면 확인할 수 있습니다

 

하단에 Powered by Vecel 라고 적혀있는데요 Vercel은 무엇일까요?

 

Vercel is the best place to deploy any frontend app. Start by deploying with zero configuration to our global edge network. Scale dynamically to millions of pages without breaking a sweat.

 

Vercel 홈페이지에서는 frontend app을 배포하기에 가장 좋은 장소라고 소개하고 있습니다 직접 제작한 nextjs앱을 vercel에 배포해볼수 있을것같습니다

 

API

api/hello.js 에 아래와같은 코드가 미리 작성되어있습니다 postman(api를 빠르게 전송해볼수있는 툴)을 이용하여 응답을 얻는것을 확인할 수 있습니다 nextjs는 간단한 api 응답 역할도 겸하고 있습니다

export default (req, res) => {
  res.statusCode = 200
  res.json({ name: 'John Doe' })
}

 

Postman

 

'웹개발' 카테고리의 다른 글

nextjs에서 global font 적용하기  (1) 2020.08.04
nextjs에서 typescript 사용하기  (0) 2020.08.04
댓글
공지사항
최근에 올라온 글