How I Made This Site
This is a quick introduction to the technologies that I used to make and publish my first website (the site that you are currently reading this on).
This site is still a work in progress and I've been learning as I go.
It is far from perfect.
Getting Started
After a bit of research I decided to use:
Next.js is a React framework made by Vercel so they seemed like a natural fit.
I'd read online that Next.js's tutorial was excellent, so I started there.
Step 1 was to learn React (which I did by building Tic Tac Toe following the official React tutorial)
Step 2 was to follow the Next.js tutorial. This walked me though the basics of Next.js and resulted in me deploying the first version of this site (which is still visible here).
There were quite a few things that make the Next.js-Vercel developer experience really nice:
- You can run your site locally and see the results of changes as you make them
- Each pull request on GitHub creates a "Preview Deployment" for you to double check your site
- Next.js also supports defining API endpoints
Adding Galleries
I wanted this site to be a portfolio for my photography and art (with a small blog). This meant that I would need to host my images somewhere.
Again, after a bit of research, I chose GraphCMS, a content management system where you use GraphQL to represent your sites data.
Currently almost all of the content on this site is fetched from GraphCMS, which means that my partner was able to use her own content to deploy jessveeb.com.
Getting a Domain Name
I bought my domain name from Google Domains and then wired it up to my Vercel deployment with "custom resource records" in the DNS settings. Vercel then automatically provides and renews an SSL certificate.
What Next
The code for this site is on GitHub, where I'm using the "Issues" as a To-Do list.