From 9fd37d03cc55df3fb218d3ee54ef12953f56e842 Mon Sep 17 00:00:00 2001
From: 1ilsang <1ilsang@naver.com>
Date: Sun, 22 Dec 2024 20:17:27 +0900
Subject: [PATCH] chore: Update ogImage

---
 _posts/activity/mdn/mdn-contributing-translations.md | 4 ++--
 _posts/js/google-adsense.md                          | 4 ++--
 e2e/__snapshots__/posts.spec.ts/desktop/posts.html   | 2 +-
 e2e/__snapshots__/posts.spec.ts/mobile/posts.html    | 2 +-
 4 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/_posts/activity/mdn/mdn-contributing-translations.md b/_posts/activity/mdn/mdn-contributing-translations.md
index 06f32bbf..2c915c68 100644
--- a/_posts/activity/mdn/mdn-contributing-translations.md
+++ b/_posts/activity/mdn/mdn-contributing-translations.md
@@ -3,10 +3,10 @@ title: '오픈소스 기여 첫걸음, MDN 문서 번역 가이드'
 description: 'MDN 문서 번역 방법을 알아보자'
 url: 'mdn-contributing-translations'
 tags: ['mdn', 'contribution', 'translation', 'open-source']
-coverImage: '/images/posts/mdn-contributing-translations/thumbnail.webp'
+coverImage: https://raw.githubusercontent.com/1ilsang/dev/refs/heads/main/public/images/posts/mdn-contributing-translations/thumbnail.webp
 date: '2024-12-21T17:01:23.788Z'
 ogImage:
-  url: '/images/posts/mdn-contributing-translations/thumbnail.webp'
+  url: https://raw.githubusercontent.com/1ilsang/dev/refs/heads/main/public/images/posts/mdn-contributing-translations/thumbnail.webp
 ---
 
 ![cover](/images/posts/mdn-contributing-translations/cover.webp 'cover')
diff --git a/_posts/js/google-adsense.md b/_posts/js/google-adsense.md
index b07dbaef..cde28556 100644
--- a/_posts/js/google-adsense.md
+++ b/_posts/js/google-adsense.md
@@ -3,10 +3,10 @@ title: '[Next.js] Google AdSense 광고 적용 및 이해하기'
 description: '구글 광고 적용기'
 url: 'google-adsense'
 tags: ['google', 'ad', 'ads', 'adsense', 'nextjs']
-coverImage: '/images/posts/google-adsense/cover.webp'
+coverImage: https://raw.githubusercontent.com/1ilsang/dev/refs/heads/main/public/images/posts/google-adsense/cover.webp
 date: '2024-08-22T07:26:38.617Z'
 ogImage:
-  url: '/images/posts/google-adsense/cover.webp'
+  url: https://raw.githubusercontent.com/1ilsang/dev/refs/heads/main/public/images/posts/google-adsense/cover.webp
 ---
 
 ![cover](/images/posts/google-adsense/cover.webp 'cover')
