Welcome 1
This is the GitHub repository for my personal webpage. It started off as just a static GitHub pages deployment with a little bit of HTML and CSS, but is now a Next.js app. The development of this website is essentially my excuse to spend time learning about the latest in web development.
Deployment 2
The application is fully Docker-ized with an nginx reverse proxy in front of it, secured with Let's Encrypt. These (the Next.js app, reverse proxy, and nginx-letsencrypt) containers are orchestrated together with Docker Compose.
I use Cloudflare as a DNS provider and domain name registry, and I also use their proxy service for DDoS protection.
The entire web application is hosted on a Amazon EC2 t4g.nano instance running Debian, which costs around $2 CAD a month.
Changelog 3
| Date Modified | Description |
|---|---|
| Jun 6 2024 | Created this repository. Hello World! |
| Jun 8 2024 | Updated index.html |
| Sep 15 2024 | Updated index.html, CSS overhaul, general improvements |
| Sep 21 2024 | Updated index.html, CSS adjustments, added boilerplates |
| Oct 3 2024 | Added contact info and home page |
| Dec 21 2024 | Ported application to Next.js |
| Tomorrow | Who knows? |
Technologies Used 4
These are some of the more important technologies I used to make/deploy the website.
| Technologies | Usage |
|---|---|
| pnpm | Package manager |
| Next.js w/ TypeScript | React-based full-stack framework which the website is built in |
| Tailwind CSS | CSS framework/preprocessor |
| shadcn/ui | React UI library based on Radix UI |
| Cloudflare | DNS provider and domain registry; proxy for DDOS protection |
| Amazon EC2 | Amazon's elastic cloud compute to host web server |
| Docker | Containerization platform |
| Docker Compose | Multicontainer support |
| nginx-proxy | Docker container to automate nginx reverse proxy |
| acme-companion | Docker container to automate creation/renewal of Let's Encrypt certificates |
| Let's Encrypt | Certificate authority for TLS certificates |
| favicon.io | Generate favicons |
Resources I Used 5
Outside of the documentation for the things listed above, I found these resources helpful:
| Resource | Description |
|---|---|
| MDN Web Docs | The best. |
| Stack Overflow | Good for any questions I had. |