Hello World: Building My Custom Developer Portfolio
Welcome to my new digital garden! After spending quite some time designing, architecting, and writing the code for this space, I'm thrilled to finally hit publish.
Instead of reaching for a headless CMS platform or a generic template, I decided to build this blog completely from scratch. I wanted a space that not only showcases my projects but also serves as a permanent playground for testing out modern web technologies.
The Architecture
If you are curious about what is running under the hood, here is the core stack powering this site:
Framework: Next.js (App Router) for seamless server-side rendering and routing.
Styling: Tailwind CSS paired with Shadcn UI to keep the design system clean, consistent, and highly accessible.
Database: PostgreSQL, strictly typed and queried using Prisma ORM.
Package Manager: Bun. I cannot emphasize enough how much faster the development workflow is when using Bun for script execution and dependency management.
The Comment System
One of the features I am most proud of is the custom comment system at the bottom of these posts. Instead of dropping in a heavy, third-party iframe widget, I built a native integration using Discord OAuth.
By handling the authentication callbacks and token management manually, the site stays incredibly fast while still allowing for rich interactions and nested replies directly written to the Postgres database.
A Quick Code Snippet Test
To make sure my markdown renderer is parsing code blocks correctly, here is a tiny example of how clean server-side fetching looks in the App Router:
typescript
export async function getPosts() {
const posts = await prisma.post.findMany({
where: { published: true },
orderBy: { createdAt: 'desc' },
});
return posts;
}
What's Next?
I plan to use this space to share deep dives into full-stack development, UI design thoughts, and lessons learned from various projects. Building things from scratch always uncovers interesting edge cases, and I hope to document those solutions here.
If you are reading this, feel free to log in via Discord and test out the comment section below!