ThankYouNEXT

React Project → Next.js Project

Why?

사내 사이드 프로젝트를 진행하면서 처음엔 개발자가 나 혼자여서 프론트엔드 프로젝트로만 생각했는데 해당 프로젝트를 진행하면 할 수록 백엔드단의 필요성이 절실해졌음..ㅜ_ㅜ

배포는 가장 간단한게 vercel 이라서 vercel로 진행했는데, vercel에서 만든게 바로 Next.js 였다… 얏호

리액트의 localstorage만으로는 당연히 한계가 있었기 때문에, db구축을 생각함,,,

그래도 다행이었던 점은 vercel project내에서 Storage를 누르면 postgres, blobs, Edge Config 같은 여러 선택지가 나오는데!!!!

물론 데이터베이스 설계 수업을 듣지 않았지만 그래도 그나마.. 익숙했던 Postgres를 선택해서 진행하기로 결정하였습니다…..

근데 진짜 풀스택을 하고싶지는 않았구요….

사실 전 인공지능학과란 말이죠.. 하하

그치만 스타트업은 원래 이러면서 성장해가는거죠

my-React-project/
├── components/
│   ├── AddBuildingForm.js
│   ├── Display.js
│   ├── ParentComponent.js
│   └── sidebar.js
├── pages/
│   ├── api/
│   │   └── SomeAPIFile.js
│   ├── _app.js
│   ├── index.js
│   ├── AllSettingPage.js
│   ├── Home.js
│   └── SettingPage.js
├── public/
│   ├── logo.png
│   ├── index.html
│   └── robots.txt
├── styles/
│   ├── addbuildingform.css
│   ├── settingpage.css
│   ├── sidebar.css
│   └── styles.css
├── .gitignore
├── next.config.js
├── package.json
└── README.md

이런 structure에서

my-nextjs-project/
├── components/
│   ├── AddBuildingForm.js
│   ├── Display.js
│   ├── ParentComponent.js
│   └── sidebar.js
├── pages/
│   ├── api/
│   │   └── SomeAPIFile.js
│   ├── _app.js
│   ├── index.js
│   ├── AllSettingPage.js
│   ├── Home.js
│   └── SettingPage.js
├── public/
│   ├── logo.png
│   ├── index.html
│   └── robots.txt
├── styles/
│   ├── addbuildingform.css
│   ├── settingpage.css
│   ├── sidebar.css
│   └── styles.css
├── .gitignore
├── next.config.js
├── package.json
└── README.md

이렇게 바꿔야 Next.js 마이그레이션이 가능하답니다....ㅎㅎ