NextJS란?
NextJS는 리액트를 기반으로 한 프레임워크입니다.
NextJS는 풀스택 리액트 프레임 워크이기 때문에 리액트로 풀스택 애플리케이션을
구축하는 과정을 단순화할 수 있기에 사용합니다.
NextJS 장점은?
- NextJS의 가장 큰 장점은 풀스택 앱을 구축하는 것입니다.
- 파일 시스템을 사용하여 경로를 설정할 수 있습니다.
- NextJS가 페이지에 보이는 모든 내용을 렌더링 할 수 있습니다.
NextJS 사용 방법
1. NextJS를 테스트해보기 위해 원하는 폴더로 이동해줍니다.
2. 폴더에 아래의 명령어를 입력하여 Next.js를 설치해 줍니다.(Node.js가 설치되어 있어야 합니다.)
npx create-next-app@latest
3. 그 후 질문하는 글들이 나오는데 읽어보시고 자신에게 맞게 설치해 주시면 됩니다.
(저는 아래와 같이 구성하였습니다.)
4. 설치가 완료되면 아래와 같은 화면이 나옵니다.
5. 설치가 잘되었는지 확인해보기 위해 설치해 주셨던 폴더 안에 (project name)이 있는지 확인해 줍니다.
저 같은 경우 first-app으로 만들었고 잘 있는 것을 확인할 수 있었습니다.
6. 테스트를 해보기 위해 폴더를 이동해 준 후 npm run dev를 입력해 실행시켜 줍니다.
7. 실행이 정상적으로 되는 경우 http://localhost:3000에 접속해 주시면 아래와 같은 화면을 보실 수 있으십니다.
마치며
이렇게 next.js 실행 방법에 대해 알아봤으며 react를 공부한 후 제대로 된 Next.JS를 사용해 보도록 하겠습니다.