Wprowadzenie do TRPC- budowanie efektywnego API

Zrozumienie podstaw TRPC

TRPC to biblioteka, która upraszcza budowę bezpiecznych i wydajnych API, umożliwiając efektywne budowanie aplikacji. Używając TRPC, programiści mogą skupić się na pisaniu funkcji zamiast manualnym tworzeniu i obsłudze endpointów, co czyni proces tworzenia API szybszym i bardziej efektywnym. Ważne jest zapoznanie się z podstawowymi konceptami przetwarzania zadań zdalnych (TRPC), takimi jak procedury, routery i adaptery. Alternatywą dla niego mogą być takie narzędzia jak GraphQL czy REST, jednak biorąc pod uwagę TypeScript, TRPC wydaje się bardziej efektywnym i intuicyjnym rozwiązaniem.

Czy szukasz wykonawcy projektów IT ?

Sprawdź case studies

Planowanie struktury API

Planowanie struktury bezpiecznych API jest podstawą każdej nowoczesnej aplikacji. Kluczem jest zrozumienie, jakie dane są przesyłane, gdzie są przechowywane i jak są chronione. To obejmuje zdecydowanie, które dane są publiczne, a które muszą być chronione. Ważnym krokiem jest również zaprojektowanie systemu autoryzacji, który zapewni właściwy dostęp do danych. TRPC zapewnia adaptery do popularnych rozwiązań które mogą być niezwykle przydatne przy tworzeniu logiki odpowiedzialnej za obsługiwanie żądań. Przy tworzeniu routerów biblioteka umożliwia nam tworzenie publicznych oraz zabezpieczonych procedur- które wymagają od użytkownika określonych permisji aby żądania zostały poprawnie obsłużone.

Instalacja i podstawowa konfiguracja TRPC

Konfiguracja środowiska do pracy z TRPC jest pierwszym kluczowym krokiem. Bogate możliwości tej biblioteki ułatwiają tworzenie API opartych na typach i funkcjach. Aby rozpocząć pracę, wymagana jest instalacja odpowiednich paczek przy użyciu preferowanego menadżera paczek, dla przykładu skorzystamy z npm:

npm install @trpc/server@next @trpc/client@next

Na początku musimy zdefiniować instancję TRPC:

// server

import { initTRPC } from '@trpc/server';
 
const trpc = initTRPC.create();

Następnie możemy przejść do stworzenia routera:

// server

const appRouter = trpc.router({
	getUser: trpc.publicProcedure.query(async (ctx) => {
		const user = db.user.findFirst(ctx.user)
		
		return user;
	})
})

export type AppRouter = typeof appRouter;
// przyda się dla zainicjowania kodu po stronie klienta

 W powyższym przykładzie inicjowana jest instancja TRPC do której następnie podłączany jest router, który posiada publiczną procedurę "getUser" która zwraca aktualnego użytkownika na bazie kontekstu. Dodatkowo na końcu eksportowany jest typ całego routera, który przyda się przy implementacji TRPC po stronie klienta. Takie rozwiązanie zapewnia pełne pokrycie typowania w momencie korzystania z API.

Konfiguracja TRPC po stronie klienta

Aby w pełni wykorzystać możliwości TRPC musimy również skonfigurować go po stronie klienta.

// client

import { createTRPCClient, httpBatchLink } from '@trpc/client';
import type { AppRouter } from './server';
 
export const trpc = createTRPCClient<AppRouter>({
  links: [
    httpBatchLink({
      url: 'http://localhost:3000',
    }),
  ],
});

// client

const user = await trpc.getUser.query();

Po zainicjowaniu klienta TRPC, można go używać w dowolnym miejscu w aplikacji po prostu go importując. Dzięki temu otrzymujemy w pełni otypowane procedury i wyniki od poszczególnych routerów i endpointów.

Podsumowanie

TRPC to biblioteka, która usprawnia tworzenie bezpiecznych i wydajnych API poprzez abstrakcję obsługi endpointów. Kluczowe koncepcje TRPC to procedury, routery i adaptery, które pomagają utrzymać wysoki poziom bezpieczeństwa. Planowanie struktury API jest kluczowe dla nowoczesnych aplikacji, a TRPC ułatwia tworzenie logiki routerów i procedur. Inicjalizacja i konfiguracja TRPC zarówno po stronie serwera, jak i klienta są kluczowymi krokami w implementacji. Dzięki pełnemu typowaniu, TRPC zapewnia bezproblemową i efektywną obsługę API.