전체 글 (3) 썸네일형 리스트형 [Next.js - loading.tsx] 로딩도 보여야 예쁘게 만들죠? Next.js에서는 `loading.tsx` 파일을 만들어 페이지의 로딩 상태를 사용자에게 보여줄 수 있습니다.이 로딩 화면은 현재 페이지가 데이터를 불러오고 있다는 사실을 사용자에게 알려주는 중요한 역할을 합니다.(오류가 아니고, 데이터를 불러오는 중이니 조금만 기다려달라는 부탁일겁니다. 개인적으로는 예쁘다고도 생각해요.)대부분의 경우, 로딩 화면은 아주 잠깐만 보여지는 것이 이상적입니다. 페이지 전환이나 데이터 호출이 빠르면 빠를수록 사용자 경험은 좋아지니까요.그런데 로딩 화면이 너무 빨리 사라지면, 정작 개발자는 그 화면을 제대로 볼 수가 없습니다.(그치만 로딩 화면을 개발중이란 말이에요.)자 그렇다면 '로딩 화면을 오래 보고 싶다는 이상한 욕심' 을 부려야 할 때,어떻게 하면 좋을까? 에 대해 .. [React에서 lottie 사용하기] 아름다운 UX를 위해 lottie-react 개발자가 Lottie란 무엇인지에 대해 자세히 알아보는 것 까지 필요할까? Lottie란 결국 JSON 포멧의 애니메이션 파일이다. React에서 해당 파일을 어떻게 적용하는 지에 대해서만 정리해보자. Lottie Easily add high-quality animation to any native app. Lottie is an iOS, Android, and React Native library that renders After Effects animations in real time, allowing apps to use animations as easily as they use static images. airbnb.design 무료 로티 애니메이션, 모션 그래픽을 위한 모든 플러그인과 도구를 한.. [브라우저 기본 스크롤 바 커스텀] 스크롤이 아름다워졌어요. 브라우저의 기본 스크롤 바가 어떻게 생겼는지 다들 아십니까? 사실 저도 mac OS에서 브라우저를 띄워서인지 스크롤 바가 유난히 못생겼거나 화면에 방해가 된다는 생각을 안 한 지 오래되었습니다. 그러나 웹 개발자인 우리에겐 윈도우도 있다는 사실을 잊지 말아야 하죠. (스크롤바는 OS와 브라우저의 조합에 따라 다양하게 나타납니다.) 윈도우는 기본적으로 오른쪽에 스크롤바가 항상 존재한다. 크롬이나 익스플로러나 파이어폭스나 모두 나타나는 현상이다. 또한 마우스 커서를 오른쪽에 갖다댄다고 해서 어떤 동작이 일어나는 일은 없다. 윈도우는 기본적으로 스크롤바가 무조건 존재한다고 봐야하겠다. 윈도우의 경우 스크롤바가 컨텐츠 영역 밖에 따로 존재하는것 처럼 보이기 때문에 실제로는 컨텐츠 영역에서 스크롤바의 크기만큼 줄.. 이전 1 다음