Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Building full stack projects with tRPC

Avatar for Brian Douglas Brian Douglas
November 10, 2022
Technology
89
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
34
Funding and Hiring Contributors
Avatar for Brian Douglas bdougie
0
49
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
48
The Secret Sauce is Open Source
Avatar for Brian Douglas bdougie
0
83
How to get your PR reviewed
Avatar for Brian Douglas bdougie
0
150
Automation w/GitHub Actions
Avatar for Brian Douglas bdougie
0
120
Getting Traction with Actions (2021)
Avatar for Brian Douglas bdougie
1
130

Other Decks in Technology

See All in Technology
Flow 不死：AI 時代 DevOps 的不變本質
Avatar for Cheng-Wei Chen cheng_wei_chen
2
550
脱SaaS！FDEを支えるプロビジョニングと分離設計
Avatar for Kenichi SUZUKI knih
0
300
Why is RC4 still being used?
Avatar for tamaiyutaro tamaiyutaro
0
160
起点・思考・出力で分解する 〜PM業務の自動化設計〜
Avatar for kazu_kichi_67 kazu_kichi_67
2
1.1k
秘密度ラベル初心者が第1歩でつまづかないための「設計・運用」ポイント
Avatar for seafay seafay
PRO
1
520
テスト設計の本質を改めて考えてみる～生成AIを活用する時代だからこそ、作ったテストの説明性を高めよう～
Avatar for YAMASAKI Takashi yamasaki696
1
140
ご挨拶「10周年を迎える共創ラボのこれまでとこれから」
Avatar for AIxIoTビジネス共創ラボ iotcomjpadmin
0
150
初めてのDatabricks勉強会
Avatar for Takaaki Yayoi taka_aki
2
190
Oracle Cloud Infrastructure：2026年6月度サービス・アップデート
Avatar for oracle4engineer oracle4engineer
PRO
1
380
從觀望到全公司落地：AI Agentic Coding 導入實戰 — 流程整合與安全治理
Avatar for Bo-Yi Wu appleboy
0
170
從開發到部署全都交給 AI：實作 AI 驅動的自動化流程
Avatar for Bo-Yi Wu appleboy
0
180
現場のトークンマネジメント
Avatar for dak2 dak2
1
200

Featured

See All Featured
Gemini Prompt Engineering: Practical Techniques for Tangible AI Outcomes
Avatar for Mfonobong Umondia mfonobong
2
450
Reflections from 52 weeks, 52 projects
Avatar for Jefferson Lam jeffersonlam
356
21k
Docker and Python
Avatar for Tania Allard trallard
47
3.9k
Discover your Explorer Soul
Avatar for Emna emna__ayadi
2
1.1k
How STYLIGHT went responsive
Avatar for nonsquared nonsquared
100
6.2k
Primal Persuasion: How to Engage the Brain for Learning That Lasts
Avatar for Mike Taylor tmiket
0
380
Money Talks: Using Revenue to Get Sh*t Done
Avatar for Nikki Halliwell nikkihalliwell
0
260
Unsuck your backbone
Avatar for Amy Palamountain ammeep
672
58k
AI Search:
Where Are We & What Can We Do About It?
Avatar for Aleyda Solis aleyda
0
7.6k
Performance Is Good for Brains [We Love Speed 2024]
Avatar for Tammy Everts tammyeverts
12
1.7k
Stop Working from a Prison Cell
Avatar for Chris Michel hatefulcrawdad
274
21k
Conquering PDFs: document understanding beyond plain text
Avatar for Ines Montani inesmontani
PRO
4
2.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