delrive.com.

Introduction

This is a personal portfolio website that I designed and built entirely. The main goal was to create a modern, clean, and fully customizable platform to showcase my background, skills, and the different projects I’ve worked on.

I'm currently a second-year student in a 5-year computer engineering program, specializing in cybersecurity. That said, I’ve been passionate about tech for years and have learned a ton on my own. This project reflects that self-taught journey and my desire to build real things while exploring new tools and frameworks.

Tech Stack

I went with a full-stack setup that I chose based on what I enjoy working with and what I wanted to improve on:

• Frontend: React – for a fast, responsive, and component-based UI.
• Backend: AdonisJS – a Node.js MVC framework that’s well-structured and includes a lot of powerful features out of the box (auth, ORM, validations, etc.).
• Database: MySQL.
• Deployment: Amazon Web Services (AWS).
• CDN & DNS: Cloudflare – for DNS management, caching, and global asset delivery optimization.

Features

Public site

The public-facing part of the site is built to be simple and straight to the point:

• A homepage with a quick overview.
• A Projects section where I showcase my work — each project includes a description, visuals, and useful links.
• A Skills section listing the technologies I’ve worked with (languages, tools, frameworks...).
• A Contact form if you want to contact me.

Admin panel

I also built a secure admin panel to manage everything behind the scenes, without touching the code:

• Create / edit / delete projects, skills and tags.
• Update site settings (maintenance mode, etc.).

Authentication is done via my OpenID custom service, called Delrive Connect.

Performance & Optimizations

Performance and user experience were key concerns while building this portfolio. I implemented several optimizations to keep the site fast, responsive, and efficient:

• Cloudflare caching: I use Cloudflare to cache static assets (like images, stylesheets, and JavaScript files) globally. This significantly reduces latency for users, no matter where they are in the world.
• Image formats: All images are optimized and served in modern formats like WebP when supported, reducing load times without compromising quality.
• Lazy loading: I’ve enabled lazy loading for non-critical images and components to prioritize what's visible first.
• Minified assets: All frontend assets (CSS, JS) are minified during the build process to reduce file size.
• GZIP / Brotli compression: Enabled through Cloudflare to speed up file transfer.
• Efficient font loading: Only the fonts I actually use are loaded, with fallbacks for better performance.

All of this contributes to a smoother browsing experience, better SEO, and improved accessibility — especially on mobile or slower networks.

What I Learned

This project helped me level up in a lot of areas:

• Building a clean full-stack architecture with modern tools.
• Learning and applying AdonisJS was a great experience. It was new to me at first, but since I had worked with Laravel before (which also uses MVC), I quickly got comfortable with the structure and logic.
• Creating a secure API with authentication, middleware, and proper input validation.
• Deploying a full app on AWS.
• Thinking about security from the ground up — using HTTPS, protecting routes, validating form data, securing the web server.