Skip to content

๐Ÿ— ๐Ÿ‘ฉโ€๐Ÿ’ป

FastAPI โš“๏ธ ๐Ÿ”› ๐Ÿ—„ ๐Ÿ”ง, ๐Ÿ‘† ๐Ÿคš ๐Ÿง ๐Ÿ”— โฎ๏ธ ๐Ÿ“š ๐Ÿงฐ, ๐Ÿ”Œ ๐Ÿง ๐Ÿ› ๏ธ ๐Ÿฉบ (๐Ÿšš ๐Ÿฆ ๐ŸŽš).

1๏ธโƒฃ ๐ŸŽฏ ๐Ÿ“ˆ ๐Ÿ‘ˆ ๐Ÿšซ ๐ŸŽฏ โญ ๐Ÿ‘ˆ ๐Ÿ‘† ๐Ÿ’ช ๐Ÿ— ๐Ÿ‘ฉโ€๐Ÿ’ป (๐Ÿ•ฃ ๐Ÿค™ ๐Ÿ“ฑ ) ๐Ÿ‘† ๐Ÿ› ๏ธ, ๐Ÿ“š ๐ŸŽ ๐Ÿ› ๏ธ ๐Ÿ‡ช๐Ÿ‡ธ.

๐Ÿ—„ ๐Ÿ‘ฉโ€๐Ÿ’ป ๐Ÿš‚

๐Ÿ“ค ๐Ÿ“š ๐Ÿงฐ ๐Ÿ— ๐Ÿ‘ฉโ€๐Ÿ’ป โšช๏ธโžก๏ธ ๐Ÿ—„.

โš  ๐Ÿงฐ ๐Ÿ—„ ๐Ÿš‚.

๐Ÿšฅ ๐Ÿ‘† ๐Ÿ— ๐Ÿ•ธ, ๐Ÿ“ถ ๐Ÿ˜Œ ๐ŸŽ› ๐Ÿ—„-๐Ÿ“•-๐Ÿ‡ฆ๐Ÿ‡ช.

๐Ÿ— ๐Ÿ“• ๐Ÿ•ธ ๐Ÿ‘ฉโ€๐Ÿ’ป

โžก๏ธ โ–ถ๏ธ โฎ๏ธ ๐Ÿ™… FastAPI ๐Ÿˆธ:

from typing import List

from fastapi import FastAPI
from pydantic import BaseModel

app = FastAPI()


class Item(BaseModel):
    name: str
    price: float


class ResponseMessage(BaseModel):
    message: str


@app.post("/items/", response_model=ResponseMessage)
async def create_item(item: Item):
    return {"message": "item received"}


@app.get("/items/", response_model=List[Item])
async def get_items():
    return [
        {"name": "Plumbus", "price": 3},
        {"name": "Portal Gun", "price": 9001},
    ]
from fastapi import FastAPI
from pydantic import BaseModel

app = FastAPI()


class Item(BaseModel):
    name: str
    price: float


class ResponseMessage(BaseModel):
    message: str


@app.post("/items/", response_model=ResponseMessage)
async def create_item(item: Item):
    return {"message": "item received"}


@app.get("/items/", response_model=list[Item])
async def get_items():
    return [
        {"name": "Plumbus", "price": 3},
        {"name": "Portal Gun", "price": 9001},
    ]

๐Ÿ‘€ ๐Ÿ‘ˆ โžก ๐Ÿ› ๏ธ ๐Ÿ”ฌ ๐Ÿท ๐Ÿ‘ซ โš™๏ธ ๐Ÿ“จ ๐Ÿš€ & ๐Ÿ“จ ๐Ÿš€, โš™๏ธ ๐Ÿท Item & ResponseMessage.

๐Ÿ› ๏ธ ๐Ÿฉบ

๐Ÿšฅ ๐Ÿ‘† ๐Ÿšถ ๐Ÿ› ๏ธ ๐Ÿฉบ, ๐Ÿ‘† ๐Ÿ”œ ๐Ÿ‘€ ๐Ÿ‘ˆ โšซ๏ธ โœ”๏ธ ๐Ÿ”— ๐Ÿ“Š ๐Ÿ“จ ๐Ÿ“จ & ๐Ÿ“จ ๐Ÿ“จ:

