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