Figuring out how you want to set up your website is hard. Over the years, I’ve tinkered with just about everything — from SaaS solutions like Squarespace, Wordpress and Cargo to web frameworks like React and Gatsby to plain old HTML/CSS/JS, I’ve tried it all. Depending on the project, each has its merits.
There are 5 components to the site:
. ├── .github │ └── workflows │ └── [workflow.yml](<https://github.com/atemp-studio/www/blob/main/.github/workflows/workflow.yml>) (Builds site and deploys to s3 bucket) ├── src │ ├── fonts │ │ └── All the font files I'm using │ ├── icons │ │ ├── favicon.ico │ │ ├── Windows 98 title bar icons (minimize, maximize, close) │ │ └── Emoji images to use for mobile dropdown │ ├── images │ │ └── Store promo image, as shown in Windows-98-esque window │ ├── scss │ │ ├── [_helpers.scss](<https://github.com/atemp-studio/www/blob/main/src/scss/_helpers.scss>) (Mixin for creating @font-face rules) │ │ ├── [_windows98.scss](<https://github.com/atemp-studio/www/blob/main/src/scss/_windows98.scss>) (Styling for Windows-98-esque window) │ │ └── [main.scss](<https://github.com/atemp-studio/www/blob/main/src/scss/main.scss>) (Where most of the styling takes place) │ ├── ts │ │ └── [main.ts](<https://github.com/atemp-studio/www/blob/main/src/ts/main.ts>) (Mainly handles draggable window functionality) │ ├── types │ │ └── [main.d.ts](<https://github.com/atemp-studio/www/blob/main/src/types/main.d.ts>) (Create window type so transpilation works) │ └── [index.html](<https://github.com/atemp-studio/www/blob/main/src/index.html>) (Plain and simple) ├── .gitignore ├── [LICENSE](<https://github.com/atemp-studio/www/blob/main/LICENSE>) (Source code licensed under Apache 2.0) ├── package-lock.json ├── [package.json](<https://github.com/atemp-studio/www/blob/main/package.json>) (Manage project) ├── README.md ├── tsconfig.json └── [webpack.config.js](<https://github.com/atemp-studio/www/blob/main/webpack.config.js>) (Instructions for building the project)
All the code that matters lives in the
Once built, the site is deployed to an S3 bucket. Unlike GitHub, Cloudflare and Notion, S3 isn’t free, but it’s pretty damn cheap. At the time of writing, S3 storage is just $0.023/GB/month. With the site currently measuring just 652.2 kB, our monthly bill is $0.000015. The nice people at AWS round this down to $0.