꾸생의 DevLog

꾸생의 DevLog
꾸생의 DevLog

nProgress (1)

Post Thumbnail

Next.js에 nProgress 입히기

요즘 원티드에서 진행하는 프리온보딩 챌린지를 통해 프론트엔드 스킬과 현업에서의 고충, 노하우를 얻어가는 계기가 되었습니다. 오늘은 강의 내용 중 nProgress라는 효과를 처음 알게 되었고 Next.js에서 라이브러리를 통해 구현해 보았습니다. nProgress 란? Next.js 에서 페이지를 이동하는 움짤을 만들어봤습니다. 페이지를 이동할 때마다 상단에 프로그래스 바가 생겼다 사라지는데요. 일종에 서버의 응답을 기다릴 때 보여주는 스피너와 동일합니다. 확실히 로딩 스피너 보다 nProgress 가 더 깔끔한 느낌이라 호감이 갑니다. 코드 샌드박스 임베드 코드 넣어서 바로 보여드리려 했는데, 이제 무료에서는 기능을 제공하지 않는 거 같습니다. 아래 링크에서 테스트해 볼 수 있습니다. wonderful..

1

새로운 블로그로 이사했습니다. 😆

Home | 꾸생 블로그

프론트엔드 개발 블로그입니다. 사소한 것도 기록합니다 :)

kku.dev