This section is under construction

Text generated with AI :)

|

mars 2025

Behind the scenes

Welcome to the technical breakdown of this website — how it's built, hosted, and secured. If you're curious about the stack and security practices I use, this is for you.


🖥️ Frontend

The frontend of this website is designed to be modern, fast, and responsive, using today's best practices for development and user experience.

  • Framework: Next.js (App Router, Server and Client components)
  • UI Library: React
  • Styling: TailwindCSS for fast and flexible utility-first CSS
  • Components: Shadcn/UI — a beautiful set of accessible components, customizable via Tailwind
  • Hosting: Vercel — for automatic deployments, fast global CDN, and great developer experience

The frontend is fully statically optimized where possible, ensuring fast loading times and great SEO performance. Dynamic parts (such as the Lab) are securely connected to the backend API.


⚙️ Backend API

To handle authentication, user management, and todos, I built a Laravel API, focusing on security, scalability, and maintainability.

  • Framework: Laravel (latest version)
  • Features:
    • Authentication with Sanctum
    • Todo management (CRUD)
    • Secure API routes
  • Database: PostgreSQL

The backend is fully Dockerized for isolated and reproducible environments.


🚀 Hosting & Deployment

The Laravel API runs on my private VPS hosted on Digital Ocean, reverse-proxied by Nginx.

Security best practices implemented:

  • Fail2Ban: Automatic IP banning for suspicious behavior (login abuse, bot scanning, etc.)
  • Firewall: Configured to block unnecessary ports and protect from unauthorized access
  • Container hardening:
    • Read-only Docker images and containers (immutable infrastructure)
    • Dropped privileges: Containers run as non-root, limited capabilities via cap_drop
    • No-new-privileges policy enforced
  • Rate-limiting & request filtering via Nginx to mitigate basic DDoS and malicious traffic
  • Monitoring and log aggregation to keep track of real-time activity
  • Encrypted communications (HTTPS) via SSL

This setup ensures a high level of security and isolation, even for a small-scale personal project.


🌍 Why this stack?

I chose this stack because:

  • Next.js + Tailwind + Shadcn allow for fast and beautiful front-end development
  • Laravel gives robust, mature backend capabilities with great security features out of the box
  • Docker ensures that the application runs the same in development and production
  • Digital Ocean VPS gives me full control over hosting, which is perfect for implementing custom security policies

✉️ Questions?

If you're curious about more technical details or want to collaborate, feel free to reach out via sanchis.alexis@gmail.com.