본문 바로가기

개발(Development)/Next.js 1312

[Next.js 13] 서버 포트 번호 변경 방법 Next.js 에서 서버를 구동하면, 기본적을 3000번 포트에서 서버가 실행된다. 물론 개발 서버와 프로덕션(배포용) 서버의 포트 번호 변경도 가능하며, 아래의 방법대로 진행하면 된다. # 서버 포트 변경 방법 개발 서버 및 프로덕션 서버의 포트를 변경하려면, package.json 파일에서 `-p 포트번호` 옵션을 추가하여 스크립트를 실행해주면 된다. "scripts": { "dev": "next dev -p 5000", "build": "next build", "start": "next start -p 6000", "lint": "next lint" } 예를 들어, 위와 같이 스크립트 수정후, - `npm run dev` 명령어를 실행하여 개발 모드로 서버를 구동하면, `http://localhos.. 2023. 8. 18.
[Next.js 13] 설치, 빌드, 서버 구동 방법 (개발 모드/프로덕션 모드) # Next.js 13 설치 방법 기본적으로 Node.js 16.8 이상이 설치된 상태에서 진행해야 한다. (node.js 공식 홈페이지에 방문하여 OS에 맞는 설치파일을 다운로드 받아서 설치하면 된다.) 1. 설치 `create-next-app` 명령어를 사용하여 Next.js를 설치하면, 관련 설정까지 자동으로 세팅된다. 터미널에서 상에서 원하는 경로로 이동 후, 아래 명령어를 실행한다. npx create-next-app@latest 만약 현재 경로 상에 설치하려면, 명령어 뒤에 마침표( . )를 하나 붙여준다. npx create-next-app@latest . 2. 세팅 설치를 시작하면 터미널 상에서 몇가지 질문을 받게 된다. 프로젝트 이름, 사용할 라이브러리, 추가 설정에 관한 것으로 추천하는.. 2023. 8. 18.
[Next.js 13] Next.js란? 주요 기능과 역할 # Next.js란 Next.js는 React로 웹 서비스를 구축할 수 있는 풀스택 프레임워크이다. 구체적으로 Next.js는 다음과 같은 역할을 수행할 수 있다. Front-End Server: 브라우저의 요청을 받으면, React로 렌더링한 HTML페이지를 응답한다. API Server: 클라이언트의 API 콜을 받아서 JSON등을 응답한다. Back-End Server: Node.js 환경에서 구동되므로, 데이터 베이스 연동, 파일시스템 접근 등이 가능하다. 이 외에도 복잡한 번들링, 컴파일 등의 설정 작업을 Next.js 에서 기본적으로 제공해주기 때문에, 개발자는 좀더 웹 개발에만 집중할 수 있게 되어 아주 유용하다. (+성능 또한 좋다) 한마디로 Node.js의 Express와 유사한 프레임워.. 2023. 8. 18.