Blog-Build
총 14개의 포스팅이 있습니다.
Velog에서 Astro로 블로그 이전하기: 자동화 스크립트 작성기
Velog 블로그의 글들을 Astro 블로그로 마이그레이션하는 과정: velog-backup 도구 사용부터 Frontmatter 자동 변환, 이미지 경로 수정 및 트러블슈팅 과정 정리
#Astro#Migration#Node.js#Velog2026-03-03
Astro 블로그에 검색 기능 구현하기: search.json.ts의 비밀
Astro의 SSG 환경에서 API 엔드포인트를 활용하여 클라이언트 사이드 검색을 구현하는 원리와 React 연동 방법을 알아본다.
#Astro#React#Search#SSG#API Endpoint2026-03-03
Astro 블로그에 AI 작성 배지 추가하기(프론트매터 스위치 패턴)
Astro의 프론트매터와 Zod를 활용하여 원하는 포스트에만 선택적으로 AI 작성 명시 배지를 렌더링하는 방법
#Astro#TypeScript#Frontend#UI-Design2026-03-03
Astro 블로그 카테고리 생성 최적화, reduce를 활용한 빌드 성능 향상
Astro의 getStaticPaths에서 불필요한 필터링과 정렬 연산을 줄이고, reduce를 활용하여 카테고리별 포스트 그룹화를 최적화하는 방법
#Astro#TypeScript#JavaScript#Optimization#reduce2026-03-03
Tailwind CSS로 반응형 블로그 레이아웃 잡기 (Header, Footer, Sidebar)
Astro와 Tailwind CSS를 활용하여 헤더, 푸터 정렬부터 반응형 사이드바 레이아웃까지 구축하며 겪은 고민과 해결 과정 기록
#Tailwind#CSS#Layout#Responsive#Astro2026-03-02
구글 애드센스 "사이트가 다운되었거나 사용할 수 없음" 에러 해결기 (robots.txt 404)
클라우드플레어 환경에서 애드센스 크롤러가 사이트를 찾지 못하는 문제 원인 분석 및 robots.txt 추가로 해결한 과정
#AdSense#애드센스#Cloudflare#robots.txt#SearchConsole#트러블슈팅2026-03-02
Astro 블로그 사이드바 position: sticky 점핑 현상 해결기
Astro와 Tailwind CSS로 사이드바를 구현할 때 발생하는 position: sticky의 덜컥거리는 현상(Jumping) 원인과 픽셀 계산을 통한 해결 방법
#Astro#Tailwind CSS#Troubleshooting#Frontend2026-03-01
Astro 블로그 카테고리와 아일랜드 사이드바 구현하기
Astro를 이용해 카테고리 분류와 아일랜드 형태의 고정 사이드바를 구현하는 방법
#Astro#TailwindCSS#TypeScript#UI-Design#Optimization2026-03-01
Astro 블로그 구글 서치 콘솔 등록 및 사이트맵 제출하기
구글 검색 노출을 위한 Cloudflare DNS 인증부터 Astro 사이트맵 생성, sitemap-index.xml 까지
#Astro#SEO#GoogleSearchConsole#Sitemap#Devlog2026-03-01
Astro + Netlify + Cloudflare로 블로그 배포하고 구글 애드센스 연동하기
Vercel 대신 Netlify를 선택한 이유부터 도메인 연결, 404 에러 해결, 그리고 애드센스 승인 신청까지의 전체 과정 정리
#Astro#Netlify#Cloudflare#AdSense#Devlog2026-03-01
Astro + Tailwind 블로그에 다크 모드 적용하기
Tailwind CSS를 활용하여 깜빡임 없는 다크 모드와 커스텀 테마 토글 버튼, 마크다운 Typography 커스텀까지 구현한 과정
#Astro#TailwindCSS#Frontend#Design#Blog2026-03-01
Astro + Tailwind 가독성 튜닝과 브랜드 컬러 입히기
Astro 블로그의 레이아웃 최적화, 타이포그래피 설정, 그리고 색상 팔레트를 활용한 브랜드 디자인 적용기
#Astro#TailwindCSS#Frontend#Design#Blog2026-03-01
Astro + React + Tailwind로 블로그 구축 시작
Astro 기반의 블로그 구축 과정 정리(feat. Empty 프로젝트)
#Astro#React#TailwindCSS#Frontend#Blog2026-02-28
첫 블로그 포스팅
Astro와 React, Tailwind를 활용해 직접 블로그를 구축해보았다
#Astro#React#Frontend2026-02-27