Software I use and gadgets I love ✨
Here’s a big list of all the tools, software, and hardware I use (or used to use) to stay productive and build great things.
Frameworks
Next.js
nextjs.org
After using standalone React for a while and running into the same configuration and optimisation hurdles (routing, code splitting, lazy loading, SSR, ...), I discovered Next.js v9 back in the day and was hooked by its simplicity. I've been using it ever since. Every new major version manages to make the tool even simpler to use, which is not always the case in the JavaScript ecosystem. Next.js is my go-to choice for any web project, my new Ruby on Rails.
Strapi
strapi.io
Strapi is one of those tools so flexible that it can fit many use cases. I've used it as a backend, admin panel and web API for my previous company. It's a great tool! A TypeScript support would be nice though.
Ruby on Rails
rubyonrails.org
Ah Ruby on Rails... This is where it all started for me. Even though I haven't used it in years, I still use its priceless principles and patterns in my work today. I still believe it's one of the best framework for building web applications faster.
Gatsby.js
gatsbyjs.com
I used Gatsby as a static site generator for a few projects back in 2018. The built-in lazy-loading and image optimization features felt like magic at the time. It was indeed blazing fast!
Librairies
React.js
reactjs.org
React blew my mind away and got me into frontend development. I taught myself the basics early 2018 and hit the ground running with projects. I have mainly been working with the React ecosystem since then.
Tailwind CSS
tailwindcss.com
I love Tailwind CSS and the people behind it. Their book Refactoring UI is a must-read for anyone getting into design. It made me better at building user interfaces in a couple of hours. I can say the same about using Tailwind CSS. Its intuitive class convention and beautiful theme set developers up for success like few other frameworks do. And in a world of JavaScript everything, it stands out for its simplicity while still being extremely powerful.
Chakra UI
chakra-ui.com
When I don't use Tailwind CSS, Chakra UI is my go-to (and favourite) React component library. It's well designed, accessible, themeable and composable. All the good stuff!
Prisma
prisma.io
Prisma is the perfect ORM companion for my Next.js projects. Thanks to my days using Active Records, it was fairly easy to start with Prisma, but the TypeScript support got me hooked and turned me into a fan! TypeScript elevates Prisma to a new level and makes database operation predictable, safe, and intuitive. As a frontend developer, it makes me feel in control rather than dreading touching the database.
Lottie Web
airbnb.io
As a developer, building animations with plain CSS or JavaScript is always a lengthy process. Lottie solved that problem for me. I've been able to integrate incredibly complex animations as easily as importing a static image.
Rebass
rebassjs.org
Rebass was one of the first component libraries I used. Its themeable and constraint-based design principles was exactly what I needed at the time, when I started building larger frontend apps.
Redux
redux.js.org
I've always had a love-hate relationship with Redux. It's a great tool, but the boilerplate can be a bit much. I love the one-way data flow and predictability of the state tree, but I believe there are better alternatives today.
Apollo Client
apollographql.com
Appolo Client is as good as react-query, but for GraphQL.
XState
xstate.js.org
Like TypeScript, it took some time to understand XState and unleash its full potential. But once I did, I was hooked! Finite state machines are a mind shift from traditional state management libraries but a worthwhile investment for anyone building complex UIs. It simplifies the complexity like few other tools. Its author, David Khourshid, is an excellent teacher and demystified the world of state machines in a fun way. I recommend watching his videos.
bn.js
github.com
JavaScript was not designed to handle precision math, but bn.js makes it possible. It's a non-negotiable dependency for projects with banking features.
Headless UI
headlessui.dev
Headless UI is made by the same team behind Tailwind CSS, hence both tools work together like magic, pretty neat! It's my go-to component library for Tailwind projects.
Radix UI
radix-ui.com
I love the level of details that went into making Radix UI. I use wherever Headless UI doesn't cut it.
React Query
tanstack.com
React Query is THE way to interact with any asynchronous state, usually a server. It takes care of all the complexity that goes into managing remote data, namely caching and refreshing. The amount of thinking that went into making React Query intuitive and easy to use is extraordinary. I can't imagine building a web application without it nowadays; it would feel primitive.
SWR
swr.vercel.app
I found out about SWR as I was browsing the Next.js docs. I was impressed by all the features of the tool and the simplicity of the API.
React Hook Form
react-hook-form.com
Few things are more complicated than building complex forms in React. The form state can quickly become a monstrous mess. I imagine this is why React Hook Form was invented after React introduced hooks in 2019. Along with React Final Form, React Hook Form is the easiest and most performant way to handle complex form data. I use it whenever I build a form. Even for forms as simple as one text input and submit button, the investment of setting up React Hook Form over React states pays off instantly.
React Router
reactrouter.com
React Router has been around for a while now, and has remained the most popular routing library for React, which is impressive. I always use it on standalone React projetcs.
React Final Form
final-form.org
The react adapter for the popular final-form library.
Auth.js
authjs.dev
Auth.js - previously NextAuth.js - is incredibly intuitive and covers most, if not all, authentication use cases. It's not my go to authentication library for my Next.js projects.
tRPC
trpc.io
I thought nothing could beat React Query at working with APIs. I was wrong. I believe tRPC is the latest frontier of developer experience on that front. I had a big wow moment when I first tried it. Data fetching is usually where type safety ends in frontend projects. tRPC not only makes it possible but incredibly fast.
Languages
TypeScript
typescriptlang.org
Unlike some of my favourite tools, TypeScript didn't impress me at first when I first used it in 2019. I felt like it was getting in the way of my development, as JavaScript is very flexible. But as I worked on increasingly bigger codebases, I got to love TypeScript. Getting the types right initially takes some time, but it always pays off as the project grows. It's my go-to language for all projects now.
HTML
developer.mozilla.org
Writing clean and accessible HTML is still a useful skill in 2023. I made the mistake of neglecting it when JavaScript frameworks were all the rage, but not anymore.
CSS
developer.mozilla.org
CSS has become incredibly powerful over the years. Advanced layouts and animations can be achieved with little CSS when understood properly.
JavaScript
developer.mozilla.org
Coming from Ruby, learning JavaScript came with its set of challenges. The language is extremely flexible and can fit multiple programming paradigms. It's a beautiful language when used properly.
GraphQL
graphql.org
Query language for your API.
SDKs
Stripe SDK
stripe.com
It would be hard to imagine a world where Stripe doesn't exist. Their web API documentation is the gold standard of developer experience. I started using their API in 2018, and I remember being impressed by how much I could do as a one-person show. It's one of the products with the most significant effort/reward ratio... Imagine building a payment portal from scratch, a developer's nightmare. Whenever I come back to Stripe for new clients' projects, they somehow manage to make their service even more enjoyable and intuitive to use. Bravo, Stripe!
Twilio SDK
twilio.com
I used Twilio to create onboarding flows with SMS verification. They made that process a breeze.
Google Auth SDK
developers.google.com
The gateway to Google's API ecosystem.
Google Calendar SDK
developers.google.com
I've worked a lot with Google's Calendar API when implementing a real-time, bi-directional calendar sync. Their webhook system is tricky to work with, but we made it work!
Mapbox SDK
mapbox.com
I tried Mapbox when Google Maps API became too expensive for our use case. It's a great alternative and simpler to set up than Google Maps.
Airtable SDK
airtable.com
I love Airtable so much that I've used their API as a backend or CMS for a few projects. It's not always a long-term solution, but it's a great way to get started quickly.
Firebase SDK
firebase.google.com
Like most Google APIS, Firebase can be a bit tricky to work with but covers a lot of use cases.
Ethers
docs.ethers.io
The library for interacting with the Ethereum blockchain.
Intercom SDK
developers.intercom.com
Popular communication API.
Fuels
fuellabs.github.io
The library for interacting with the Fuel blockchain.
Vercel AI SDK
sdk.vercel.ai
It would be much harder to build a snappy chat UI without Vercel AI SDK. It's a great tool that work with a wide variety of AI providers. And the SDK works on the frontend and backend, which is pretty neat!
Dev Tools
Visual Studio Code
code.visualstudio.com
I was a Sublime Text lover for years. It was a sad moment when I could no longer lie to myself and admit that VS Code was the best code editor out there. It's such a pleasure to use.
Prettier
prettier.io
Prettier changed my (dev) life. I discovered it around the same time I got into React, as I was transitioning from the Ruby world to the - much vaster - JavaScript world. It's incredibly useful as a solo developer and indispensable for teamwork. And the Tailwind plugin took my Tailwind CSS game to a new level. I remember the days when I formatted code manually; I can't believe I used to do that... Thank you, Prettier.
Docker
docker.com
I've barely scratched the surface of Docker. I've used it to run a few databases locally and it makes that process so much easier already.
Z - jump around
github.com
Z is a tiny shell script but such a cool one. It makes moving around the file system so much easier. I 'z' my way around directories instead of 'cd'ing like a caveman.
Parcel
parceljs.org
A zero-configuration bundler for the rest of us
Vite
vitejs.dev
Next-generation bundler for frontend projects.
Github
github.com
The most popular code hosting & collaboration platform
Github Copilot
github.com
Gitub Copilot is one of these tools with a massive wow factor, the kind you only have every few years. It's mind-blowing. Somedays, I feel like I am the copilot of Github Copilot, as it seems to increasingly know what I want to do.
Firefox Developer Edition
mozilla.org
I find Firefox's devtools more advanced and enjoyable to use than Chrome's. The network panel is particularly impressive.
Postman
postman.com
Postman was a game changer for me as I started building or working with APIs. The collaboration features they added make it the ultimate tool for API development.
iTerm
iterm2.com
I've never used the default MacOs terminal, but whenever I see someone's screen with it, I feel like I am looking at a computer from the 80s. iTerm feels like the way to go.
Fig
fig.io
Fig makes your terminal come alive with autocomplete and some AI magic. It's a great tool for productivity and learning new commands.
Workstation
M2 MacBook Air 15" (2023)
apple.com
I've been on the Mackbook Pro bandwagon since 2009, but the latest Apple M chips are such a game changer that a MacBook Air (with some extra RAM) is now more than enough for modern web development.
Smart Monitor 32" M7 UHD
samsung.com
I dreamed of having a high-resolution external monitor like this during all my travel years. It is now the case! It makes frontend development so much enjoyable.
Magic Keyboard
apple.com
I love how compact and portable this keyboard is, a great travel companion.
MX Vertical
logitech.com
I used to use the Magic Mouse, and would always have wrist pain after a few hours of work. The MX Vertical solved that problem, it's a pleasure to use.
Roost Laptop Stand
therooststand.com
This tiny, beautifully engineered laptop stand saved my neck and back during my years of working and nomading. It might seem costly at first but has probably saved me months, if not years, of physiotherapy. Roost turned any place into my office for the day in 30 seconds. It has made working remotely way more enjoyable. I even remember people asking about it when I used it in public places. I should have asked for a referral link! I still enjoy it occasionally when I work from a cafe, and it's still the best.