Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

Building full stack projects with tRPC

Avatar for Brian Douglas Brian Douglas
November 10, 2022
Technology
90
0

Building full stack projects with tRPC

Avatar for Brian Douglas

Brian Douglas

November 10, 2022

More Decks by Brian Douglas

See All by Brian Douglas
 Funding & Hiring Contributors
Avatar for Brian Douglas bdougie
0
41
Funding and Hiring Contributors
Avatar for Brian Douglas bdougie
0
53
Unconventional Metrics in OSS
Avatar for Brian Douglas bdougie
0
150
Success in Open Source
Avatar for Brian Douglas bdougie
0
110
Measuring Success in Open Source
Avatar for Brian Douglas bdougie
0
57
The Secret Sauce is Open Source
Avatar for Brian Douglas bdougie
0
93
How to get your PR reviewed
Avatar for Brian Douglas bdougie
0
160
Automation w/GitHub Actions
Avatar for Brian Douglas bdougie
0
120
Getting Traction with Actions (2021)
Avatar for Brian Douglas bdougie
1
150

Other Decks in Technology

See All in Technology
【データ横丁主催】AI Agentがコンテキストを使って仕事をした後、何が残るのか― 組織の経験を次の判断に引き継ぐ「Agent Memory」
Avatar for KoheiOgawa shisyu_gaku
2
320
Databricksメトリクスビューはじめてのもくもく会
Avatar for Takaaki Yayoi taka_aki
0
160
【Findyテック文化祭ワークショップ】新卒エンジニア&採用担当と作る、 なりたい姿と今やるべき一歩
Avatar for ディップ株式会社 dip_tech
PRO
0
150
The seven pitfalls of AI (revised version)
Avatar for Uwe Friedrichsen ufried
0
190
並行性の問題を防げ！実践トランザクション入門
Avatar for Shoichi Ochi occhi
0
150
Apache Iceberg が拓く AI 時代のオープンレイクハウス
Avatar for Tomohiro Tanaka tomtanaka
0
210
Amazon Bedrock Agents ClassicからAmazon Bedrock AgentCoreへ移行した際、ガードレール設定が2箇所に割れた話
Avatar for Kohei Matsunobu matsunobu
0
170
LLM機能を自作して分かるSnowflake Cortex AIの強み
Avatar for Nayuta S. nayuts
0
170
検証フェーズはAIの回答を判断するための学習機会
Avatar for Toru_Kubota toru_kubota
2
280
FinTech 1-2 : Overview of FinTech
Avatar for Kenji Saito ks91
PRO
0
120
Claude Designがめちゃくちゃ便利なので使ってほしい
Avatar for morimorikochan diggymo
0
190
OpenClawでAzure DevOpsのWiki更新を自動化する - クラウドAIだけでは届かない場所へ
Avatar for yutakaosada yutakaosada
0
140

Featured

See All Featured
職位にかかわらず全員がリーダーシップを発揮するチーム作り / Building a team where everyone can demonstrate leadership regardless of position
Avatar for MADOX madoxten
69
66k
Designing Dashboards & Data Visualisations in Web Apps
Avatar for Des Traynor destraynor
232
55k
Odyssey Design
Avatar for Ryan Kendrick rkendrick25
PRO
2
850
The Impact of AI in SEO - AI Overviews June 2024 Edition
Avatar for Aleyda Solis aleyda
6
1.2k
Building Better People: How to give real-time feedback that sticks.
Avatar for Will Jessup wjessup
370
20k
Keith and Marios Guide to Fast Websites
Avatar for Keith Pitt keithpitt
413
23k
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
46
8.3k
技術選定の審美眼（2025年版） / Understanding the Spiral of Technologies 2025 edition
Avatar for Takuto WADA twada
PRO
120
120k
The Language of Interfaces
Avatar for Des Traynor destraynor
162
27k
Agile that works and the tools we love
Avatar for Rasmus Luckow-Nielsen rasmusluckow
331
22k
RailsConf 2023
Avatar for Aaron Patterson tenderlove
30
1.6k
Making Projects Easy
Avatar for Brett Harned brettharned
120
6.8k

Transcript

  1. @bdougieYO Building full stack projects with tRPC opensauced.pizza 1

  2. Brian Douglas youtube.com/ilikerobot Work fl ow Automation By leveraging the

    GitHub API The Last Dance Michael Jordan of content

  3. opensauced.pizza @bdougieYO 3 Statistically proven Area 31

  4. opensauced.pizza @bdougieYO 4 1 5 2 3 4 Triangle Offense

    (framework)

  5. Picking tech is hard

  6. Choose a framework

  7. Michael Jordan of open-source Brian Douglas

  8. opensauced.pizza @bdougie 8 OpenSauced: 
 “Open Source Insights, by the

    slice” . Image of the platform serving Digital Ocean’s Hacktoberfest 2022 insights for 95k. repos

  9. We chose Next.js

  10. opensauced.pizza @bdougie 10 Building Modern APIs

  11. opensauced.pizza @bdougie Building Modern APIs 11 Server Client GraphQL Or

    Swagger

  12. opensauced.pizza @bdougie 12 tRPC? TypeScript Remote Procedure Call

  13. opensauced.pizza @bdougie tRPC Setup 13 tRPC-server tRPC-client tRPC router

  14. opensauced.pizza @bdougie tRPC 14 Server Client Function Remote Calls

  15. https://beta.create.t3.gg/

  16. TypeScript Tailwind tRPC

  17. t3-app decisions made TypeScript Tailwind tRPC next-auth prisma

  18. opensauced.pizza @bdougie 18 Jamstack DEMO

  19. opensauced.pizza @bdougie 19 Jamstack

  20. localhost:3000

  21. opensauced.pizza @bdougie tRPC Setup 21 tRPC-server tRPC-client tRPC router

  22. opensauced.pizza @bdougie 22 tRPC-server tRPC-client tRPC Setup tRPC router

  23. opensauced.pizza @bdougie 23 tRPC-server tRPC-client tRPC Setup tRPC router

  24. opensauced.pizza @bdougie 24 tRPC-server pages create-t3-app setup tRPC router

  25. opensauced.pizza @bdougie 25 Backend

  26. server/example.ts tRPC Schema-less API development.

  27. opensauced.pizza @bdougie 27 Frontend

  28. localhost:3000

  29. pages/index.tsx react-query Powerful React state management

  30. pages/index.tsx react-query Powerful React state management

  31. pages/index.tsx react-query Powerful React state management

  32. tRPC router bene fi ts Caching Distribution JSON Magic

  33. opensauced.pizza @bdougie tRPC benefits Lowers the barrier for building. 33

    T3 Stack • focused on simplicity, modularity, and full-stack typesafety. It consists of: • Next.js, tRPC, Tailwind, CSS, TypeScript, Prisma, NextAuth.js

  34. opensauced.pizza @bdougie tRPC Lowers the barrier for building. 34

  35. opensauced.pizza @bdougieYO 35 1 5 2 3 4 create-t3-app (framework)

  36. hot.opensauced.pizza

  37. None

  38. opensauced.pizza @bdougieYO 38 youtube.com/opensauced

  39. opensauced.pizza @bdougieYO 39 youtube.com/opensauced

  40. Michael Jordan of open-source @bdougieYO