Timeline
Part of the Toronto-based Product Experience team, full-stack engineer with a front-end web focus and some iOS experience. I moved to Toronto for the role and was promoted from Mid-Senior to Senior. Day to day, I work across a lot of areas - feed modules, shopping features, GenAI tooling, landing pages, and internal developer tools. I also spend time mentoring and helping other teams when they need web engineering support. Note that the projects shown here are just a sample of the public work I did, not all of it. Tech Stack/Tools: JavaScript, TypeScript, Flow, React, Redux, Jest, React Testing Library, RESTful APIs, GraphQL, Relay, Enzyme, Cypress, Python, Flask, Apache Thrift, Docker, Figma, Phabricator, Kibana, Gestalt, Objective-C, Texture, Plank.
None of these are original, but these are the ideas I keep coming back to
What started out as a simple resume-like page, became an exhaustive timeline of my professional life and side projects. I compiled in a JSON file all the projects I've worked on, the jobs I've had, the studies I've done, and the personal projects I've worked on. Then I created some renderers to display them in a vertical timeline format. I did some iterations using a visualization library called vis-timeline, with more interactions animations etc, but the UX was not great on mobile, so I ended up creating a custom solution with UX first principles in mind. I structured with some overarching projects (University, main job at the time, etc) and nested projects I did during those periods. I took great care on adding demos to each project and links to where they can be tested (still some pending). Also added an automatic feed from the blog posts to the timeline, so it's always up to date with my writings. Finally, I added some links to each project card, so it's easy to share a particular point in the timeline with a link.
Reflecting on all the stuff I’ve put out there
Email was the problem
Pinterest Predicts is the yearly not-yet-trending report packed with next year’s biggest trends in fashion, beauty, home decor, food and more. Always a fun thing to build as it gets big media attention.
Scales and tilts pins on desktop hover while the Z key is pressed. This one was all me - came up with the idea, designed it, and built it.
(Plays agent finished sound)
Generally on favour of them
And it shows
Android app for Terracitas.app, built with Kotlin and Jetpack Compose. It allows users to discover bars and restaurants with outdoor terraces across Spain, and to easily find great places to eat or drink outdoors, wherever they are.
A gift guide experience for the holiday season, with ideas for presents for each persona.
Replaced the "Hide" option on Pin overflow menus with "See less like this" and added a "See more like this" option. The idea is to give users a direct way to tell the recommendation system what they want more or less of, rather than just hiding things.
Visual refresh of a module focused on recipe videos, building on the n-columns Masonry project mentioned before.
A ton of users were asking for a way to control AI-generated images on Pinterest. The tricky part was designing something simple enough for regular users but that still sent meaningful signal back to the ranking systems. Once we shipped it, the reception was great - users were happy and it got picked up by The Verge and other outlets.
First prize at Pinterest's internal makeathon in the internal tools category. Built a tool to make grabbing debugging entity data way less painful - something that was a common friction point for engineers.
Terracitas.app is a location-aware web app for discovering bars and restaurants with outdoor terraces across Spain. It curates patios and terraces, focusing on quality, atmosphere, and outdoor experience rather than exhaustive listings. Search results and the home feed adapt to the user’s location, while each terrace has its own shareable page. The web app helps people easily find great places to eat or drink outdoors, wherever they are.
Moved to the Horizontal Product Experience team, which owns pin representation in the grid, feedback/navigation themes, and parts of product performance. This is a product team closer to platform, acting as the layer between product and platform.
First prize at Pinterest's internal docathon for best documentation. I documented the in-house web developer tools that most people on the team use daily but nobody had written proper docs for.
Visual refresh for a module that provides outfit completions
A new GPT-powered shopping module on search and related pins surfaces. The interesting challenge was integrating it into the existing feed without messing up the Masonry grid layout or hurting performance. It serves as an entry point to a product-only feed.
Second prize at Pinterest's internal makeathon in the internal tools category. Built an internal web developer tool with a UX focus - it lets you override HTTP request headers and A/B experiment configurations, which is something developers do constantly but was always clunky.
Added product price, brand, merchant, and on-sale filters for shopping searches. Pretty straightforward feature but it made a big difference for people actually trying to buy things through Pinterest.
I temporarily joined a different team who needed web engineering help. They wanted to let people create, edit, and delete multiple pin drafts at the same time in the Pin Builder. It was a good exercise in jumping into an unfamiliar codebase and delivering quickly.
This was a historic one. Up until now, every single element in the Pinterest grid had spanned exactly one column - it had been that way since the platform's inception. One column makes whitespace management easy, but there was growing hunger from design for richer, multi-column modules. The tricky part was rethinking the layout algorithm's whitespace handling without breaking performance or visual consistency across millions of feed renders. We went with an incremental approach - proving out 2-column first rather than rewriting the whole grid - to validate the concept with minimal risk. With the web platform team, we shipped the first 2-column module (shop by brand, visible in the video). More importantly, this opened the door for a whole wave of multi-column experiences in the Pinterest grid that came after.
Landing a job as a software engineer requires more than just technical skills. In this one-minute tutorial, I’ll outline the key steps to…
A visual refresh of a module that serves as entry point to style-specific searches
A visual refresh on a search module that serves as entry point to merchant-specific searches
Another iOS project, porting the product page to iPad specific UI
First iOS project - Brand awareness on product detail page by showing brand separated from merchant, and allowing to follow brands
An experimental website, exploring some good old multi page applications (I basically had only done modern single page applications up until this point), I scanned some of my drawings and add them as background images, I also did some experiments with template renderings, dark theme, visits counting, and session management.
Curelator is a digital health company building clinical-grade disease management platforms, based in Cambridge MA with a distributed team across Barcelona, UK, and Germany. I started as a web developer and grew into a full-stack engineer role. I worked on a React SPA with d3 charts for clinical dashboards, contributed to the Python/Flask REST API, migrated the company website from WordPress to a JAMStack architecture with Metalsmith, and owned the email template systems. Small team, lots of ownership. Note that the projects shown here are just a sample of the public work I did, not all of it.
A clinical dashboard I built while working at Curelator. A feature-rich SPA built with React and alt (Flux). Features custom charts with d3 and a custom WYSIWYG text editor for clinical office notes made with Slate.
My solutions to some of the exercises of the CS50 course by Harvard University. Mostly in C.
There isn’t one best way to implement SVGs on our websites, since each method has its pros and cons. Let’s learn their differences.
You’ve used them before but you’re not completely sure what they are, here are some answers.
We’ll learn how to implement a browser auto-saving draft system in JavaScript
Many people struggle to build a writing habit. I did too, but I solved it with this simple mantra
Let’s learn to use the power of this advanced tool for Git disaster‑saving
Let’s build a touch-triggered image slider with lazy loading, navigation, and pagination, in one minute.
An intensive, self-paced foundational course in computer science and programming fundamentals, designed for both beginners and those with prior experience. CS50 teaches core concepts including computational thinking, algorithms, data structures, abstraction, resource management, and software engineering principles. Students gain practical programming experience in C, Python, SQL, JavaScript, HTML and CSS, progressing from low-level understanding of memory and machine-level concepts (via C) to higher-level web and application development skills (via Python, SQL, JavaScript, HTML/CSS). The curriculum includes weekly problem sets drawing from real-world domains - such as cryptography, finance, forensics, biology or gaming - culminating in a final project that demonstrates the ability to design and implement a complete software application. CS50 emphasizes strong coding style, correctness, and algorithmic efficiency, helping learners develop not just coding fluency but deeper understanding of how computers work under the hood. The course also connects students to a large global learning community, offering exposure to diverse problem-solving approaches and collaboration opportunities.
A quick guide (with examples) on applying CSS to log messages in the browser’s console
Learn how to prevent CSS overflow with variable-length text using a simple wrapper component that keeps text on one line.
Save time while reviewing your own pull requests
Learn how to lazy load images, in one minute.
Learn how to avoid hyphen line-breaks, in one minute.
Understand the difference between forward proxies and reverse proxies, and when to use each one.
Learn to avoid headaches with Static Code Analysis Tools, in one minute.
Learn how to remove all your node_modules directories, in one minute.
Learn how to build a 3D bank card, in one minute.
Learn how to count the total number of lines in a Git repository, in one minute.
Learn how to leverage window.IntersectionObserver to find out how many visitors see your content, in one minute.
Learn how to use Regex’s Negative Lookahead, in one minute.
A tutorial on setting a VPN and using it from the CLI to hide our IP and location
Don’t lose your aliases again when switching computers!
A quick explanation and a couple of handy one-liners
A quick tip to save time on saving and sharing documents
A quick guide for web developers on this great time-saver when executing JavaScript on the go.
And a few other methods that you can also use, but beware of the caveats!
A neat trick for a job interview or to save time on quick scripts
A simple Visual Studio Code trick to save precious time while refactoring
Avoid losing all those changes on the elements tab if you accidentally reload your browser
An obscure (but effective) way to do CSS feature detection with JavaScript. In the example, we test for a feature that only Microsoft browsers have.
A website from a Netlify template I built for my future engineering company which never actually happened. It's a simple unfinished website with some BS facts and a portfolio of my projects and a contact form.
Advertisement video for the OXIDIA backpack I produced.
Tutorial video for the OXIDIA MAXi backpack I produced.
Tutorial video for the OXIDIA MINi backpack I produced.
Codeworks is an immersive coding bootcamp with campuses in Austin, Barcelona, New York, Berlin, London, and Toronto. Its Software Engineering Immersive program covers advanced JavaScript, HTML/CSS, unit testing, data structures, algorithms, complexity analysis, networking, end-to-end testing, security, authentication, automated tasks, advanced state management, continuous deployment, DevOps (Docker), systems architecture, open source contributions, back-end frameworks (Node, Express, Koa, GraphQL), databases (SQL, MongoDB, Redis), and front-end frameworks (Angular, React). Responsibilities: Give a lecture once a week about the current course subject, train new Teaching Assistants, answer help requests from all students, host Q&A sessions and exercise reviews, support senior students throughout their coding projects (brainstorming, code reviews, demos), prepare senior students for their job search.
A simple Node.js script I built as an ad-hoc project to help my Codeworks students with a project. It's fetches on a loop the data of some Pokémon from the PokéAPI and saves it to a JSON file.
A simple website I built for one of my lectures as instructor at Codeworks, to teach my students about Model View Controller (MVC) architecture.
There are some ugly parts that people don’t talk about. Before deciding to enrol, mind all the possible outcomes.
The story of my career change, and how first choices aren’t usually the best for your future
These are custom made, they don’t appear in the Git docs! Saved me countless headaches in the last two years…
Some web-dev wisdom, not just limited to JS!
A song I made - Inspired by the Money Heist Netflix show
A memento of my first ever JavaScript project circa February 2018.
Never trust the design.
A song I made - playing a sound similar to the Game Boy Advanced's startup sound
A song I made - It had been a while without producing music and set myself to complete this one in one evening
A landing page website I built while working at Curelator. Custom wordpress theme with some nice animations and creative styles.
Some cool React.js libraries, PropTypes, node_modules updates and an Easter Egg.
Stop listening.
This time tips and tricks on CSS Modules, a lot of BASH and GIT stuff, macOS apps, using searchable components and fighting Chrome's autocomplete styling.
Tips and tricks including but not limited to Pandas, JavaScript sliders and swipers, a flights API, BASH automations and some other nifty ideas.
A web app to find flights to meet up between two people from different origins in some intermediate destination. Built in 24 hours for the kiwi.com Kiwi Hack Travel hackathon with 3 other engineers that I met right there. We didn't win anything. Interestingly, other 2 teams had the same idea and one of them actually won the 1st prize.
A Node.js program to check if your credentials have been pwned. Find if your password is in a cracked passwords list. Locally, without sending your password to a server.
Get all the neat desktop goodness from /r/wallpapers with this command line utility built in Node.js
A web app to make Instagram contests suck less.
An app that allows to randomly pick a comment on an Instagram picture that follows a set of conditions. It features a conversational UI to get the rules for a given contest and, at the last step, it creates a snippet that gets copied to the user clipboard. Then, this can be pasted in the JavaScript console in the picture page and the winner comment will be highlighted.
Mandatory
There are some cool wallpapers on Reddit. At some point, I started saving them on a folder on my computer in order to display them on my desktop in a random fashion. This picking and downloading process was kind of tedious, so I've built a small Node.js program to automate it.
An intensive, outcomes-driven program focused on building production-ready full-stack web applications using modern JavaScript and professional engineering workflows. Curriculum covers advanced JavaScript, data structures & algorithms, networking (HTTP/WebSockets), REST and GraphQL APIs, and software architecture, with hands-on development across Node.js, Express, Koa, React, Angular, SQL, MongoDB, Redis, and Docker. Strong emphasis on testing, security, authentication, and scalable system design. The program includes multiple real-world individual and team-based projects that replicate professional software development environments, applying Git-based collaboration, CI/CD, and deployment practices. The final phase focuses on portfolio development, system design, and technical interview preparation. Codeworks is known for its selective admissions and strong hiring outcomes, preparing graduates to perform effectively in production engineering teams.
Final project for Codeworks, my team was composed of me and 5 other students, we came up with the idea and built it in 2 weeks following the Agile methodology. It's a Bitcoin shared wallet app, designed to rapidly agree and execute group expenses through unanimous voting. For this project I designed and wrote the server API to interact with the Bitcoin blockchain network, including its documentation and tests. The API is based on the Bitcore library. It allows users to create Bitcoin wallets, make transactions and check the historic of transactions of an account. On the front end I worked on the React-Redux integration, and the components logic. Tech Stack: Bitcore, React, Redux, Jest.
2nd Prize on a 48h hackaton. Teamed with another Codeworksstudent and built a game of Pong that is meant to be shown on a public screen, such as cinema or auditorium. Participants use their smartphones as controllers and must collaborate to beat the other team.
Solo project for Codeworks. I designed and built the app in 3 days. Find a Hobby! is a crowdsourced web app that will help you discover the most amazing thing to spend your leisure time on. It features a recommendation engine that learns from user interaction, and provides accurate suggestions. Tech Stack: React, Koa, MongoDB, Redis, Raccon.
Legacy project for Codeworks, my team was composed of me and 2 other students, we took a solo project of another student and redesigned it, added best practices fro client-side state management and facebook authentication. Nanny Express is a platform for parents to find and share contact details of their nannies. Parents connect through Facebook, and can see the contact details of nannies posted by their friends. Nanny Express is open source and free to use. Worked in a team of 3 developers, to redesign the server and client, making the app responsive, improving code modularity, restructuring the API interaction, and upgrading the project scalability. Tech stack: Koa, MongoDB, React, Redux, Facebook Auth, OnsenUI.
As the last test in order to get admitted in Codeworks, the full stack JavaScript bootcamp I did back in 2018, I had one week to create and deliver a blackjack game. This was my first ever JavaScript + CSS + HTML project.
Figuring myself out after graduating from university. Lots of creative work in this period: advertising, short films, music composition and production, graphic design. Pivoted to a more technical role towards the end, specializing in live events doing video/audio systems set up and operation for conferences, shows and art installations. Finally, I decided I neeed a career change and started looking for education in the tech industry.
Video promoting a scooter.
Summary reel of my work as an Audiovisual Engineer in live events and conferences.
After my brief stay in Vancouver, I moved back to Barcelona and swapped doing freelancing on live events for a full-time job at an event company called Eikonos. From my freelancing experience, this was one of the companies with the most interesting projects and people to work with. I grew a lot there, and did really cool projects like the MotoGP world championship, music festivals, TV, movies, etc. I worked there for the best part of that year until at some point the crazy hours, traveling and lack of sleep started to take a toll on me and my personal life, so I decided to move on.
Decided to try moving out from Barcelona to Vancouver, worked a few months as an Audiovisual Engineer for FMAV. This was a medium-sized company that provided audiovisuals for events and conferences, it got aquired in 2018 by another company. I got to learn what's like to be an immigrant and how to adapt to a new culture and a new country. Although I missed my friends and family and didn't stay long, it was a valuable experience.
Video promoting rental apartments in Barcelona.
Art installation, I produced the original soundtrack.
Music video I produced for a local artist.
Volunteer Camera operator for creaRSA, a non-profit social initiative cooperative based in Barcelona that specializes in communication, production, and training related to Audiovisual Social Responsibility (RSA).
Documentary web series about assisted interventions with therapy dogs for people with disabilities, focused on the day-to-day work and therapeutic goals of the participants.
The bachelor's degree in Audiovisual Communication prepares audiovisual professionals for a variety of roles: director, scriptwriter, producer, visual and sound production and post-production designer, researcher, specialist in corporate communication and community manager. The bachelor's degree in Audiovisual Communication offers comprehensive training in the skills needed to thrive as an audiovisual professional. Students learn to use the technical tools that are needed to create content, and acquire practice in planning and implementing innovative audiovisual projects, in various formats and supports (audiovisual, radio, sound, text and digital). The subjects of this degree promote entrepreneurship, innovation and creativity through project-based learning. The programme also encourages participation in documentary and fiction film festivals, as well as contests for new audiovisual formats, and it fosters initiatives with social impact. Likewise, it promotes the training of professionals with critical and analytical skills, capable of studying and understanding the media and audiovisual products within the social, economic, political and cultural structure of which they are part.
Video promoting a group of educational technology companies I produced. I got this gig through my university's internship, as the company was part of this cluster of companies. Was fun because I had a pretty decend budget and could actually hire a bunch of buddies to help me out.
Acoustic live performance with my band at the Bambusound Documentary.
Video summarizing a music concert my band at the time played with a guest band from Portugal, was a lot of fun!
Acoustic live performance with my band at the Alfa Bar Barcelona.
A short documentary for a University project in the documentary subject. I got highest grade in the class for this one.
Video tutorial showing how to create a project with mydocumenta. Part of my University internship, I had to record some video tutorials for a webapp. Funny how I ended up building webapps later on.
Videoart piece for a University project. It's body horror stuff so don't watch it if you're sensitive. I did sound and lighting.
A music documentary for University project, I conceived the idea, did sound and OST production. Also interviewed the musicians. My band at the time was actually featured in the documentary.
Live performance with my band at the IKEA band contest.
Official lyric video for the song 'This is Not a Love Song' by my band. We recorded it in my bedroom / home studio.
A short TV show for a University project in the TV show subject. We actually went to a real TV studio and recorded the show. I did the sound mixing and cameo.
Official lyric video for the song 'Gas Powered' by my band. We recorded it in my bedroom / home studio. Getting quite metal with this one.
A short film for a University project in the audiovisual production subject.
The making of the music videoclip for my band I did the whole video and acting.
The first "real" song by my band at the time, we recorded it in my bedroom / home studio.
A music videoclip my band at the time, I made the whole video, acting, recording of the song, playing guitar, and backing vocals. This was really fun!
A guitar and bass cover of the song Cosmic Girl by Jamiroquai.
A short comedy film for a University project in the audiovisual production subject. I did camera operation and audio engineering.
Intensive 3-module sound engineering technician course at Sonopro Academy Barcelona that helped me professionalize my passion for music and start getting into technical aspects of music production. Module 1: Sound properties, acoustics, Pro Tools fundamentals, project setup, EQ, dynamics (compression/multicompression/limiters/de-essers), reverb, delays, modulation, distortion, phase relationships, and comprehensive microphone techniques. Module 2: Sound capture fundamentals, professional recording of voices/wind instruments/percussion/strings, advanced recording techniques, Pro Tools mastery, pitch correction, vocal/drum/acoustic/electronic instrument processing, advanced automation, ear training through technical analysis, and mixing foundations. Module 3: Advanced acoustics (3 levels), music theory for audio professionals, sound spatialization concepts, Pro Tools template systems, continued ear training, professional mixing techniques, analog/digital console operation, group/VCAs management, and sophisticated automation. State-of-the-art recording studios and hands-on training. Mentored by active industry professionals currently working in premier recording facilities and major live events.
Short comedy video about how to upload videos to YouTube. For a University project.
Intro to a school research project.
A short TV spot for a University project in the TV show subject. Announcing some kind of energy drink. Having fun with rotoscoping and other video editing techniques.
Songs composed and produced for my University's buddy play 'Guerra de Lleons'. First time doing some bit more serious stuff with Logic Pro.
Book trailer I produced. I did the sound recording and mixing, my buddy did photography and animation and his GF did the acting / voiceover.
Video promoting the International Women's Day event at the University of Barcelona. Part of a part-time job I had during University, making videos promoting University events.
Jokes video snow with a friend, more fun editing with Final Cut Pro.
A comedy news piece for a University project in the TV news subject. Fun fact: buddy playing the jouranlist became a very successful journalist, same as buddy playing the actor became a very successful actor.
Bass cover of the song Still take you home by Arctic Monkeys.
For a University project in the animation subject. Didn't really like animating too much.
Some street interviews for a school research project regarding John Lennon's murder.
Video resume / presentation for a University project, cringe
A music videoclip for a local band, I did boom mic operation (poorly)
First song I ever recorded for my band at the time - good times
A TV spot for a cleaning company, I did boom mic operation and also cameo in the video. This was actually my first paid job as a freelancer.
Video promotion for a local barber shop I produced.
Surrealist stop motion video for college - I did OST, some editing and cameo
Guitar and Bass cover of the song Don't stop by Foster the people.
Bass and Guitar solo cover of the song Day tripper by The Beatles.
Jokes music video with my buddies from university, I did music and video editing
Live performance of my band at the time
Skateboarding video with some friends in Donosti, having teenager fun times.
Guitar cover of the song Reptilia by The Strokes. For this one I actually climbed high on the rooftop, was scary but worth it.
Guitar cover of the song Mardy Bum by Arctic Monkeys. Recorded on my rooftop, more rooftop to come after this.
Snow video 0 trying out video Final Cut Pro editing software and a GoPro 3 camera.