๐Ÿ‘† ๐Ÿ’ช ๐Ÿ‘€ ๐Ÿ‘ˆ ๐Ÿ”— โ†ฉ๏ธ ๐Ÿ‘ซ ๐Ÿ“ฃ โฎ๏ธ ๐Ÿท ๐Ÿ“ฑ.

๐Ÿ‘ˆ โ„น ๐Ÿ’ช ๐Ÿ“ฑ ๐Ÿ—„ ๐Ÿ”—, & โคด๏ธ ๐ŸŽฆ ๐Ÿ› ๏ธ ๐Ÿฉบ (๐Ÿฆ ๐ŸŽš).

& ๐Ÿ‘ˆ ๐ŸŽ โ„น โšช๏ธโžก๏ธ ๐Ÿท ๐Ÿ‘ˆ ๐Ÿ”Œ ๐Ÿ—„ โšซ๏ธโ” ๐Ÿ’ช โš™๏ธ ๐Ÿ— ๐Ÿ‘ฉโ€๐Ÿ’ป ๐Ÿ“Ÿ.

๐Ÿ— ๐Ÿ“• ๐Ÿ‘ฉโ€๐Ÿ’ป

๐Ÿ”œ ๐Ÿ‘ˆ ๐Ÿ‘ฅ โœ”๏ธ ๐Ÿ“ฑ โฎ๏ธ ๐Ÿท, ๐Ÿ‘ฅ ๐Ÿ’ช ๐Ÿ— ๐Ÿ‘ฉโ€๐Ÿ’ป ๐Ÿ“Ÿ ๐Ÿ•ธ.

โŽ openapi-typescript-codegen

๐Ÿ‘† ๐Ÿ’ช โŽ openapi-typescript-codegen ๐Ÿ‘† ๐Ÿ•ธ ๐Ÿ“Ÿ โฎ๏ธ:

$ npm install openapi-typescript-codegen --save-dev

---> 100%

๐Ÿ— ๐Ÿ‘ฉโ€๐Ÿ’ป ๐Ÿ“Ÿ

๐Ÿ— ๐Ÿ‘ฉโ€๐Ÿ’ป ๐Ÿ“Ÿ ๐Ÿ‘† ๐Ÿ’ช โš™๏ธ ๐Ÿ“‹ โธ ๐Ÿˆธ openapi ๐Ÿ‘ˆ ๐Ÿ”œ ๐Ÿ”œ โŽ.

โ†ฉ๏ธ โšซ๏ธ โŽ ๐Ÿ‡ง๐Ÿ‡ฟ ๐Ÿ—, ๐Ÿ‘† ๐ŸŽฒ ๐Ÿšซ๐Ÿ”œ ๐Ÿ’ช ๐Ÿค™ ๐Ÿ‘ˆ ๐Ÿ“‹ ๐Ÿ”—, โœ‹๏ธ ๐Ÿ‘† ๐Ÿ”œ ๐Ÿšฎ โšซ๏ธ ๐Ÿ”› ๐Ÿ‘† package.json ๐Ÿ“.

โšซ๏ธ ๐Ÿ’ช ๐Ÿ‘€ ๐Ÿ’– ๐Ÿ‘‰:

{
  "name": "frontend-app",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "generate-client": "openapi --input http://localhost:8000/openapi.json --output ./src/client --client axios"
  },
  "author": "",
  "license": "",
  "devDependencies": {
    "openapi-typescript-codegen": "^0.20.1",
    "typescript": "^4.6.2"
  }
}

โฎ๏ธ โœ”๏ธ ๐Ÿ‘ˆ โ˜• generate-client โœ ๐Ÿ“ค, ๐Ÿ‘† ๐Ÿ’ช ๐Ÿƒ โšซ๏ธ โฎ๏ธ:

$ npm run generate-client

frontend-app@1.0.0 generate-client /home/user/code/frontend-app
> openapi --input http://localhost:8000/openapi.json --output ./src/client --client axios

๐Ÿ‘ˆ ๐Ÿ“‹ ๐Ÿ”œ ๐Ÿ— ๐Ÿ“Ÿ ./src/client & ๐Ÿ”œ โš™๏ธ axios (๐Ÿ•ธ ๐Ÿ‡บ๐Ÿ‡ธ๐Ÿ” ๐Ÿ—ƒ) ๐Ÿ”˜.

