Website Project
This Website
A custom-built professional portfolio created to showcase my work, technical documentation, project write-ups, and background in a responsive and visually polished format.
Framework
Built with Next.js using the App Router structure to organize the homepage, project pages, documentation pages, and shared layout components.
Frontend Stack
Uses React and TypeScript for component-based page structure, maintainability, and safer updates as the site continues to grow.
Styling
Designed with Tailwind CSS to create custom spacing, gradients, responsive layouts, card styling, typography treatments, and hover interactions.
Technologies Used
Why I Built It
Why I Decided to Build My Own Portfolio Website
I wanted a portfolio that felt personal, practical, and easy to update as my IT work kept growing. I did not want a generic template site that only listed job titles. I wanted one place where I could show documentation, project write-ups, resume details, and the kind of systems work I actually enjoy doing.
I also wanted the site itself to become part of the portfolio. Instead of only describing what I build, I wanted to point to a real project that showed how I think about layout, organization, iteration, and polish.
The Stack
What I Used to Build It
I built the site with Next.js, React, TypeScript, and Tailwind CSS. That stack gave me a clean way to organize routes, keep components maintainable, and move quickly on styling without fighting a large CSS file.
The site is structured around the App Router so I can keep adding project pages, documentation pages, and content sections without rebuilding the whole thing every time I want to expand it.
Working With Codex
How I Used Codex as a Coding Partner
The biggest difference for me was treating Codex like a collaborator instead of a code generator. I would give it a concrete task, let it inspect the current codebase, and then iterate with it the same way I would with another developer.
Sometimes that meant asking for a new section or page. Other times it meant making a focused change like updating the resume link, fixing layout details, cleaning up a component, or getting changes pushed to GitHub. I stayed in control of the direction, but Codex helped me move much faster through the implementation work.
Where I Still Had To Decide
What Still Required My Judgment
Codex helped with speed, but I still had to make the important decisions. I decided what belonged on the site, what tone felt right, what should be published, and which features were worth keeping.
A good example was the footer visit counter I tried. It did not feel reliable enough, so I removed it. That was a good reminder that using AI does not remove the need for judgment. It just gives you help executing faster once you know what you want.
The Result
What I Ended Up With
The final result is a portfolio site that feels much closer to how I actually work. It includes a homepage, resume section, project pages, documentation sections, and enough structure to keep growing over time.
More importantly, the process gave me a workflow I would use again. I could move from idea to implementation faster, keep momentum on the project, and still review each change carefully before it went live.
My Workflow
- Describe the change in plain language and point Codex at the relevant page or component.
- Let Codex inspect the existing codebase before making assumptions.
- Review the implementation, then iterate on wording, layout, or behavior until it feels right.
- Run lint or other checks so the changes are clean.
- Commit and push only when the update matches the direction I want for the site.
Real Examples
- Building and refining the homepage layout
- Updating the resume button to a new PDF
- Creating the Projects section and a page for this website
- Cleaning up components that were not working as expected
- Committing and pushing finished changes to GitHub
Lessons Learned
- AI works best when the task is specific and grounded in a real codebase.
- It is much more useful as a collaborator than as a one-shot website generator.
- Small iterative requests usually produce better results than giant vague prompts.
- You still need to review the output, make product decisions, and keep the final standard high.
Closing Thoughts
Building this site with Codex changed how I think about AI in development. The value was not that it replaced my thinking. The value was that it helped me keep momentum, execute faster, and spend more of my time making decisions instead of getting stuck in the slower parts of implementation.
Codex helped me build my own portfolio site faster, but the project still felt like mine at every step.