2026
Astro 6, Tailwind CSS v4, Vite 8 버전 충돌 해결하기
Astro 6.1이 Vite 7을 사용하는데 Tailwind CSS v4.2.2가 Vite 8을 끌어오면서 발생하는 버전 충돌 문제와 해결 방법 정리
Astro + Tailwind v4 다크모드 구현
Astro에서 Tailwind CSS와 light-dark()를 사용해 라이트/다크를 안정적으로 토글하는 방법
Astro 블로그에서 카테고리 설계하기
Content Collection, 타입 안전성, UI 배지까지 Astro 블로그 카테고리 설계 방법 정리
2025
2024
인프콘 2024 후기
인프콘 2024에 참석해서 들었던 세션들에 대한 회고
Read Magic
README 초안 작성을 쉽고 빠르게 작성할 수 있게 도와주는 서비스
Astro 프로젝트에 "맨 위로" 버튼 추가하기
daisyUI를 활용하여 Astro 프로젝트에 세련되고 접근성 높은 "맨 위로" 버튼을 구현하는 방법
실수로 지워진 .git 폴더 복구하기
.git 폴더를 실수로 삭제했을 때 커밋을 복구하는 방법과 유용한 Git 명령어에 대해 알아보기
반응형 사이드바 구현하기
Next.js 프로젝트에서 shadcn/ui를 사용해서 반응형 사이드바를 구현하는 방법
daisyUI 사용하기
프로젝트에 daisyUI를 설치하고, 사용하는 방법에 대한 정리
CSS 한 줄로 배경 이미지에 오버레이 추가하기
border-image를 사용해서 배경 이미지에 오버레이를 추가하는 방법
99Club Coding Study
99Club에서 진행했던 스터디 기록으로 구현한 프로젝트
Next.js에서 노션 데이터베이스 사용하기
Next.js 프로젝트에서 노션 데이터베이스를 사용하는 방법의 단계별 정리
MDX 블로그 구현하기
Astro와 Tailwind CSS를 사용해서 MDX 블로그를 구현하는 방법
Tailwind CSS v4 적용하기
Next.js, Vite, Astro에 Tailwind CSS v4를 적용하는 방법
Woongsnote
개발 관련 학습한 지식 공유를 위한 기술 블로그
Tailwind CSS를 유용하게 쓰는 방법
Tailwind CSS를 사용할 때 유용한 팁들에 대한 정리
2023
Next.js 14에서 이메일을 보내는 방법
Next.js의 App Router 및 Server Actions를 사용하여 이메일을 보내는 방법
Next.js 포트폴리오에 대한 회고
Next.js로 온라인 포트폴리오를 구축하면서 얻은 경험과, 교훈에 대한 개인적인 회고
Next.js에서 Astro로 전환하기
기존 Next.js 블로그의 프레임워크를 Astro로 전환한 후기
Linktree
Vite로 구현한 Linktree 프로젝트
Next.js에서 섬네일 이미지 쉽게 생성하기
Vercel/og를 사용해서 섬네일과 OG(Open Graph) image를 자동으로 생성하는 방법
QR Code 생성기
QR Code 라이브러리를 활용해서, 구현한 QR Code 생성기
미니픽
간단하게 Thumbnail을 생성할 수 있는 웹 서비스
Contentlayer 블로그 만들기
Next.js와 Contentlayer를 사용해서 블로그 템플릿 구현하기
React.Fragment에 관하여
React.Fragment에 대한 정리
Next.js 13과 리액트 서버 컴포넌트
리액트 서버 컴포넌트에 대한 정리
CSR vs SSR vs SSG
CSR, SSR, SSG에 관한 비교
Toodos
추천 검색어 기능 구현
Debounce(디바운스)란?
Debounce(디바운스)에 관한 정리
ESLint와 Prettier
코드 스타일링 도구의 소개 및 사용 방법
Context API란?
Context API에 관한 정리
시맨틱 태그란?
HTML에서 시맨틱 태그(Semantic Tag)의 종류에 관하여
왜 기술 블로그를 만들었는가?
Next.js로 기술 블로그를 구현했던 후기