📌시작하며 프로젝트를 시작하고 Tailwind를 사용하다 보니 자꾸 똑같은 속성의 클래스명을 헷갈려서, 자주 쓰는 내용을 정리해보면 좋을 것 같아 포스팅을 작성한다. 이 글은 아래와 같이 이어집니다. TailwindCSS 세팅(1) TailwindCSS 세팅(2) TailwindCSS 세팅(3) Tailwi...

📌시작하며 이번에 진행하는 프로젝트에서 전부터 해보고 싶었던 ‘언어 변경’기능을 구현하고 있다. 한국어와 일본어 두 언어를 지원하는 애플리케이션인데, 각 언어에 적절한 font를 사용하고 싶어 방법을 검색해보게 되었다. 🤔 Next/font를 시도하다 이번 프로젝트에서는 Next13을 사용하고 있고, Next.js가 13으로 업데이트되면서 새로 ...

📌시작하며 TailwindCSS 세팅(1)편에서 plugin이나 그 외 세팅을 마무리 했으니 이번엔 tailwind 컬러를 커스텀 해보고자 한다. 사실 거창해보이지만 별 건 없다🤭 이 글은 아래와 같이 이어집니다. TailwindCSS 세팅(1) TailwindCSS 세팅(2) TailwindCSS 세팅(3) ...

📌시작하며 Next.js에서 TailwindCSS 이용해 스타일링을 하기로 결정하고, 필요한 플러그인을 설치했다. 하지만 예상대로 작동하지 않거나 오류가 발생하는 경우가 있었다. TailwindCSS는 종종 사용할 것 같으니 이번 기회에 어떤 오류가 있는지 정리하고, 나름의 세팅 과정을 정리해보고자 한다. 이 글은 아래와 같이 이어집니다. ...

📌시작하며 Next.js + Typescript 인강을 듣던 중 선생님께서 (제네릭을 사용하시면서) 이 부분은 조금 어려울 수 있어요. 라고 말씀하셨는데.. 그 말씀 그대로였다. 선생님께서 작성하시는 문법이 타입스크립트 제네릭인 건 알고 있지만 그걸 내가 자유자재로 쓸 수 있는 가는 아무래도 다른 문제다 보니… 😥 그래서, 이번엔 확실하게...

📌시작하며 이 글은 아래와 같이 이어집니다. Next.js 13의 특징과 변화(1) Next.js 13의 특징과 변화(2) Next.js 13의 특징과 변화(3) routes 부분도 12 버전과 달라진 부분이 꽤 있다! 헷갈리지 않도록 이 번엔 Next13의 API Routes🌹에 대해 알아보자. ✅API...

📌시작하며 이 글은 아래와 같이 이어집니다. Next.js 13의 특징과 변화(1) Next.js 13의 특징과 변화(2) Next.js 13의 특징과 변화(3) 이 번엔 Next13의 꽃🌺 app 폴더를 살펴보고, api 작성법에 대해 정리해보고자 한다. ✅app router app/ │ ├───pag...

📌시작하며 개발 공부를 시작하고 지금까지 notion으로 많은 양을 정리해왔다. 하지만 notion으로 정리하면 아무래도 블로그보단 폐쇄적인 공간인 만큼 작성한 글을 누군가에게 보여주기 애매한 부분이 있었다. 아마 많은 개발자가 그렇겠지만.. 그 동안 다른 개발자분들의 블로그를 통해 공부한 부분이 많기에, 블로그를 시작해보면 어떨까? 생각하게 되었...

📌시작하며 이 글은 아래와 같이 이어집니다. Next.js 13의 특징과 변화(1) Next.js 13의 특징과 변화(2) Next.js 13의 특징과 변화(3) Next.js 강의를 수강을 시작한지 어느정도 시간이 지났다. 내가 React를 공부하기 시작했을 때는 많은 프로젝트나 강의가 클래스형 컴포넌트에...

📌시작하며 웹 애플리케이션에서 성능 측정은 어떻게 할까? 이번 글에서는 내 나름대로 성능지표와 Lighthouse에 대해 정리하고, 활용해볼 수 있는 자료를 만들어보고자 한다. ✨Lighthouse 이 내용은 Chrome for Developers 를 참고해 작성한다. Lighthouse는 웹페이지 품질을 개선하기 위한 오픈소스 자동화 ...

📌시작하며 컴포넌트를 만들다 보면, onClick이나 onMouseOver등의 이벤트를 props로 받아와야 하는 일이 간혹 생기곤 한다. 물론 props로 내려줘서 작업해도 문제는 없지만, 이벤트가 하나 더 발생하면, 컴포넌트에 정의해둔 props의 interface안에 작성해줘야 하는 번거로움이 생긴다. 그래서 미리 정의할 때 타입을 확장해서 ...

📌시작하며 연말에 가볍게 진행한 프로젝트에서 Jest를 간단히 적용해보았다. 역시 처음 도입하는 것이다 보니 시간도 많이 소요되고 삐그덕 거리기는 했지만 그래서 그런지, PASS가 뜰 때마다 너무 기뻐서 다들 봐달라고 하고 싶었다… 🤣 어쨌든, 이번 포스팅에서는 프로젝트를 진행하면서 새롭게 배운 Jest의 내용을 정리해보면서 복습해보려고 한다. ...