๐Ÿ”„ ๐Ÿ‘… ๐Ÿ‘ฉโ€๐Ÿ’ป ๐Ÿ“Ÿ

๐Ÿ”œ ๐Ÿ‘† ๐Ÿ’ช ๐Ÿ—„ & โš™๏ธ ๐Ÿ‘ฉโ€๐Ÿ’ป ๐Ÿ“Ÿ, โšซ๏ธ ๐Ÿ’ช ๐Ÿ‘€ ๐Ÿ’– ๐Ÿ‘‰, ๐Ÿ‘€ ๐Ÿ‘ˆ ๐Ÿ‘† ๐Ÿคš โœ ๐Ÿ‘ฉโ€๐Ÿ”ฌ:

๐Ÿ‘† ๐Ÿ”œ ๐Ÿคš โœ ๐Ÿš€ ๐Ÿ“จ:

Tip

๐Ÿ‘€ โœ name & price, ๐Ÿ‘ˆ ๐Ÿ”ฌ FastAPI ๐Ÿˆธ, Item ๐Ÿท.

๐Ÿ‘† ๐Ÿ”œ โœ”๏ธ โธ โŒ ๐Ÿ“Š ๐Ÿ‘ˆ ๐Ÿ‘† ๐Ÿ“จ:

๐Ÿ“จ ๐ŸŽš ๐Ÿ”œ โœ”๏ธ โœ:

FastAPI ๐Ÿ“ฑ โฎ๏ธ ๐Ÿ”–

๐Ÿ“š ๐Ÿ’ผ ๐Ÿ‘† FastAPI ๐Ÿ“ฑ ๐Ÿ”œ ๐Ÿฆ, & ๐Ÿ‘† ๐Ÿ”œ ๐ŸŽฒ โš™๏ธ ๐Ÿ”– ๐ŸŽ ๐ŸŽ ๐Ÿ‘ช โžก ๐Ÿ› ๏ธ.

๐Ÿ–ผ, ๐Ÿ‘† ๐Ÿ’ช โœ”๏ธ ๐Ÿ“„ ๐Ÿฌ & โž•1๏ธโƒฃ ๐Ÿ“„ ๐Ÿ‘ฉโ€๐Ÿ’ป, & ๐Ÿ‘ซ ๐Ÿ’ช ๐Ÿ‘ฝ ๐Ÿ”–:

from typing import List

from fastapi import FastAPI
from pydantic import BaseModel

app = FastAPI()


class Item(BaseModel):
    name: str
    price: float


class ResponseMessage(BaseModel):
    message: str


class User(BaseModel):
    username: str
    email: str


@app.post("/items/", response_model=ResponseMessage, tags=["items"])
async def create_item(item: Item):
    return {"message": "Item received"}


@app.get("/items/", response_model=List[Item], tags=["items"])
async def get_items():
    return [
        {"name": "Plumbus", "price": 3},
        {"name": "Portal Gun", "price": 9001},
    ]


@app.post("/users/", response_model=ResponseMessage, tags=["users"])
async def create_user(user: User):
    return {"message": "User received"}
from fastapi import FastAPI
from pydantic import BaseModel

app = FastAPI()


class Item(BaseModel):
    name: str
    price: float


class ResponseMessage(BaseModel):
    message: str


class User(BaseModel):
    username: str
    email: str


@app.post("/items/", response_model=ResponseMessage, tags=["items"])
async def create_item(item: Item):
    return {"message": "Item received"}


@app.get("/items/", response_model=list[Item], tags=["items"])
async def get_items():
    return [
        {"name": "Plumbus", "price": 3},
        {"name": "Portal Gun", "price": 9001},
    ]


@app.post("/users/", response_model=ResponseMessage, tags=["users"])
async def create_user(user: User):
    return {"message": "User received"}

๐Ÿ— ๐Ÿ“• ๐Ÿ‘ฉโ€๐Ÿ’ป โฎ๏ธ ๐Ÿ”–

๐Ÿšฅ ๐Ÿ‘† ๐Ÿ— ๐Ÿ‘ฉโ€๐Ÿ’ป FastAPI ๐Ÿ“ฑ โš™๏ธ ๐Ÿ”–, โšซ๏ธ ๐Ÿ”œ ๐Ÿ›Ž ๐ŸŽ ๐Ÿ‘ฉโ€๐Ÿ’ป ๐Ÿ“Ÿ โš“๏ธ ๐Ÿ”› ๐Ÿ”–.

