TypeScript Academy · Pelajaran

Keselamatan Jenis Hujung ke Hujung: Aliran Kerja Berasaskan Skema

Kekalkan satu sumber kebenaran daripada skema hingga klien.

Pelajaran 4 daripada 413 langkah

Keselamatan Jenis Hujung ke Hujung: Aliran Kerja Berasaskan Skema ialah pelajaran TypeScript Academy percuma di CoddyKit. Ini ialah pelajaran 4 daripada 4. Anda boleh membaca keseluruhan pelajaran di bawah secara percuma — kemudian berlatih secara praktikal dalam pelayar menggunakan penyunting kod terbina dalam dan tutor kecerdasan buatan 24/7. Pelajaran ini merupakan sebahagian daripada laluan pembelajaran TypeScript Academy, dan kemajuan anda disegerakkan merentas web serta aplikasi CoddyKit. Kursus TypeScript Academy merangkumi sejumlah 4 pelajaran.

Apakah Schema-First?

Schema-first bermaksud GraphQL schema ialah satu-satunya sumber kebenaran. Jenis bahagian hadapan, penyelesai bahagian belakang dan kontrak API semuanya terbit daripadanya — sekali gus menghalang mana-mana lapisan daripada tidak lagi selaras.

# The workflow:
# 1. Define schema (.graphql or SDL)
# 2. Generate server resolver types
# 3. Generate client operation types
# 4. Both sides automatically stay in sync

Mentakrifkan Schema

Tulis GraphQL schema anda dalam SDL (fail .graphql) dan lakukan commit ke repositori sebagai kontrak antara klien dengan pelayan.

# schema.graphql
type User {
  id: ID!
  name: String!
  email: String!
}

type Query {
  user(id: ID!): User
}

Pelayan: Menjana Jenis Penyelesai

Jalankan codegen dengan pemalam typescript-resolvers untuk menjana tandatangan penyelesai bertip daripada schema.

# Server codegen step
npx graphql-codegen --config codegen.server.yml

Klien: Menjana Jenis Operasi

Jalankan codegen dengan typescript-operations serta pemalam Apollo/urql untuk menjana cangkuk bertip daripada fail operasi .graphql.

# Client codegen step
npx graphql-codegen --config codegen.client.yml

Pengesanan Perubahan Pecah

Gunakan graphql-inspector untuk mengesan perubahan schema yang memecahkan keserasian (membuang medan atau mengubah jenis) sebelum perubahan itu sampai ke pengeluaran.

npx graphql-inspector diff ./api/schema.graphql ./api/schema.new.graphql
# Reports: BREAKING: Field 'User.email' was removed

Pendaftaran Schema

Pendaftaran schema (Apollo Studio, Hive) menyimpan versi schema, menjejaki perubahan dari semasa ke semasa dan memberikan amaran tentang perubahan yang memecahkan keserasian dalam CI.

# Push schema to Apollo Studio:
npx apollo schema:push --endpoint https://api.example.com/graphql

Membuat Mock dengan Schema

Gunakan schema untuk menjana data tiruan bagi pembangunan klien tanpa pelayan sebenar, sambil memastikan mock mematuhi schema.

import { buildClientSchema, introspectionFromSchema } from "graphql";
import { addMocksToSchema } from "@graphql-tools/mock";
const schema = buildClientSchema(introspectionResult);
const mockedSchema = addMocksToSchema({ schema });

tRPC sebagai Alternatif

Untuk projek TypeScript sahaja, tRPC menyediakan keselamatan jenis hujung ke hujung tanpa bahasa schema — jenis router pelayan IS kontrak klien.

// Server: router infers types
const router = t.router({ getUser: t.procedure.query(() => fetchUser()) });
// Client: types flow automatically via inference
const { data } = trpc.getUser.useQuery();

Zod + tRPC untuk Pengesahan

Gabungkan schema Zod dengan pengesah masukan tRPC untuk pengesahan masa jalan dan jenis masa kompilasi daripada satu definisi.

const createUser = t.procedure
  .input(z.object({ name: z.string(), email: z.string().email() }))
  .mutation(({ input }) => saveUser(input));
// input: { name: string; email: string } — from Zod schema

CI: Aliran Kerja Keselamatan Schema Lengkap

