-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
222 lines (208 loc) · 12.4 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
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
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
<!doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="KKuTuDotNet & CubeCity CEO, Student Developer.">
<meta name="author" content="Kim Do Hoon">
<title>Kim Do Hoon · Home</title>
<link rel="canonical" href="https://kdh.io">
<link rel="stylesheet" type="text/css" href="https://kdh.io/assets/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/moonspam/[email protected]/nanumsquare.css">
<link rel="stylesheet" type="text/css" href="https://kdh.io/assets/css/kdhkr.css?production=true">
<style>
* {
font-family: 'NanumSquare', sans-serif;
}
.text-gray {
color: rgba(255,255,255,.8);
}
.bd-placeholder-img {
font-size: 1.125rem;
text-anchor: middle;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.tdx {
text-decoration: none !important;
}
@media (min-width: 768px) {
.bd-placeholder-img-lg {
font-size: 3.5rem;
}
}
.lead {
font-size: 1.5rem;
}
.font-weight-light {
font-size: 3.25rem;
}
.main-nav::before {
height: 32px;
width: calc(32px * 1.5);
}
.main::before {
height: 128px;
width: calc(128px * 1.5);
}
</style>
</head>
<body>
<header>
<div class="collapse bg-primary" id="navbarHeader">
<div class="container">
<div class="row">
<div class="col-sm-8 col-md-7 py-4">
<h4 class="text-white">자기소개</h4>
<p class="text-gray">안녕하세요, 아직 배우고 싶은 것이 너무나도 많은 학생 개발자 김도훈입니다. 현재 Typescript와 Docker 위주로 공부하고 있으며, 풀스택 개발자를 목표로 하고 있습니다. 저에 대하여 더 궁금하신 점이 있으시다면 우측에 있는 개발자 소개 링크를 클릭해주시면 감사하겠습니다!</p>
</div>
<div class="col-sm-4 offset-md-1 py-4">
<h4 class="text-white">이동하기</h4>
<ul class="list-unstyled">
<li><a href="/" class="text-gray">메인 페이지</a></li>
<li><a href="/about" class="text-gray">개발자 소개</a></li>
<li><a href="/stack" class="text-gray">보유 기술</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="navbar navbar-dark bg-primary shadow-sm">
<div class="container">
<a href="#" class="navbar-brand d-flex align-items-center" style="font-size:2rem;">
<i class="kdh kdh-main main-nav"></i> <strong>Do Hoon Kim</strong>
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarHeader" aria-controls="navbarHeader" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
</div>
</div>
</header>
<main>
<section class="py-5 text-center container">
<div class="row py-lg-5">
<div class="col-lg-10 col-md-8 mx-auto">
<h1 style="font-size: 8rem"><i class="kdh kdh-main main"></i></h1>
<h1 class="font-weight-light"><b style="font-weight: bold !important;">모두를 위한 작은 변화</b>를 만듭니다.</h1>
<p class="lead text-muted">안녕하세요, 아직 배우고 싶은 것이 너무나도 많은 학생 개발자 김도훈입니다.</p>
<p>
<a href="/about" class="btn btn-primary my-2" style="font-size: 1.25rem"><i class="kdh kdh-user"></i> 개발자 소개</a>
<a href="/stack" class="btn btn-secondary my-2" style="font-size: 1.25rem"><i class="kdh kdh-plus"></i> 보유 기술</a>
</p>
</div>
</div>
</section>
<div class="album py-5 bg-light">
<div class="container">
<h1 class="font-weight-light" style="font-weight: bold !important; text-align: center;">진행한 프로젝트</h1>
<p class="lead text-muted" style="text-align: center; margin-bottom: 30px;">이제까지 진행하였던 프로젝트 목록입니다.</p>
<div class="row row-cols-1 row-cols-sm-2 row-cols-md-3 g-3">
<div class="col">
<div class="card shadow-sm">
<img class="bd-placeholder-img card-img-top" width="100%" height="225" src="/assets/img/KKuTuDotNet.png">
<div class="card-body">
<p class="card-text">끄투닷넷은 한국어 또는 영어 단어를 이용하여 끝말잇기 등을 즐길 수 있는 실시간 온라인 웹 게임으로, JJoriping의 KKuTu를 기반으로 하고 있습니다.</p>
<div class="d-flex justify-content-between align-items-center">
<div class="btn-group">
<button type="button" class="btn btn-sm btn-outline-secondary" onclick="window.open('https://kkutu.xyz')"><i class="kdh kdh-eye"></i></button>
<button type="button" class="btn btn-sm btn-outline-secondary" onclick="window.open('https://github.com/KKuTuDotNet/KKuTu')"><i class="kdh kdh-code"></i></button>
</div>
<small class="text-muted">17/7/7 ~</small>
</div>
</div>
</div>
</div>
<div class="col">
<div class="card shadow-sm">
<svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" aria-label="Placeholder: Thumbnail" preserveAspectRatio="xMidYMid slice" role="img" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">썸네일 준비중...</text></svg>
<div class="card-body">
<p class="card-text">CubeNode는 개발자를 위하여 고안된 웹 호스팅 서비스로, 1년에 3,000원부터 시작하는 저렴한 가격으로 제공하고 있습니다.</p>
<div class="d-flex justify-content-between align-items-center">
<div class="btn-group">
<button type="button" class="btn btn-sm btn-outline-secondary" onclick="window.open('https://hosting.cube.city')"><i class="kdh kdh-eye"></i></button>
<button type="button" class="btn btn-sm btn-outline-secondary" disabled><i class="kdh kdh-code"></i></button>
</div>
<small class="text-muted">18/6/5 ~</small>
</div>
</div>
</div>
</div>
<div class="col">
<div class="card shadow-sm">
<svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" aria-label="Placeholder: Thumbnail" preserveAspectRatio="xMidYMid slice" role="img" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">썸네일 준비중...</text></svg>
<div class="card-body">
<p class="card-text">iNWall은 터널링을 통하여 포트 개방 없이 외부에서 애플리케이션 접속이 가능하도록 하는 개발자용 솔루션입니다. 현재 비공개 테스트 진행 중입니다.</p>
<div class="d-flex justify-content-between align-items-center">
<div class="btn-group">
<button type="button" class="btn btn-sm btn-outline-secondary" onclick="window.open('https://iwall.kdh.io')"><i class="kdh kdh-eye"></i></button>
<button type="button" class="btn btn-sm btn-outline-secondary" onclick="window.open('https://github.com/kdhkr')"><i class="kdh kdh-code"></i></button>
</div>
<small class="text-muted">20/7/20 ~</small>
</div>
</div>
</div>
</div>
<div class="col">
<div class="card shadow-sm">
<svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" aria-label="Placeholder: Thumbnail" preserveAspectRatio="xMidYMid slice" role="img" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">썸네일 준비중...</text></svg>
<div class="card-body">
<p class="card-text">iNPass는 클라우드 비밀번호 저장 솔루션으로, 서버에 암호화 키를 저장하지 않고 사용자에게 해독 키를 제공하여 해킹의 위험으로부터 벗어났습니다. (부분 서비스 종료)</p>
<div class="d-flex justify-content-between align-items-center">
<div class="btn-group">
<button type="button" class="btn btn-sm btn-outline-secondary" disabled><i class="kdh kdh-eye"></i></button>
<button type="button" class="btn btn-sm btn-outline-secondary" onclick="window.open('https://github.com/kdhkr')"><i class="kdh kdh-code"></i></button>
</div>
<small class="text-muted">18/4/12 ~ 20/7/1</small>
</div>
</div>
</div>
</div>
<div class="col">
<div class="card shadow-sm">
<svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" aria-label="Placeholder: Thumbnail" preserveAspectRatio="xMidYMid slice" role="img" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">썸네일 준비중...</text></svg>
<div class="card-body">
<p class="card-text">iDM은 DDoS 공격에 취약한 웹 사이트를 대상으로 무료로 WAF 서비스를 제공하는 서비스입니다. Comodo WAF를 기반으로 구축되었습니다. (서비스 종료)</p>
<div class="d-flex justify-content-between align-items-center">
<div class="btn-group">
<button type="button" class="btn btn-sm btn-outline-secondary" disabled><i class="kdh kdh-eye"></i></button>
<button type="button" class="btn btn-sm btn-outline-secondary" disabled><i class="kdh kdh-code"></i></button>
</div>
<small class="text-muted">19/3/7 ~ 19/11/24</small>
</div>
</div>
</div>
</div>
<div class="col">
<div class="card shadow-sm">
<img class="bd-placeholder-img card-img-top" width="100%" height="225" src="/assets/img/iNCresto.png">
<div class="card-body">
<p class="card-text">iNCresto는 광고를 표시하지 않는 대신 클라이언트의 웹 사이트 관심도를 분석하여 가치가 있는 콘텐츠에 대금을 지불하는 신개념 플랫폼입니다. (서비스 종료)</p>
<div class="d-flex justify-content-between align-items-center">
<div class="btn-group">
<button type="button" class="btn btn-sm btn-outline-secondary" disabled><i class="kdh kdh-eye"></i></button>
<button type="button" class="btn btn-sm btn-outline-secondary" disabled><i class="kdh kdh-code"></i></button>
</div>
<small class="text-muted">16/9/15 ~ 18/4/27</small>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</main>
<footer class="text-muted py-5">
<div class="container">
<p class="float-right mb-1">
<a href="#"><i class="kdh kdh-chevron-up" style="font-size:2rem;"></i></a>
</p>
<p class="mb-1">© 2020 김도훈. 모든 권리 보유.</p>
<p class="mb-0"><a class="tdx" href="mailto:[email protected]"><i class="kdh kdh-mail"></i> E-mail</a> / <a class="tdx" href="https://blog.kdh.io" target="_blank"><i class="kdh kdh-blogger-rect"></i> Blog</a> / <a class="tdx" href="https://connect.kdh.io/facebook" target="_blank"><i class="kdh kdh-facebook-squared"></i> Facebook</a> / <a class="tdx" href="https://connect.kdh.io/telegram" target="_blank"><i class="kdh kdh-telegram"></i> Telegram</a> / <a class="tdx" href="https://connect.kdh.io/github" target="_blank"><i class="kdh kdh-github-circled"></i> Github</a></p>
</div>
</footer>
<script src="https://kdh.io/assets/js/bootstrap.bundle.min.js"></script>
</body>
</html>