Creating, testing, improving

Complete development of corporate web platform for GM Microcementos, a company specialising in microcement application. Professional website with 15 optimised pages, focused on performance, SEO and exceptional user experience. Includes budget calculator, filterable project gallery, advanced forms and minimalist design system. Modular architecture with 100+ reusable components and optimised for Core Web Vitals.

Web platform for Academia CEJ, academy specialised in civil service exams in Malaga. Fully responsive website with blog, virtual campus, knowledge test, enrolment system and course management. Developed with Next.js 14, React 18, Tailwind CSS, Framer Motion and Docker.

Development of Dimap's corporate site, a modern application based on Next.js 15, React 19, Redux Toolkit and TailwindCSS, focused on delivering optimal performance and a smooth experience. The project includes service pages, blog, corporate sections and lead tracking forms, all built on a modular architecture and highly optimised loading using SSG, Lazy Loading and ClientLoader.

DevCrate is a platform for discovering development resources (tools, libraries, assets, documentation and challenges). Haven't you ever needed a resource for your project, or just some inspiration, and ended up browsing through a myriad of pages? That's why I created this platform: to organise and not lose any of the resources I've discovered over the years, and to be able to find them quickly without relying on scattered bookmarks. It includes advanced search, filters by tags and an admin area to manage all the content. It also allows suggestions from the community to keep collecting useful tools. It is built with Next.js, React, TypeScript and MongoDB, with secure authentication and a modern interface based on shadcn/ui.

Cmd+kit is a reusable command palette system for web products, designed to provide fast search, keyboard navigation and action execution from a consistent and accessible interface. It is designed to integrate easily into different stacks with official adapters for React, Vue, Preact and Astro, while maintaining the same base of behaviour and visual customisation. It includes full documentation and an interactive playground for configuring themes, command structure and exporting ready-to-use code. Can be installed with npm, pnpm, yarn or bun depending on the flow of each project.

CLI toolkit + library published in npm that allows API contracts to be defined in a single typed JSON file and automatically generate shared TypeScript types, Angular client, runtime validation with Zod and controllers for NestJS. Eliminates out-of-sync between frontend and backend, avoids duplicate code and detects breaking changes through contract snapshots. Includes mock generation for testing and a modular architecture based on multiple reusable packages.

Recreation of Apple’s official hero section for the AirPods Pro 2, focused on mastering advanced animations with GSAP and ScrollTrigger. I implemented a 65-frame Canvas-rendered sequence synchronised with scroll, along with smooth transitions, dynamic navigation, and visual effects inspired by Apple’s original design. A project aimed at refining high-performance web animation with a faithful, fluid approach.

Development of a real-time object detection PWA using Angular 19 and TensorFlow.js. Includes PWA setup, TensorFlow.js integration for object recognition, live image capture and processing, optimisation with Web Workers and Lazy Loading, offline storage via IndexedDB, and deployment on mobile devices.

Practice project to learn Three.js and TresJS working with 3D models. Interactive web application that allows customization of a standing desk with different finish and color options. Features 3D view with orbit controls, 3D models of laptop, headphones and decorative plant. Customize desk finish and select colors for accessories with real-time preview. Built with Vue 3, TresJS (Three.js integration with Vue), TypeScript, Vite and UnoCSS.

Grand Theft Auto VI landing page clone created exclusively for educational purposes and web development skills demonstration. Modern website with responsive design optimized for all desktop resolutions (1024px - 4K). Features dropdown menu with advanced animations using GSAP, dynamic character and location showcase system with images, interactive trailer section with previews, and animated download cards section. Non-profit educational project built with Astro, Tailwind CSS and JavaScript.

Small project focused on practicing with Strapi as CMS and backend. It is built with React/Next.js, TypeScript, and Tailwind CSS. Although the demo uses mocked data, the code includes a real Strapi integration to fetch and manage content.

Real-time chat project with a production-oriented backend architecture. It uses Node.js + Express and Socket.IO for bidirectional communication, with two storage modes: in-memory (mock) and optional Supabase persistence. The frontend (Vite) can run in demo or live mode, and the solution is layered (configuration, HTTP, realtime, domain, and storage) to improve maintainability, testing, and scalability.

HTML5 implementation of the classic Super Mario Bros built with Phaser 3.55.2 for educational purposes, based on decapapi's work. The project recreates the 2D platformer experience with a modular architecture for animations, blocks, structures, entities, player controls, and HUD, plus extras such as screenshot capture with html2canvas. It supports web deployment and local development with Vite, making testing and open-source contributions under the MIT license straightforward.

Paint Win 95' recreates the classic Microsoft Paint experience with a retro Windows 95-style interface and modern web behavior. It includes drawing and selection tools, a primary/secondary color palette, undo/redo history, working zoom levels, local image import, PNG export, and support for mouse, keyboard, and touch/stylus input through Pointer Events.

Bookshop View Transitions is a React + Vite demo focused on implementing smooth page-to-page transitions with the View Transitions API, including shared animations between elements (title, cover, and navigation) to achieve visually continuous navigation.

TikTok clone built with React, TypeScript, and Vite, designed with a mobile-first approach. It includes a vertical feed with autoplay, Following/For You navigation, interactive actions (like, comments, saves, share), Friends/Inbox/Profile pages, and upload with feed publishing. It uses a service-based architecture (mock by default with localStorage persistence) and has Supabase ready for real backend connection.

Open-source project inspired by the classic Breakout, built with Astro and game logic in TypeScript using Canvas. It includes an in-canvas difficulty selector, adjustable and progressive ball speed, variable brick durability with damaged states, keyboard controls, and restart flow after Game Over.

In this project I worked together with a team to develop from scratch a platform committed to selling quality products and local commerce. We worked from scratch with the concept to the practice creating both the back-end and the front-end. Apart from different technologies we incorporated integrations such as jwt for the control of user accounts and login, a dashboard for the control of all data... Functionalities such as being able to log in with different social networks, account creation as a user to buy products or as a company to add them, maps of the nearest place where the product in question could be found, among other things. For confidentiality reasons the code is not shown.