frontend-requirements
8
总安装量
2
周安装量
#35969
全站排名
安装命令
npx skills add https://github.com/gemini960114/skills --skill frontend-requirements
Agent 安装分布
antigravity
2
Skill 文档
çæå端串æ¥éæ±æ¸ï¼FastAPI â frontend.mdï¼
ç®æ¨
æ ¹æãç®åæ¢æç FastAPI å¾ç«¯ API æåç¨å¼ç¢¼ãï¼æ°å¯«ä¸ä»½çµ¦å端工ç¨å¸«ä½¿ç¨ç串æ¥éæ±èæµç¨èªªææä»¶ï¼è¼¸åºæªååºå®çº frontend.mdï¼ä¸¦ä»¥ Markdown æ°å¯«ãçµæ§æ¸
æ¥ãå¯ç´æ¥äº¤ä»å端實ä½ã
æ ¸å¿ååï¼é常éè¦ï¼
- 以ãåç«¯è¦æéº¼ä¸²ãæéº¼å UI/UXãæéº¼èçé¯èª¤èçæ ãçºä¸»ï¼è䏿¯å¾ç«¯å¯¦ä½ç´°ç¯ã
- å¿ é å¾ç¨å¼ç¢¼ä¸æ´çåºäºå¯¦ï¼è·¯ç±ãrequest/response schemaãèªèæ¹å¼ãçæ å¼ãé¯èª¤ç¢¼ã
- ä¸è¦æç©ºç·¨é APIãè¥ç¨å¼ç¢¼æ¾ä¸å°ï¼å°±å¨æä»¶ä¸æ¨æ³¨ãæªå¨ç®åç¨å¼ç¢¼ä¸ç¼ç¾ã並給åºå端建è°çåé ï¼æå¤ 3 åééµåé¡ï¼ã
- æä»¶è®è åè¨ï¼å¾æªçéå¾ç«¯ç¨å¼ç¢¼çå端工ç¨å¸«ã
工使µç¨ï¼ä½ å¿ é ç §åï¼
- å
ææå°æ¡ä¸ç FastAPI å
¥å£èè·¯ç±å®ç¾©ï¼
- 常è¦ä½ç½®ï¼
main.pyãapp/main.pyãapp/api/*ãrouters/*ãapi.py - FastAPI è¨»åæ¹å¼ï¼
include_router()ãAPIRouter()ãprefix/tags
- 常è¦ä½ç½®ï¼
- æ¶éææ endpoint èå
¶æ¹æ³ãè·¯å¾åæ¸ãquery/bodyãå峿 ¼å¼ï¼
- 以 Pydantic model / response_model / typing 註è¨çºæº
- è§£æèªè/ææ¬æ©å¶ï¼è¥æï¼ï¼
- JWT / OAuth2PasswordBearer / API key / session cookie
- header å稱ãtoken æ ¼å¼ãéæ/å·æ°ï¼è¥æï¼
- ç¹å¥æ´çã工使´¾é / ä»»å / Job / Taskãç¸éæµç¨ï¼
- 建ç«ä»»åç APIï¼POSTï¼
- ä»»åæ¥è©¢/å表ï¼GETï¼
- ä»»åçµæåå¾ï¼GETï¼
- æ¯å¦éåæ¥ãæ¯å¦éè¦è¼ªè©¢ãçæ è½æèé¯èª¤æ å¢
- å°è³è¨æ´çæå端ååç
frontend.mdï¼- æ¯å API æä¾ request/response ç¯ä¾èé¯èª¤èç建è°
- è£ä¸åç«¯ä¸²æ¥æµç¨å»ºè°è UX 建è°ï¼loadingãretryãemptyãerror statesï¼
frontend.md å¿ åç« ç¯ï¼è¼¸åºæå¿ é å å«ï¼
ä½ æçµè¼¸åºè«æ¯ä¸ä»½å®æ´ç
frontend.mdï¼Markdown æä»¶ï¼ï¼è³å°å å«ä»¥ä¸ç« ç¯ï¼ä¸¦å¯ä¾å¯¦éå¾ç«¯è£å ï¼
0. æä»¶ç®çèç¯å
- éåå端è¦åçåè½ç¯å
- éè¦çç°å¢è®æ¸ï¼å¦ Base URLï¼
- åè¨èéå¶ï¼ä¾å¦ï¼åªè½å §ç¶²ãéè¦ VPNãCORS çï¼
1. 帳èè身å管ç
- 使ç¨è 註åï¼è¥æï¼
- ç»å
¥ / é©èæ©å¶
- Token/JWT çå徿¹å¼
- Header æ ¼å¼ï¼Authorization: Bearer xxxï¼
- Token éæè¡çºèå端èç建è°
- 使ç¨è
è§è²/æ¬éï¼è¥å¾ç«¯æå®ç¾©ï¼
- æ¬éä¸è¶³æçé¯èª¤ç¢¼è UI 建è°ï¼ä¾å¦å°åç»å ¥ãé¡¯ç¤ºç¡æ¬éï¼
2. API 使ç¨èªªæï¼å ±éè¦æ ¼ï¼
- API Base URLï¼å¾è¨å®æç¨å¼ç¢¼æ¨å°ï¼è¥ä¸æç¢ºå°±æ¨æ³¨ï¼
- å ±é headers
- content-typeãå峿 ¼å¼ï¼JSONï¼
- é¯èª¤åæçå ±éæ ¼å¼ï¼è¥å¾ç«¯æçµ±ä¸ error schemaï¼
- 龿/é試/ç¯æµï¼å¦æï¼
3. Endpoint ä¸è¦½è¡¨ï¼ç¸½è¡¨ï¼
- ç¨è¡¨æ ¼ååºï¼
- åè½
- Method
- Path
- Authï¼æ¯å¦éè¦ï¼
- ç°¡è¿°
4. API éä¸èªªæï¼å端串æ¥ç´°ç¯ï¼
éå°æ¯å endpointï¼æä¾ï¼
- åè½èªªæï¼å端è§åº¦ï¼ç¨å¨åªåç«é¢/æµç¨ï¼
- HTTP Method + Path
- Request
- path/query/body çæ¬ä½èªªæï¼åå¥ãå¿ å¡«ãé è¨ï¼
- ç¯ä¾ requestï¼JSONï¼
- Response
- 200/201 æåç¯ä¾ï¼JSONï¼
- éè¦æ¬ä½æç¾©
- Error Handling
- 401/403/404/422/429/500 çæ å¢
- å端建è°è¡çºï¼toastãéå°ãè¡¨å®æ¬ä½æç¤ºãé試ï¼
5. 工使´¾éè任念ç¨ï¼Job/Taskï¼
- 建ç«/æ´¾éä»»åç API è忏
- æ´¾éå¾çèçæµç¨ï¼åæ¥/é忥ï¼
- æ¯å¦æ¯æ´æ¹æ¬¡æ´¾éï¼è¥æï¼
- 建è°å端æµç¨ï¼ç¨æåæµç¨/æ¥é©æè¿°ï¼
- ä¾å¦ï¼å»ºç«ä»»å â 顯示 pending â éå§è¼ªè©¢ â success é¡¯ç¤ºçµæ / failed 顯示é¯èª¤
6. æ¥è©¢èçµæåå¾
- ä»»åå表ï¼å¤çï¼
- åé /æåº/篩é¸ï¼è¥æ¯æ´ï¼
- å®çä»»åæ¥è©¢
- ä»»åçµæåå¾ï¼è¥çºç¨ç« endpointï¼
- å¤§çµæ/æªæ¡ä¸è¼ï¼è¥æï¼
- streamingãpresigned URLãcontent-type èç
7. çæ èªªæï¼çæ æ©ï¼
- ååºææä»»åçæ ï¼ä¾å¦ pending/running/success/failedï¼
- æ¯åçæ çæç¾©ãUI åç¾å»ºè°ï¼badgeãloadingãç¦ç¨æéçï¼
- çæ è½æææ©ï¼ç±åªå API/äºä»¶é æï¼
- failed æé¯èª¤è³è¨æ¬ä½ï¼è¥æï¼è顯示建è°
8. å端實ä½å»ºè°
- 建è°çå¼å«é åºï¼æµç¨ï¼
- æ¯å¦éè¦ pollingï¼è¼ªè©¢ï¼
- å»ºè° intervalã忢æ¢ä»¶ãè¶ æçç¥
- 常è¦é¯èª¤è UX 建è°
- ä¾å¦ï¼401 â å°åç»å ¥
- 422 â è¡¨å®æ¬ä½æç¤º
- 5xx â å 許é試 + 顯示客æ/åå ±è³è¨
9. å ¶ä»ï¼è¥å¾ç«¯æï¼
- health check endpointï¼/healthï¼
- system info/version endpoint
- rate limit/é é¡/éå¶
- CORSãæªæ¡å¤§å°éå¶ãtimeout ç
ä½ è¼¸åºæçæ ¼å¼è¦æ±ï¼åå¿ éµå®ï¼
- æçµè¼¸åºæ¯ä¸ä»½å®æ´ç Markdown æä»¶å
§å®¹ï¼å¯ç´æ¥åæ
frontend.mdï¼ã - æ¨é¡å±¤ç´æ¸ æ¥ï¼#ã##ã###ï¼ã
- æ¯å endpoint è³å°çµ¦ä¸å request/response JSON ç¯ä¾ã
- è¥æä¸ç¢ºå®è³è¨ï¼æ¸ æ¥æ¨æ³¨ãæªå¨ç¨å¼ç¢¼ä¸ç¼ç¾ãï¼ä¸¦éä¸å端éè¦åå¾ç«¯ç¢ºèªç 1â3 ååé¡ï¼ä¸è¦è¶ é 3 åï¼ã