난 원래 php , laravel 개발자이다.
기존에는 리액트로 개발했던적이 있다.
약 1년전에 아주 짧지만 여러가지 시도를 해봤다.
이번에 새로운 프로젝트를 들어가는데 문득, 나는 회사에서 무엇을 남기느냐, 혹은 무엇을 가져가느냐에 대한 생각이 들었다.
그래서 든 생각은, 시도를 해본다는것
그래서 팀장님과 나는 리액트 넥스트js를 시도해보기로 했다
우선 오늘은 첫날.
hello world 띄우기
- 노드 다운로드
https://nodejs.org/ko LTS버전
npm버전 = 10.9.2
노드란? laravel의 composer 느낌.
사용하는 플러그인 들의 버전관리 툴
버전 관리란, 나의 버전만 관리하는게 아닌, 같이 개발하는 모든 개발자들의 버전이 조금의 차이없이 동일하게 관리 될수 있도록 하는 관리.
- next.js 설치
CMD 접속 후 경로 C:\로 이동
커맨드
npx create-next-app@latest
실행
project named? (lms)
use TypeScript (Yes)
use ESLint (Yes)
use TailwindCss (Yes)
code inside a src/ (Yes)
use App Router (Yes)
use Turbopack (Yes)
import alias (No)
3
리액트 실행
후
커맨드 cd lms
커맨드 npm run dev
http://localhost:3000/ 접속으로 정상 작동 확인
봣다 Nextjs를..!!!
이제 기본적인 라우팅 어떻게 되는 시스템인지 알아보았다.
나는 버전이 15버전이라 라우팅이 조금 다르다고 한다.
보통 pages라는 폴더가 있지만, 13버전부터는 앱라우팅이 사용되면서
src/app 에 폴더를 만들어 사용하면 된다.
라우팅 따로 필요없이 폴더가 자동으로 해주는듯 하다...
개꿀;;;
http://localhost:3000/hello를 원한다면
src/app/hello/page.tsx 를 만들면된다.
앞으로 조금씩 next와 react를 게시해보도록 하겠다...