๐Ÿ‘‰ ๐ŸŒŒ ๐Ÿ‘† ๐Ÿ”œ ๐Ÿ’ช โœ”๏ธ ๐Ÿ‘œ โœ” & ๐Ÿ‘ช โ˜‘ ๐Ÿ‘ฉโ€๐Ÿ’ป ๐Ÿ“Ÿ:

๐Ÿ‘‰ ๐Ÿ’ผ ๐Ÿ‘† โœ”๏ธ:

  • ItemsService
  • UsersService

๐Ÿ‘ฉโ€๐Ÿ’ป ๐Ÿ‘ฉโ€๐Ÿ”ฌ ๐Ÿ“›

โ–ถ๏ธ๏ธ ๐Ÿ”œ ๐Ÿ— ๐Ÿ‘ฉโ€๐Ÿ”ฌ ๐Ÿ“› ๐Ÿ’– createItemItemsPost ๐Ÿšซ ๐Ÿ‘€ ๐Ÿ“ถ ๐Ÿงน:

ItemsService.createItemItemsPost({name: "Plumbus", price: 5})

...๐Ÿ‘ˆ โ†ฉ๏ธ ๐Ÿ‘ฉโ€๐Ÿ’ป ๐Ÿš‚ โš™๏ธ ๐Ÿ—„ ๐Ÿ”— ๐Ÿ› ๏ธ ๐Ÿ†” ๐Ÿ”  โžก ๐Ÿ› ๏ธ.

๐Ÿ—„ ๐Ÿšš ๐Ÿ‘ˆ ๐Ÿ”  ๐Ÿ› ๏ธ ๐Ÿ†” ๐Ÿ˜ ๐Ÿคญ ๐ŸŒ โžก ๐Ÿ› ๏ธ, FastAPI โš™๏ธ ๐Ÿ”ข ๐Ÿ“›, โžก, & ๐Ÿ‡บ๐Ÿ‡ธ๐Ÿ” ๐Ÿ‘ฉโ€๐Ÿ”ฌ/๐Ÿ› ๏ธ ๐Ÿ— ๐Ÿ‘ˆ ๐Ÿ› ๏ธ ๐Ÿ†”, โ†ฉ๏ธ ๐Ÿ‘ˆ ๐ŸŒŒ โšซ๏ธ ๐Ÿ’ช โš’ ๐Ÿ’ญ ๐Ÿ‘ˆ ๐Ÿ› ๏ธ ๐Ÿ†” ๐Ÿ˜.

โœ‹๏ธ ๐Ÿ‘ค ๐Ÿ”œ ๐ŸŽฆ ๐Ÿ‘† โ” ๐Ÿ“‰ ๐Ÿ‘ˆ โญ. ๐Ÿ‘ถ

๐Ÿ›ƒ ๐Ÿ› ๏ธ ๐Ÿ†” & ๐Ÿ‘ ๐Ÿ‘ฉโ€๐Ÿ”ฌ ๐Ÿ“›

๐Ÿ‘† ๐Ÿ’ช ๐Ÿ”€ ๐ŸŒŒ ๐Ÿ‘ซ ๐Ÿ› ๏ธ ๐Ÿ†” ๐Ÿ— โš’ ๐Ÿ‘ซ ๐Ÿ™… & โœ”๏ธ ๐Ÿ™… ๐Ÿ‘ฉโ€๐Ÿ”ฌ ๐Ÿ“› ๐Ÿ‘ฉโ€๐Ÿ’ป.

๐Ÿ‘‰ ๐Ÿ’ผ ๐Ÿ‘† ๐Ÿ”œ โœ”๏ธ ๐Ÿšš ๐Ÿ‘ˆ ๐Ÿ”  ๐Ÿ› ๏ธ ๐Ÿ†” ๐Ÿ˜ ๐ŸŽ ๐ŸŒŒ.

๐Ÿ–ผ, ๐Ÿ‘† ๐Ÿ’ช โš’ ๐Ÿ’ญ ๐Ÿ‘ˆ ๐Ÿ”  โžก ๐Ÿ› ๏ธ โœ”๏ธ ๐Ÿ”–, & โคด๏ธ ๐Ÿ— ๐Ÿ› ๏ธ ๐Ÿ†” โš“๏ธ ๐Ÿ”› ๐Ÿ”– & โžก ๐Ÿ› ๏ธ ๐Ÿ“› (๐Ÿ”ข ๐Ÿ“›).

