Technologies

Let's start with the workspace. The location where your code will reside and the features that meet the needs of your users will be implemented.

Nx is a next-generation build system that offers first-class monorepo support and strong integrations for all well-known JavaScript frameworks. It enables you to use frontend frameworks like Angular or backend frameworks like NestJs to architect, test, and build your project at any size.

AnalogJs is a meta-framework for Angular. It provides you with all the benefits of Angular but extends its capabilities with even more:

AnalogJs uses Vite for serving and building as well as Vitest for testing. Vite is a next-generation JavaScript bundler that is super fast. It also gives us access to the Vite ecosystem with hundreds of very powerful plugins.

Another incredible advantage of AnalogJs is that it comes equipped to handle both Server-Side Rendering (SSR) and Static Site Generation (SSG) for Angular applications. With AnalogJs, Angular can easily power marketing websites, blog pages, and more! As AnalogJs is SSR by default, no further configuration is necessary.

Last but not least, AnalogJs supports API (server) routes and file-based routing for Angular apps. In an AnalogJs application, the folder hierarchy and filenames determine the routing. You won't ever need to declare a route array again.

Angular has opinionated routing solutions, a strong HttpClient for making asynchronous web queries, and, my personal favorite, an outstanding dependency injection system. Angular provides programmers with all the resources they need to create outstanding applications right out of the box.

tRPC stands for TypeScript Remote Procedure Call, and is a lightweight library for remotely calling backend functions on the client side. It makes communication between the backend and frontend incredibly easy, taking advantage of TypeScript inference to automatically warn you of errors on your client before you even save the change on your server file! Using tRPC will feel like using an SDK for your API's server code, giving you confidence in your endpoints.

We're just a few steps away from having complete type safety from our database to the template generating the DOM. Drizzle is the tool that will bring us there. Drizzle is a Node.js and TypeScript ORM. It allows you to create performant SQL queries with autocompletion powered by TypeScript. They also have incredible memes!

PostgreSQL is one of the world's most scalable databases. It is a sophisticated object-relational system applying SQL. Postgres allows you to securely store vast quantities of complex data. It enables developers to build the most sophisticated programs, carry out administrative operations, and establish integral environments. It is an open-source technology trusted by millions of developers.

It turns out that every Supabase project is powered by a dedicated PostgreSQL database. Supabase is a fantastic open-source Firebase replacement powered by the aforementioned Postgres database. It also provides a lot more features as your project expands and becomes more involved.

Finally, every good application needs a great UI. Although it's easier said than done, there are tools that help us do our best work. Tailwind is one of those essential tools for me. Tailwind is "a utility-first CSS framework packed with classes like flex, pt-4, text-center and rotate-90."

These utility classes let you modify the layout, color, spacing, font, shadows, and more to create a distinctive component design without leaving your HTML or adding any additional CSS code.