Date: 5/22/2022

Website Build

The origin of the idea for a personal website mostly started in college when I was thinking about ways to separate myself from my peers graduating from a broad but not-super-broadly valuable major. Some people had websites, some people loaded up their LinkedIns, but not very many people had built their own websites from scratch.

I obviously didn’t complete the first version of the project back then since this website just went live last week (May 2022; almost exactly 3 years post-grad), but the interest in that project never fully left.

Now the purpose isn’t as much for differentiating myself from others who I compete with for jobs, but to grow my technical knowledge as somebody working in software. The skill of writing front end web code isn’t valuable to me in itself (I don’t currently want to be a front-end dev), but the understanding of how it is hosted and the data gets served to those visiting the page is relevant to software development, and my current professional role specifically.

Initial Versions

In 2019, one of my coworkers (Garrett York) put on a continued education session for those who wanted to join from the company and we talked about hosting websites using Apache on our laptops. That session revived the motivation for creating a personal website and I figured a good project for working through these education sessions would be to build my website.

I ended up working for a while on the page design but then lost most of interest. Here’s what the page first looked like:

Without much interesting personal content, I got discouraged about the home page and building actual substance into it. It also looked too much like MySpace (first heard that from one of my coworkers haha, that actually deflated my excitement about it quite a bit). I become further demotivated when the most simple part of the website (or so I thought) of putting my resume in a simple format turned out to be a much bigger struggle than I thought.

Fast-forward, now I have:

• More content that could be added to the site
• More understanding of web infrastructure
• A lead on a platform and process for hosting websites (based on understanding of the product I’m managing)

As a result of the points above in addition to a COVID scare which kept me locked inside a room for a few days AND a colleague (Joe “Yabin” Marsh) showing me a site he build and hosted on his own machine, I figured I’d take another go at it.

Current Version

Website contents:

• Home page with blog, social media, and project previews
• Blog page with links and previews of personal blog content
• Project page with links and previews of personal project summaries
• Background page (currently empty) that will be a future home of an informal CV

Website configuration:

• Node.js Express 4.X server
• Hosted on Heroku as a Free app
• URL: kylelindley.com purchased through google domains
• HTML/CSS/JS built from scratch through reading online documentation and some help from friends
• All data and assets are static, so the server contains no database connections

Here’s what the home page now looks like (basically the same thing, but simpler):

General overview of the steps:

1. Created initial HTML and CSS for home page and skeletons for the other pages
2. Created new folder for all of the code
3. Created server.js, Profile, and package.json files following these steps
4. Created an assets folder in the parent folder containing all images
5. Renamed my home page HTML to index.html
6. Installed npm (node package manager), Node.js, Heroku CLI, and Git
7. Created git repository then added and committed the files above
8. Ran npm install on the command line to install the app locally
9. Ran Heroku local web to start up the app locally to test the site and make sure it’s working on https://localhost:5000
10. Once it was working, added and committed any changes to git
11. Created a Heroku account and a free app
12. Logged into Heroku through the command line using Heroku login
13. Created a git remote variable called kyles-website that directs to the Heroku git remote repo
14. Ran git push kyles-website master to push code to Heroku which automatically attempts to build the express app

A lot of this was made easier by background work I’d done for other work reasons like getting familiar with git on the command line, deploying already-built apps to Heroku, installing simple, local Node.js apps with very basic functionality, etc.

What's Next

I’m currently happy enough with the design and functionality of the site that I don’t want to sync too much more time into it in the next couple of months, but I’ll likely be making content updates to it going forward:

• All blogs I post will be on this site instead of medium.com where I’d posted them previously
• I’ll update my background/CV on the site eventually
• I’ll likely list this site on my socials just to shared with people who are looking into my profiles

The only other page I’d like to add is some sort of history page where I can put a timeline of my life (my life isn’t that interesting yet) such as the places I’ve lived and when, what I did there, my favorite things about them, my current relationship, family vacations, concerts, etc. Maybe I’ll even add a photo album page.

Thanks for reading and absolutely feel free to reach out to me at lindleyk@sbcglobal.net if you wanna talk shop about this website itself or anything on it!

Links to some of the resources that got me started:

• This is outdated, but a Medium blog that got me started
• Some extra info about Express servers, specifically regarding routers
• A blog about how to access images or static assets with a Node.js server