일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- 리액트
- 겹치는 선분의 길이
- React
- 생명주기
- Redux
- 리엑트
- google firebase
- JavaScript
- 달리기경주
- lifecycle
- 배열
- 자바스크립트
- next-pwa
- NextJS
- 리덕스
- csr
- Recoil
- useMutation
- 넥스트
- react-query
- Next
- Firebase
- 파이어베이스
- JS
- SSR
- debounce
- programmers
- 투두리스트
- customModal component 만들기
- todolist
- Today
- Total
목록Next (3)
끄적끄적
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bFs3Hj/btsAqLnnpWt/tq8hDuxTP8KDxIyHf8tgTk/img.png)
NextJS 의 14버전이 발표됐습니다. 13이 나오고 몇달마다 계속 새로운 업데이트가 되고있으면서 이번에 또 14버전이 나왔습니다. 역시나 프론트엔드 생태계는 정말 빠르게 변화하고 발전하고 있다는게 실감이 됩니다. 먼저 새롭게 나온 14버전의 달라진 점을 확인해보겠습니다. 공식문서에 발표된 내용을 살펴보겠습니다. ①Turbopack - 최대 53% 더 빠른 로컬 서버 시작 - 빠른 새로고침으로 최대 94% 더 빠른 코드 업데이트 ②서버 작업(안정) - 캐싱 및 재검증과 통합 - 간단한 함수 호출 또는 기본적으로 양식에서 자동 ③부분 사전 렌더링(미리보기) - 빠른 초기 정적 응답 + 스트리밍 동적 콘텐 서비스가 규모가 커지거나 코드의 양이 많아지면 로컬에서 실행하며 개발 할때 가장 스트레스 받는게 속도..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bvNTIW/btsn8lmAXX6/KHpZaNwtELFDoRwNVq1WJ0/img.png)
사실 Next를 써야 한다해서 그냥 쓰지, 쓰다보니 기본적으로 제공되는 장점이나 무엇때문에 편했는지, 빨랐는지는 알지 못한 채 사용하는 경우가 있습니다.저 또한 프로젝트에 투입될때 처음으로 Next를 경험했고, 이미 Next로 작성된 코드들을 수정하다보니 막상 뭐가 좋은지, 잘쓰고 있는건지 전혀 알지 못한채 사용 하고 있었습니다.그래서 오늘은 Next를 사용함으로써 얻는 기본적인 장점들 및 기본 개념을 한번 살펴보려고 합니다.① SSG(Static Site Generation) 과 SSR(Server-Side Rendering)SSG와 SSR 모두 서버 사이드 렌더링 (SSR) 을 의미하긴 하지만, 약간 다른 개념이다. SSG는 Next.js의 기능 중 하나로, 미리 정적인 HTML을 빌드 시점에서 만들..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bEPSSt/btqROeM6NBt/KnB0DxhN4U0S9qKEUce6A0/img.png)
Next는 React 전용 프레임워크입니다. React에서 Sever Side Rendering을 쉽게 하기 위해 만들어진 프레임워크입니다. CSR(Clinet Side Rendering) 과 SSR(Server Side Rendering)은 이전의 블로그를 참고해주시면 되겠습니다. ! Next의 특징 ● React에서 SSR을 가능하게 해준다. SPA의 큰 단점 중 하나는 첫 페이지에 빈화면을 먼저 받고 JS파일을 해석하며 화면을 구성하기 때문에 SEO에 가장 큰 문제를 갖고 있습니다. React만으로도 SSR을 구현할 수 는 있지만 매우 복잡하고 까다롭다고 합니다. 이를 Next를 통해 해결할 수 있습니다. 완성된 HTML파일을 처음에 받아오게 하여 맨 처음 화면의 로딩 속도 또한 빠르게 해줍니다. ..