Skip to content

Commit d366219

Browse files
2REBCat2REBCat
committed
hugo로 UI 개편
1 parent 7fdeca7 commit d366219

54 files changed

Lines changed: 2921 additions & 86 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎.github/workflows/hugo.yml‎

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
name: Deploy Hugo site
2+
3+
on:
4+
push:
5+
branches:
6+
- main
7+
workflow_dispatch:
8+
9+
permissions:
10+
contents: read
11+
pages: write
12+
id-token: write
13+
14+
concurrency:
15+
group: pages
16+
cancel-in-progress: true
17+
18+
jobs:
19+
build:
20+
runs-on: ubuntu-latest
21+
steps:
22+
- name: Checkout
23+
uses: actions/checkout@v4
24+
with:
25+
fetch-depth: 0
26+
27+
- name: Setup Pages
28+
uses: actions/configure-pages@v5
29+
30+
- name: Setup Hugo
31+
uses: peaceiris/actions-hugo@v3
32+
with:
33+
hugo-version: '0.145.0'
34+
extended: true
35+
36+
- name: Build site
37+
run: hugo --minify
38+
39+
- name: Upload artifact
40+
uses: actions/upload-pages-artifact@v3
41+
with:
42+
path: ./public
43+
44+
deploy:
45+
environment:
46+
name: github-pages
47+
url: ${{ steps.deployment.outputs.page_url }}
48+
runs-on: ubuntu-latest
49+
needs: build
50+
steps:
51+
- name: Deploy to GitHub Pages
52+
id: deployment
53+
uses: actions/deploy-pages@v4

‎.gitignore‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
/public/
2+
/resources/_gen/
3+
/.hugo_build.lock
4+
/.tools/

‎.verify-build/about/index.html‎

