- Today
- Total
Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
Tags
- Redux
- 코인차트
- apollo
- error
- 비전공자
- 채팅
- rtk
- 주식
- chart
- Firebase
- 코인
- 에러
- nextjs
- 차트구현
- 차트만들기
- 리액트
- Flutter
- typescript
- 항해99
- 3주차
- react
- Coin
- typeorm
- nestjs
- 주식차트
- javascript
- websocket
- graphql
- API
- 차트
Archives
Act99 기술블로그
[React] 주식사이트 만들기-6 Next.js로 이사하기 [Redux, Crypto Compare] 차트 라이브러리x 본문
개발팁저장소/nextjs
[React] 주식사이트 만들기-6 Next.js로 이사하기 [Redux, Crypto Compare] 차트 라이브러리x
Act99 2021. 12. 8. 19:13React를 하면서 항상 Next.js 를 사용해보려고 생각만 했는데 이번에는 실제로 사용해보려고 한다.
Next js의 장점은
1. 자동 라우팅 (아주 매력적이다. 편안...)
2. SSR 구현에 용이하며 덕분에 SEO 최적화가 가능하다. (이건 직접 체감하기에는 오래걸릴 것 같다.)
그럼 바로 작업을 시작하겠다.
먼저, tailwindCSS & Typescript & Redux & Apollo 를 기반으로 하는 Nextjs 를 만들어주었다.
npx create-next-app stock-chat --typescript
`npm install -D tailwindcss@npm:@tailwindcss/postcss7-compat postcss@^7 autoprefixer@^9`
`npm install @craco/craco`
`npm i d3-scale`
`npm i --save-dev @types/d3-scale`
`npm install @reduxjs/toolkit`
`npm i redux`
`npm install react-spinners`
`npm i react-tailwind-table`
`npm install react-table`
`npm i @types/react-table`
현재 next.js로 이사를 진행하고 있는데, 생각보다 에러가 많이 발생한다.
가령, <img> 를 <Image> 로 바꿔줘야하는 과정에서 to 가 안먹힌다거나, 네비게이션 훅이 먹히지 않는다거나.. 생각보다 손댈것이 많아서 오늘부터 계속 작업에 들어가야겠다.
'개발팁저장소 > nextjs' 카테고리의 다른 글
[Nextjs] 주식사이트 만들기-6 채팅 프론트엔드 (Websocket Error) (0) | 2021.12.14 |
---|---|
[Nextjs] 주식사이트 만들기-4 채팅 프론트엔드(Apollo client, graphQL, useQuery) (0) | 2021.12.13 |
[Nextjs] 주식사이트 만들기-3 프론트엔드 채팅 만들기 (Apollo client, graphQL, useForm) (0) | 2021.12.10 |
[Nextjs] 주식사이트 만들기-2 코인 이평선 만들기 & 볼린저밴드 만들기 [Redux, Apollo] 차트 라이브러리x (0) | 2021.12.09 |
[Nextjs] 주식사이트 만들기-1 Next.js로 이사하기 [Redux, Apollo] 차트 라이브러리x (0) | 2021.12.08 |