-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
271 lines (239 loc) · 16.9 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
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Aditi Diwan's Website</title>
<link href="styles.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css">
</head>
<body>
<nav class="navbar navbar-expand-lg bg-body-tertiary">
<div class="container-fluid">
<a class="navbar-brand" href="#">
Aditi Diwan
</a>
</div>
</nav>
<!-- Nav Menu -->
<div class="content-wrapper">
<div class="d-flex align-items-start">
<div data-bs-scroll="true" class="nav nav-pills flex-column" id="v-pills-tab" role="tablist"
aria-orientation="vertical">
<button class="nav-link active text-nowrap" id="home-tab" data-bs-toggle="pill" data-bs-target="#home"
type="button" role="tab" aria-controls="home" aria-selected="true">About Me</button>
<button class="nav-link" id="projects-tab" data-bs-toggle="pill" data-bs-target="#projects"
type="button" role="tab" aria-controls="profile" aria-selected="false">Projects</button>
<button class="nav-link" id="certifications-tab" data-bs-toggle="pill" data-bs-target="#certifications"
type="button" role="tab" aria-controls="certifications"
aria-selected="false">Certifications</button>
</div>
<!-- Content -->
<div class="tab-content" id="v-pills-tabContent">
<div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab"
tabindex="0">
<div class="mypic-wrapper">
<img class="mypic" src="profile_pic.jpg" alt="Picture of Aditi Diwan"
class="d-inline-block align-text-top">
</div>
<p class="lead">Introduction</p>
<p>Hi I'm Aditi! I recently completed an Accelerated B.S./MEng Computer Science program at Virginia
Tech. During my undergraduate degree, I majored in Data-Centric Computing and minored in
Human-Computer Interaction (HCI). During my graduate degree, my focus became Software
Development & Applications.
I started out with little to no coding experience.
However, during the first summer of the pandemic, I began self-teaching web development. I built
a few
projects using <span class="badge bg-secondary">HTML</span>,
<span class="badge bg-secondary">CSS</span>, <span class="badge bg-secondary">Javascript</span>
and eventually moved on to using libraries like <span class="badge bg-secondary">React</span>.
Most recently, I learned
to code a full-stack application using the <span class="badge bg-secondary">VueJS</span>
framework in the frontend and <span class="badge bg-secondary">MySQL</span> in the backend (for
more info, checkout the
Projects section!). I soon expanded to the cloud and got certified as an <span
class="badge bg-secondary">AWS</span> Solutions Architect - Associate. I'm also interested
in <span class="badge bg-secondary">Machine Learning</span> and <span
class="badge bg-secondary">Data Analytics</span>, and would like to get more hands-on
experience in industry.
</p>
<p class="lead">Fun Facts</p>
<ul>
<li>I'm multilingual. I speak Hindi, English, and have limited working proficiency in Spanish.
</li>
<li>I've lived on 3 different continents.</li>
<li>I'm a dancer. I was a member of Bhangra at Virginia Tech (2021 - 2022), and currently
regularly attend hip hop dance workshops. </li>
<li>I do origami. I've dabbled in most modular origami (kusudamas are my favorite), tesselations
(Eric Gjerde!), and roses (Kawasaki Rose is the most elegant, in my opinion)</li>
</ul>
</div>
<div class="tab-pane fade" id="projects" role="tabpanel" aria-labelledby="projects-tab" tabindex="0">
<!-- TODO -->
<!-- <div>featured projects with pagination go here</div> -->
<div class="container text-center">
<div class="row">
<div class="col-12 col-md-6 col-sm-12 col-lg-3 pb-4">
<div class="card h-100">
<img src="/images/fert.png" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Fert</h5>
<span class="badge bg-secondary">Material UI</span>
<span class="badge bg-secondary">ReactJS</span>
<span class="badge bg-secondary">Figma</span>
<span class="badge bg-secondary">HTML5</span>
<span class="badge bg-secondary">CSS3</span>
<span class="badge bg-secondary">FrostLine API</span>
<p class="card-text">This app helps users to start planting edible plants by
recommending plants based on the user’s location, budget and
climate conditions. The FrostLine API allows us to input user's zip-code and
output their temperate zone as well as recommended temperature range.
For further information on functionalities, check out the README on Github!
</p>
</div>
<div class="card-footer text-muted text-end p-1">
<div class="btn-group" role="group" aria-label="Basic example">
<a target="_blank" href="https://github.com/aditi977/Fert" class="btn"><i
class="bi bi-github"></i></a>
<a class="btn" href="https://aditi977.github.io/Fert/" target="_blank"><i
class="bi bi-box-arrow-up-right"></i></a>
</div>
</div>
</div>
</div>
<div class="col-12 col-md-6 col-sm-12 col-lg-3 pb-4">
<div class="card h-100">
<img src="/images/bookit_bookstore.png" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">BookIt Bookstore</h5>
<span class="badge bg-secondary">VueJS</span>
<span class="badge bg-secondary">Vuelidate</span>
<span class="badge bg-secondary">Pinia</span>
<span class="badge bg-secondary">MySQL</span>
<p class="card-text">This was developed as part of my CS5244 Web Application
Development class. All of the frontend design was done by me as per the
classes requirements. It has cart, checkout, and order confirmation
functionality. </p>
</div>
<div class="card-footer text-muted text-end p-1">
<a class="btn disabled" style="border:none;">Private repository</a>
</div>
</div>
</div>
<div class="col-12 col-md-6 col-sm-12 col-lg-3 pb-4">
<div class="card h-100">
<img src="/images/book_of_creativitea.png" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Book of Creativitea</h5>
<span class="badge bg-secondary">HTML</span>
<span class="badge bg-secondary">CSS</span>
<span class="badge bg-secondary">turn.js</span>
<span class="badge bg-secondary">jQuery</span>
<p class="card-text">This is the first anthology for CreativiTea, a creative
writing
club at
Virginia Tech. I created this digitally to make it accessible to others
during
the pandemic.
Using turn.js, I was able to animate the book to flip like pages in a real
book!
The only
issue I encountered was making the book responsive. </p>
</div>
<div class="card-footer text-end p-1">
<a target="_blank" href="https://creativiteaant.github.io/ctvt-anthology/"
class="btn"> <i class="bi bi-box-arrow-up-right"></i></a>
</div>
</div>
</div>
<div class="col-12 col-md-6 col-sm-12 col-lg-3 pb-4">
<div class="card h-100">
<img src="/images/batch16.png" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Image-to-Image Translation with GANs</h5>
<span class="badge bg-secondary">GANs</span>
<span class="badge bg-secondary">Machine Learning</span>
<span class="badge bg-secondary">pix2pix</span>
<p class="card-text">I worked with the pytorch implementation of the pix2pix GAN
to
add color onto grayscale images. This was part of a Data-Centric Computing
capstone project.</p>
</div>
<div class="card-footer text-end p-1">
<div class="btn-group" role="group" aria-label="Basic example">
<a target="_blank"
href="https://github.com/andrewaf1/cs4664-neural-style-transfer"
class="btn"><i class="bi bi-github"></i></a>
<a class="btn"
href="https://andrewfarabow.com/cs4664-neural-style-transfer/"
target="_blank"><i class="bi bi-box-arrow-up-right"></i></a>
</div>
</div>
</div>
</div>
<div class="col-12 col-md-6 col-sm-12 col-lg-3 pb-4">
<div class="card h-100">
<img src="/images/calcheck.png" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Calcheck</h5>
<span class="badge bg-secondary">HTML</span>
<span class="badge bg-secondary">CSS</span>
<span class="badge bg-secondary">jQuery</span>
<span class="badge bg-secondary">MongoDB</span>
<span class="badge bg-secondary">ExpressJS</span>
<span class="badge bg-secondary">EJS</span>
<span class="badge bg-secondary">nutritionixAPI</span>
<p class="card-text">A calorie tracking website.</p>
</div>
<div class="card-footer text-end p-1 text-muted">
<a target="_blank" href="https://github.com/aditi977/CalCheck-2.0"
class="btn"><i class="bi bi-github"></i></a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pan fade" id="certifications" role="tabpanel" aria-labelledby="certifications-tab"
tabindex="0">
<!-- <div data-iframe-width="150" data-iframe-height="270"
data-share-badge-id="761b9c2a-a324-48e0-997a-3337d8dde40b"
data-share-badge-host="https://www.credly.com"></div>
<script type="text/javascript" async src="//cdn.credly.com/assets/utilities/embed.js"></script>
<div data-iframe-width="150" data-iframe-height="270"
data-share-badge-id="f4c2a3f9-89d7-444f-8c35-645039d25b8a"
data-share-badge-host="https://www.credly.com"></div>
<script type="text/javascript" async src="//cdn.credly.com/assets/utilities/embed.js"></script> -->
<div class="d-flex flex-row gap-4">
<div class="card text-center" style="width: 12rem;">
<img src="/src/assets/images/badges/aws-sol-arch.png" class="card-img p-4"
alt="sol architect certification">
<div class="card-footer">
<a href="https://www.credly.com/badges/761b9c2a-a324-48e0-997a-3337d8dde40b/public_url"
class="btn btn-small border">See certification</a>
</div>
</div>
<div class="card text-center" style="width: 12rem;">
<img src="/src/assets/images/badges/cka.png" class="card-img p-4"
alt="sol architect certification">
<div class="card-footer">
<a href="https://www.credly.com/badges/f4c2a3f9-89d7-444f-8c35-645039d25b8a/public_url"
class="btn btn-small border">See certification</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN"
crossorigin="anonymous"></script>
<!-- Popper for dropdowns, popovers, or tooltips, remove if not needed! -->
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"
integrity="sha384-oBqDVmMz9ATKxIep9tiCxS/Z9fNfEXiDAYTujMAeBAsjFuCZSmKbSSUnQlmh/jp3"
crossorigin="anonymous"></script>
</body>
</html>