This Website

This is Version 3. I decided to start fresh after the bloated mess that was Version 2. I really wanted to be thorough with every change so I could better understand how everything fit together.

I did the coding myself, but still using Cursor's AI assistance along the way, but I didn't just follow the suggestions blindly. I took it step by step, starting with the basics to make sure everything worked smoothly. From there, I gradually added more complexity and tweaked some elements.

The code is much cleaner, the site is mobile optimised, and I have laid a good foundation I can build upon.

For version 2 of the site, I wanted to explore how AI could improve the experience. I still wanted to code and host the site myself (as opposed to using a builder), but I wanted to see to how good AI tools were when it came to coding. After researching a few I landed on Cursor, an AI-powered code editor—and I was blown away.

I watched a few tutorials, picked up some best practice tips, and jumped in. I imported the code for the first version of the site from VS Code (since I knew it worked) and started building from there.

One of my main goals was to change the layout and introduce a side navigation menu while keeping the overall design clean and simple (or basic and boring!).

I started slowly, but it didn't take long before I got carried away—and learned some valuable lessons in the process.

For example, when I ask AI for e.g. a marketing strategy draft, it's usually easy to spot which parts are useful and which are uninspired or just wrong. It took me a moment to realise that coding with AI works the same way. After an initial frenzy of blindly accepting suggestions without much scrutiny, I ended up with a bloated mess that didn't work on mobile. So, it was back to the drawing board, with new insights from my mistakes.

This process has been equal parts frustrating and rewarding, but it's taught me a lot about working smarter with AI and staying hands-on.

1. What

This site is inspired by Derek Sivers' tech independence project. It is a place for me to present my thinking, play around with web development, and showcase some things I've accomplished.

2. Register a Domain & Change DNS Nameservers

I started by transferring my domain to Porkbun and changed the DNS nameservers to point to the web server on Vultr.

3. Create an SSH Key

For better security, I generated an SSH Key with the terminal to use to access my server remotely.

4. Set Up the Server

I set up a server with the OpenBSD operating system and added secure block storage.

5. SSH into Root

I added my SSH key to the Root of my laptop so I can login remotely to my server using the SSH key instead of a password. This means it can only be accessed from my computer.

6. Using the Storage

I started using the encrypted storage by syncing files to the server from my computer.

7. Simple Website V0

Using a simple text editor and some basic HTML and CSS, I created a basic one-page website.

8. V1 Website

For a full V1, I used Visual Studio Code and the Bootstrap 5 framework (with lots of YouTube tutorials and a little ChatGPT) to build a (slightly) more sophisticated website.