# nextjs

476개의 포스트
post-thumbnail

유튜브 클론코딩(댓글편)

댓글부분 만들기 - 2022 / 09 / 20 ~ 2022 / 09 / 22

약 3시간 전
·
0개의 댓글
·
post-thumbnail

🎁 Gift MBTI - 2. Result 페이지 시작(Emotion theme 적용, SEO 최적화 )

이번 프로젝트에선 emotion으로 스타일링을 하기로 했는데 특별한 이유가 있던 것은 아니고 그냥 다들 많이 쓰길래 사용해봤다.한 번도 사용해본적 없는 라이브러리라 걱정했는데 웬걸 그냥 문법이 styled-components랑 똑같았다!찾아보니 둘 다 CSS-in-JS

2일 전
·
0개의 댓글
·
post-thumbnail

Next.js 시작하기 - 소개 및 환경설정

Next.js 소개 https://nextjs.org/에 가보면 대표문구로 "The React Framework for Production"라고 쓰여 있다. react는 어떨까? https://reactjs.org/ 여기에는 "A JavaScript library f

2일 전
·
0개의 댓글
·
post-thumbnail

Next 초기 설정

Next.js: The React Framework Next.js는 리엑트 어플리케이션에서 SSR을 쉽게 구현해주는 프레임워크이다. 기능 직관적인 페이지 기반의 라우팅 시스템(다이나믹 라우팅도 지원) , 과 둘 다 페이지 기반 단위에서 지원해준다. 자동 으로 빠른

3일 전
·
0개의 댓글
·
post-thumbnail

Next.js에 Sentry로 에러 모니터링 하기

※ 팀포2 센트리건 아닙니다.

4일 전
·
0개의 댓글
·
post-thumbnail

Next.JS config 다뤄보기

NextJS에서 커스텀 설정을 하기 위해선 프로젝트 디렉터리의 루트에 next.config.js 또는 next.config.mjs 파일을 만들 수 있다.이는 JSON 파일이 아닌 Node.js 모듈이다.NextJS 서버 및 빌드 단계에서 사용되며 브라우저 빌드에는 포함

6일 전
·
0개의 댓글
·

좌우충돌 블로그 개발기행(2) - 개발 스택 선정

개발 스택 선정 일단 개발을 시작하기 전에 개발 환경 세팅을 위해 개발 스택을 골라보았다.

2022년 9월 21일
·
0개의 댓글
·

next.js, typescript, eslint, airbnb, prettier 로 프로젝트 설정하기

typescript를 사용하는 next.js 프로젝트 설치eslint 설정을 위한 eslintrc 파일 자동으로 만들기typescript 파서 설정nextjs 규칙 추가기타 next와 충돌하는 룰 삭제airbnb 규칙 설치airbnb 규칙 추가prettier 설치esl

2022년 9월 21일
·
0개의 댓글
·

Notion Project 마지막

오늘로써 노션 프로젝트가 마무리되었다. 마무리 단계에선 특별한 문제가 없을줄 알았지만 아니었다. 오늘 발생한 엽기적인 에러에 대해 적어보겠다. > 에러문 : Hydration failed because the initial UI does not match what was rendered on the server. 초기 UI가 서버에서 렌더링된 UI와...

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

[Next.js] 일기장 만들기

Next.js로 진행한 첫 프로젝트

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

유튜브 클론코딩(영상 부분편)

유튜브 클론코딩(영상부분) - 2022 / 09 / 12 부터 2022 / 09 / 16 까지의 작업을 담음

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

NextJS - page rendering(SSR,SSG)

✅ 기본 React 방식index 렌더링, 빈배열 > useEffect실행, http호출 후 데이터 배열에 할당 > index 재 렌더링해당 컴포넌트는 2번 렌더링이 됨두번의 렌더링 때문에 검색 엔진 최적화에 문제가 생김useEffect작업은 서버가 아닌 브라우저에서

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

NextJS란

React기반의 풀스택 프레임워크사전 렌더링 기능을 내장하기 때문에 NextJS는 싱글 페이지 애플리케이션을 제공하여 서버에 요청이 오면, 이 싱글 페이지에 동적으로 사전 렌더링을 거쳐 컨텐츠를 포함한 초기 페이지를 보여준다.✅ npm run build: 프러덕션 빌드

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

Next.js 시작하기

간단 소개와 빠른 시작

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

🎁 Gift MBTI - 1. Next.js 프로젝트 세팅, ESLint(airbnb), Prettier 설정

오늘부터 약 3주간 웹 디자이너와 협업으로 작은 토이 프로젝트를 진행하게 되었다프로젝트 규모가 작아서 그 동안 사용해보고 싶던 next.js와 redux-toolkit을 연습해보는 좋은 기회가 될 것 같다 👍: Next.js, Typescript, redux-tool

2022년 9월 18일
·
0개의 댓글
·
post-thumbnail

NextJS + React Query (with SSR)

React Query는 서버 사이드에서 prefecth한 데이터를 queryClient에 전달하는 2가지 방법을 지원한다. Using "initialData" getStaticProps나 getServerSideProps 함수와 useQuery 옵션 중 initalD

2022년 9월 18일
·
0개의 댓글
·
post-thumbnail

nextjs 설치

NEXT.JS 공식문서https://nextjs.org/docs/api-reference/create-next-appMSOffice문서https://learn.microsoft.com/ko-kr/windows/dev-environment/javascr

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

귤마켓 UI 구성(Feat. Tailwind) (2)

모든 소스는 깃허브에 있다.https://github.com/wannabeing/gyul-marketEDIT 2022.09.17📂 pages┣ 📂 chats (채팅 페이지)┃┣ 📜 id.tsx┃┗ 📜 index.tsx┣ 📂 community (동네생활

2022년 9월 16일
·
0개의 댓글
·
post-thumbnail

Next.js 프로젝트에 분석 툴 도입하기(Google Analytics, Hotjar)

Google Analytics와 Hotjar! ⚠️호이짜 아님 주의

2022년 9월 14일
·
0개의 댓글
·