iHuezo API
Building This Website
This website was my first full-stack project. Building it taught me how production
systems actually come together—infrastructure, backend, frontend, all of it. It's
shaped how I approach everything since.
The Plan
I had to do some serious studying on how to design the application. This included
learning AWS and Terraform. I wanted to make sure that my application was secure
and correctly networked. The security-conscious approach helped me produce code
closer to what you'd see in a production system at a larger company.
The Frontend
The frontend is built with React. To be honest, what I really wanted from the
frontend was a consistent UI that felt snappy and great to the user. I wanted to
make sure my Lighthouse score made a good impression and that the site would also
work on mobile. My goal was a great experience rather than just showcasing my
skills. I actually know a lot of vanilla JavaScript from my work, and although
React has a lot of nice features, it's still a bit bloated. However, it's easy to
leverage component libraries like Bootstrap or Shadcn to get something nice-looking
quickly.
For styling, I chose to build a custom design system in SASS rather than reaching
for Tailwind or another utility framework. There's a single globals file that
defines the color palette, spacing scale, typography, and shadows. Every component
pulls from these shared variables, which keeps things consistent without much
effort.
The blog section presented an interesting challenge. I wanted to write posts in
Markdown and have them render nicely without building a separate static site. The
solution was react-markdown paired with remark-gfm for GitHub Flavored Markdown
support. Code blocks get syntax highlighting through Prism, which handles most
languages I'd ever want to write about. The whole thing lazy-loads so it doesn't
bloat the initial bundle. Again, the Lighthouse score is what I like to see—a nice,
buttery experience.
The Backend
Django powers the API, with Django REST Framework handling serialization and
routing. It's a well-worn stack, but that's part of the appeal. It's not the most
glamorous framework like FastAPI, which I've also used, but it provides a lot of
out-of-the-box utilities I would have had to build myself with FastAPI.
PostgreSQL is the database, and it was a pretty easy choice. I'm not dealing with
big data, so Cassandra or other distributed databases don't make much sense. And to
be honest, this is a small site and Django works well with small to medium sites
regardless—even large sites if optimized correctly with proper SQL queries,
caching, etc.
Infrastructure
Everything runs on AWS, defined entirely through Terraform. This was more work
upfront than clicking through the console, but it pays off every time I need to
understand what's deployed or make changes confidently.
Static assets live in S3 with CloudFront in front for caching. The backend runs in
containers, with images stored in ECR. PostgreSQL is hosted on RDS, which handles
backups and maintenance without me thinking about it. The whole setup costs
surprisingly little for a personal project.
Docker containers keep everything consistent between my laptop and production. The
Dockerfiles use multi-stage builds—development stages include debugging tools and
hot reloading, while production stages strip everything down to the bare minimum
needed to run. The production images are based on Alpine Linux, keeping them small
and reducing the surface area for security issues.
For local development, Docker Compose brings up the entire stack with one command:
frontend, backend, database, all wired together and ready to go.
Deployment
GitHub Actions handles continuous deployment. When I push to the main branch,
parallel jobs build the frontend, backend, and nginx containers. Once those
complete, Terraform applies any infrastructure changes, and CloudFront
invalidations ensure the CDN serves fresh content.
The pipeline also runs Infracost to track how changes affect the AWS bill. It's a
small thing, but it's caught a few "wait, that costs how much?" moments before they
made it to production.
Nginx sits in front of everything in production, handling SSL termination and
routing requests to the right place. It's a simple setup but it works reliably.
Wrapping Up
This project has been a good reminder of how much goes into even a "simple" website
when you want full control. There's the application code, sure, but also the
styling system, the build pipeline, the container configuration, the cloud
infrastructure, the deployment automation. Each piece is manageable on its own, but
they all need to work together.
The upside is that I understand all of it. When something breaks, I know where to
look. When I want to add a feature, I know exactly how it'll fit in. That ownership
is worth the extra effort.
If you're considering building something similar, my advice is to start simple and
add complexity only when you need it. Get the basics working first, then layer on
the infrastructure automation, then the fancy deployment pipeline. Each piece
should solve a real problem you're actually having.