Next.js
[Next.js] Next12 발표영상 후기
한국 시간으로 10월 27일, Next12의 발표가 있었다. 이 영상 썸네일은.... 저번 Next conf와 동일하게 1시부터 시작을 했고, 저번의 경험으로 일찍 끝난다는걸 알고 있었기 때문에 보고 잤다. 2021 Next.js Conf 후기 Next.js Conf A special edition of Next.js Conf, presented by Vercel (creators of Next.js) and Google Chrome. Let's make the web. Faster. nextjs.org 한국 시각으로 오늘인 16일 오전 1시에 Next.js의 앞.. nookpi.tistory.com Nextjs 자랑타임이 지나가고, 핵심 내용만 보도록 하자. 1. URL import (alpha) 말 ..
[Next.js] 프로덕션 환경에서 런타임 에러로 인한 무한루프(해결)
특정 페이지 진입시 무한루프 도는 현상 발생 SWR 에러 아님 Request 결과도 정상 local dev 환경에서는 무한루프 발생하지 않음. build 후 production 에서만 발생 원인 : 채널톡 객체 참조 불가 (채널톡 객체 검증 예외처리 미흡) 기존 채널톡 스크립트 로드를 전역 script에서 특정 페이지 내부로 옮기면서 문제 발생. -> 예외처리 미흡. 공통 Page 컴포넌트에는 예외처리 되어있었으나, 해당 페이지는 Page컴포넌트를 사용하지 않고 독자적으로 로직 구현되어 있었음. 그로 인해 런타임 환경에서 에러 발생 (스크린샷은 local dev 환경) GitHub Next.js Issue : _error 페이지가 렌더되지 않고 무한루프에 빠진 케이스 Endless loop when _e..
2021 Next.js Conf 후기
Next.js Conf A special edition of Next.js Conf, presented by Vercel (creators of Next.js) and Google Chrome. Let's make the web. Faster. nextjs.org 한국 시각으로 오늘인 16일 오전 1시에 Next.js의 앞으로의 방향에 대해 엿볼 수 있는 Next Conf가 있었습니다. 졸린 나머지 끝까지 들을 수 있을까 싶었지만, 30분 안에 종료되어 다행히 다 보고 잘 수 있었습니다. (after party는 못 봄) 이번 포스팅에서는 어제 본 Next.js Conf의 중요 내용을 정리해 보려고 합니다. 인트로 Next.live Image Component Script Component 총평 인트로 ..
Next.js HOC 안에 hook 로직 넣기
진행하고 있는 프로젝트의 오픈 준비로 한동안 포스팅을 하지 못하고 있었다. 1차 오픈을 하고 어느정도의 여유를 찾은 만큼, 틈틈이 포스팅을 다시 해보려고 한다. 오늘은 프로젝트 마무리 단계에서 SEO를 위한 각종 분석툴과 GA, 메타테그를 붙이면서 프로젝트 전체에 적용되어야 할 HOC를 만드는 과정에서 배운 내용을 적어보려고 한다. 먼저 HOC란 High Order Component. 즉 고차 컴포넌트이다. 고차 컴포넌트 – React A JavaScript library for building user interfaces ko.reactjs.org 설명에 잘 나와있듯이, 컴포넌트를 인자로 받아 새 컴포넌트를 반환하는 함수이다. 일반적으로 컴포넌트는 props를 받아 UI를 렌더링하지만, HOC는 컴포넌..
[react] What is The Difference Point Between Next.js & Create-React-App? (React의 CRA와 Next.js는 대체 뭐가 다를까?)
As you know, Create-React-App(CRA) made by Facebook is first recommanded Tool Chain in react environment. Create-React-App(줄여서 CRA)는 React 공식 가이드에서 첫 번째로 추천하는 툴체인이다. (first recommanded !== most recommanded) (물론 첫 번째로 추천한다는 말이 제일 추천한다는 말은 아니긴 하다) Anyway, CRA is powerful ToolChain to make single-page-application And also useful starter-kit for who learning react recently! (like me) 아무튼 공식 가이드에서 소개..