๐Ÿ›ƒ ๐Ÿ— ๐Ÿ˜ ๐Ÿ†” ๐Ÿ”ข

FastAPI โš™๏ธ ๐Ÿ˜ ๐Ÿ†” ๐Ÿ”  โžก ๐Ÿ› ๏ธ, โšซ๏ธ โš™๏ธ ๐Ÿ› ๏ธ ๐Ÿ†” & ๐Ÿ“› ๐Ÿ™† ๐Ÿ’ช ๐Ÿ›ƒ ๐Ÿท, ๐Ÿ“จ โš–๏ธ ๐Ÿ“จ.

๐Ÿ‘† ๐Ÿ’ช ๐Ÿ›ƒ ๐Ÿ‘ˆ ๐Ÿ”ข. โšซ๏ธ โœŠ APIRoute & ๐Ÿ”ข ๐ŸŽป.

๐Ÿ–ผ, ๐Ÿ“ฅ โšซ๏ธ โš™๏ธ ๐Ÿฅ‡ ๐Ÿ”– (๐Ÿ‘† ๐Ÿ”œ ๐ŸŽฒ โœ”๏ธ ๐Ÿ•ด 1๏ธโƒฃ ๐Ÿ”–) & โžก ๐Ÿ› ๏ธ ๐Ÿ“› (๐Ÿ”ข ๐Ÿ“›).

๐Ÿ‘† ๐Ÿ’ช โคด๏ธ ๐Ÿšถโ€โ™€๏ธ ๐Ÿ‘ˆ ๐Ÿ›ƒ ๐Ÿ”ข FastAPI generate_unique_id_function ๐Ÿ”ข:

from typing import List

from fastapi import FastAPI
from fastapi.routing import APIRoute
from pydantic import BaseModel


def custom_generate_unique_id(route: APIRoute):
    return f"{route.tags[0]}-{route.name}"


app = FastAPI(generate_unique_id_function=custom_generate_unique_id)


class Item(BaseModel):
    name: str
    price: float


class ResponseMessage(BaseModel):
    message: str


class User(BaseModel):
    username: str
    email: str


@app.post("/items/", response_model=ResponseMessage, tags=["items"])
async def create_item(item: Item):
    return {"message": "Item received"}


@app.get("/items/", response_model=List[Item], tags=["items"])
async def get_items():
    return [
        {"name": "Plumbus", "price": 3},
        {"name": "Portal Gun", "price": 9001},
    ]


@app.post("/users/", response_model=ResponseMessage, tags=["users"])
async def create_user(user: User):
    return {"message": "User received"}
from fastapi import FastAPI
from fastapi.routing import APIRoute
from pydantic import BaseModel


def custom_generate_unique_id(route: APIRoute):
    return f"{route.tags[0]}-{route.name}"


app = FastAPI(generate_unique_id_function=custom_generate_unique_id)


class Item(BaseModel):
    name: str
    price: float


class ResponseMessage(BaseModel):
    message: str


class User(BaseModel):
    username: str
    email: str


@app.post("/items/", response_model=ResponseMessage, tags=["items"])
async def create_item(item: Item):
    return {"message": "Item received"}


@app.get("/items/", response_model=list[Item], tags=["items"])
async def get_items():
    return [
        {"name": "Plumbus", "price": 3},
        {"name": "Portal Gun", "price": 9001},
    ]


@app.post("/users/", response_model=ResponseMessage, tags=["users"])
async def create_user(user: User):
    return {"message": "User received"}

๐Ÿ— ๐Ÿ“• ๐Ÿ‘ฉโ€๐Ÿ’ป โฎ๏ธ ๐Ÿ›ƒ ๐Ÿ› ๏ธ ๐Ÿ†”

๐Ÿ”œ ๐Ÿšฅ ๐Ÿ‘† ๐Ÿ— ๐Ÿ‘ฉโ€๐Ÿ’ป ๐Ÿ”„, ๐Ÿ‘† ๐Ÿ”œ ๐Ÿ‘€ ๐Ÿ‘ˆ โšซ๏ธ โœ”๏ธ ๐Ÿ“‰ ๐Ÿ‘ฉโ€๐Ÿ”ฌ ๐Ÿ“›:

