I recently started creating this website in an effort to display my engineering experience and describe in depth the personal projects I have taken on. This site is very much under construction and I only recently finished the bones and frameworks for it. There will be significant overhauls once I find the time. This uses elements from open source frameworks and templates so it is not purely my own development. I will publish the code on my GitHub once I clean it up a little. As you can probably tell by this site, front-end development is not my forte, so please excuse any errors as I am probably in the process of fixing it.
Tech Stack Overview:
| Purpose | Provider |
|---|---|
| Framework | Astro |
| Styling | Tailwind |
| Components | shadcn/ui |
| Content | MDX |
| Codeblocks | Expressive Code, Shiki |
| Graphics | Figma |
| Deployment | Cloudflare |
The foundation of the tech stack of this website is AstroJS which I chose for it’s focus on static sites (through optimization and zero client side JavaScript for faster sites) along with its general ease of use compared to more comprehensive and powerful frameworks like react (which it is based on). This site uses MDX for blog content which allows for advanced formatting and insertion of components (like callouts, code snippets, and formatted math) all while being easy to use. There are some other scripts for managing content and repeated assets, but overall this website is relatively simple, which helps me focus on the point of conveying content rather than looking flashy. This site also will not kill your GPU or eat your RAM, and has some nice QoL optimizations like lazy loading images, automatic media optimization, and preloading pages.
Development status
Current issues:
- Homepage layout on mobile looks bad. I am going to make a separate layout for smaller devices to fix this.
- Dark Mode toggle doesn’t after navigating anywhere on the website. This is a very weird issue that I am unable to replicate locally and only appears on deployment. No matter if I am running a dev server or full build locally, it does not appear, so this will require some investigation. It potentially could be some strange interaction with Cloudflare’s infra, but I cannot say for sure. This issue resolves itself on reload and is just cosmetic, so I will likely not fix it very soon as I have no clue how it is being caused.
- There are some console issues with asset decoding. It is likely some mistake I made with how media is optimized so it’ll be an easy fix.
Planned features:
- As you can read about here, I am working on getting a dev-log style blog system working for long-term projects to be able to document my journey and all the details about it that I am unable to capture in a single post at the end like with my other projects. This system will use a sub-navigation system and sub-posts to enable this functionality while preserving accessibility.
- Better mobile blog posts. Reading blog posts on mobile isn’t great since the text is very large and the margins waste space, so I will create a more optimized layout for smaller screens.
- Index/Table of Contents. I am working to add interactive overviews for longer project/blog posts with the index of all headings and subheadings so it is easy to see what is in a post and navigate it without scrolling too much. This will be especially helpful for dev-log style posts where the content will inevitably be much longer and more cumbersome.
- Better mobile menu. I want to implement a better menu for navigating pages on mobile as the current one is functional, but looks bad and is hard to use compared to more traditional menus.
Development on this site will likely accelerate during late December when I am on winter break as I will finally have the free time to dedicate to polishing this site.