# nextjs

487개의 포스트

Next.js에서 Embla Carousel 라이브러리를 사용하여 Carousel Slider 만들기

Embla Carousel 라이브러리를 사용하여 다음과 같은 슬라이더를 만드는법을 공유해보려고한다.

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

Drag Touch 뽀개기

라이브러리 없이 React에서 element를 터치로 움직이게 하자!!!

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

Drag Resize 뽀개기

라이브러리 없이 React에서 element 크기를 drag해서 조정하자!!!

2일 전
·
2개의 댓글
·

Next js앱 github action 이용해서 github-page/vercel에 배포하기

merge만해도 배포되도록 만들기

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

[원티드 프리온보딩]CSR,SSR,Next.js-사전과제

2022-10-02 프리온보딩 사전과제-CSR,SSR,NextJS시작할때 분석

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

라이브러리와 프레임워크의 차이

이 글은 노마드 코더님의 강의를 바탕으로 기록과 공유를 위한 의미를 가지고 있습니다.라이브러리는 우리가 '호출'하는 개념이다.가지고 와서 우리에 코드에 사용하는 느낌프레임워크는 우리가 프레임워크 안에 들어가서 사용하는 개념.예를들어 제일 유명한 라이브러리인 jQuery

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

Drag 이벤트 뽀개기

라이브러리 없이 React에서 element를 커서로 움직이게 하자!!!

4일 전
·
4개의 댓글
·

[NextJS] window is not defined

1. Introduction 아마 NextJs 를 처음 접하고 프로젝트를 만들다보면 'window is not defined' 문구와 함께 window 객체를 쓰지 못하는 경우를 마주치게 될 것입니다. 기존에 Vue 나 React 만 사용하셨던 분들은 "window

5일 전
·
0개의 댓글
·

[Next.js] Next js 시작하기

※ 실행 후 파일을 열었을 때 해당 에러가 발생한다면Parsing error: Cannot find module 'next/babel'1) 프로젝트 루트경로에 .babelrc 파일을 만들어준 뒤 해당 내용을 입력한다.2) 프로젝트 루트경로에 있는 .eslintrc.js

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

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

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

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

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

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

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

Next.js 시작하기 - 기본 다지기 1

1. Data Fetching nextjs의 data fetching 방법 4가지

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

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

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

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

Next 초기 설정

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

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

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

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

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

💻 비드마켓 리팩토링 next/link 적용기

⚠️ 정리한 내용은 오타나 잘못된 정보가 있을 수 있습니다. 댓글로 알려주시면 감사하겠습니다. 비드마켓 프로젝트의 모든 페이지에서 아래 사진처럼 next/Router의 useRouter 훅을 사용해서 router 객체에 접근하여 사용하였다.

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

Next.JS config 다뤄보기

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

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

💻 비드마켓 리팩토링 - 페이지 로딩 적용

⚠️ 정리한 내용은 오타나 잘못된 정보가 있을 수 있습니다. 댓글로 알려주시면 감사하겠습니다. 상품 카드를 눌렀을 때 getServerSideProps로 서버에서 데이터를 먼저 가져오기 전까지 로딩 처리가 없어서 화면이 멈춰있는 것 처럼 보이는 문제가 발생하였다.이런

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

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

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

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