Lines changed: 279 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,279 @@
1+
<!doctype html>
2+
<html lang="ko">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1" />
6+
<meta name="description" content="2RebCat knowledge archive. A blog-first site for study notes, security and operations memos, and portfolio build logs." />
7+
<link rel="icon" type="image/jpeg" href="/logo.jpg" />
8+
<link rel="preconnect" href="https://fonts.googleapis.com" />
9+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
10+
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@500;700&family=Noto+Sans+KR:wght@400;500;700;800&display=swap" rel="stylesheet" />
11+
12+
<link rel="stylesheet" href="/css/main.min.ff8e9f0f171521e24e0f4547a9d69eee57ec5b723e79f5aba74c8e88d1513285.css" integrity="sha256-/46fDxcVIeJOD0VHqdae7lfsW3I&#43;efWrp0yOiNFRMoU=" />
13+
<title>About | 2RebCat | Knowledge Archive</title>
14+
</head>
15+
<body>
16+
<div class="page-shell">
17+
<header class="site-header" data-site-header>
18+
<nav class="site-nav" aria-label="Primary">
19+
<a class="nav-link" href="/">홈</a>
20+
<a class="nav-link" href="/blog/">블로그</a>
21+
<a class="nav-link" href="/about/">소개</a>
22+
</nav>
23+
</header>
24+
25+
26+
27+
28+
29+
30+
31+
32+
33+
34+
35+
36+
37+
38+
39+
40+
41+
42+
43+
44+
45+
46+
47+
48+
49+
50+
51+
52+
53+
54+
55+
56+
57+
58+
59+
60+
61+
62+
63+
64+
65+
66+
67+
68+
69+
70+
71+
72+
73+
<main id="about" class="home-layout">
74+
<section class="hero-grid reveal">
75+
<div class="hero-copy">
76+
<div class="hero-head">
77+
<div class="hero-head-copy">
78+
<p class="eyebrow">About</p>
79+
<p class="hero-role">Computer Science Graduate · Security-minded Builder</p>
80+
<p class="status-line">Open to collaboration</p>
81+
</div>
82+
</div>
83+
<h1>기록이 쌓일수록 더 선명해지는 개발 포트폴리오</h1>
84+
85+
<div class="intro-copy">
86+
<p>웹 개발, 정보보안, 서버 운영을 따로 떨어진 분야로 보지 않고 하나의 흐름 안에서 이해하려고 노력합니다. 기능을 구현하는 일과 기록을 남기는 일을 같은 비중으로 다루며, 시간이 지나도 다시 읽히는 구조를 만드는 데 관심이 많습니다.</p>
87+
<p>이 페이지는 소개와 이력을 정리하는 포트폴리오 영역입니다. 실제 학습 기록과 작업 메모는 블로그를 중심으로 계속 쌓아 갈 예정입니다.</p>
88+
89+
</div>
90+
91+
</div>
92+
</section>
93+
94+
<section id="focus" class="section-block reveal delay-2">
95+
<div class="section-heading">
96+
<p class="section-kicker">Focus</p>
97+
<h2>지금 이 페이지에서 먼저 보여주고 싶은 것</h2>
98+
</div>
99+
<div class="principles-grid">
100+
101+
<article class="principle-card">
102+
<h3>학습을 결과물로 남기기</h3>
103+
<p>무엇을 공부했는지보다 어떤 방식으로 이해하고 정리했는지를 보여주는 구조를 만드는 데 더 집중합니다.</p>
104+
</article>
105+
106+
<article class="principle-card">
107+
<h3>보안 감각이 있는 개발</h3>
108+
<p>기능 구현만이 아니라 배포, 입력 처리, 링크 관리, 정적 사이트 운영까지 함께 챙기는 개발 습관을 지향합니다.</p>
109+
</article>
110+
111+
<article class="principle-card">
112+
<h3>작지만 완성도 있는 개선</h3>
113+
<p>거대한 기능 추가보다 지금 있는 저장소를 더 명확하고 읽기 좋은 결과물로 바꾸는 개선을 선호합니다.</p>
114+
</article>
115+
116+
</div>
117+
</section>
118+
119+
<section class="section-block reveal delay-2">
120+
<div class="section-heading split-heading">
121+
<div>
122+
<p class="section-kicker">Overview</p>
123+
<h2>기본 정보와 관심 분야</h2>
124+
</div>
125+
</div>
126+
<div class="overview-grid">
127+
<article class="overview-card">
128+
<p class="card-label">Education</p>
129+
<ul class="detail-list">
130+
131+
<li>
132+
<span class="detail-label">학교</span>
133+
<strong>상명대학교 학사</strong>
134+
</li>
135+
136+
<li>
137+
<span class="detail-label">전공</span>
138+
<strong>컴퓨터과학과 정보보안전공</strong>
139+
</li>
140+
141+
</ul>
142+
</article>
143+
<article class="overview-card">
144+
<p class="card-label">Interests</p>
145+
<div class="tag-list">
146+
147+
<span>Web Engineering</span>
148+
149+
<span>Information Security</span>
150+
151+
<span>Infrastructure</span>
152+
153+
<span>Knowledge Archive</span>
154+
155+
<span>Technical Writing</span>
156+
157+
</div>
158+
</article>
159+
</div>
160+
</section>
161+
162+
<section id="timeline" class="section-block reveal delay-3">
163+
<div class="section-heading">
164+
<p class="section-kicker">Journey</p>
165+
<h2>학업과 실무 흐름</h2>
166+
</div>
167+
<div class="timeline-list">
168+
169+
<article class="timeline-item">
170+
<div class="timeline-period-wrap">
171+
<span class="timeline-period">University</span>
172+
</div>
173+
<div class="timeline-body">
174+
<h3>상명대학교 컴퓨터과학과 정보보안전공</h3>
175+
<p>컴퓨터과학 기반 위에 정보보안 관점을 더해 웹과 시스템을 구조적으로 이해하는 방향으로 학업을 이어 왔습니다.</p>
176+
</div>
177+
</article>
178+
179+
<article class="timeline-item">
180+
<div class="timeline-period-wrap">
181+
<span class="timeline-period">2019 - 2020</span>
182+
</div>
183+
<div class="timeline-body">
184+
<h3>New Media Dept. · Assistant</h3>
185+
<p>전자 신문 서비스 유지보수와 서버 관리를 담당하며 운영 환경에서의 안정성, 점검, 대응 흐름을 경험했습니다.</p>
186+
</div>
187+
</article>
188+
189+
<article class="timeline-item">
190+
<div class="timeline-period-wrap">
191+
<span class="timeline-period">Now</span>
192+
</div>
193+
<div class="timeline-body">
194+
<h3>Portfolio &amp; Archive Rebuild</h3>
195+
<p>기존 학습 블로그를 현재의 포트폴리오 구조와 연결해 소개와 기록이 함께 살아 있는 개인 사이트로 다시 다듬고 있습니다.</p>
196+
</div>
197+
</article>
198+
199+
</div>
200+
</section>
201+
202+
<section class="section-block reveal delay-4">
203+
<div class="section-heading split-heading">
204+
<div>
205+
<p class="section-kicker">Archive</p>
206+
<h2>최근 글이 추가된 주제</h2>
207+
</div>
208+
<a class="inline-link inline-link-minimal" href="/blog/">더 보기</a>
209+
</div>
210+
211+
<div class="topic-grid">
212+
213+
<article class="topic-card">
214+
<p class="card-label">Topic</p>
215+
<h3><a href="/blog/build-log/">빌드 로그</a></h3>
216+
<p><p>사이트 구조 변경, UI 조정, 배포 확인처럼 블로그를 직접 손보는 과정의 기록을 정리합니다.</p></p>
217+
</article>
218+
219+
<article class="topic-card">
220+
<p class="card-label">Topic</p>
221+
<h3><a href="/blog/web-engineering/">웹 개발 메모</a></h3>
222+
<p><p>화면 구조, 네비게이션, 읽기 흐름처럼 사용자에게 직접 보이는 요소를 다룰 때 필요한 메모를 모아 둡니다.</p></p>
223+
</article>
224+
225+
<article class="topic-card">
226+
<p class="card-label">Topic</p>
227+
<h3><a href="/blog/study/">학습 노트</a></h3>
228+
<p><p>개념 정리, 구현 실험, 디버깅 메모처럼 다시 찾아볼 가능성이 큰 내용을 모아 두는 공간입니다. 짧은 기록이라도 나중에 흐름을 따라가기 쉽도록 정리합니다.</p></p>
229+
</article>
230+
231+
</div>
232+
233+
</section>
234+
235+
<section id="contact" class="section-block reveal delay-4">
236+
<article class="contact-panel">
237+
<div>
238+
<p class="section-kicker">Contact</p>
239+
<h2>이야기를 함께 나눌 수 있습니다</h2>
240+
</div>
241+
<div class="contact-actions">
242+
<a class="button primary" href="mailto:2rebcat@gmail.com">메일 보내기</a>
243+
244+
<a class="button secondary social-link" href="https://github.com/2REBCat" target="_blank" rel="noreferrer" data-platform="github">github.com/2REBCat</a>
245+
246+
</div>
247+
</article>
248+
</section>
249+
</main>
250+
251+
252+
<footer class="site-footer">
253+
<p>© 2026 2RebCat. Blog-first knowledge archive built with Hugo.</p>
254+
</footer>
255+
</div>
256+
<script>
257+
(() => {
258+
const header = document.querySelector('[data-site-header]');
259+
if (!header) return;
260+
261+
let lastScrollY = window.scrollY;
262+
263+
const syncHeader = () => {
264+
const currentScrollY = window.scrollY;
265+
const scrollingUp = currentScrollY < lastScrollY;
266+
const nearTop = currentScrollY < 24;
267+
268+
header.classList.toggle('is-hidden', !nearTop && !scrollingUp && currentScrollY > 120);
269+
header.classList.toggle('is-condensed', currentScrollY > 24);
270+
271+
lastScrollY = currentScrollY;
272+
};
273+
274+
syncHeader();
275+
window.addEventListener('scroll', syncHeader, { passive: true });
276+
})();
277+
</script>
278+
</body>
279+
</html>

0 commit comments

Comments
 (0)