post-thumbnail

Next.js - 카카오 로그인 구현

이번 프로젝트에서 로그인 부분을 담당하게 되었다. 카카오 로그인과 이메일 로그인을 구현해야 하는데, 이미 백엔드 개발자분께서 만들어 놓으신 api가 있어서 쉽게 할 수 있을 것 같았지만... 중간에 내가 알고있는 방식대로 되지 않아 새로운 방식을 찾아서 하느라 고생을

2022년 3월 26일
·
0개의 댓글
post-thumbnail

Cookie & Session vs JWT

인터넷 상에서의 웹통신에는 여러가지 규약이 존재한다. 이것을 Protocol이라고 하는데, HTTP는 서버와 클라이언트 모델을 따르는 가장 기본적인 Protocol이다. HTTP는 connectionless 및 stateless 특징을 가지고 있어서 요청에 대한 응답

2022년 3월 20일
·
0개의 댓글
post-thumbnail

Next.js - next.config.js

next를 좀 더 커스텀하게 사용하기 위해 next.config.js 파일에서 기본 설정을 할 수 있다. next.config.js 는 JSON 파일이 아닌 일반 Node 모듈이고 next 서버 빌드 단계에서 사용되며 브라우저 빌드에는 포함되지 않는다. next.con

2022년 3월 1일
·
0개의 댓글
post-thumbnail

Next.js - next/head

NextJS의 장점인 SEO를 최대한 활용하기 위해 next/head 로 부터 <HEAD> 태그를 사용하여 이 페이지의 정보를 웹 크롤러가 알 수 있게 한다.기본적으로 크롤러는 html 문서를 읽는다고 알고 있다. 문서를 로딩한 뒤에 자바스크립트가 실행되는데 이

2022년 3월 1일
·
0개의 댓글
post-thumbnail

Next.js - Routing

next.js 에서는 Routing을 쉽게 할 수 있도록 지원하고 있다. pages 폴더에 파일시스템 방식으로 파일, 폴더를 만들면 자동으로 파일, 폴더 이름을 기반으로 Routing을 지원한다. >pages/index.js → / pages/posts/first-p

2022년 1월 19일
·
0개의 댓글
post-thumbnail

Next.js - Data Fetching

getStaticProps, getServerSideProps 는 next.js에서 data를 fetching 방식으로 이 방식들을 알아보기 전 Pre-rendering 개념을 살펴보자. Pre-rendering 앞에서 배웠듯이 next.js는 페이지를 이동 할 때

2022년 1월 17일
·
0개의 댓글
post-thumbnail

Next.js - Image Optimization

next.js에서는 이미지 최적화를 위해 Image 컴포넌트를 제공한다. Image 컴포넌트를 사용하면 다음과 같은 기능들을 이용하여 최적화된 이미지를 사용하여 성능을 향상할 수 있고, 더 나은 사용자 경험을 만들 수 있다. 최신 이미지 형식을 사용하여 항상 각 기기

2022년 1월 15일
·
0개의 댓글
post-thumbnail

Next.js - SSR, CSR, Next.js를 사용하는 이유

next.js는 React의 프레임워크로 SSR(Server Side Rendering)을 쉽게 구현하게 해주며, SEO(Search Engine Optimization)등의 여러기능을 제공한다. 또한 기본적으로 React에서 흔히 사용되는 CSR(Client Side

2022년 1월 15일
·
0개의 댓글