diff --git a/e2e/__snapshots__/posts.spec.ts/desktop/posts.html b/e2e/__snapshots__/posts.spec.ts/desktop/posts.html
index bd53b0a5..bc9f07f7 100644
--- a/e2e/__snapshots__/posts.spec.ts/desktop/posts.html
+++ b/e2e/__snapshots__/posts.spec.ts/desktop/posts.html
@@ -1 +1 @@
-<nav class="fixed z-40 flex flex-wrap w-full justify-between justify-items-center hover:animate-rainbow-water hover:bg-nav hover:bg-[length:400%_400%] opacity-10	md:opacity-100 shadow-nav shadow-lg"><h2 class="tracking-tight mr-6 text-2xl	font-bold my-2 ml-3.5"><a class="hover:underline" href="/">1ilsang</a></h2><div class="flex"><h2 class="tracking-tight mr-6 text-xl mt-2.5"><a class="hover:underline" href="/posts">posts</a></h2><h2 class="tracking-tight mr-6 text-xl mt-2.5"><a class="hover:underline" href="/tags">tags</a></h2><div class="mr-2 w-8 h-8 mt-2" role="img" aria-label="1ilsang character"><a href="/about"><img class="border border-solid rounded-full border-white-blue" src="/images/chul.webp" alt="1ilsang"></a></div></div></nav><section class="h-auto min-h-full max-w-screen-md py-20 md:py-28 mx-4 min-[790px]:m-auto print:py-0 md:py-[4.8rem]"><div class="category-bar flex flex-wrap mb-4 justify-center border-b border-sub-blue"><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow after:content-['𒅄'] hover:animate-slow-spin"></span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">JavaScript</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Rust</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Activity</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Book</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Retrospect</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Tool</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Algorithm</span></div><ul class="pb-24 md:pb-56"><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/mdn-contributing-translations"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="/images/posts/mdn-contributing-translations/thumbnail.webp" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">오픈소스 기여 첫걸음, MDN 문서 번역 가이드</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">MDN 문서 번역 방법을 알아보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-12-22 02:01">2024-12-22 02:01</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/google-adsense"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="/images/posts/google-adsense/cover.webp" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[Next.js] Google AdSense 광고 적용 및 이해하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">구글 광고 적용기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-08-22 16:26">2024-08-22 16:26</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/inflearn-meetup-03-dev-career"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://cdn.inflearn.com/public/files/courses/333675/5fb60a7a-1b19-4b41-80e6-c49851282dec/5_meetup_p.png" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">인프런 판교 퇴근길 밋업 - 개발자 커리어 후기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">한기용님의 실리콘밸리에서 인정받는 개발자의 특징 10가지 소개</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-06-08 18:30">2024-06-08 18:30</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/typescript-subtyping"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/a56811d2-a7e2-4c71-b36e-d2bc368989b1" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Object.keys()는 왜 string[] 타입일까?</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">구조적 서브 타이핑과 집합적 특징을 알아보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-05-10 22:11">2024-05-10 22:11</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/visual-regression-test"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/a6de7fcd-2666-44f5-931a-c440785dc0e5" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">시각적 회귀 테스트 도입기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">playwright 소개와 트러블 슈팅</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-05-06 14:34">2024-05-06 14:34</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/mdn-ko-organizer"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/13851fba-2198-4113-aae2-8e6aedc05e2e" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">@mdn/yari-content-ko Organizer 합류 여정</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">Mozilla Developer Network는 어떤 곳일까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-04-13 17:21">2024-04-13 17:21</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/micro-state-management-review"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/3a57dcf8-43b1-4e95-ae8d-2b5194c83122" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Micro State Management with React Hooks 리뷰</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">상태 관리의 종류와 기술들에 대한 이해</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-03-01 09:00">2024-03-01 09:00</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/array-prototype-sort"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/47823496-4644-4e7b-9801-9d54273d200e" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Array.prototype.sort() 이해하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">정열적으로 정렬해 보기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-02-28 05:56">2024-02-28 05:56</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/2024-01"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/80b94675-d239-4f77-917d-52211a6a878d" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">2024년 1월 회고</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">1월은 설렘의 연속</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-02-09 15:06">2024-02-09 15:06</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/vite-dev-server"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/132b52c7-3c2b-4554-b0fb-8ec5f3193d7a" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Vite Dev Server 이해하기 (feat. HMR)</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">Dev 서버의 동작 방식은 어떻게 될까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-02-04 22:50">2024-02-04 22:50</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/udemy-rust-programming"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/847f2f42-7697-49ff-852d-cbdd7cd8cf50" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">러스트 시작! - 유데미 Rust Programming를 수강하며</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">가보자고</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-01-13 16:47">2024-01-13 16:47</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/2023"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/b5692eaa-05d7-428c-8356-ba04da3f4e3f" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">2023 회고록</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">올해를 돌아보며</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-12-31 14:27">2023-12-31 14:27</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/bali-remote-work"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/b9834b4f-a495-43df-ace7-bc8784a6d6f9" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">발리 한 달 리모트 워크 후기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">발리 한 달 살기 얼마나 낭만 있을까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-12-30 17:21">2023-12-30 17:21</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/mac-init-apps"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/dbe32093-4f4b-4f4b-aa2c-a2b8574d85a0" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">웹 개발자를 위한 도구 추천 - 유용한 Mac 앱들</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">생산성을 올려줄 유용한 맥 앱을 알아보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-12-24 12:54">2023-12-24 12:54</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/woowa-type-review"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/3e0ae612-003f-43e9-a6b0-d481697fc280" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">우아한 타입스크립트 with 리액트 리뷰</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">주니어 FE를 위한 온보딩 책</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-11-24 21:37">2023-11-24 21:37</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/leetcode-hard-42"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/e0fcd614-46f9-4221-a284-570b9591a1b8" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[LeetCode] 42. Trapping Rain Water</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">2차원 좌표의 영역을 빠르게 구해보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-10-14 17:10">2023-10-14 17:10</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/proving-ground-review"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/7da7662a-9991-467b-b7bc-cfd8819da792" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">"사라진 개발자들" 리뷰</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">악삭박박과 최초의 개발자들</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-24 13:24">2023-09-24 13:24</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/jeju-remote-work"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/733573ae-f90e-4573-a7a2-41940c787da9" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">제주 한 달 리모트 워크 후기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">제주 한 달 살기 얼마나 낭만 있을까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-16 12:19">2023-09-16 12:19</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/goorm-195698"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/904bc3d3-7662-4a68-add4-e4fb6349ff08" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[구름톤 챌린지] 연합</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">단방향 그래프의 집합을 BFS 및 Union-Find로 구해보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-06 19:12">2023-09-06 19:12</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/goorm-195696"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/904bc3d3-7662-4a68-add4-e4fb6349ff08" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[구름톤 챌린지] 작은 노드</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">양방향 그래프 가볍게 복습하기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-03 21:14">2023-09-03 21:14</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/geultto8-open-source-seminar"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/a6b9e96a-d651-4854-a1a4-a05370dba890" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[글또 세미나] 모여봐요 오픈소스의 숲 발표 후기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">번역 기여 방법과 코어 코드에 접근하는 방법</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-01 20:30">2023-09-01 20:30</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/deploy-eslint-plugin"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/d3c160f4-daef-49e0-ab36-39009eb277bc" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">ESLint 플러그인 배포하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">ESLint 플러그인 배포 방법 알아보기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-01 15:48">2023-09-01 15:48</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/goorm-195693"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/904bc3d3-7662-4a68-add4-e4fb6349ff08" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[구름톤 챌린지] 통증2</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">완전 탐색에서 DP까지</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-29 16:27">2023-08-29 16:27</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/goorm-195692"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/904bc3d3-7662-4a68-add4-e4fb6349ff08" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[구름톤 챌린지] GameJam</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">시뮬레이션 단계화하기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-27 23:35">2023-08-27 23:35</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/junction2023"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/4797d67e-2599-42ec-b653-329a40cf81e6" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Junction Asia 2023 참여 후기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">부산 벡스코에서 2박 3일간 정션 해커톤에 참여했다</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-23 19:58">2023-08-23 19:58</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/goorm-195687"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/904bc3d3-7662-4a68-add4-e4fb6349ff08" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[구름톤 챌린지] 이진수 정렬</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">메모이제이션 활용하기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-21 21:56">2023-08-21 21:56</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/leetcode-medium-238"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/e0fcd614-46f9-4221-a284-570b9591a1b8" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[LeetCode] 238. Product of Array Except Self</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">연속되는 곱셈을 어떻게 처리할까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-13 22:31">2023-08-13 22:31</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/storybook7"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/c251c31e-1775-4cf9-9131-7cab72cde00e" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Storybook 7.0 살펴보기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">7버전은 무엇이 달라졌을까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-13 19:17">2023-08-13 19:17</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/leetcode-easy-2727"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/e0fcd614-46f9-4221-a284-570b9591a1b8" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[LeetCode] 2727. Is Object Empty</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">for...in vs for...of</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-01 10:02">2023-08-01 10:02</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/prettier3"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/10b0b10c-f103-425d-aa86-e9d6deb36772" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Prettier v3 변경사항 살펴보기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">린트없인 못살아</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-07-06 22:29">2023-07-06 22:29</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/quality-of-job-review"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/828d3793-5021-498a-9f8a-c1990d361ae5" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">"일의 격"을 읽고</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">신수정님의 '일의 격' 책을 읽고 생각을 정리하게 되었다</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-06-22 20:36">2023-06-22 20:36</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/use-transition"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/4c83fd47-4f27-4cec-86bf-64ac64fa9795" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">useTransition 이해하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">상태 업데이트의 우선 순위를 지정해보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-06-04 20:38">2023-06-04 20:38</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/implicit-coercion"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/59c84bbf-9a64-4d93-b161-9c0fb22e21ce" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">알랑말랑 암묵적 형변환 말랑말랑 이해하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">자바스크립트의 형변환은 어떻게 일어나는가?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-04-22 17:02">2023-04-22 17:02</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/typescript5"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/a05f9167-23d8-4756-bd67-9381ff38cbb7" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">TypeScript 5.0 살펴보기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">5버전은 무엇이 달라졌을까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-04-09 16:24">2023-04-09 16:24</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/use-prevent-leave"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/bf2cd78f-1d32-4d08-9fc7-1eb326a35288" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">페이지 이탈시 확인 컨펌창 만들기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">usePreventLeave를 알아보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-03-12 15:14">2023-03-12 15:14</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/renovate"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/e3637b13-b6b4-4bda-b3bb-7cd9f15928e3" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Renovate 간단하게 살펴보기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">패키지 매니징을 자동화 해보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2022-07-02 14:01">2022-07-02 14:01</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/turborepo"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/2db5a04f-e83c-4bc4-ba59-685d3bb0e5dd" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Turborepo로 모노레포 개발 경험 향상하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">모노레포와 터보레포를 간략히 알아보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2022-04-15 00:00">2022-04-15 00:00</time></div></a></li></ul></section>
\ No newline at end of file
+<nav class="fixed z-40 flex flex-wrap w-full justify-between justify-items-center hover:animate-rainbow-water hover:bg-nav hover:bg-[length:400%_400%] opacity-10	md:opacity-100 shadow-nav shadow-lg"><h2 class="tracking-tight mr-6 text-2xl	font-bold my-2 ml-3.5"><a class="hover:underline" href="/">1ilsang</a></h2><div class="flex"><h2 class="tracking-tight mr-6 text-xl mt-2.5"><a class="hover:underline" href="/posts">posts</a></h2><h2 class="tracking-tight mr-6 text-xl mt-2.5"><a class="hover:underline" href="/tags">tags</a></h2><div class="mr-2 w-8 h-8 mt-2" role="img" aria-label="1ilsang character"><a href="/about"><img class="border border-solid rounded-full border-white-blue" src="/images/chul.webp" alt="1ilsang"></a></div></div></nav><section class="h-auto min-h-full max-w-screen-md py-20 md:py-28 mx-4 min-[790px]:m-auto print:py-0 md:py-[4.8rem]"><div class="category-bar flex flex-wrap mb-4 justify-center border-b border-sub-blue"><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow after:content-['𒅄'] hover:animate-slow-spin"></span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">JavaScript</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Rust</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Activity</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Book</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Retrospect</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Tool</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Algorithm</span></div><ul class="pb-24 md:pb-56"><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/mdn-contributing-translations"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://raw.githubusercontent.com/1ilsang/dev/refs/heads/main/public/images/posts/mdn-contributing-translations/thumbnail.webp" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">오픈소스 기여 첫걸음, MDN 문서 번역 가이드</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">MDN 문서 번역 방법을 알아보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-12-22 02:01">2024-12-22 02:01</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/google-adsense"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://raw.githubusercontent.com/1ilsang/dev/refs/heads/main/public/images/posts/google-adsense/cover.webp" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[Next.js] Google AdSense 광고 적용 및 이해하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">구글 광고 적용기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-08-22 16:26">2024-08-22 16:26</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/inflearn-meetup-03-dev-career"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://cdn.inflearn.com/public/files/courses/333675/5fb60a7a-1b19-4b41-80e6-c49851282dec/5_meetup_p.png" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">인프런 판교 퇴근길 밋업 - 개발자 커리어 후기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">한기용님의 실리콘밸리에서 인정받는 개발자의 특징 10가지 소개</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-06-08 18:30">2024-06-08 18:30</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/typescript-subtyping"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/a56811d2-a7e2-4c71-b36e-d2bc368989b1" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Object.keys()는 왜 string[] 타입일까?</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">구조적 서브 타이핑과 집합적 특징을 알아보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-05-10 22:11">2024-05-10 22:11</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/visual-regression-test"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/a6de7fcd-2666-44f5-931a-c440785dc0e5" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">시각적 회귀 테스트 도입기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">playwright 소개와 트러블 슈팅</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-05-06 14:34">2024-05-06 14:34</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/mdn-ko-organizer"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/13851fba-2198-4113-aae2-8e6aedc05e2e" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">@mdn/yari-content-ko Organizer 합류 여정</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">Mozilla Developer Network는 어떤 곳일까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-04-13 17:21">2024-04-13 17:21</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/micro-state-management-review"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/3a57dcf8-43b1-4e95-ae8d-2b5194c83122" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Micro State Management with React Hooks 리뷰</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">상태 관리의 종류와 기술들에 대한 이해</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-03-01 09:00">2024-03-01 09:00</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/array-prototype-sort"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/47823496-4644-4e7b-9801-9d54273d200e" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Array.prototype.sort() 이해하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">정열적으로 정렬해 보기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-02-28 05:56">2024-02-28 05:56</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/2024-01"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/80b94675-d239-4f77-917d-52211a6a878d" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">2024년 1월 회고</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">1월은 설렘의 연속</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-02-09 15:06">2024-02-09 15:06</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/vite-dev-server"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/132b52c7-3c2b-4554-b0fb-8ec5f3193d7a" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Vite Dev Server 이해하기 (feat. HMR)</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">Dev 서버의 동작 방식은 어떻게 될까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-02-04 22:50">2024-02-04 22:50</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/udemy-rust-programming"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/847f2f42-7697-49ff-852d-cbdd7cd8cf50" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">러스트 시작! - 유데미 Rust Programming를 수강하며</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">가보자고</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-01-13 16:47">2024-01-13 16:47</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/2023"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/b5692eaa-05d7-428c-8356-ba04da3f4e3f" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">2023 회고록</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">올해를 돌아보며</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-12-31 14:27">2023-12-31 14:27</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/bali-remote-work"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/b9834b4f-a495-43df-ace7-bc8784a6d6f9" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">발리 한 달 리모트 워크 후기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">발리 한 달 살기 얼마나 낭만 있을까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-12-30 17:21">2023-12-30 17:21</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/mac-init-apps"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/dbe32093-4f4b-4f4b-aa2c-a2b8574d85a0" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">웹 개발자를 위한 도구 추천 - 유용한 Mac 앱들</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">생산성을 올려줄 유용한 맥 앱을 알아보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-12-24 12:54">2023-12-24 12:54</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/woowa-type-review"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/3e0ae612-003f-43e9-a6b0-d481697fc280" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">우아한 타입스크립트 with 리액트 리뷰</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">주니어 FE를 위한 온보딩 책</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-11-24 21:37">2023-11-24 21:37</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/leetcode-hard-42"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/e0fcd614-46f9-4221-a284-570b9591a1b8" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[LeetCode] 42. Trapping Rain Water</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">2차원 좌표의 영역을 빠르게 구해보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-10-14 17:10">2023-10-14 17:10</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/proving-ground-review"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/7da7662a-9991-467b-b7bc-cfd8819da792" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">"사라진 개발자들" 리뷰</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">악삭박박과 최초의 개발자들</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-24 13:24">2023-09-24 13:24</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/jeju-remote-work"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/733573ae-f90e-4573-a7a2-41940c787da9" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">제주 한 달 리모트 워크 후기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">제주 한 달 살기 얼마나 낭만 있을까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-16 12:19">2023-09-16 12:19</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/goorm-195698"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/904bc3d3-7662-4a68-add4-e4fb6349ff08" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[구름톤 챌린지] 연합</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">단방향 그래프의 집합을 BFS 및 Union-Find로 구해보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-06 19:12">2023-09-06 19:12</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/goorm-195696"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/904bc3d3-7662-4a68-add4-e4fb6349ff08" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[구름톤 챌린지] 작은 노드</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">양방향 그래프 가볍게 복습하기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-03 21:14">2023-09-03 21:14</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/geultto8-open-source-seminar"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/a6b9e96a-d651-4854-a1a4-a05370dba890" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[글또 세미나] 모여봐요 오픈소스의 숲 발표 후기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">번역 기여 방법과 코어 코드에 접근하는 방법</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-01 20:30">2023-09-01 20:30</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/deploy-eslint-plugin"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/d3c160f4-daef-49e0-ab36-39009eb277bc" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">ESLint 플러그인 배포하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">ESLint 플러그인 배포 방법 알아보기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-01 15:48">2023-09-01 15:48</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/goorm-195693"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/904bc3d3-7662-4a68-add4-e4fb6349ff08" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[구름톤 챌린지] 통증2</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">완전 탐색에서 DP까지</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-29 16:27">2023-08-29 16:27</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/goorm-195692"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/904bc3d3-7662-4a68-add4-e4fb6349ff08" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[구름톤 챌린지] GameJam</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">시뮬레이션 단계화하기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-27 23:35">2023-08-27 23:35</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/junction2023"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/4797d67e-2599-42ec-b653-329a40cf81e6" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Junction Asia 2023 참여 후기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">부산 벡스코에서 2박 3일간 정션 해커톤에 참여했다</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-23 19:58">2023-08-23 19:58</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/goorm-195687"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/904bc3d3-7662-4a68-add4-e4fb6349ff08" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[구름톤 챌린지] 이진수 정렬</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">메모이제이션 활용하기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-21 21:56">2023-08-21 21:56</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/leetcode-medium-238"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/e0fcd614-46f9-4221-a284-570b9591a1b8" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[LeetCode] 238. Product of Array Except Self</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">연속되는 곱셈을 어떻게 처리할까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-13 22:31">2023-08-13 22:31</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/storybook7"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/c251c31e-1775-4cf9-9131-7cab72cde00e" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Storybook 7.0 살펴보기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">7버전은 무엇이 달라졌을까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-13 19:17">2023-08-13 19:17</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/leetcode-easy-2727"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/e0fcd614-46f9-4221-a284-570b9591a1b8" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[LeetCode] 2727. Is Object Empty</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">for...in vs for...of</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-01 10:02">2023-08-01 10:02</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/prettier3"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/10b0b10c-f103-425d-aa86-e9d6deb36772" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Prettier v3 변경사항 살펴보기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">린트없인 못살아</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-07-06 22:29">2023-07-06 22:29</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/quality-of-job-review"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/828d3793-5021-498a-9f8a-c1990d361ae5" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">"일의 격"을 읽고</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">신수정님의 '일의 격' 책을 읽고 생각을 정리하게 되었다</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-06-22 20:36">2023-06-22 20:36</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/use-transition"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/4c83fd47-4f27-4cec-86bf-64ac64fa9795" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">useTransition 이해하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">상태 업데이트의 우선 순위를 지정해보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-06-04 20:38">2023-06-04 20:38</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/implicit-coercion"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/59c84bbf-9a64-4d93-b161-9c0fb22e21ce" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">알랑말랑 암묵적 형변환 말랑말랑 이해하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">자바스크립트의 형변환은 어떻게 일어나는가?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-04-22 17:02">2023-04-22 17:02</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/typescript5"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/a05f9167-23d8-4756-bd67-9381ff38cbb7" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">TypeScript 5.0 살펴보기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">5버전은 무엇이 달라졌을까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-04-09 16:24">2023-04-09 16:24</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/use-prevent-leave"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/bf2cd78f-1d32-4d08-9fc7-1eb326a35288" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">페이지 이탈시 확인 컨펌창 만들기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">usePreventLeave를 알아보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-03-12 15:14">2023-03-12 15:14</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/renovate"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/e3637b13-b6b4-4bda-b3bb-7cd9f15928e3" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Renovate 간단하게 살펴보기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">패키지 매니징을 자동화 해보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2022-07-02 14:01">2022-07-02 14:01</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/turborepo"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/2db5a04f-e83c-4bc4-ba59-685d3bb0e5dd" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Turborepo로 모노레포 개발 경험 향상하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">모노레포와 터보레포를 간략히 알아보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2022-04-15 00:00">2022-04-15 00:00</time></div></a></li></ul></section>
\ No newline at end of file
diff --git a/e2e/__snapshots__/posts.spec.ts/mobile/posts.html b/e2e/__snapshots__/posts.spec.ts/mobile/posts.html
index bd53b0a5..bc9f07f7 100644
--- a/e2e/__snapshots__/posts.spec.ts/mobile/posts.html
+++ b/e2e/__snapshots__/posts.spec.ts/mobile/posts.html
@@ -1 +1 @@
-<nav class="fixed z-40 flex flex-wrap w-full justify-between justify-items-center hover:animate-rainbow-water hover:bg-nav hover:bg-[length:400%_400%] opacity-10	md:opacity-100 shadow-nav shadow-lg"><h2 class="tracking-tight mr-6 text-2xl	font-bold my-2 ml-3.5"><a class="hover:underline" href="/">1ilsang</a></h2><div class="flex"><h2 class="tracking-tight mr-6 text-xl mt-2.5"><a class="hover:underline" href="/posts">posts</a></h2><h2 class="tracking-tight mr-6 text-xl mt-2.5"><a class="hover:underline" href="/tags">tags</a></h2><div class="mr-2 w-8 h-8 mt-2" role="img" aria-label="1ilsang character"><a href="/about"><img class="border border-solid rounded-full border-white-blue" src="/images/chul.webp" alt="1ilsang"></a></div></div></nav><section class="h-auto min-h-full max-w-screen-md py-20 md:py-28 mx-4 min-[790px]:m-auto print:py-0 md:py-[4.8rem]"><div class="category-bar flex flex-wrap mb-4 justify-center border-b border-sub-blue"><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow after:content-['𒅄'] hover:animate-slow-spin"></span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">JavaScript</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Rust</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Activity</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Book</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Retrospect</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Tool</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Algorithm</span></div><ul class="pb-24 md:pb-56"><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/mdn-contributing-translations"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="/images/posts/mdn-contributing-translations/thumbnail.webp" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">오픈소스 기여 첫걸음, MDN 문서 번역 가이드</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">MDN 문서 번역 방법을 알아보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-12-22 02:01">2024-12-22 02:01</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/google-adsense"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="/images/posts/google-adsense/cover.webp" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[Next.js] Google AdSense 광고 적용 및 이해하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">구글 광고 적용기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-08-22 16:26">2024-08-22 16:26</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/inflearn-meetup-03-dev-career"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://cdn.inflearn.com/public/files/courses/333675/5fb60a7a-1b19-4b41-80e6-c49851282dec/5_meetup_p.png" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">인프런 판교 퇴근길 밋업 - 개발자 커리어 후기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">한기용님의 실리콘밸리에서 인정받는 개발자의 특징 10가지 소개</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-06-08 18:30">2024-06-08 18:30</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/typescript-subtyping"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/a56811d2-a7e2-4c71-b36e-d2bc368989b1" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Object.keys()는 왜 string[] 타입일까?</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">구조적 서브 타이핑과 집합적 특징을 알아보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-05-10 22:11">2024-05-10 22:11</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/visual-regression-test"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/a6de7fcd-2666-44f5-931a-c440785dc0e5" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">시각적 회귀 테스트 도입기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">playwright 소개와 트러블 슈팅</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-05-06 14:34">2024-05-06 14:34</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/mdn-ko-organizer"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/13851fba-2198-4113-aae2-8e6aedc05e2e" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">@mdn/yari-content-ko Organizer 합류 여정</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">Mozilla Developer Network는 어떤 곳일까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-04-13 17:21">2024-04-13 17:21</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/micro-state-management-review"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/3a57dcf8-43b1-4e95-ae8d-2b5194c83122" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Micro State Management with React Hooks 리뷰</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">상태 관리의 종류와 기술들에 대한 이해</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-03-01 09:00">2024-03-01 09:00</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/array-prototype-sort"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/47823496-4644-4e7b-9801-9d54273d200e" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Array.prototype.sort() 이해하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">정열적으로 정렬해 보기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-02-28 05:56">2024-02-28 05:56</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/2024-01"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/80b94675-d239-4f77-917d-52211a6a878d" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">2024년 1월 회고</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">1월은 설렘의 연속</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-02-09 15:06">2024-02-09 15:06</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/vite-dev-server"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/132b52c7-3c2b-4554-b0fb-8ec5f3193d7a" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Vite Dev Server 이해하기 (feat. HMR)</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">Dev 서버의 동작 방식은 어떻게 될까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-02-04 22:50">2024-02-04 22:50</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/udemy-rust-programming"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/847f2f42-7697-49ff-852d-cbdd7cd8cf50" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">러스트 시작! - 유데미 Rust Programming를 수강하며</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">가보자고</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-01-13 16:47">2024-01-13 16:47</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/2023"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/b5692eaa-05d7-428c-8356-ba04da3f4e3f" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">2023 회고록</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">올해를 돌아보며</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-12-31 14:27">2023-12-31 14:27</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/bali-remote-work"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/b9834b4f-a495-43df-ace7-bc8784a6d6f9" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">발리 한 달 리모트 워크 후기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">발리 한 달 살기 얼마나 낭만 있을까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-12-30 17:21">2023-12-30 17:21</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/mac-init-apps"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/dbe32093-4f4b-4f4b-aa2c-a2b8574d85a0" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">웹 개발자를 위한 도구 추천 - 유용한 Mac 앱들</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">생산성을 올려줄 유용한 맥 앱을 알아보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-12-24 12:54">2023-12-24 12:54</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/woowa-type-review"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/3e0ae612-003f-43e9-a6b0-d481697fc280" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">우아한 타입스크립트 with 리액트 리뷰</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">주니어 FE를 위한 온보딩 책</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-11-24 21:37">2023-11-24 21:37</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/leetcode-hard-42"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/e0fcd614-46f9-4221-a284-570b9591a1b8" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[LeetCode] 42. Trapping Rain Water</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">2차원 좌표의 영역을 빠르게 구해보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-10-14 17:10">2023-10-14 17:10</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/proving-ground-review"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/7da7662a-9991-467b-b7bc-cfd8819da792" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">"사라진 개발자들" 리뷰</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">악삭박박과 최초의 개발자들</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-24 13:24">2023-09-24 13:24</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/jeju-remote-work"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/733573ae-f90e-4573-a7a2-41940c787da9" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">제주 한 달 리모트 워크 후기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">제주 한 달 살기 얼마나 낭만 있을까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-16 12:19">2023-09-16 12:19</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/goorm-195698"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/904bc3d3-7662-4a68-add4-e4fb6349ff08" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[구름톤 챌린지] 연합</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">단방향 그래프의 집합을 BFS 및 Union-Find로 구해보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-06 19:12">2023-09-06 19:12</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/goorm-195696"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/904bc3d3-7662-4a68-add4-e4fb6349ff08" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[구름톤 챌린지] 작은 노드</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">양방향 그래프 가볍게 복습하기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-03 21:14">2023-09-03 21:14</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/geultto8-open-source-seminar"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/a6b9e96a-d651-4854-a1a4-a05370dba890" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[글또 세미나] 모여봐요 오픈소스의 숲 발표 후기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">번역 기여 방법과 코어 코드에 접근하는 방법</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-01 20:30">2023-09-01 20:30</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/deploy-eslint-plugin"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/d3c160f4-daef-49e0-ab36-39009eb277bc" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">ESLint 플러그인 배포하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">ESLint 플러그인 배포 방법 알아보기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-01 15:48">2023-09-01 15:48</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/goorm-195693"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/904bc3d3-7662-4a68-add4-e4fb6349ff08" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[구름톤 챌린지] 통증2</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">완전 탐색에서 DP까지</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-29 16:27">2023-08-29 16:27</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/goorm-195692"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/904bc3d3-7662-4a68-add4-e4fb6349ff08" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[구름톤 챌린지] GameJam</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">시뮬레이션 단계화하기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-27 23:35">2023-08-27 23:35</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/junction2023"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/4797d67e-2599-42ec-b653-329a40cf81e6" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Junction Asia 2023 참여 후기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">부산 벡스코에서 2박 3일간 정션 해커톤에 참여했다</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-23 19:58">2023-08-23 19:58</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/goorm-195687"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/904bc3d3-7662-4a68-add4-e4fb6349ff08" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[구름톤 챌린지] 이진수 정렬</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">메모이제이션 활용하기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-21 21:56">2023-08-21 21:56</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/leetcode-medium-238"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/e0fcd614-46f9-4221-a284-570b9591a1b8" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[LeetCode] 238. Product of Array Except Self</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">연속되는 곱셈을 어떻게 처리할까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-13 22:31">2023-08-13 22:31</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/storybook7"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/c251c31e-1775-4cf9-9131-7cab72cde00e" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Storybook 7.0 살펴보기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">7버전은 무엇이 달라졌을까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-13 19:17">2023-08-13 19:17</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/leetcode-easy-2727"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/e0fcd614-46f9-4221-a284-570b9591a1b8" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[LeetCode] 2727. Is Object Empty</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">for...in vs for...of</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-01 10:02">2023-08-01 10:02</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/prettier3"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/10b0b10c-f103-425d-aa86-e9d6deb36772" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Prettier v3 변경사항 살펴보기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">린트없인 못살아</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-07-06 22:29">2023-07-06 22:29</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/quality-of-job-review"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/828d3793-5021-498a-9f8a-c1990d361ae5" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">"일의 격"을 읽고</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">신수정님의 '일의 격' 책을 읽고 생각을 정리하게 되었다</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-06-22 20:36">2023-06-22 20:36</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/use-transition"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/4c83fd47-4f27-4cec-86bf-64ac64fa9795" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">useTransition 이해하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">상태 업데이트의 우선 순위를 지정해보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-06-04 20:38">2023-06-04 20:38</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/implicit-coercion"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/59c84bbf-9a64-4d93-b161-9c0fb22e21ce" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">알랑말랑 암묵적 형변환 말랑말랑 이해하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">자바스크립트의 형변환은 어떻게 일어나는가?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-04-22 17:02">2023-04-22 17:02</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/typescript5"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/a05f9167-23d8-4756-bd67-9381ff38cbb7" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">TypeScript 5.0 살펴보기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">5버전은 무엇이 달라졌을까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-04-09 16:24">2023-04-09 16:24</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/use-prevent-leave"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/bf2cd78f-1d32-4d08-9fc7-1eb326a35288" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">페이지 이탈시 확인 컨펌창 만들기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">usePreventLeave를 알아보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-03-12 15:14">2023-03-12 15:14</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/renovate"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/e3637b13-b6b4-4bda-b3bb-7cd9f15928e3" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Renovate 간단하게 살펴보기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">패키지 매니징을 자동화 해보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2022-07-02 14:01">2022-07-02 14:01</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/turborepo"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/2db5a04f-e83c-4bc4-ba59-685d3bb0e5dd" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Turborepo로 모노레포 개발 경험 향상하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">모노레포와 터보레포를 간략히 알아보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2022-04-15 00:00">2022-04-15 00:00</time></div></a></li></ul></section>
\ No newline at end of file
+<nav class="fixed z-40 flex flex-wrap w-full justify-between justify-items-center hover:animate-rainbow-water hover:bg-nav hover:bg-[length:400%_400%] opacity-10	md:opacity-100 shadow-nav shadow-lg"><h2 class="tracking-tight mr-6 text-2xl	font-bold my-2 ml-3.5"><a class="hover:underline" href="/">1ilsang</a></h2><div class="flex"><h2 class="tracking-tight mr-6 text-xl mt-2.5"><a class="hover:underline" href="/posts">posts</a></h2><h2 class="tracking-tight mr-6 text-xl mt-2.5"><a class="hover:underline" href="/tags">tags</a></h2><div class="mr-2 w-8 h-8 mt-2" role="img" aria-label="1ilsang character"><a href="/about"><img class="border border-solid rounded-full border-white-blue" src="/images/chul.webp" alt="1ilsang"></a></div></div></nav><section class="h-auto min-h-full max-w-screen-md py-20 md:py-28 mx-4 min-[790px]:m-auto print:py-0 md:py-[4.8rem]"><div class="category-bar flex flex-wrap mb-4 justify-center border-b border-sub-blue"><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow after:content-['𒅄'] hover:animate-slow-spin"></span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">JavaScript</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Rust</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Activity</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Book</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Retrospect</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Tool</span><span class="inline-block cursor-pointer select-none py-0.5 px-1.5 my-1 mx-4 hover:category-shadow">Algorithm</span></div><ul class="pb-24 md:pb-56"><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/mdn-contributing-translations"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://raw.githubusercontent.com/1ilsang/dev/refs/heads/main/public/images/posts/mdn-contributing-translations/thumbnail.webp" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">오픈소스 기여 첫걸음, MDN 문서 번역 가이드</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">MDN 문서 번역 방법을 알아보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-12-22 02:01">2024-12-22 02:01</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/google-adsense"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://raw.githubusercontent.com/1ilsang/dev/refs/heads/main/public/images/posts/google-adsense/cover.webp" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[Next.js] Google AdSense 광고 적용 및 이해하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">구글 광고 적용기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-08-22 16:26">2024-08-22 16:26</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/inflearn-meetup-03-dev-career"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://cdn.inflearn.com/public/files/courses/333675/5fb60a7a-1b19-4b41-80e6-c49851282dec/5_meetup_p.png" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">인프런 판교 퇴근길 밋업 - 개발자 커리어 후기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">한기용님의 실리콘밸리에서 인정받는 개발자의 특징 10가지 소개</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-06-08 18:30">2024-06-08 18:30</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/typescript-subtyping"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/a56811d2-a7e2-4c71-b36e-d2bc368989b1" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Object.keys()는 왜 string[] 타입일까?</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">구조적 서브 타이핑과 집합적 특징을 알아보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-05-10 22:11">2024-05-10 22:11</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/visual-regression-test"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/a6de7fcd-2666-44f5-931a-c440785dc0e5" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">시각적 회귀 테스트 도입기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">playwright 소개와 트러블 슈팅</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-05-06 14:34">2024-05-06 14:34</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/mdn-ko-organizer"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/13851fba-2198-4113-aae2-8e6aedc05e2e" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">@mdn/yari-content-ko Organizer 합류 여정</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">Mozilla Developer Network는 어떤 곳일까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-04-13 17:21">2024-04-13 17:21</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/micro-state-management-review"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/3a57dcf8-43b1-4e95-ae8d-2b5194c83122" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Micro State Management with React Hooks 리뷰</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">상태 관리의 종류와 기술들에 대한 이해</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-03-01 09:00">2024-03-01 09:00</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/array-prototype-sort"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/47823496-4644-4e7b-9801-9d54273d200e" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Array.prototype.sort() 이해하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">정열적으로 정렬해 보기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-02-28 05:56">2024-02-28 05:56</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/2024-01"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/80b94675-d239-4f77-917d-52211a6a878d" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">2024년 1월 회고</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">1월은 설렘의 연속</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-02-09 15:06">2024-02-09 15:06</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/vite-dev-server"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/132b52c7-3c2b-4554-b0fb-8ec5f3193d7a" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Vite Dev Server 이해하기 (feat. HMR)</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">Dev 서버의 동작 방식은 어떻게 될까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-02-04 22:50">2024-02-04 22:50</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/udemy-rust-programming"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/847f2f42-7697-49ff-852d-cbdd7cd8cf50" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">러스트 시작! - 유데미 Rust Programming를 수강하며</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">가보자고</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2024-01-13 16:47">2024-01-13 16:47</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/2023"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/b5692eaa-05d7-428c-8356-ba04da3f4e3f" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">2023 회고록</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">올해를 돌아보며</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-12-31 14:27">2023-12-31 14:27</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/bali-remote-work"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/b9834b4f-a495-43df-ace7-bc8784a6d6f9" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">발리 한 달 리모트 워크 후기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">발리 한 달 살기 얼마나 낭만 있을까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-12-30 17:21">2023-12-30 17:21</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/mac-init-apps"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/dbe32093-4f4b-4f4b-aa2c-a2b8574d85a0" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">웹 개발자를 위한 도구 추천 - 유용한 Mac 앱들</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">생산성을 올려줄 유용한 맥 앱을 알아보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-12-24 12:54">2023-12-24 12:54</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/woowa-type-review"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/3e0ae612-003f-43e9-a6b0-d481697fc280" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">우아한 타입스크립트 with 리액트 리뷰</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">주니어 FE를 위한 온보딩 책</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-11-24 21:37">2023-11-24 21:37</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/leetcode-hard-42"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/e0fcd614-46f9-4221-a284-570b9591a1b8" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[LeetCode] 42. Trapping Rain Water</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">2차원 좌표의 영역을 빠르게 구해보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-10-14 17:10">2023-10-14 17:10</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/proving-ground-review"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/7da7662a-9991-467b-b7bc-cfd8819da792" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">"사라진 개발자들" 리뷰</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">악삭박박과 최초의 개발자들</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-24 13:24">2023-09-24 13:24</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/jeju-remote-work"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/733573ae-f90e-4573-a7a2-41940c787da9" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">제주 한 달 리모트 워크 후기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">제주 한 달 살기 얼마나 낭만 있을까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-16 12:19">2023-09-16 12:19</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/goorm-195698"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/904bc3d3-7662-4a68-add4-e4fb6349ff08" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[구름톤 챌린지] 연합</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">단방향 그래프의 집합을 BFS 및 Union-Find로 구해보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-06 19:12">2023-09-06 19:12</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/goorm-195696"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/904bc3d3-7662-4a68-add4-e4fb6349ff08" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[구름톤 챌린지] 작은 노드</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">양방향 그래프 가볍게 복습하기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-03 21:14">2023-09-03 21:14</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/geultto8-open-source-seminar"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/a6b9e96a-d651-4854-a1a4-a05370dba890" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[글또 세미나] 모여봐요 오픈소스의 숲 발표 후기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">번역 기여 방법과 코어 코드에 접근하는 방법</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-01 20:30">2023-09-01 20:30</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/deploy-eslint-plugin"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/d3c160f4-daef-49e0-ab36-39009eb277bc" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">ESLint 플러그인 배포하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">ESLint 플러그인 배포 방법 알아보기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-09-01 15:48">2023-09-01 15:48</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/goorm-195693"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/904bc3d3-7662-4a68-add4-e4fb6349ff08" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[구름톤 챌린지] 통증2</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">완전 탐색에서 DP까지</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-29 16:27">2023-08-29 16:27</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/goorm-195692"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/904bc3d3-7662-4a68-add4-e4fb6349ff08" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[구름톤 챌린지] GameJam</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">시뮬레이션 단계화하기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-27 23:35">2023-08-27 23:35</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/junction2023"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/4797d67e-2599-42ec-b653-329a40cf81e6" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Junction Asia 2023 참여 후기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">부산 벡스코에서 2박 3일간 정션 해커톤에 참여했다</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-23 19:58">2023-08-23 19:58</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/goorm-195687"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/904bc3d3-7662-4a68-add4-e4fb6349ff08" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[구름톤 챌린지] 이진수 정렬</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">메모이제이션 활용하기</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-21 21:56">2023-08-21 21:56</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/leetcode-medium-238"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/e0fcd614-46f9-4221-a284-570b9591a1b8" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[LeetCode] 238. Product of Array Except Self</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">연속되는 곱셈을 어떻게 처리할까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-13 22:31">2023-08-13 22:31</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/storybook7"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/c251c31e-1775-4cf9-9131-7cab72cde00e" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Storybook 7.0 살펴보기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">7버전은 무엇이 달라졌을까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-13 19:17">2023-08-13 19:17</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/leetcode-easy-2727"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/e0fcd614-46f9-4221-a284-570b9591a1b8" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">[LeetCode] 2727. Is Object Empty</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">for...in vs for...of</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-08-01 10:02">2023-08-01 10:02</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/prettier3"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/10b0b10c-f103-425d-aa86-e9d6deb36772" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Prettier v3 변경사항 살펴보기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">린트없인 못살아</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-07-06 22:29">2023-07-06 22:29</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/quality-of-job-review"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/828d3793-5021-498a-9f8a-c1990d361ae5" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">"일의 격"을 읽고</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">신수정님의 '일의 격' 책을 읽고 생각을 정리하게 되었다</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-06-22 20:36">2023-06-22 20:36</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/use-transition"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/4c83fd47-4f27-4cec-86bf-64ac64fa9795" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">useTransition 이해하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">상태 업데이트의 우선 순위를 지정해보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-06-04 20:38">2023-06-04 20:38</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/implicit-coercion"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/59c84bbf-9a64-4d93-b161-9c0fb22e21ce" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">알랑말랑 암묵적 형변환 말랑말랑 이해하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">자바스크립트의 형변환은 어떻게 일어나는가?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-04-22 17:02">2023-04-22 17:02</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/typescript5"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/a05f9167-23d8-4756-bd67-9381ff38cbb7" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">TypeScript 5.0 살펴보기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">5버전은 무엇이 달라졌을까?</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-04-09 16:24">2023-04-09 16:24</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/use-prevent-leave"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/bf2cd78f-1d32-4d08-9fc7-1eb326a35288" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">페이지 이탈시 확인 컨펌창 만들기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">usePreventLeave를 알아보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2023-03-12 15:14">2023-03-12 15:14</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/renovate"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/e3637b13-b6b4-4bda-b3bb-7cd9f15928e3" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Renovate 간단하게 살펴보기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">패키지 매니징을 자동화 해보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2022-07-02 14:01">2022-07-02 14:01</time></div></a></li><li class="group px-1 md:px-8 py-4 mb-1 hover:text-snazzy-bg hover:bg-rainbow-water hover:animate-rainbow-water hover:bg-[length:400%_400%] hover:rounded md:hover:rounded-[35px_60px/80px_25px]"><a class="flex flex-col items-center md:flex-row md:items-start" href="/posts/turborepo"><div class="relative overflow-hidden w-64 md:w-52 min-w-52 h-32 md:h-28 mr-6 rounded border border-white-blue"><img class="object-cover w-full h-full group-hover:scale-105 transform-gpu transition duration-500" src="https://github.com/1ilsang/dev/assets/23524849/2db5a04f-e83c-4bc4-ba59-685d3bb0e5dd" alt="cover"></div><div class="w-full mt-2"><h1 class="text-2xl mb-1.5 title-underline">Turborepo로 모노레포 개발 경험 향상하기</h1><h1 class="text-white-blue group-hover:text-snazzy-bg">모노레포와 터보레포를 간략히 알아보자</h1><time class="text-sub-blue group-hover:text-snazzy-bg" datetime="2022-04-15 00:00">2022-04-15 00:00</time></div></a></li></ul></section>
\ No newline at end of file