PageSourceSearch

https://yongsk0066.github.io/

html yongsk0066.github.io collected 2026-10-03 10:13:15 UTC 21,259 bytes, 224 lines download raw bytes

1<!DOCTYPE html><html lang="ko" data-astro-cid-j7pv25f6> <head><link rel="canonical" href="https://yongseok.me/"><meta http-equiv="refresh" content="0; URL=https://yongseok.me/"><!-- Global Metadata --><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" type="image/svg+xml" href="/favicon.svg"><meta name="generator" content="Astro v4.11.5"><!-- Font preloads --><link rel="preload" href="/fonts/atkinson-regular.woff" as="font" type="font/woff" crossorigin><link rel="preload" href="/fonts/atkinson-bold.woff" as="font" type="font/woff" crossorigin><link rel="preload" href="/fonts/JetBrainsMono-Bold.woff2" as="font" type="font/woff" crossorigin><link rel="preload" href="/fonts/JetBrainsMono-Regular.woff2" as="font" type="font/woff" crossorigin><link rel="preload" href="/fonts/JetBrainsMono-SemiBold.woff2" as="font" type="font/woff" crossorigin><link rel="preload" href="/fonts/JetBrainsMono-Medium.woff2" as="font" type="font/woff" crossorigin><link rel="preload" href="/fonts/Oswald-Bold.ttf" as="font" type="font/ttf" crossorigin><link rel="preload" href="/fonts/Oswald-Regular.ttf" as="font" type="font/ttf" crossorigin><link rel="preload" href="/fonts/Oswald-SemiBold.ttf" as="font" type="font/ttf" crossorigin><link rel="preload" href="/fonts/Oswald-Medium.ttf" as="font" type="font/ttf" crossorigin><link rel="preload" href="/fonts/Oswald-ExtraLight.ttf" as="font" type="font/ttf" crossorigin><link rel="preload" href="/fonts/Oswald-Light.ttf" as="font" type="font/ttf" crossorigin><link rel="preload" href="/fonts/Oswald-SemiBold.ttf" as="font" type="font/ttf" crossorigin><!-- Canonical URL --><link rel="canonical" href="https://yongsk0066.github.io/"><!-- Primary Meta Tags --><title>장용석 블로그</title><meta name="title" content="장용석 블로그"><meta name="description" content="Welcome to my website!"><!-- Open Graph / Facebook --><meta property="og:type" content="website"><meta property="og:url" content="https://yongsk0066.github.io/"><meta property="og:title" content="장용석 블로그"><meta property="og:description" content="Welcome to my website!"><meta property="og:image" content="https://yongsk0066.github.io/blog-placeholder-1.jpg"><!-- Twitter --><meta property="twitter:card" content="summary_large_image"><meta property="twitter:url" content="https://yongsk0066.github.io/"><meta property="twitter:title" content="장용석 블로그"><meta property="twitter:description" content="Welcome to my website!"><meta property="twitter:image" content="https://yongsk0066.github.io/blog-placeholder-1.jpg"><!-- Google Tag Manager --><link rel="stylesheet" href="/_astro/about.C7erBnUx.css">
2<link rel="stylesheet" href="/_astro/index.CIjJNGLc.css">
3<style>main[data-astro-cid-j7pv25f6]{display:flex;justify-content:center;align-items:center;width:100%;height:100%}
4.header__clock{font-family:JetBrains Mono,monospace;display:flex;align-items:center;justify-content:center;box-sizing:border-box}
5</style>
5<script type="module" src="/_astro/hoisted.CY1w50wQ.js"></script>
vendor: 1 bytes, line 5
5
6<script>/** @license Copyright 2020 Google LLC (BSD-3-Clause) */
7/** Bundled JS generated from "@astrojs/lit/client-shim.js" */
8var N = Object.defineProperty;
9var i = (t, n) => () => (t && (n = t((t = 0))), n);
10var b = (t, n) => {
11	for (var a in n) N(t, a, { get: n[a], enumerable: !0 });
12};
13function s() {
14	if (d === void 0) {
15		let t = document.createElement('div');
16		(t.innerHTML = '<div><template shadowrootmode="open"></template></div>'),
17			(d = !!t.firstElementChild.shadowRoot);
18	}
19	return d;
20}
21var d,
22	m = i(() => {});
23var p,
24	c,
25	f,
26	u = i(() => {
27		(p = (t) => t.parentElement === null),
28			(c = (t) => t.tagName === 'TEMPLATE'),
29			(f = (t) => t.nodeType === Node.ELEMENT_NODE);
30	});
31var h,
32	E = i(() => {
33		m();
34		u();
35		h = (t) => {
36			var n;
37			if (s()) return;
38			let a = [],
39				e = t.firstElementChild;
40			for (; e !== t && e !== null; )
41				if (c(e)) a.push(e), (e = e.content);
42				else if (e.firstElementChild !== null) e = e.firstElementChild;
43				else if (f(e) && e.nextElementSibling !== null) e = e.nextElementSibling;
44				else {
45					let o;
46					for (; e !== t && e !== null; )
47						if (p(e)) {
48							o = a.pop();
49							let r = o.parentElement,
50								l = o.getAttribute('shadowroot');
51							if (((e = o), l === 'open' || l === 'closed')) {
52								let y = o.hasAttribute('shadowrootdelegatesfocus');
53								try {
54									r.attachShadow({ mode: l, delegatesFocus: y }).append(o.content);
55								} catch {}
56							} else o = void 0;
57						} else {
58							let r = e.nextElementSibling;
59							if (r != null) {
60								(e = r), o !== void 0 && o.parentElement.removeChild(o);
61								break;
62							}
63							let l =
64								(n = e.parentElement) === null || n === void 0 ? void 0 : n.nextElementSibling;
65							if (l != null) {
66								(e = l), o !== void 0 && o.parentElement.removeChild(o);
67								break;
68							}
69							(e = e.parentElement), o !== void 0 && (o.parentElement.removeChild(o), (o = void 0));
70						}
71				}
72		};
73	});
74var w = i(() => {
75	E();
76});
77var v = {};
78b(v, { hasNativeDeclarativeShadowRoots: () => s, hydrateShadowRoots: () => h });
79var S = i(() => {
80	m();
81	w();
82});
83async function g() {
84	let { hydrateShadowRoots: t } = await Promise.resolve().then(() => (S(), v));
85	window.addEventListener('DOMContentLoaded', () => t(document.body), { once: true });
86}
87var x = Document.parseHTMLUnsafe(
88	'<p><template shadowrootmode="open"></template></p>'
89).querySelector('p');
90(!x || !x.shadowRoot) && g();
91</script>
91</head> <body data-astro-cid-j7pv25f6> <!-- Google Tag Manager (noscript) --> <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-THN5VFZZ" height="0" width="0" style="display:none;visibility:hidden" data-astro-cid-j7pv25f6></iframe></noscript> <!-- End Google Tag Manager (noscript) --> <!-- <Header title={SITE_TITLE} /> --> <html lang="en"> <head><link rel="canonical" href="https://yongseok.me/"><meta http-equiv="refresh" content="0; URL=https://yongseok.me/"><!-- Global Metadata --><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" type="image/svg+xml" href="/favicon-dark.svg" media="(prefers-color-scheme: dark)"><link rel="icon" type="image/svg+xml" href="/favicon-light.svg" media="(prefers-color-scheme: light)"><link rel="icon" type="image/x-icon" href="/favicon-light.svg"><meta name="generator" content="Astro v4.11.5"><!-- Font preloads --><!-- Font preloads --><link rel="preload" href="/fonts/atkinson-regular.woff" as="font" type="font/woff" crossorigin><link rel="preload" href="/fonts/atkinson-bold.woff" as="font" type="font/woff" crossorigin><link rel="preload" href="/fonts/JetBrainsMono-Bold.woff2" as="font" type="font/woff" crossorigin><link rel="preload" href="/fonts/JetBrainsMono-Regular.woff2" as="font" type="font/woff" crossorigin><link rel="preload" href="/fonts/JetBrainsMono-SemiBold.woff2" as="font" type="font/woff" crossorigin><link rel="preload" href="/fonts/JetBrainsMono-Medium.woff2" as="font" type="font/woff" crossorigin><link rel="preload" href="/fonts/Oswald-Bold.ttf" as="font" type="font/ttf" crossorigin><link rel="preload" href="/fonts/Oswald-Regular.ttf" as="font" type="font/ttf" crossorigin><link rel="preload" href="/fonts/Oswald-SemiBold.ttf" as="font" type="font/ttf" crossorigin><link rel="preload" href="/fonts/Oswald-Medium.ttf" as="font" type="font/ttf" crossorigin><link rel="preload" href="/fonts/Oswald-ExtraLight.ttf" as="font" type="font/ttf" crossorigin><link rel="preload" href="/fonts/Oswald-Light.ttf" as="font" type="font/ttf" crossorigin><link rel="preload" href="/fonts/Oswald-SemiBold.ttf" as="font" type="font/ttf" crossorigin><!-- Canonical URL --><link rel="canonical" href="https://yongsk0066.github.io/"><!-- Primary Meta Tags --><title>About Me | 장용석 블로그</title><meta name="title" content="About Me | 장용석 블로그"><meta name="description" content="나는 누구인가?"><!-- Open Graph / Facebook --><meta property="og:type" content="website"><meta property="og:url" content="https://yongsk0066.github.io/"><meta property="og:title" content="About Me | 장용석 블로그"><meta property="og:description" content="나는 누구인가?"><meta property="og:image" content="https://yongsk0066.github.io/nano.png"><!-- Twitter --><meta property="twitter:card" content="summary_large_image"><meta property="twitter:url" content="https://yongsk0066.github.io/"><meta property="twitter:title" content="About Me | 장용석 블로그"><meta property="twitter:description" content="나는 누구인가?"><meta property="twitter:image" content="https://yongsk0066.github.io/nano.png"><!-- Google Tag Manager --><meta name="astro-view-transitions-enabled" content="true"><meta name="astro-view-transitions-fallback" content="animate">
91<script>
92  function init() {
93    preloadTheme();
94    onScroll();
95    animate();
96
97    const backToTop = document.getElementById("back-to-top");
98    backToTop?.addEventListener("click", (event) => scrollToTop(event));
99
100    const backToPrev = document.getElementById("back-to-prev");
101    backToPrev?.addEventListener("click", () => window.history.back());
102
103    const shareButton = document.getElementById("share-button");
104    shareButton?.addEventListener("click", () => {
105      const url = window.location.href;
106      if (navigator.share) {
107        navigator.share({
108          title: document.title,
109          url: url,
110        });
111      } else {
112        navigator.clipboard
113          .writeText(url)
114          .then(() => {
115            alert("링크가 복사되었어요!");
116          })
117          .catch((error) => {
118            console.error("클립보드에 복사 실패:", error);
119            prompt("아래 링크를 복사하세요!", url);
120          });
121      }
122    });
123
124    const lightThemeButton = document.getElementById("light-theme-button");
125    lightThemeButton?.addEventListener("click", () => {
126      localStorage.setItem("theme", "light");
127      toggleTheme(false);
128    });
129
130    const darkThemeButton = document.getElementById("dark-theme-button");
131    darkThemeButton?.addEventListener("click", () => {
132      localStorage.setItem("theme", "dark");
133      toggleTheme(true);
134    });
135
136    const systemThemeButton = document.getElementById("system-theme-button");
137    systemThemeButton?.addEventListener("click", () => {
138      localStorage.setItem("theme", "system");
139      toggleTheme(window.matchMedia("(prefers-color-scheme: dark)").matches);
140    });
141
142    window
143      .matchMedia("(prefers-color-scheme: dark)")
144      .addEventListener("change", (event) => {
145        if (localStorage.theme === "system") {
146          toggleTheme(event.matches);
147        }
148      });
149
150    document.addEventListener("scroll", onScroll);
151  }
152
153  function animate() {
154    const animateElements = document.querySelectorAll(".animate");
155
156    animateElements.forEach((element, index) => {
157      setTimeout(() => {
158        element.classList.add("show");
159      }, index * 150);
160    });
161  }
162
163  function onScroll() {
164    if (window.scrollY > 0) {
165      document.documentElement.classList.add("scrolled");
166    } else {
167      document.documentElement.classList.remove("scrolled");
168    }
169  }
170
171  function scrollToTop(event) {
172    event.preventDefault();
173    window.scrollTo({
174      top: 0,
175      behavior: "smooth",
176    });
177  }
178
179  function toggleTheme(dark) {
180    const css = document.createElement("style");
181
182    css.appendChild(
183      document.createTextNode(
184        `* {
185             -webkit-transition: none !important;
186             -moz-transition: none !important;
187             -o-transition: none !important;
188             -ms-transition: none !important;
189             transition: none !important;
190          }
191        `
192      )
193    );
194
195    document.head.appendChild(css);
196
197    if (dark) {
198      document.documentElement.classList.add("dark");
199    } else {
200      document.documentElement.classList.remove("dark");
201    }
202
203    window.getComputedStyle(css).opacity;
204    document.head.removeChild(css);
205  }
206
207  function preloadTheme() {
208    const userTheme = localStorage.theme;
209
210    if (userTheme === "light" || userTheme === "dark") {
211      toggleTheme(userTheme === "dark");
212    } else {
213      // default
214      toggleTheme(false);
215      // toggleTheme(window.matchMedia("(prefers-color-scheme: dark)").matches);
216    }
217  }
218
219  document.addEventListener("DOMContentLoaded", () => init());
220  document.addEventListener("astro:after-swap", () => init());
221  preloadTheme();
222</script>
222</head> <body> <header> <div class="mx-auto max-w-screen-md px-5">  <div class="flex flex-wrap gap-y-2 justify-between"> <a href="/" target="_self" class="inline-block decoration-black/15 dark:decoration-white/30 hover:decoration-black/25 hover:dark:decoration-white/50 text-current hover:text-black hover:dark:text-white transition-colors duration-300 ease-in-out">  <div class="font-semibold">장용석 블로그</div>  </a> <nav class="flex gap-1"> <style>astro-island,astro-slot,astro-static-slot{display:contents}</style>
222<script>(()=>{var e=async t=>{await(await t())()};(self.Astro||(self.Astro={})).only=e;window.dispatchEvent(new Event("astro:only"));})();;(()=>{var A=Object.defineProperty;var g=(i,o,a)=>o in i?A(i,o,{enumerable:!0,configurable:!0,writable:!0,value:a}):i[o]=a;var d=(i,o,a)=>g(i,typeof o!="symbol"?o+"":o,a);{let i={0:t=>m(t),1:t=>a(t),2:t=>new RegExp(t),3:t=>new Date(t),4:t=>new Map(a(t)),5:t=>new Set(a(t)),6:t=>BigInt(t),7:t=>new URL(t),8:t=>new Uint8Array(t),9:t=>new Uint16Array(t),10:t=>new Uint32Array(t)},o=t=>{let[l,e]=t;return l in i?i[l](e):void 0},a=t=>t.map(o),m=t=>typeof t!="object"||t===null?t:Object.fromEntries(Object.entries(t).map(([l,e])=>[l,o(e)]));class y extends HTMLElement{constructor(){super(...arguments);d(this,"Component");d(this,"hydrator");d(this,"hydrate",async()=>{var b;if(!this.hydrator||!this.isConnected)return;let e=(b=this.parentElement)==null?void 0:b.closest("astro-island[ssr]");if(e){e.addEventListener("astro:hydrate",this.hydrate,{once:!0});return}let c=this.querySelectorAll("astro-slot"),n={},h=this.querySelectorAll("template[data-astro-template]");for(let r of h){let s=r.closest(this.tagName);s!=null&&s.isSameNode(this)&&(n[r.getAttribute("data-astro-template")||"default"]=r.innerHTML,r.remove())}for(let r of c){let s=r.closest(this.tagName);s!=null&&s.isSameNode(this)&&(n[r.getAttribute("name")||"default"]=r.innerHTML)}let p;try{p=this.hasAttribute("props")?m(JSON.parse(this.getAttribute("props"))):{}}catch(r){let s=this.getAttribute("component-url")||"<unknown>",v=this.getAttribute("component-export");throw v&&(s+=` (export ${v})`),console.error(`[hydrate] Error parsing props for component ${s}`,this.getAttribute("props"),r),r}let u;await this.hydrator(this)(this.Component,p,n,{client:this.getAttribute("client")}),this.removeAttribute("ssr"),this.dispatchEvent(new CustomEvent("astro:hydrate"))});d(this,"unmount",()=>{this.isConnected||this.dispatchEvent(new CustomEvent("astro:unmount"))})}disconnectedCallback(){document.removeEventListener("astro:after-swap",this.unmount),document.addEventListener("astro:after-swap",this.unmount,{once:!0})}connectedCallback(){if(!this.hasAttribute("await-children")||document.readyState==="interactive"||document.readyState==="complete")this.childrenConnectedCallback();else{let e=()=>{document.removeEventListener("DOMContentLoaded",e),c.disconnect(),this.childrenConnectedCallback()},c=new MutationObserver(()=>{var n;((n=this.lastChild)==null?void 0:n.nodeType)===Node.COMMENT_NODE&&this.lastChild.nodeValue==="astro:end"&&(this.lastChild.remove(),e())});c.observe(this,{childList:!0}),document.addEventListener("DOMContentLoaded",e)}}async childrenConnectedCallback(){let e=this.getAttribute("before-hydration-url");e&&await import(e),this.start()}async start(){let e=JSON.parse(this.getAttribute("opts")),c=this.getAttribute("client");if(Astro[c]===void 0){window.addEventListener(`astro:${c}`,()=>this.start(),{once:!0});return}try{await Astro[c](async()=>{let n=this.getAttribute("renderer-url"),[h,{default:p}]=await Promise.all([import(this.getAttribute("component-url")),n?import(n):()=>()=>{}]),u=this.getAttribute("component-export")||"default";if(!u.includes("."))this.Component=h[u];else{this.Component=h;for(let f of u.split("."))this.Component=this.Component[f]}return this.hydrator=p,this.hydrate},e,this)}catch(n){console.error(`[astro-island] Error hydrating ${this.getAttribute("component-url")}`,n)}}attributeChangedCallback(){this.hydrate()}}d(y,"observedAttributes",["props"]),customElements.get("astro-island")||customElements.define("astro-island",y)}})();</script>
222<astro-island uid="1Bz4sp" component-url="/_astro/HeaderClock.Dit9YhCe.js" component-export="default" renderer-url="/_astro/client.BIGLHmRd.js" props="{}" ssr="" client="only" before-hydration-url="/_astro/astro_scripts/before-hydration.js.CFRWJj0F.js" opts="{&quot;name&quot;:&quot;HeaderClock&quot;,&quot;value&quot;:&quot;react&quot;}"></astro-island> <span> / </span> <a href="/blog" target="_self" class="inline-block decoration-black/15 dark:decoration-white/30 hover:decoration-black/25 hover:dark:decoration-white/50 text-current hover:text-black hover:dark:text-white transition-colors duration-300 ease-in-out underline underline-offset-2">  blog  </a> <span> / </span> <a href="/about" target="_self" class="inline-block decoration-black/15 dark:decoration-white/30 hover:decoration-black/25 hover:dark:decoration-white/50 text-current hover:text-black hover:dark:text-white transition-colors duration-300 ease-in-out underline underline-offset-2">  about  </a> </nav> </div>  </div> </header> <main>  <div class="mx-auto animate-expand px-8 max-sm:px-4 max-sm:-mt-8" data-astro-cid-j7pv25f6> <astro-island uid="ZQAnxv" component-url="/_astro/home-cover-element.ByFa8UhT.js" component-export="HomeCoverElement" renderer-url="/_astro/client.DEGHhFmz.js" props="{&quot;data-astro-cid-j7pv25f6&quot;:[0,true]}" ssr="" client="only" before-hydration-url="/_astro/astro_scripts/before-hydration.js.CFRWJj0F.js" opts="{&quot;name&quot;:&quot;HomeCoverElement&quot;,&quot;value&quot;:&quot;lit&quot;}"></astro-island> </div>  </main> <footer class="animate"> <div class="mx-auto max-w-screen-md px-5">  <div class="relative"> <div class="absolute right-0 -top-20"> <button id="back-to-top" class="relative group w-fit flex pl-8 pr-3 py-1.5 flex-nowrap rounded border border-black/15 dark:border-white/20 hover:bg-black/5 dark:hover:bg-white/5 hover:text-black dark:hover:text-white transition-colors duration-300 ease-in-out"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="absolute top-1/2 left-2 -translate-y-1/2 size-4 stroke-2 fill-none stroke-current rotate-90"> <line x1="5" y1="12" x2="19" y2="12" class="translate-x-2 group-hover:translate-x-0 scale-x-0 group-hover:scale-x-100 transition-transform duration-300 ease-in-out"></line> <polyline points="12 5 5 12 12 19" class="translate-x-1 group-hover:translate-x-0 transition-transform duration-300 ease-in-out"></polyline> </svg> <div class="text-sm">위로 올라가요</div> </button> </div> </div> <div class="flex justify-between items-center"> <div>
223&copy; 2024 | 장용석 블로그
224</div> <div class="flex flex-wrap gap-1 items-center"> <button id="light-theme-button" aria-label="Light theme" class="group size-8 flex items-center justify-center rounded-full"> <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="group-hover:stroke-black group-hover:dark:stroke-white transition-colors duration-300 ease-in-out"> <circle cx="12" cy="12" r="5"></circle> <line x1="12" y1="1" x2="12" y2="3"></line> <line x1="12" y1="21" x2="12" y2="23"></line> <line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line> <line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line> <line x1="1" y1="12" x2="3" y2="12"></line> <line x1="21" y1="12" x2="23" y2="12"></line> <line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line> <line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line> </svg> </button> <button id="dark-theme-button" aria-label="Dark theme" class="group size-8 flex items-center justify-center rounded-full"> <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="group-hover:stroke-black group-hover:dark:stroke-white transition-colors duration-300 ease-in-out"> <path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path> </svg> </button> <button id="system-theme-button" aria-label="System theme" class="group size-8 flex items-center justify-center rounded-full"> <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="group-hover:stroke-black group-hover:dark:stroke-white transition-colors duration-300 ease-in-out"> <rect x="2" y="3" width="20" height="14" rx="2" ry="2"></rect> <line x1="8" y1="21" x2="16" y2="21"></line> <line x1="12" y1="17" x2="12" y2="21"></line> </svg> </button> </div> </div>  </div> </footer> </body></html> </body></html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.