๐Ÿ‘† ๐Ÿ‘€, ๐Ÿ‘ฉโ€๐Ÿ”ฌ ๐Ÿ“› ๐Ÿ”œ โœ”๏ธ ๐Ÿ”– & โคด๏ธ ๐Ÿ”ข ๐Ÿ“›, ๐Ÿ”œ ๐Ÿ‘ซ ๐Ÿšซ ๐Ÿ”Œ โ„น โšช๏ธโžก๏ธ ๐Ÿ“› โžก & ๐Ÿ‡บ๐Ÿ‡ธ๐Ÿ” ๐Ÿ› ๏ธ.

๐Ÿ—œ ๐Ÿ—„ ๐Ÿ”ง ๐Ÿ‘ฉโ€๐Ÿ’ป ๐Ÿš‚

๐Ÿ— ๐Ÿ“Ÿ โœ”๏ธ โŽ โ„น.

๐Ÿ‘ฅ โช ๐Ÿ’ญ ๐Ÿ‘ˆ ๐Ÿ‘‰ ๐Ÿ‘ฉโ€๐Ÿ”ฌ ๐Ÿ”— ๐Ÿฌ โ†ฉ๏ธ ๐Ÿ‘ˆ ๐Ÿ”ค ItemsService (โœŠ โšช๏ธโžก๏ธ ๐Ÿ”–), โœ‹๏ธ ๐Ÿ‘ฅ โœ”๏ธ ๐Ÿ“› ๐Ÿ”ก ๐Ÿ‘ฉโ€๐Ÿ”ฌ ๐Ÿ“› ๐Ÿ’โ€โ™‚๏ธ. ๐Ÿ‘ถ

๐Ÿ‘ฅ ๐Ÿ”œ ๐ŸŽฒ ๐Ÿ’š ๐Ÿšง โšซ๏ธ ๐Ÿ—„ ๐Ÿข, ๐Ÿ‘ˆ ๐Ÿ”œ ๐Ÿšš ๐Ÿ‘ˆ ๐Ÿ› ๏ธ ๐Ÿ†” ๐Ÿ˜.

โœ‹๏ธ ๐Ÿ— ๐Ÿ‘ฉโ€๐Ÿ’ป ๐Ÿ‘ฅ ๐Ÿ’ช ๐Ÿ”€ ๐Ÿ—„ ๐Ÿ› ๏ธ ๐Ÿ†” โ–ถ๏ธ๏ธ โญ ๐Ÿญ ๐Ÿ‘ฉโ€๐Ÿ’ป, โš’ ๐Ÿ‘ˆ ๐Ÿ‘ฉโ€๐Ÿ”ฌ ๐Ÿ“› ๐Ÿ‘Œ & ๐Ÿงน.

๐Ÿ‘ฅ ๐Ÿ’ช โฌ ๐Ÿ—„ ๐ŸŽป ๐Ÿ“ openapi.json & โคด๏ธ ๐Ÿ‘ฅ ๐Ÿ’ช โŽ ๐Ÿ‘ˆ ๐Ÿ”ก ๐Ÿ”– โฎ๏ธ โœ ๐Ÿ’– ๐Ÿ‘‰:

import json
from pathlib import Path

file_path = Path("./openapi.json")
openapi_content = json.loads(file_path.read_text())

for path_data in openapi_content["paths"].values():
    for operation in path_data.values():
        tag = operation["tags"][0]
        operation_id = operation["operationId"]
        to_remove = f"{tag}-"
        new_operation_id = operation_id[len(to_remove) :]
        operation["operationId"] = new_operation_id

file_path.write_text(json.dumps(openapi_content))

โฎ๏ธ ๐Ÿ‘ˆ, ๐Ÿ› ๏ธ ๐Ÿ†” ๐Ÿ”œ ๐Ÿ“ โšช๏ธโžก๏ธ ๐Ÿ‘œ ๐Ÿ’– items-get_items get_items, ๐Ÿ‘ˆ ๐ŸŒŒ ๐Ÿ‘ฉโ€๐Ÿ’ป ๐Ÿš‚ ๐Ÿ’ช ๐Ÿ— ๐Ÿ™… ๐Ÿ‘ฉโ€๐Ÿ”ฌ ๐Ÿ“›.