Aliran kerja CI yang lengkap untuk keselamatan schema-first: linter schema → semak perubahan yang memecahkan keserasian → jalankan codegen → semak jenis → jalankan ujian.

# .github/workflows/schema.yml
- run: npx graphql-inspector validate ...
- run: npx graphql-codegen --check
- run: npx tsc --noEmit
- run: npm test

Ringkasan: Aliran Kerja Schema-First

TypeScript schema-first: takrifkan SDL → jana jenis penyelesai pelayan → jana jenis operasi klien → kesan perubahan yang memecahkan keserasian dalam CI. Schema ialah satu-satunya sumber kebenaran untuk semua lapisan keselamatan jenis.

Semakan Pantas

Apakah peranan GraphQL schema dalam aliran kerja schema-first?

Jawab dalam pelajaran interaktif

Perkara yang Dipelajari

Aliran kerja TypeScript schema-first menerbitkan semua jenis daripada GraphQL schema. Jana jenis penyelesai untuk pelayan dan jenis operasi untuk klien, kesan perubahan yang memecahkan keserasian dalam CI, serta kekalkan schema sebagai kontrak antara semua lapisan.

Percuma untuk bermula

Pelajari TypeScript dengan tutor kecerdasan buatan — percuma

Tulis dan jalankan kod sebenar dalam pelayar anda, dapatkan bantuan segera daripada tutor kecerdasan buatan yang tersedia 24/7, dan sambung semula dari tempat anda berhenti di web atau dalam aplikasi.

Kursus: 101
Pelajaran: 352

Mula belajar secara percuma Lihat kursus penuh

Soalan Lazim

Adakah pelajaran “Keselamatan Jenis Hujung ke Hujung: Aliran Kerja Berasaskan Skema” percuma?

Ya — teks penuh “Keselamatan Jenis Hujung ke Hujung: Aliran Kerja Berasaskan Skema” boleh dibaca secara percuma di web ini. Untuk berlatih secara interaktif menggunakan penyunting kod terbina dalam dan tutor kecerdasan buatan 24/7, serta membuka kunci baki kursus TypeScript Academy, tingkat taraf kepada CoddyKit PRO. Kursus TypeScript Academy merangkumi sejumlah 4 pelajaran.

Apakah yang akan saya pelajari dalam “Keselamatan Jenis Hujung ke Hujung: Aliran Kerja Berasaskan Skema”?

Kekalkan satu sumber kebenaran daripada skema hingga klien. Anda berlatih TypeScript Academy menggunakan kod praktikal yang dijalankan terus dalam pelayar, manakala tutor kecerdasan buatan 24/7 menjawab soalan anda semasa anda mengikuti pelajaran.

Adakah saya memerlukan pengalaman untuk memulakan TypeScript Academy?

Tiada pengalaman terdahulu diperlukan. Pembelajaran TypeScript Academy di CoddyKit disusun untuk pelajar daripada peringkat pemula hingga lanjutan, jadi anda boleh bermula di sini atau dari awal dan belajar mengikut kadar anda sendiri. Ini ialah pelajaran 4 daripada 4.

Berapa lamakah pelajaran “Keselamatan Jenis Hujung ke Hujung: Aliran Kerja Berasaskan Skema” diambil?

Kebanyakan pelajaran CoddyKit mengambil masa kira-kira 5–10 minit. Setiap pelajaran ringkas dan interaktif, jadi anda boleh membuat kemajuan secara berterusan dan menyambung tepat dari tempat anda berhenti di web atau aplikasi.

Bolehkah saya menulis dan menjalankan kod dalam pelajaran TypeScript Academy ini?

Ya. Setiap pelajaran TypeScript Academy menyertakan penyunting kod terbina dalam, jadi anda boleh menulis dan menjalankan kod sebenar terus dalam pelayar serta menerima maklum balas kecerdasan buatan serta-merta — tanpa memerlukan persediaan setempat.

Semua pelajaran dalam kursus ini

Skema GraphQL kepada Jenis TypeScript
Penyelesai Berjenis dengan GraphQL Code Generator
Klien GraphQL Berjenis dengan Apollo dan urql
Keselamatan Jenis Hujung ke Hujung: Aliran Kerja Berasaskan Skema

← Kembali ke TypeScript Academy