Name | Progress |
---|---|
Introduction | Not Read |
๐ฐ Player | Not Read |
Name | Progress |
---|---|
Software Installation | Not Read |
Project Setup | Not Read |
Running and Testing | Not Read |
React and ReactDOM | Not Read |
๐ก Assignment 1: Welcome Message | Not Attempted |
Submissions | Not Read |
Name | Progress |
---|---|
JSX and Components | Not Read |
Props | Not Read |
๐พ Exercise: Props | Not Attempted |
CSS Styles | Not Read |
useState and Hooks | Not Read |
๐พ Exercise: useState | Not Attempted |
Conditional Rendering | Not Read |
Lists | Not Read |
๐พ Exercise: Lists | Not Attempted |
Forms and Events | Not Read |
๐พ Exercise: Forms | Not Attempted |
๐ก Assignment 2: Front End | Not Attempted |
Name | Progress |
---|---|
Pure Components - memo | Not Read |
Lifecycle - useEffect | Not Read |
Expensive? - useMemo | Not Read |
DOM Interactions - useRef | Not Read |
forwardRef | Not Read |
useImperativeHandle | Not Read |
๐พ useImperativeHandle | Not Attempted |
Context | Not Read |
useCallback | Not Read |
useId | Not Read |
useReducer | Not Read |
Name | Progress |
---|---|
Database | Not Read |
NextAuth and Github Authentication | Not Read |
Prisma and ORM | Not Read |
Project Setup | Not Read |
Project Authentication | Not Read |
Name | Progress |
---|---|
APIs | Not Read |
APIs - Slides | Not Attempted |
Rest APIs | Not Read |
Rest APIs - Express.js | Not Read |
ReastAPIs - Next.js | Not Read |
Securing APIs | Not Read |
Securing APIs - NextAuth | Not Read |
tRPC is a modern framework that enables type-safe communication between the client and server in TypeScript, focusing on API development. It differs from REST (Representational State Transfer) in several key ways, offering advantages and challenges depending on the use case.
Type-Safe Communication:
tRPC: Supports type-safe communication between the client and server by leveraging TypeScript. Types are inferred directly from the server-side implementation and shared with the client automatically.
REST: Generally, type information is not enforced across client-server communication. Instead, developers rely on OpenAPI (Swagger) specifications or manual data validation.
Request Structure:
tRPC: Has a Remote Procedure Call (RPC) style where clients call functions directly as if they were on the server.
REST: Follows a resource-oriented approach with HTTP methods like GET, POST, PUT, DELETE to perform CRUD operations.
Protocol Flexibility:
tRPC: Is typically used with HTTP or WebSockets but can be adapted to other protocols.
REST: Strictly uses HTTP.
Data Transfer:
tRPC: Allows direct function calls without needing to manually define endpoints or data shapes separately.
REST: Requires explicit endpoint definition, often resulting in over-fetching or under-fetching data due to fixed structures.
End-to-End Type Safety:
By sharing TypeScript types across the entire stack, tRPC ensures that the client knows precisely what data structures the server expects and will return. This reduces runtime errors and increases development speed with instant feedback.
Simplified API Development:
Developers can define backend functions that clients can invoke directly without requiring boilerplate API contracts or specifications. This minimises overhead and complexity.
Automatic Inference:
Types are inferred automatically on the client side from the server implementation, making code maintenance easier and reducing duplication.
Reduced Boilerplate:
tRPC eliminates the need for writing OpenAPI/Swagger specifications and additional data transformation layers.
Real-Time Support:
tRPC can work seamlessly over WebSockets for real-time features like subscriptions, making it highly suitable for modern web applications.
Performance:
With tRPC, the API calls can be more efficient due to reduced data transfer and optimised function invocation.
TypeScript Dependency: tRPC relies heavily on TypeScript, so it's most suitable for TypeScript projects. Developers without prior TypeScript knowledge may find it challenging.
Adoption: tRPC is relatively new and may have a smaller ecosystem compared to REST's broad adoption.
Tool Compatibility: While tools like OpenAPI or Swagger are unnecessary with tRPC, this also means less compatibility with existing tools that leverage these specifications.
tRPC offers significant advantages over REST in terms of developer productivity, type safety, and simplicity when building full-stack TypeScript applications. It is particularly advantageous for projects where the client and server share a codebase or require frequent iteration. However, REST remains valuable due to its established ecosystem and compatibility with other systems. Choose the framework that best fits the requirements of your specific project and development workflow.