React Piano is a web app that emulates a virtual piano keyboard with a list of instruments that can be played with the actual keyboard.
It was coded in React and TypeScript, and uses the Soundfont API to generate musical notes and the browser built-in AudioContext API to get access to the user’s sound hardware.

React Piano

MiSpotify is a full-stack web app that consumes the Spotify's API to display a user's favorite artists, playlists, and tracks.
It uses React Router to navigate between pages, Node and Express for the back end, and localStorage to store the user's auth tokens.

MiSpotify Web App

Legend — an online store for Legend's uniques and cool clothing. This store is being developed for the brand to reach a wider audience and be available internationally.
Legend is a local brand from Barranquilla, Colombia making truly unique pieces that convey the peculiar idiosincracy and cultural heritage of the Colombian Caribbean Coast.

Legend’s E-commerce Store

Catstronauts is a full-stack web app that fetches a list of learning tracks from a GraphQL API and displays them in a card grid on the homepage.
 I completed this project by taking the 5-part Apollo Graph Developer - Associate Certification, taught by Apollo Odyssey.

Catstronauts

Floema is a full-stack, creative website for an online jewelry store. The website is built with WebGL and Three.js.
I'm developing this website while taking the "Building an immersive creative website from scratch without frameworks" course by Luiz Henrique Bizarro.

Floema Website

A reponsive, themable website that hosts the spanish translation of "The Swift Programming Language" book.
It's an open-source initiative built with Nextra, Next.js, Markdown, and CSS modules.

The Swift Programming Language en Español

A massive full-stack app that simulates a NASA Mission Control dashboard.
 I coded this to learn best practices and techniques to build performant full-stack applications with Node, MongoDB, and data from SpaceX and NASA.

NASA Mission Control

A Gatsby web app for Slick’s Slices — an online pizza delivery restaurant.
It's a full-stack web app built with Gatsby, GraphQL, and Sanity CMS.

Slick’s Slices

A React web app for a local seafood market that allows you to order your favorite seafood.
It's a full-stack web app built with React, Firebase, React Router, and Stylus.

Catch of the Day

A React-based todo app that allows you to create a list of tasks and let it decide what to do for you.
It's a web app built with React, Sass, and Webpack.

Indecision (Todo App)

A Vanilla JavaScript web app that consumes a food recipes API to render them. It's styled with sass.
It's written with the MVC architecture and features searching, pagination, and a DOM Updating Algorithm.

Recipeasy

A vanilla-JavaScript web app for tracking your running and cycling activities. It's styled with CSS.
It's a project created as part of The Complete JavaScript Course by Jonas Schmedtmann.

Mapty

A showcase website for 30 small JavaScript projects. Made with HTML and CSS.
The micro projects are from the Wes Bos' course — JavaScript30.

JavaScript30

A showcase website for AlterNight, your new favorite VS Code theme. Made with HTML and CSS.
AlterNight is a VS Code theme I made from scratch so I can code with my own visual style.

AlterNight Showcase Website

A dummy landing page for a real state agency. A simple website made with HTML and CSS.
I coded this project to practice CSS layout techniques, such as grid and flexbox.

Nexter

A contribution to an open-source project about examples and descriptions of the latest features of the ECMAScript specification.
I added 2020 features such as Dynamic Imports, BigInt, Nullish Coallescing and Optional Chaining operators, standardization of for-in loop's order, and more.

ECMAScript 2020 Features

AlterNight is a modern, stylish theme for Visual Studio Code, created from scratch with a curated selection of colors.
It currently offers syntax highlight for several languages and file formats, such as HTML, CSS, JavaScript, TypeScript, JSX, GraphQL, GSLS, etc.

AlterNight VSCode Theme

With this PR, I fixed an accessibility issue on the Svelte's website—not enough color contrast between a custom element's background-color and color/border-color.
I considered better to switch the yellow color for an orange/tan color (similar to the Svelte color) and a lighter background color, so it passes WCAG AA.

Fix a11y issue on Svelte’s Website

Open-source contribution to the Wes Bos’ React for Beginners course.
With this PR, I added missing propTypes to a React component used on the course.

Add Missing propTypes

Minimus is a minimalistic yet stylish theme for Visual Studio Code, that aims to boost your productivity.
It currently offers syntax highlight for several languages and file formats, such as HTML, CSS, JavaScript, TypeScript, JSX, GraphQL, GSLS, etc.

Minimus VSCode Theme

Open-source contribution to the Wes Bos’ Beginner JavaScript course.
With this PR, I fixed the arguments being passed to the .slice method of an array used on the course.

Fix Arguments for `.slice`

Open-source contribution to the Wes Bos’ Beginner JavaScript course.
With this PR, I fixed the numberSort function — a callback function to sort the items of an array based on their price.

Fix function’s return statement

Open-source contribution to the Wes Bos’ Beginner JavaScript course.
With this PR, I fixed the arguments being passed to the .splice method of an array used on the course.

Fix Arguments for `.splice`

An online store for Legend's uniques and cool clothing. This design aims to guide development for the brand to reach a wider audience and gain online presence.
Legend is a local brand from Barranquilla, Colombia. They craft pieces that convey the peculiar idiosincracy and cultural heritage of the Colombian Caribbean Coast.

Legend’s E-Commerce Website

Skools is a web app for searching schools, universities, and related services in Colombia.
The platform is intended for parents and students to find the best schools and services available.

Skools

Daviplata app is an online platform for users to transfer and receive money.
This is a flash re-design concept for the app to practice some design skills.

Daviplata App Re-design

Official re-design of the Service Plans page of Simple Mobile—a US-based prepaid, wireless service provider.
This design helped the brand to increase user conversion and retention by improving the UX.

SM’s Service Plans Page

Legend — an online store for Legend's uniques and cool clothing. This store  has been developed for the brand to reach a wider audience and be available internationally.
Legend is a local brand from Barranquilla, Colombia making truly unique pieces that convey the peculiar idiosincracy and cultural heritage of the Colombian Caribbean Coast.

Las Islas Hotel Re-design

Contrastrat.io is an online tool to check the color contrast ratio between a given pair of colors.
This app works as a helper tool for accessibility in web design and development.

Contrastrat.io

El Heraldo is a local newspaper from Barranquilla, Colombia. It is published every morning and distributed in the city and the surrounding areas.
Here, I explored with a cleaner yet fluid design and a more modern approach to the content distribution.

El Heraldo Re-design

Electricaribe is the local Energy and Electricity service provider.
Here, I designed a quick couple of screens for the Sign In/Sign Up pages of their website.

Electricaribe Portal

Logo Design for María C. Mascotas—the biggest retail store for pet products and services in Montería.
The logo perfectly conveys the brand and the company’s identity as well as its range of products and services.

María C. Mascotas’s Logo

Design of a logo for Agrodistribuidora Manosalva Rivera—the biggest agriculture-related retail store in Montería, Córdoba.
The logo perfectly conveys the brand and the company’s identity as well as its range of products and services.

Agro Manosalva Rivera’s Logo

This logo was designed for Sami’s—a local, family-owned resturant based in Montería, Córdoba.
The logo was designed to be a simple and clean representation of the brand, with a simple and clear visual identity.

Sami’s Logo

The logotype was designed to represent the luxury and welcoming vibe of the brand.
It's a cleaner design that embraces every element of the hotel.

Las Islas Hotel’s Logotype

The logo was designed to convey the lightweight and fast functionality of the brand.
It was designed to communicate the simplicity and power of the app.

VSCODESIGN’s Logo

The logotype was designed to be a simple and clear representation of the brand.
It's a minimalist yet fluid design that is easy to read and understand.

Works