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

Building full stack projects with tRPC

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on. →
Avatar for Brian Douglas Brian Douglas
November 10, 2022
Technology
0
78

Building full stack projects with tRPC

Avatar for Brian Douglas

Brian Douglas

November 10, 2022
Tweet

More Decks by Brian Douglas

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

Other Decks in Technology

See All in Technology
競争優位を生み出す戦略的内製開発の実践技法
Avatar for 増田 亨 masuda220
PRO
2
500
AI Agentにおける評価指標とAgent GPA
Avatar for tsho tsho
1
230
Introduction to Sansan, inc / Sansan Global Development Center, Inc.
Avatar for Sansan, Inc. sansan33
PRO
0
3k
作るべきものと向き合う - ecspresso 8年間の開発史から学ぶ技術選定 / 技術選定con findy 2026
Avatar for FUJIWARA Shunichiro fujiwara3
6
1.6k
Data Hubグループ 紹介資料
Avatar for Sansan, Inc. sansan33
PRO
0
2.8k
Introduction to Sansan for Engineers / エンジニア向け会社紹介
Avatar for Sansan, Inc. sansan33
PRO
6
71k
Introduction to Sansan Meishi Maker Development Engineer
Avatar for Sansan, Inc. sansan33
PRO
0
360
AWS Bedrock Guardrails / 機密情報の入力・出力をブロックする — Blocking Sensitive Information Input/Output
Avatar for Kazuhito Nakayama kazuhitonakayama
2
180
AIエージェントで変わる開発プロセス ― レビューボトルネックからの脱却
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
2
790
1 年間の育休から時短勤務で復帰した私が、 AI を駆使して立ち上がりを早めた話
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
190
名刺メーカーDevグループ 紹介資料
Avatar for Sansan, Inc. sansan33
PRO
0
1.1k
AIで 浮いた時間で 何をする？ 2026春 #devsumi
Avatar for konifar konifar
16
3.4k

Featured

See All Featured
Side Projects
Avatar for Sacha Greif sachag
455
43k
Agile Actions for Facilitating Distributed Teams - ADO2019
Avatar for Mark Kilby mkilby
0
140
The Limits of Empathy - UXLibs8
Avatar for Cassini Nazir cassininazir
1
240
Reflections from 52 weeks, 52 projects
Avatar for Jefferson Lam jeffersonlam
356
21k
The Impact of AI in SEO - AI Overviews June 2024 Edition
Avatar for Aleyda Solis aleyda
5
750
We Are The Robots
Avatar for Honza Javorek honzajavorek
0
190
Building a A Zero-Code AI SEO Workflow
Avatar for Ian Lurie portentint
PRO
0
360
The agentic SEO stack - context over prompts
Avatar for schlessera schlessera
0
670
KATA
Avatar for Megan Lloyd mclloyd
PRO
35
15k
How Fast Is Fast Enough? [PerfNow 2025]
Avatar for Tammy Everts tammyeverts
3
470
Self-Hosted WebAssembly Runtime for Runtime-Neutral Checkpoint/Restore in Edge–Cloud Continuum
Avatar for Yuki Nakata chikuwait chikuwait
0
380
Highjacked: Video Game Concept Design
Avatar for Ryan Kendrick rkendrick25
PRO
1
300

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