大家好我叫 Danny ~ 目前是一個菜鳥的前端工程師,這次的 it 鐵人賽是本人第一次參賽,希望可以透過這次的內容增進自己的技術外,同時也希望可以帶給讀者有趣的知識點並運用在公司專案上,這次的主題是本人近一年常在使用的全端框架 trpc
,也算是近期突然火紅的技術~
trpc
主打的就是讓你可以在 client
端以及 server
端透過 http request
方式互相傳遞資料,例如 modal schema
、 api router info
等等,主要透過 end-to-end typesafe
自動生成相關的 interfcae
,讓 client
端在接 api
時可以馬上知道 api response
結果是什麼,可以大大提升 DX
的體驗。
trpc 會配合一些本人開發中會用到的套件例如 TanStack Query
用來接 api
, prisma
作為 orm 框架,甚至 next auth
管理 user auth
內容,對於已經習慣這些生態系的朋友可能會相對好入手。
因為 trpc
是一個用於全端框架例如Nextjs
,他對於 api
的生成非常直觀,同時 client
端是透過 react query
接 api
,所以可以非常快速就寫好整個頁面的邏輯。
同時 trpc
有很多方便的輔助工具幫你調適,例如 ci
整合 、 test case
、api playground
等等,之後也會跟讀者分享~
trpc
雖然可以用在 express
搭配 vite(react)
去做,但大部分的內容幾乎都是從 next
出發, 所以如果用 next
去起一個 trpc
也會有更多功能可以去使用,穩定性也會好一些。
本系列會盡量多準備一些 demo
讓讀者可以快速理解內容,雖然這次主題是全端框架,但我會盡量用簡單的方式,就算你是前端工程師,也可以快速掌握後端的概念,這部分讀者可以好好期待喔~
最後小工商一下,如果看完文章有不懂想提問的,本人目前有經營小社群大家有興趣也可以進來聊天喔~
✅ 前端社群 :
https://lihi3.cc/kBe0Y