-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathblog.html
More file actions
369 lines (344 loc) · 21.3 KB
/
blog.html
File metadata and controls
369 lines (344 loc) · 21.3 KB
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
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Blog | Travis Southard</title>
<meta property="og:title" content="Blog | Travis Southard">
<meta property="og:description"
content="Travis Southard's most recent blog posts'.">
<meta property="og:image" content="https://travissouthard.com/assets/images/blog/travis-flowers.jpg">
<meta property="og:image:secure_url" content="https://travissouthard.com/assets/images/blog/travis-flowers.jpg">
<meta property="og:image:type" content="image/jpeg">
<meta property="og:image:width" content="600">
<meta property="og:image:height" content="450">
<meta property="og:image:alt" content="Travis holding a bouquet of flowers in a field of flowers!">
<meta name="author" content="Travis Southard">
<meta name="robots" content="noai, noimageai">
<link href="https://jawns.club/@travissouthard" rel="me">
<link href="https://codeforphilly.org/people/travissouthard" rel="me">
<link href="https://github.com/travissouthard" rel="me">
<link rel="webmention" href="https://webmention.io/travissouthard.com/webmention">
<link rel="authorization_endpoint" href="https://indieauth.com/auth">
<link rel="token_endpoint" href="https://tokens.indieauth.com/token">
<link rel="microsub" href="https://aperture.p3k.io/microsub/995">
<link rel="stylesheet" href="style.css">
<link rel="apple-touch-icon" sizes="180x180" href="./assets/favicon_io/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="./assets/favicon_io/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="./assets/favicon_io/favicon-16x16.png">
<link rel="manifest" href="./assets/favicon_io/site.webmanifest">
</head>
<body>
<header>
<h1>Travis Southard</h1>
<p>Philadelphian Software Engineer</p>
</header>
<nav><ul>
<li>
<a href="index.html">Home</a
></li>
<li>
<a href="projects.html">Projects</a
></li>
<li>
<a href="art.html">Art</a
></li>
<li>
<a href="blog.html">Blog</a
></li>
<li>
<a href="about.html">About</a
></li></ul></nav>
<main>
<h2>Blog</h2>
<div class="list-view"><article class="project-card">
<h3>The Rhythm of the Work</h3>
<a href="blog/the-rhythm-of-the-work.html">
<img src="./assets/images/profile2025.png" alt="Me smiling in a green sweater in front of a green block wall">
</a>
<p>
I started a new role at CLS
at the beginning of the year. My previous supervisor, Nate, moved on to work at a new workplace, and now
I am the sole developer at CLS. In fact, I am... <a href="blog/the-rhythm-of-the-work.html">Read more</a></p>
</article>
<article class="project-card">
<h3>It's okay to let things end</h3>
<a href="blog/it's-okay-to-let-things-end.html">
<img src="./assets/images/art/headshot-32.png" alt="">
</a>
<p>
Last week, I was listening to Spotify for the last time. Already I was planning a breakup and starting
to collect more physical and digital albums, but this particular session was genuinely the ... <a href="blog/it's-okay-to-let-things-end.html">Read more</a></p>
</article>
<article class="project-card">
<h3>Building the web I want to see</h3>
<a href="blog/building-the-web-i-want-to-see.html">
<img src="./assets/images/blog/webring.png" alt="A brick-like pattern of white rectangles with blue outlines, blue names like Ruby Gertz, Clotheshorse, and many other names of people and projects, plus each rectangle has blue labels with the topics each person/project covers">
</a>
<p>
I have made a webring! This feels important to me as I try (along with many others) to build a better
web. This was a project I have been meaning to take on for some time. I did start with a basic set of
... <a href="blog/building-the-web-i-want-to-see.html">Read more</a></p>
</article>
<article class="project-card">
<h3>Your project is worth it</h3>
<a href="blog/your-project-is-worth-it.html">
<img src="./assets/images/blog/grinduro-2024.png" alt="A dithered photo of Travis riding a mountain bike in the woods">
</a>
<p>
After reading a blog post from Andrew Dana Hudson about thermochauvinism, I have begun referring to July as "Hot
Winter," a time of year when I spend most of my time indoors because ... <a href="blog/your-project-is-worth-it.html">Read more</a></p>
</article>
<article class="project-card">
<h3>We cannot afford to skip repairs</h3>
<a href="blog/we-cannot-afford-to-skip-repairs.html">
<img src="./assets/images/blog/june-flowers.png" alt="A dithered image of a flowering sage plant in my backyard">
</a>
<p>
Maintenance and repair are essential to a more sustainable, and frankly pleasant world. Well-maintained
bikes feel, sound, and ride better. Well-maintained roads are easier and safer for everyon... <a href="blog/we-cannot-afford-to-skip-repairs.html">Read more</a></p>
</article>
<article class="project-card">
<h3>My Kingdom for a Paper Map</h3>
<a href="blog/my-kingdom-for-a-paper-map.html">
<img src="./assets/images/blog/initiation-well.png" alt="A dithered view from the bottom of the Initiation Well at Quinta de Regaleira in Portugal. The well is a large stone sprial staircase with ornate arches twisting up to the sunlight. Strongly recommend visiting if you can.">
</a>
<p>
Recently returned from a ten day vacation in Lisbon, Portugal to celebrate my mother-in-law's birthday. This
is the longest trip I've taken since Ruby and I spent three weeks in Ireland for our ... <a href="blog/my-kingdom-for-a-paper-map.html">Read more</a></p>
</article>
<article class="project-card">
<h3>My interest in Solarpunk</h3>
<a href="blog/my-interest-in-solarpunk.html">
<img src="./assets/images/blog/lisbon-view.png" alt="A dithered view of Lisbon showing its castle, hills, and many homes and buildings in pastel colors with orange tile roofs">
</a>
<p>
Over the past few years, I have been taking in a lot of Solarpunk influences.
Solarpunk is a movement/genre/aesthetic/practice based around ultra-sustainability, averting climate climate
... <a href="blog/my-interest-in-solarpunk.html">Read more</a></p>
</article>
<article class="project-card">
<h3>Sketches of the Real</h3>
<a href="blog/sketches-of-the-real.html">
<img src="./assets/images/blog/may-11-sketch.png" alt="A dithered image of a spiral-bound sketchbook with a pen sketch of a Victorian house with a hoophouse in front of it and a tree branch ot the right">
</a>
<p>
I have been sketching lately. Mostly sitting in a place and drawing a building or plant within view. Some of
these sketches are better than others, but these sketches are mental exercise more th... <a href="blog/sketches-of-the-real.html">Read more</a></p>
</article>
<article class="project-card">
<h3>I am the hand, not the tool</h3>
<a href="blog/i-am-the-hand-not-the-tool.html">
<img src="./assets/images/blog/clock-tower.jpg" alt="A dithered image of a clock tower atop a storage warehouse looming over a tree-filled neighborhood">
</a>
<p>
Despite a very full schedule leading up to the Social Justice Hackathon, I have been really enjoying springtime this year. Some warm
days where we were lucky enough to be able to clear out a lot... <a href="blog/i-am-the-hand-not-the-tool.html">Read more</a></p>
</article>
<article class="project-card">
<h3>Finding my best duck-ness</h3>
<a href="blog/finding-my-best-duck-ness.html">
<img src="./assets/images/blog/rittenhousetown.jpg" alt="A dithered image of my mountain bike on a small bridge in front of an old homestead">
</a>
<p>
Coming through feeling sick and just in time for day light savings, which snuck up on me this year. Usually I am
watching for it like a hawk, but this winter I was very focused on trying to enjo... <a href="blog/finding-my-best-duck-ness.html">Read more</a></p>
</article>
<article class="project-card">
<h3>After vacation; before spring</h3>
<a href="blog/after-vacation-before-spring.html">
<img src="./assets/images/blog/assilah-walking.jpg" alt="A dithered photo of people walking down a street of the medina in Assilah, Morocco">
</a>
<p>
Excited to see that the sunlight is just starting to stick around after 6pm lately. A few hours of extra
sunlight really makes a difference to my mood. Weirdly enough the snow in Philadelphia th... <a href="blog/after-vacation-before-spring.html">Read more</a></p>
</article>
<article class="project-card">
<h3>Back in the saddle</h3>
<a href="blog/back-in-the-saddle.html">
<img src="./assets/images/blog/trail_01.jpg" alt="A dithered photo of a wooded trail going off into the trees">
</a>
<p>
After a few weeks working at my new job and settling into new habits, there's a part of me that feels like I'm
waking up from something. I really did not enjoy my last job. While I knew it was t... <a href="blog/back-in-the-saddle.html">Read more</a></p>
</article>
<article class="project-card">
<h3>New year. New job. New habits.</h3>
<a href="blog/new-year-new-job-new-habits.html">
<img src="./assets/images/blog/snowyard.jpg" alt="A dithered photo of our backyard lightly coated in snow, a rarity now in Philly. A mostly brown landscape features some orange pots, a blue umbrella, and white snow.">
</a>
<p>
New year. I am newly 35 years old and just came through a tough but still good year. Many
years have been tough for me, but in the grand scheme of tough years, 2023 was pretty easy on me. This y... <a href="blog/new-year-new-job-new-habits.html">Read more</a></p>
</article>
<article class="project-card">
<h3>A personal financial project</h3>
<a href="blog/a-personal-financial-project.html">
<img src="./assets/images/projects/debt-snowball.png" alt="A screenshot of the debt snowball chart showing the paydown of the debts compared to the traditional payment plan">
</a>
<p>
Earlier this year I built a project
that came from a personal need. I have three student loans from my time at University of the Arts, my time at
Temple University, and my coding... <a href="blog/a-personal-financial-project.html">Read more</a></p>
</article>
<article class="project-card">
<h3>Season of Change</h3>
<a href="blog/season-of-change.html">
<img src="./assets/images/blog/wiss-fall.jpg" alt="The Wissahickon Creek flowing from around the corner through orange leaved tees that have dropped about 20% of their leaves">
</a>
<p>
Autumn is in full show here in Philadelphia, at least up in the Northwest of Philly where I now live. The colors
are a great time to reflect on the passage of time. It being the weekend daylight... <a href="blog/season-of-change.html">Read more</a></p>
</article>
<article class="project-card">
<h3>Smaller code and bigger plans</h3>
<a href="blog/smaller-code-and-bigger-plans.html">
<img src="./assets/images/blog/ruby-beach.jpg" alt="Ruby standing on an autumn beach on her birthday weekend">
</a>
<p>
Over the past few weeks I have released a tutorial to make the classic video game, Minesweeper, from scratch
using native web tools (being HTML, CSS, and Javascript). (Check out parts 1, 2, & 3!... <a href="blog/smaller-code-and-bigger-plans.html">Read more</a></p>
</article>
<article class="project-card">
<h3>How to make Minesweeper part 3</h3>
<a href="blog/how-to-make-minesweeper-part-3.html">
<img src="./assets/images/blog/minesweeper19.jpg" alt="Our fully done Minesweeper game with styling to make it look like cut stone.">
</a>
<p>
How to make Minesweeper part 3
This is the final part of this 3-part series! I recommend starting with part 1 and also working through part 2 before moving on
to this one. If you have already worked through parts 1 ... <a href="blog/how-to-make-minesweeper-part-3.html">Read more</a></p>
</article>
<article class="project-card">
<h3>How to make Minesweeper part 2</h3>
<a href="blog/how-to-make-minesweeper-part-2.html">
<img src="./assets/images/blog/minesweeper12.jpg" alt="Our partially done Minesweeper game with blank squares, some pink ones, and an array of buttons reading 'reset', 'easy', 'medium', and 'hard'">
</a>
<p>
How to make Minesweeper part 2
This is part 2 of 3 and I recommend starting with part 1 before moving on
to this part. If you have already worked through part 1, welcome back! In the previous part, we built a board ... <a href="blog/how-to-make-minesweeper-part-2.html">Read more</a></p>
</article>
<article class="project-card">
<h3>How to make Minesweeper part 1</h3>
<a href="blog/how-to-make-minesweeper-part-1.html">
<img src="./assets/images/blog/minesweeper06.jpg" alt="Our partially done Minesweeper game with randomly placed bombs and safe squares">
</a>
<p>
Overview
Let’s make minesweeper with just native web tools! Using only native web components we can build this classic video game using some loops, array methods, and recursion. Specifically we'll be using HTML5, CSS3 with Flexbox, and... <a href="blog/how-to-make-minesweeper-part-1.html">Read more</a></p>
</article>
<article class="project-card">
<h3>September Updates and October Upcoming</h3>
<a href="blog/september-updates-and-october-upcoming.html">
<img src="./assets/images/blog/sunset-graveyard.jpg" alt="Sunset over a local church and graveyard">
</a>
<p>
I have some updates from the past week and a content schedule for the next month!
Firstly I am honored that last Monday I was named one of Technical.ly's RealLIST
... <a href="blog/september-updates-and-october-upcoming.html">Read more</a></p>
</article>
<article class="project-card">
<h3>Web development streams coming soon!</h3>
<a href="blog/web-development-streams-coming-soon.html">
<img src="./assets/images/blog/travis-flowers.jpg" alt="Travis holding a bouquet of flowers in a field of flowers!">
</a>
<p>
I have been working on personal projects in my spare time for a few weeks: stepping into a leadership role at Code for
Philly, writing tutorials for upcoming streaming I'll be doing, and wor... <a href="blog/web-development-streams-coming-soon.html">Read more</a></p>
</article>
<article class="project-card">
<h3>Cautiously considering creating content</h3>
<a href="blog/cautiously-considering-creating-content.html">
<img src="./assets/images/blog/cityview.jpg" alt="Gray buildings amongst green trees under a blue sky. A dithered pixel-art of a view of Fairmount, The Art Museum, the Schuylkill River, and the ridges beyond.">
</a>
<p>
I have been arguing with myself for a while now about getting back into content creation for the
past few years. I have started and abandoned moved on from so many projects over the years. None of them necessarily "g... <a href="blog/cautiously-considering-creating-content.html">Read more</a></p>
</article>
<article class="project-card">
<h3>Now with permalinks!</h3>
<a href="blog/now-with-permalinks.html">
<img src="./assets/images/blog/permalink.png" alt="A recursive screenshot of this blog post in tinier and tinier images as they recursively recede into themselves.">
</a>
<p>
I have been trying to keep this portfolio and its parts pretty simple
and lightweight. Part of this is wanting to
use free services as much as possible, but part of it is to keep my vanilla Javascript skills up to snu... <a href="blog/now-with-permalinks.html">Read more</a></p>
</article>
<article class="project-card">
<h3>I need a better routine</h3>
<a href="blog/i-need-a-better-routine.html">
<img src="./assets/images/blog/raystown-camp.jpg" alt="A dithered photo of our campsite from our recent vacation to Raystown Lake PA. Featureing our camp chairs in front of our campfire pizza, our borrowed tent and our two hammocks near the lake.">
</a>
<p>
I am still very much on the job
search. I am actively seeking a full-time (though ideally 32-hours-a-week) software engineering position
in civic technology with geospatial work. I have had some great conversation... <a href="blog/i-need-a-better-routine.html">Read more</a></p>
</article>
<article class="project-card">
<h3>Solved a tricky (for me) docker-compose error!</h3>
<a href="blog/solved-a-tricky-for-me-docker-compose-error.html">
<img src="./assets/images/art/headshot-32.png" alt="">
</a>
<p>
I am currently volunteering on a project as part of Code for
Philly's Launchpad 2023. I am working with a small team of developers and UXers to develop a project
that will seek to connect Philadelphians to comfort... <a href="blog/solved-a-tricky-for-me-docker-compose-error.html">Read more</a></p>
</article>
<article class="project-card">
<h3>Why is some documentation better than others?</h3>
<a href="blog/why-is-some-documentation-better-than-others.html">
<img src="./assets/images/blog/azavea-blog-1.webp" alt="Outline of a person holding a pen with screenshots of documentation text including 'README.md', 'Start Huddle in #CivicApps', 'Conversation (23)', 'Requirements', 'doc/arch','user merged 5 commits into develop', and the github logo">
</a>
<p>
Note: This was originally published on the Azavea blog, but I wanted to put this here in case that blog
disappeared.
And how to
make sure your documentation is the best of the best
Documentatio... <a href="blog/why-is-some-documentation-better-than-others.html">Read more</a></p>
</article>
</div>
</main>
<script src="app.js"></script>
<footer>
<ul>
<li>
<a href="index.html">Home</a
></li>
<li>
<a href="projects.html">Projects</a
></li>
<li>
<a href="art.html">Art</a
></li>
<li>
<a href="blog.html">Blog</a
></li>
<li>
<a href="about.html">About</a
></li>
<li>
<a href="webring.html">Webring</a
></li>
<li>
<a href="rss.xml" rel="alternate" type="application/rss+xml">RSS Feed</a
></li>
<li>
<a href="https://github.com/travissouthard">GitHub</a
></li>
<li>
<a href="resume.html">Resumé</a
></li></ul>
<div class="h-card">
<div>
<a class="u-url" rel="me" href="https://travissouthard.com">
<p class="p-name">Travis Southard</p>
</a>
<p><span class="p-locality">Philadelphia</span>, <span class="p-region">PA</span></p>
</div>
<img class="u-photo" src="./assets/images/profile.png" alt="A stylized white on blue photo of Travis' face made of squares of various size.">
</div>
</footer>
</body>
</html>