-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
280 lines (280 loc) · 10.6 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
272
273
274
275
276
277
278
279
280
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Tristan Balon</title>
<meta
name="description"
content="Tristan Balon: Software Developer & Tech Enthusiast. Portfolio showcasing expertise in web and game development, containerization, and more. Projects include Django enhancements, automation tools, and a Sonos controller. Based in Vancouver, Canada."
/>
<meta name="author" content="Tristan Balon" />
<link rel="icon" type="image/x-icon" href="/assets/images/icon.ico" />
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"
integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
/>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap"
rel="stylesheet"
/>
<link rel="stylesheet" href="/assets/styles/style.css" />
</head>
<body>
<header>
<nav>
<ul>
<div class="logo">
<img src="/assets/images/logo.png" alt="Logo" />
</div>
<li>
<a href="https://linkedin.com/in/tristan-balon">
<i class="fa-brands fa-linkedin"></i>
</a>
</li>
<li>
<a href="https://github.com/legendaryfire">
<i class="fa-brands fa-square-github"></i>
</a>
</li>
<li>
<a href="https://steamcommunity.com/id/LegendaryFire/">
<i class="fa-brands fa-square-steam"></i>
</a>
</li>
<li>
<a href="mailto:[email protected]">
<i class="fa-solid fa-square-envelope"></i>
</a>
</li>
</ul>
</nav>
</header>
<main>
<section class="banner">
<h1>Hi,<br />I'm Tristan.</h1>
</section>
<section class="content">
<div class="content-container">
<h2>Welcome to my portfolio.</h2>
<hr />
<p class="tab">
I am a 27-year-old software developer residing in Vancouver, British
Columbia, drawn by its stunning natural beauty and vibrant tech
scene. My passion and dedication to technology knows no bounds, as I
continuously find myself studying new programming languages and
paradigms. I kicked off my software journey by diving into the
realms of Python and progressed my way to JavaScript, Java, C#, C++
and beyond.
</p>
<div id="welcome" class="collapse">
<p class="tab">
Starting with the print statement, I've leveled up my skills to
use popular web frameworks like Express.js, React and Django. As
an avid gamer, my interest doesn't stop at web development. I
invest my spare time in learning Unreal Engine and have knowledge
in both blueprints and C++. Additionally, I am proficient in
Docker, using it to streamline my development process and deploy
applications efficiently.
</p>
</div>
<button class="btn-toggle" data-target="welcome">See More</button>
</div>
<div class="content-container">
<h2>A little more about me.</h2>
<hr />
<p class="tab">
Beyond my passion for technology, you'll often find me exploring the
outdoors either hiking, biking or snowboarding. As a devoted coffee
and tea enthusiast, you can also find me seeking out the trendiest
cafes in the area. My favorite cup of cup of caffeine is a cortado
with oat milk, closely followed by a white peach oolong tea. Always
open to recommendations, feel free to hit me with your best
shot-whether it's a latte, a mocha or something more adventurous.
</p>
<div id="about" class="collapse">
<p class="tab">
In addition to my professional pursits, I enjoy turning old
electronics into smart devices with the help of microcontrollers.
With an ESP32 and the HDMI-CEC protocol, I managed to turn an
outdated TV into a smart device controllable from my phone. I was
also able to build a smart fan using an IR blaster allowing me to
control the power state, speed and timer.
</p>
</div>
<button class="btn-toggle" data-target="about">See More</button>
</div>
</section>
<section class="content">
<h1>Projects</h1>
</section>
<section class="content">
<div class="content-container">
<h2>Django Responsive Tables</h2>
<hr />
<p class="project">
Easily implement responsive <i>django_tables2</i> tables with
full-text search and pagination functionality.
</p>
<ul class="minimum">
<li>
<span class="icon">🚀</span>
Customizable with templates to support Bootstrap and other
frameworks.
</li>
<li>
<span class="icon">💡</span>
Fully responsive tables for both full-text search and pagination.
</li>
<li>
<span class="icon">🛠️</span>
Supports implementation of custom filters, and can take any
QuerySet for sorting.
</li>
</ul>
<span class="project-footer">
<hr />
<a
class="project-link"
href="https://github.com/LegendaryFire/django-responsive-tables2"
>See on GitHub</a
>
</span>
</div>
<div class="content-container">
<h2>Edge Runlist Builder</h2>
<hr />
<p class="project">
Generate vehicle runlists for Edge Pipeline auctions and
automatically calculate currency conversions, breakeven costs,
profits and line prices.
</p>
<ul class="minimum">
<li>
<span class="icon">🔍</span>
Use presale auction data and find inventory using the point of
sales system REST API.
</li>
<li>
<span class="icon">📊</span>
Effortless integration with Microsoft Excel and Teams for easy
collaboration on shared documents.
</li>
<li>
<span class="icon">📝</span>
Complete column customization with result sorting and filtering
using regular expressions.
</li>
</ul>
<span class="project-footer">
<hr />
<a
class="project-link"
href="https://github.com/LegendaryFire/edge-runlist-builder"
>See on GitHub</a
>
</span>
</div>
<div class="content-container">
<h2>Kijiji Scraper</h2>
<hr />
<p class="project">
Never miss another deal and promptly receive notifications for new
listings sooner than everyone else.
</p>
<ul class="minimum">
<li>
<span class="icon">📨</span>
Receive notifiations on your mobile device with Pushover,
including the title, description, price and phone number.
</li>
<li>
<span class="icon">💲</span>
Get notifed when the seller lowers the price of an item, or when
they paid to have the ad bumped.
</li>
<li>
<span class="icon">🏷️</span>
Supports multiple searches, and filter by category, location,
private sellers and businesses.
</li>
</ul>
<span class="project-footer">
<hr />
<a
class="project-link"
href="https://github.com/LegendaryFire/kijiji-scraper"
>See on GitHub</a
>
</span>
</div>
<div class="content-container">
<h2>Sonos Controller</h2>
<hr />
<p class="project">
Control your Sonos multi-room audio system using the native media
keys on your keyboard, along with individual room control.
</p>
<ul class="minimum">
<li>
<span class="icon">🔊</span>
Seamless volume control with a combo key and the native media keys
on your keyboard.
</li>
<li>
<span class="icon">⌨️</span>
Using the combo key and arrow keys to move to and from each room.
</li>
<li>
<span class="icon">🔧</span>
Configuration file with independent zone selection and mappable
hotkeys.
</li>
</ul>
<span class="project-footer">
<hr />
<a
class="project-link"
href="https://github.com/LegendaryFire/sonos-controller"
>See on GitHub</a
>
</span>
</div>
</section>
</main>
<footer>
<nav>
<ul>
<li>
<a href="https://linkedin.com/in/tristan-balon">
<i class="fa-brands fa-linkedin"></i>
</a>
</li>
<li>
<a href="https://github.com/legendaryfire">
<i class="fa-brands fa-square-github"></i>
</a>
</li>
<li>
<a href="https://steamcommunity.com/id/LegendaryFire/">
<i class="fa-brands fa-square-steam"></i>
</a>
</li>
<li>
<a href="mailto:[email protected]">
<i class="fa-solid fa-square-envelope"></i>
</a>
</li>
<li class="copyright">© 2024 Tristan Balon</li>
</ul>
</nav>
</footer>
<script type="module" src="assets/scripts/firebase.js"></script>
<script type="module" src="assets/scripts/script.js"></script>
</body>
</html>