Koodin jakaminen ja uudelleenkäyttö
Oppikaa strategioita koodin uudelleenkäytön maksimoimiseksi asiakkaan ja palvelimen välillä, erityisesti tyyppien ja apuohjelmien osalta.
Koodin jakaminen ja uudelleenkäyttö on ilmainen tRPC:n tyyppiturvalliset API:t päästä päähän-oppitunti CoddyKitissä. Tämä on oppitunti 2/4. Voit lukea tästä oppimispolusta kokonaan mitkä tahansa 3 oppituntia ilmaiseksi — sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä käytännön harjoittelun sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Oppitunti kuuluu tRPC:n tyyppiturvalliset API:t päästä päähän-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. tRPC:n tyyppiturvalliset API:t päästä päähän-kurssilla on yhteensä 4 oppituntia.
Miksi koodia jaetaan?
tRPC-monorepossa teillä on usein useita sovelluksia (asiakas, palvelin, hallintapaneeli), joiden on käsiteltävä samoja tietorakenteita tai suoritettava samankaltaisia tehtäviä.
Koodin jakaminen on tehokas tekniikka, joka vähentää toisteisuutta, varmistaa yhdenmukaisuuden ja parantaa projektin ylläpidettävyyttä kokonaisuutena.
Tyypit asiakkaan ja palvelimen välillä
Yksi tRPC:n suurimmista eduista on päästä päähän ulottuva tyypitysturvallisuus. Tämä tarkoittaa, että käyttöliittymänne tietää automaattisesti niiden tietojen tyypit, joita taustajärjestelmänne lähettää ja vastaanottaa.
Tämä perustuu vahvasti TypeScript-tyyppien ja rajapintojen jakamiseen asiakas- ja palvelinsovellusten välillä.
Jaetun tyypin määrittäminen
Luodaan yksinkertainen User-rajapinta omistettuun packages/types-hakemistoon. Sekä palvelin että asiakas tuovat tämän paketin käyttöönsä.
/* packages/types/src/user.ts */
export interface User {
id: string;
name: string;
email: string;
}Palvelinpuolen jaetut tyypit
Nyt voimme käyttää tätä User-tyyppiä määrittämään tRPC-kyselyn odotetun tuloksen taustajärjestelmässä. Näin varmistetaan, että palvelimelta lähetettävät tiedot noudattavat täsmällisesti User-rakennetta.
/* packages/server/src/router/user.ts */
import { publicProcedure, router } from '../trpc';
import { User } from '@my-monorepo/types'; // Import shared type
export const userRouter = router({
getUsers: publicProcedure
.query(async () => {
const users: User[] = [
{ id: '1', name: 'Alice', email: 'alice@example.com' },
{ id: '2', name: 'Bob', email: 'bob@example.com' },
];
return users; // tRPC infers return type as User[]
}),
});Asiakaspuolen jaetut tyypit
Asiakaspuolella tRPC päättelee automaattisesti users-tyypit palvelimen määritelmän perusteella. Vaikka nimenomaista tuontia ei aina tarvita päättelyä varten, se parantaa selkeyttä ja mahdollistaa tyypin käyttämisen paikallisessa asiakaspuolen tilassa tai props-arvoissa.
/* packages/client/src/components/UserList.tsx */
import { trpc } from '../utils/trpc';
import { User } from '@my-monorepo/types'; // Optional, but good practice
function UserList() {
const { data: users, isLoading } = trpc.user.getUsers.useQuery();
if (isLoading) return <div>Loading users...</div>;
return (
<div>
{users?.map((user: User) => ( // 'user' is typed as User
<p key={user.id}>{user.name} ({user.email})</p>
))}
</div>
);
}Aputoimintojen jakaminen
Tyyppien lisäksi myös monia muita koodin osia voidaan jakaa. Näitä ovat esimerkiksi yleiset aputoiminnot, vakiot, validointiskeemat (kuten Zod-skeemat) ja jopa jaetut käyttöliittymäkomponentit, jos käytätte komponenttikirjastoa.
Jakaminen auttaa säilyttämään yhdenmukaisen käyttökokemuksen ja vähentää sovellusten välistä päällekkäistä koodia.
Aputoimintopaketin luominen
Luodaan packages/utils-hakemistoon yksinkertainen aputoiminto, joka muotoilee koko nimen. Sisällytetään mukaan myös jaettu vakio.
/* packages/utils/src/format.ts */
export function formatFullName(firstName: string, lastName: string): string {
return `${firstName} ${lastName}`;
}
export const APP_NAME = 'CoddyKit Learn'; // Example constantPalvelinpuolen aputoiminnot
Voitte tuoda ja käyttää näitä jaettuja aputoimintoja suoraan tRPC-taustajärjestelmän proseduurien sisällä. Näin logiikka pysyy yhdenmukaisena riippumatta siitä, käynnistyykö toiminto API-kutsusta vai palvelimen sisäisistä prosesseista.
/* packages/server/src/router/profile.ts */
import { publicProcedure, router } from '../trpc';
import { formatFullName } from '@my-monorepo/utils'; // Import shared utility
import { z } from 'zod'; // Assuming Zod is configured
export const profileRouter = router({
getUserProfile: publicProcedure
.input(z.object({ firstName: z.string(), lastName: z.string() }))
.query(({ input }) => {
const fullName = formatFullName(input.firstName, input.lastName);
return { greeting: `Hello, ${fullName}!` };
}),
});Asiakaspuolen aputoiminnot
Vastaavasti asiakaspuolen sovellus voi tuoda ja käyttää täsmälleen samoja aputoimintoja ja vakioita. Näin varmistetaan, että laskelmat tai näytettävä teksti vastaavat palvelimen logiikkaa.
/* packages/client/src/components/Greeting.tsx */
import { formatFullName, APP_NAME } from '@my-monorepo/utils'; // Import shared utility
function Greeting() {
const firstName = "Jane";
const lastName = "Doe";
const formattedName = formatFullName(firstName, lastName);
return (
<div>
<h1>Welcome to {APP_NAME}!</h1>
<p>User: {formattedName}</p>
</div>
);
}Jaetun koodin parhaat käytännöt
- Rakeisuus: Luokaa pieniä ja tarkasti rajattuja jaettuja paketteja (esim.
types,utils,ui). - Riippuvuudet: Jaetuilla paketeilla tulisi olla mahdollisimman vähän ulkoisia riippuvuuksia, jotta muut sovellukset eivät paisu tarpeettomasti.
- Välttäkää kehäriippuvuuksia: Varokaa luomasta kehäriippuvuuksia jaettujen pakettien tai sovelluksen ja jaettujen pakettien välille.
- Testaus: Testatkaa jaettu koodi perusteellisesti, koska muutokset voivat vaikuttaa useisiin sovelluksiin.
Jaetun koodin hyödyt
Mitkä seuraavista ovat tRPC-monorepossa asiakas- ja palvelinpuolen välillä jaettujen tyyppien ja aputoimintojen keskeisiä hyötyjä?
Kertaus: jakaminen kannattaa!
Tutkimme, kuinka tyyppien ja aputoimintojen jakaminen tRPC-monorepossa on keskeistä tehokkuuden maksimoinnissa. Tämä lähestymistapa vähentää toistoa, parantaa tyyppiturvallisuutta ja helpottaa asiakas- ja palvelinsovellusten ylläpidettävyyttä kokonaisuudessaan. Jäsentämällä projektin huolellisesti voitte rakentaa vankkoja ja yhdenmukaisia full-stack-sovelluksia.
Opi tRPC:n tyyppiturvalliset API:t päästä päähän tekoälytuutorin avulla — ilmaiseksi
Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.
- Kurssit
- 10
- Oppitunnit
- 40
Usein kysytyt kysymykset
Onko oppitunti ”Koodin jakaminen ja uudelleenkäyttö” ilmainen?
Kyllä — voit lukea täällä verkossa kokonaan ilmaiseksi mitkä tahansa tRPC:n tyyppiturvalliset API:t päästä päähän-oppimispolun 3 oppituntia, myös oppitunnin “Koodin jakaminen ja uudelleenkäyttö”. Sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä interaktiiviset harjoitukset sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. tRPC:n tyyppiturvalliset API:t päästä päähän-kurssilla on yhteensä 4 oppituntia.
Mitä opin oppitunnilla ”Koodin jakaminen ja uudelleenkäyttö”?
Oppikaa strategioita koodin uudelleenkäytön maksimoimiseksi asiakkaan ja palvelimen välillä, erityisesti tyyppien ja apuohjelmien osalta. Harjoittelet tRPC:n tyyppiturvalliset API:t päästä päähän-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.
Tarvitsenko kokemusta aloittaakseni tRPC:n tyyppiturvalliset API:t päästä päähän-opiskelun?
Aiempi kokemus ei ole tarpeen. CoddyKitin tRPC:n tyyppiturvalliset API:t päästä päähän-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 2/4.
Kuinka kauan ”Koodin jakaminen ja uudelleenkäyttö”-oppitunnin suorittaminen kestää?
Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.
Voinko kirjoittaa ja suorittaa koodia tällä tRPC:n tyyppiturvalliset API:t päästä päähän-oppitunnilla?
Kyllä. Jokainen tRPC:n tyyppiturvalliset API:t päästä päähän-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.
Kaikki tämän kurssin oppitunnit
- tRPC-monorepon määrittäminen
- Koodin jakaminen ja uudelleenkäyttö
- tRPC:n toiminnallisuuden laajentaminen
- Jaettujen tRPC-pakettien versiointi ja julkaisu