Overview
Introduction
Welcome to my personal documentation. This section is filled with the steps I follow while building real projects with React, Next.js, and their ecosystem. Each page focuses on one task from start to finish. You will see the goal, the versions used, the exact steps, copy-ready snippets, and common issues with fixes. I write these while implementing features in projects, so the code is practical and reflects my approach in engineering.
How to use these tutorials
Read the intro to understand the goal, then follow the numbered steps. “Used in this guide” shows library versions so you can match your setup. “Requirements” lists anything to prepare before you start. Notes and warnings call out some problems I hit along the way. If something fails, please read the text explanation carefully.
What is covered
You will find a broad mix of topics such as Next.js patterns, Payload CMS with AuthSmith, TanStack Query, Stripe, mailing and SMTP setup, Cloudflare and R2 storage, PostgreSQL, MDX, Docker, and UI details like animations and carousels. I also add AI integration guides using Gemini, including File Search Store and RAG. The scope keeps growing as I learn and refine my approach.
Conventions
- All examples use TypeScript.
- Commands and file paths match a typical Next.js project layout best practice.
- I prefer small, composable steps that you can reuse in other work.
- Version pills at the top help you know exactly which combination I tested.
Who this is for
These notes help anyone who wants working instructions without fluff. If you are reviewing my portfolio, this section shows how I think through problems, organize work, and document decisions. If you are building something similar, you can follow the steps directly or adapt them to your stack.
I update this area regularly. Check back for new guides and improvements as my projects evolve.