|
Listen to this story
|
In the last few months, users on various platforms have claimed that T3 Stack is rightfully gaining traction in developer circles. The reason—T3 Stack is the most recent addition to the list of tech stacks available for developers that aims to provide simplicity, modularity, and Full-stack safety standards.
Unlike most JavaScript frameworks, T3 lets users create loosely-linked components while also enabling them to choose other parts that their web application may need. It may be used independently or in conjunction with other frameworks like Backbone or React. The T3 stack primarily consists of NextJS, tRPC, TailwindCSS, TypeScript and Prisma.
NextJS
Although based on the React library, NextJS is well known as a framework for supporting server-side rendering and static websites unlike React. However, NextJS might be challenging to master without a background in ReactJS. The web apps created using NextJS are also faster in comparison to those created using ReactJS. Additionally, NextJS doesn’t need offline support and is less expensive than ReactJS for app development.
tRPC
GraphQL is currently the main technique used by TypeScript to construct typesafe APIs. However, since GraphQL is meant to be a language-neutral standard for creating APIs, several developers believe that it does not fully utilise the power of a language like TypeScript. In addition, GraphQL is also difficult to master since complexity analysis, performance, and ACL all demand non-trivial considerations. In comparison, tRPC is significantly simpler and connects more directly to users’ servers and website/app.
tRPC makes it easy to move quickly, make adjustments without changing a schema, and do so without taking the continually traversable graph into account.
TailwindCSS
Tailwind CSS is essentially a utility-first CSS framework for creating bespoke user interfaces quickly. It uses an in-line style to create a smooth user interface without requiring developers to write their own CSS codes.
Unlike Bootstrap—which tends to use generic patterns that make sites appear more or less the same—Tailwind CSS offers a set of utility classes to design UI with a great deal of freedom and distinctiveness. Further, in contrast to Bootstrap—which includes jQuery, Popper.js, Bootstrap JS, and the primary Bootstrap CSS file—Tailwind CSS has a single base stylesheet and is merely 27 kb in size (whereas Bootstrap stands at 308 kb). However, despite its easy usability, Tailwind CSS is yet to catch up to Bootstrap—which has been around for more than nine years and is widely used in the larger developer community.
TypeScript
Initially designed as a client-side programming language, JavaScript was later shown to be effective as a server-side programming language. But when JavaScript gained popularity, its codes became increasingly complex and cumbersome—preventing it from fulfilling the requirements of being an Object-Oriented Programming Language. It was then that TypeScript was established because JavaScript had already proven itself impossible as a server-side technology. Thus, while JavaScript is prototype-based language, TypeScript is widely known as an Object-Oriented Programming Language.
TypeScript is renowned for highlighting compilation mistakes only during the development phase, leading to relatively little runtime error. This could not be done with JavaScript. Additionally, unlike JavaScript, TypeScript provides static/strong typing, resulting in its correctness being tested only at compile time.
Browsers are unable to natively interpret the TypeScript codes. As a result, TypeScript comes up with a process called “Trans-piled”—which basically refers to the ability of the language to get compiled and converted into JavaScript. The browsers are then able to read and display the codes. In addition to that, all the codes written in JavaScript can be converted to TypeScript by changing the extension from .js to .ts.
Furthermore, since TypeScript is so flexible, it can be built to work on any browser, gadget, or operating system. With TypeScript, programmers may use the TS Code from native JavaScript code, include well-known JavaScript libraries, or use already-written JavaScript code.
Prisma
Prisma is essentially an object-relational mapper (ORM) that promises to make developers’ work more efficient and error-free. Prisma approaches ORMs directly, in contrast to conventional ORMs. It generates type-safe code and creates migrations automatically using a customised Schema Definition Language (SDL).
Prisma doesn’t employ classes or decorators for model definition, in contrast to TypeORM and MikroORM. Instead, it makes use of GraphQL’s Code Generator tool, which generates code from schema. The Prisma Client uses this produced TypeScript code for stronger type safety and comprehensive IDE auto-completion features.