๐Ÿ— ๐Ÿ“• ๐Ÿ‘ฉโ€๐Ÿ’ป โฎ๏ธ ๐Ÿ—œ ๐Ÿ—„

๐Ÿ”œ ๐Ÿ”š ๐Ÿ ๐Ÿ“ openapi.json, ๐Ÿ‘† ๐Ÿ”œ ๐Ÿ”€ package.json โš™๏ธ ๐Ÿ‘ˆ ๐Ÿ‡ง๐Ÿ‡ฟ ๐Ÿ“, ๐Ÿ–ผ:

{
  "name": "frontend-app",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "generate-client": "openapi --input ./openapi.json --output ./src/client --client axios"
  },
  "author": "",
  "license": "",
  "devDependencies": {
    "openapi-typescript-codegen": "^0.20.1",
    "typescript": "^4.6.2"
  }
}

โฎ๏ธ ๐Ÿญ ๐Ÿ†• ๐Ÿ‘ฉโ€๐Ÿ’ป, ๐Ÿ‘† ๐Ÿ”œ ๐Ÿ”œ โœ”๏ธ ๐Ÿงน ๐Ÿ‘ฉโ€๐Ÿ”ฌ ๐Ÿ“›, โฎ๏ธ ๐ŸŒ โœ, โธ โŒ, โ™’๏ธ:

๐Ÿ’ฐ

๐Ÿ•โ” โš™๏ธ ๐Ÿ” ๐Ÿ— ๐Ÿ‘ฉโ€๐Ÿ’ป ๐Ÿ‘† ๐Ÿ”œ โœ :

  • ๐Ÿ‘ฉโ€๐Ÿ”ฌ.
  • ๐Ÿ“จ ๐Ÿš€ ๐Ÿ’ช, ๐Ÿ”ข ๐Ÿ”ข, โ™’๏ธ.
  • ๐Ÿ“จ ๐Ÿš€.

๐Ÿ‘† ๐Ÿ”œ โœ”๏ธ โธ โŒ ๐ŸŒ.

& ๐Ÿ•โ” ๐Ÿ‘† โ„น ๐Ÿ‘ฉโ€๐Ÿ’ป ๐Ÿ“Ÿ, & โ™ป ๐Ÿ•ธ, โšซ๏ธ ๐Ÿ”œ โœ”๏ธ ๐Ÿ™† ๐Ÿ†• โžก ๐Ÿ› ๏ธ ๐Ÿ’ช ๐Ÿ‘ฉโ€๐Ÿ”ฌ, ๐Ÿ— ๐Ÿ• โŽ, & ๐Ÿ™† ๐ŸŽ ๐Ÿ”€ ๐Ÿ”œ ๐ŸŽจ ๐Ÿ”› ๐Ÿ— ๐Ÿ“Ÿ. ๐Ÿ‘ถ

๐Ÿ‘‰ โ›“ ๐Ÿ‘ˆ ๐Ÿšฅ ๐Ÿ•ณ ๐Ÿ”€ โšซ๏ธ ๐Ÿ”œ ๐ŸŽจ ๐Ÿ”› ๐Ÿ‘ฉโ€๐Ÿ’ป ๐Ÿ“Ÿ ๐Ÿ”. & ๐Ÿšฅ ๐Ÿ‘† ๐Ÿ— ๐Ÿ‘ฉโ€๐Ÿ’ป โšซ๏ธ ๐Ÿ”œ โŒ ๐Ÿ‘… ๐Ÿšฅ ๐Ÿ‘† โœ”๏ธ ๐Ÿ™† ๐Ÿ”– ๐Ÿ“Š โš™๏ธ.

, ๐Ÿ‘† ๐Ÿ”œ ๐Ÿ” ๐Ÿ“š โŒ ๐Ÿ“ถ โช ๐Ÿ› ๏ธ ๐Ÿ›ต โ†ฉ๏ธ โœ”๏ธ โŒ› โŒ ๐ŸŽฆ ๐Ÿ†™ ๐Ÿ‘† ๐Ÿ ๐Ÿ‘ฉโ€๐Ÿ’ป ๐Ÿญ & โคด๏ธ ๐Ÿ”„ โ„น ๐ŸŒโ” โš . ๐Ÿ‘ถ