A couple of months ago, I help a friend set up a website for a business. Today, I had another talk with a friend about building a portfolio website and he asked me for a few resources. I couldn’t find a comprehensive one that outlines all the required steps so I’ll try my best.
What is a static website?
From ChatGPT:
Basically:
- Static - no server-side logic, cheaper
- Dynamic - with server-side logic, more expensive
What makes a (static) website
Setting up a static website is basically free these days, maybe a few dollars a year if you want a custom domain. There are many free website builders out there. However, we’re going DIY with no strings attached to any one provider. Any of these components can be swapped with many alternatives out there if you so choose.
You really only need two things: your content, which is a bunch of HTML, CSS, and JavaScript files, and a hosting provider, basically a computer that serves your content 24/7.
What we will use
I’m mostly going to outline my process because it’s free (aside from the domain) and that it’s going to teach you some skills on web development.
We will need:
- A Computer (Windows/Mac/Linux)
- GitHub account for hosting your website with GitHub Pages
- Some programming knowledge (very little, don’t worry)
- Patience with my sucky writing ðŸ˜
These would be nice to have:
- Custom domain name - if you don’t want your domain to appear as
your-github-username.github.io
- Cloudflare account - for email protection and easier DNS management
Since we are making a static website, most of the work will be done on your personal computer. The hosting provider will only be concerned with serving the final build output. For this, we would need to set up our development environment.
Stay tuned for part 2!