Welcome to my site! This is the first blog post-launch that I'm writing.
Here is a brief synopsis of what it took to get here.
All the steps I took to host this damn website.
- Deciding on a static site platform: Vitepress
- Converted all my old octopress posts from my old blog for here
- Screwed around a lot with theming choices only to decide I'll make my own theme later
- Hosting config stuff
- git actions or justfile? justfile for now.
- Launch!
- ???
- Profit?
All the things I want to do (AKA avoiding scope creap for now)
- More personalized, custom theme a. And let's make that theme open source
- Figure out build and publish steps on push to gitea
- Scripts/CLI for making and creating posts a. preload all that frontmatter b. File name and date formatting
Why vitepress?
I've been working a lot with vue at my current job. Before that I did a lot of react and before that was ember and before that was the OG angular (angular.js). I've touched the four basic javascript frameworks/libraries at this point even an obscure one like ember. I've been enjoing vue as it does offer a bit more control over it's DOM and choosing which parts of the app are reactive and which are not. I also like that I don't have to use jsx/tsx as I prefer to use html in my templating. Reacts state/store management I think is better though, especially around bubbling up of data from child to parent components and context makes more sense to me vs vue's providers.
All that to say, I wanted a platform that would allow me to write files in markdown, generate html, and use vue. Vitepress seemed the best way to go.
Theming
The one downside to vitepress is while they do offer easy theming support, I can't seem to find a good tutorial on how to make your own custom theme. That will be my next goal, to make my own theme. All this because I don't like the way a theme I'm using displays the collections for my multi-themed-blog. I can't for the life of me figure out how to import custom components without making my own npm package.
Logically, I should just make my own theme via an npm package. LOLOLOLOLOL. But seriously, I figure why the heck now. And then I'll document the process in this blog. That's the goal! YAY content farming, I guess.
The hosting and build process
I am primarily a front-end engineer. Accessibility and UX/UI is my bread and butter. That's why I chose a vitepress + vue blog platform. That being said, my partner has his own opinions on good hosting and has graciously allowed me to use his hosting setup. These are the new things I've been picking up thanks to him.
- gitea: Now ours is self-hosted on our own network, but gitea offers a lot of what github does without microsoft hosting flakeyness.
- rclone: This is the config cli tool that allows me to connect to our aws like hosting platform. It installs via
brew rcloneand is super simple and easy to use - just: A simplified
makealternative that also installs withbrew just. I'm using this to run commands likejust publishso that I can send my built files to the server.
I do eventually want to use some sort of git(hub) action, husky or similar tool to build and publish when I merge to master. That is my goal, to have deployments automatically go as I merge or push to main. Since this site is a static single page application, it may make sense to use a tool that will build locally and then push up on sending up to gitea. More decisions to come on that later.
Summary (the TL;DR)
Welcome to my new website. It's a vitepress site on an aws-like platform (on cloudflare). Join me as I screw around with more coding things!