It’s the year 2067 and you remember the good ol’ days in 2025 where you could build a web application without using jQuery — all you needed was Javascript (ES6+) and frameworks like React, Vue or Angular. Heck, you could just vibe code with an AI editor like Cursor!
In 2067, all you need are your BrainDuds; you imagine the user interface and reason through the expected user experience and the duds write out the code — what a time to be alive!
You get the drift, right? Software and technology has always been about making things simpler through abstraction. Back in the day, people literally programmed with 0s and 1s. Now we write in high-level languages — but under the hood, it all still gets turned back into those same 0s and 1s to run on the machine.
We simply became more efficient and reduced the time needed doing manual, repetitive and complex coding tasks.
This article explores a number of tools, services, solutions and packages that I’ve come across in my dev journey so far — some I’ve personally used and others I’m yet to explore.
Keep in mind, there’s always a trade-off between control and convenience. While modern tools make you faster, nothing replaces understanding the fundamentals. Knowing the principles at the core will always give you an edge — because great engineers are problem solvers, not just fast typists using the latest shiny tool.
Now let’s dive in. These are the broad categories we’ll be exploring. I’ve indicated those I personally use and would recommend with a “ 🏂 ”
- Authentication & Authorisation
- Analytics, Logging and Tracking
- Payments
- CSS, UI Frameworks & Icon Packages
- Documentation
- Data Visualisation — Charts & Graphs
- SMS & Email Notifications
1. Authentication & Authorization (Access Control)
Clerk / clerk.com — 🏂
The easiest way to add authentication and user management to your application. Purpose-built for React, Next.js and Remix.
Better Auth / better-auth.com
Supports multiple OAuth providers. Allow users to sign in with their accounts, including GitHub, Google, Discord, Twitter, and more.
Lucia / lucia-auth.com
Lucia is an open source project to provide resources on implementing authentication using JavaScript and TypeScript.
2. Analytics, Logging and Tracking
Clarity / clarity.microsoft.com — 🏂
Clarity is a free user behavior analytics tool that helps you understand how users are interacting with your website through session replays and heatmaps.
Aptabase / aptabase.com — 🏂
Aptabase is an easy to use and open source alternative to Google Firebase Analytics for Mobile and Desktop applications.
Umami / umami.is
Umami is an open-source, privacy-focused web analytics tool that serves as an alternative to Google Analytics.
PostHog / posthog.com
PostHog is an all-in-one platform for product analytics, feature flags, session replays, experiments, and surveys that’s built for developers.
3. Payments
Stripe / stripe.com — 🏂
Stripe is a financial infrastructure platform for businesses. It allows you to process payments and manage subscriptions in many currencies for many countries.
Lemonsqueezy / lemonsqueezy.com
Lemon Squeezy is the all-in-one platform for running your SaaS business. Payments, subscriptions, global tax compliance, fraud prevention, multi-currency are some of the features they offer.
Paystack / paystack.com — 🏂
Paystack is used by businesses to accept payments online and offline from customers in Africa, supporting various channels like cards, mobile money and bank accounts.
Stripe is a fintech giant valued at $91.5 billion. Interestingly enough, Stripe has acquired both Lemonsqueezy and Paystack *wink
4. CSS, UI Frameworks & Icon Packages
TailwindCSS / tailwindcss.com — 🏂
Of course I use Tailwind 😂! Tailwind is utility-first CSS framework packed with classes that can be composed to build any design.
Shadcn / ui.shadcn.com
Shadcn-ui is a modern React component library that provides developers with a set of highly customisable and accessible UI components.
HeroUI / heroui.com — 🏂
An agnostic UI Framework that provides beautify ready components like Buttons and Modals that are easy to customise. It’s built on top of TailwindCSS.
React Icons / react-icons.github.io/react-icons — 🏂
Include popular icons in your React projects easily with react-icons, which utilises ES6 imports that allows you to include only the icons that your project needs.
5. Documentation
Mintlify / mintlify.com
Mintlify is a well-known documentation platform designed to help developers create, manage, and optimise API and product documentation efficiently.
Redocly / redocly.com
Redocly is a developer toolchain for designing, managing, and publishing API documentation. It helps you take an OpenAPI/Swagger spec and generate clean, interactive, and customisable API docs.
Scalar / scalar.com
An open source and offline first API Platform that integrates with dozens of API Frameworks (Elysia, Hono, FastAPI, etc) and comes with an integrated API playground.
6. SMS & Email Notifications
Twilio / twilio.com
It’s a communications APIs with AI and data for SMS, voice and email. Twilio gives you the tools to connect digital experiences on any channel, full access to your customer data, and AI to work efficiently.
Brevo / brevo.com — 🏂
Brevo is an email Marketing Platform that goes beyond emails with SMS, Email, chat, and more.
Deywuro / deywuro.com — 🏂
For Ghanaians, Deywuro is a cost-effective solution for sending SMS. Their pricing starts around GHS 0.009 per SMS
7. Data Visualisations — Charts & Graphs
Tremor / tremor.so — 🏂
Tremor makes it so easy to build beautiful dashboards for the ReactJS / Next.js ecosystem. With the least effort, you can quickly put dashboards together and focus on the data, not perky chart customizsation.
Chartjs / chartjs.org
Chart.js is a free JavaScript library for making HTML-based charts. It is one of the simplest visualization libraries for JavaScript.
Recharts / recharts.org
Quickly build your charts with decoupled, reusable React components. Reliable. Built on top of SVG elements with a lightweight dependency on D3 submodules.
What tools or tricks do you use to cut through the complexity in your projects? Drop them in the comments — I’d love to learn from you and update this article with your suggestions (with a shoutout, of course!) 😉