image

How I Built My Website

I built this website to share things I've learned and find interesting. I chose to code the site myself to have more control over its look and feel than would be afforded by a third party platform. There are many good tools for publishing on the internet, like blog hosting tools WordPress or Ghost, or the newsletter platform Substack. But I decided coding the site myself was the best option for me.

Importantly, I knew very little at the outset about the tools I used to build the site. I'm constantly amazed at how much documentation and how many tutorials are available for free on the internet to help developers of all skill levels complete projects.

Worth It!

Building this site was definitely a challenge. Learning to code involves a lot of stops and starts. Rewinding and playing back tutorials over and over, searching for solutions online, and figuring out that a misspelled word deep in the code is the reason things aren't working - these are just some of the challenges that I encountered. Overall, though, I'm glad I did it. It's very satisfying to have a finished product that's a part of the internet.

If you'd like to hear more about the process of building my site or want more recommendations on how to create your own, message me on LinkedIn or Twitter.

Tools

After some research, I settled on React as the front-end tool I would use. React is a widely used JavaScript library that was introduced by Facebook in 2013 and subsequently made available as an open source project. Software libraries are repositories of pre-written code that developers can use to build programs without having to write every line themselves.

While learning React, I became aware of NextJS, which is a React framework. A framework adds functionality to the program on which it's built and enforces best practices that enhance the developer and user experiences. NextJS has many useful tools, but the most significant is that it speeds up the rendering of web pages to the user and reduces the amount of local computing power required to use a website. Within NextJS, I use Redux to manage state.

To make my site accessible on the internet, I chose Amazon Web Services to provide the servers on which I would host my code. AWS is the world's largest provider of cloud computing services and provides many building blocks and tools to provision and manage its digital infrastructure offerings.

I selected AWS Amplify as the toolkit, as it is easy to set up and provides an intuitive user interface within the AWS web console. Amplify allowed me to provision all the services I needed to launch my website through a single service, rather than having to provision and manage them individually to publish my site.

I use GitLab as the cloud repository ("repo") for my code. It allows me to work on the code on my local machine and "push" the changes to GitLab, which organizes the code so I can see what the most recent version is, look back at past versions and changes, and collaborate with others easily. Another benefit is that when I push code changes to my repo, it automatically updates AWS and the site you see here is immediately updated for the changes. This concept is called "continuous integration / continuous deployment" (CI/CD).

Support

React, NextJS, and AWS have great content on their sites, and there are people like Ali Spittel that offer great content too. I took a few self-paced courses on Udemy for which there was a cost and found them useful. But there's more than enough free content to learn.

I also relied on StackOverflow, a Q&A site where users can browse previously-asked questions or pose their own. I received several very helpful responses to questions from contributors on the site.

Jump Start

Enter a few lines of basic code in an online code editor like W3 Schools.

If you decide to take on the challenge of building a site, whether it's with these tools or others, good luck, and drop me a note so I can check it out!