TypeScript Academy · Pelajaran

Penangan rute Router, pengetikan Request/Response

Ketik penangan rute Express: parameter, kueri, dan isi JSON; kirim respons bertipe dengan res.json dan DTO yang dapat digunakan ulang.

Pelajaran 1 dari 38 langkah

Penangan rute Router, pengetikan Request/Response adalah pelajaran TypeScript Academy gratis di CoddyKit. Ini adalah pelajaran 1 dari 3. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar TypeScript Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus TypeScript Academy mencakup 3 pelajaran total.

Pendahuluan

Tujuan: Hubungkan API Express kecil dengan tipe yang ketat. Anda akan memberi tipe pada parameter rute, kueri, dan isi JSON, lalu mengembalikan JSON bertipe dengan res.json.

  • Antarmuka DTO
  • Request<P, Res, Body, Q>
  • res.json bertipe

Penyiapan server

Inisialisasi Express dan aktifkan penguraian JSON. Jaga agar titik akhir kesehatan tetap kecil dan bertipe dengan Request/Response.

import express, { Request, Response } from "express"

const app = express()
app.use(express.json())

app.get("/", (_req: Request, res: Response) => {
  res.type("text/plain").send("OK")
})

app.listen(3000, () => console.log("http://localhost:3000"))

Parameter dan kueri

Beri tipe pada setiap bagian secara eksplisit: Parameter, Kueri, dan ResBody. Pelengkapan otomatis membantu menghindari salah ketik.

import { Request, Response } from "express"

type Params = { id: string }
 type Query = { verbose?: "1" | "0" }
 type ResBody = { id: string; name: string; details?: string }

export function getUser(req: Request<Params, ResBody, unknown, Query>, res: Response<ResBody>) {
  const { id } = req.params
  const { verbose } = req.query
  const body: ResBody = { id, name: "Ada", details: verbose === "1" ? "Loves math" : undefined }
  return res.status(200).json(body)
}

Isi dan respons bertipe

Beri anotasi pada body untuk POST/PUT, serta pada respons bertipe. DTO Anda juga berfungsi sebagai dokumentasi.

import { Request, Response } from "express"

type CreateUserBody = { name: string }
 type CreateUserRes = { id: string; name: string }

export function createUser(req: Request<{}, CreateUserRes, CreateUserBody>, res: Response<CreateUserRes>) {
  const { name } = req.body
  const result: CreateUserRes = { id: "u_1", name }
  return res.status(201).json(result)
}

Menghubungkan rute

Gabungkan penangan kecil yang bertipe. Parameter rute divalidasi dengan mencocokkannya dengan templat (misalnya, :id).

import express from "express"
import { getUser } from "./getUser"
import { createUser } from "./createUser"

const app = express()
app.use(express.json())

app.get("/users/:id", getUser)
app.post("/users", createUser)

app.listen(3000, () => console.log("http://localhost:3000"))

Kiat

Kiat:

  • Jaga DTO tetap kecil dan gunakan kembali di berbagai penangan.
  • Utamakan literal union untuk nilai kueri yang dibatasi.
  • Kembalikan kode status yang tepat dan JSON bertipe.

Pemeriksaan pengetikan Express

Pemeriksaan cepat: Bagaimana cara memberi tipe pada penangan Express dengan parameter dan isi JSON?

Ringkasan

Ringkasan: Anda memberi tipe pada parameter rute, kueri, isi, dan respons. Pola yang sama dapat diterapkan pada perute dan middleware.

Gratis untuk memulai

Belajar TypeScript dengan tutor AI — gratis

Tulis dan jalankan kode asli di browser kamu, dapatkan bantuan instan dari tutor AI 24/7, dan lanjutkan di mana kamu tinggalkan di web atau aplikasi.

Kursus
101
Pelajaran
352

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Penangan rute Router, pengetikan Request/Response” gratis?

Ya — teks lengkap “Penangan rute Router, pengetikan Request/Response” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus TypeScript Academy, upgrade ke CoddyKit PRO. Kursus TypeScript Academy mencakup 3 pelajaran total.

Apa yang akan aku pelajari di “Penangan rute Router, pengetikan Request/Response”?

Ketik penangan rute Express: parameter, kueri, dan isi JSON; kirim respons bertipe dengan res.json dan DTO yang dapat digunakan ulang. Kamu berlatih TypeScript Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.

Apakah aku perlu pengalaman untuk memulai TypeScript Academy?

Tidak diperlukan pengalaman sebelumnya. TypeScript Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 1 dari 3.

Berapa lama pelajaran “Penangan rute Router, pengetikan Request/Response” memakan waktu?

Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.

Bisakah aku menulis dan menjalankan kode dalam pelajaran TypeScript Academy ini?

Ya. Setiap pelajaran TypeScript Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.

Semua pelajaran dalam kursus ini

  1. Penangan rute Router, pengetikan Request/Response
  2. Validasi skema dengan zod & inferensi ke TS
  3. Middleware kesalahan & tipe hasil
← Kembali ke TypeScript Academy