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
87
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
31
Funding and Hiring Contributors
Avatar for Brian Douglas bdougie
0
44
Unconventional Metrics in OSS
Avatar for Brian Douglas bdougie
0
140
Success in Open Source
Avatar for Brian Douglas bdougie
0
100
Measuring Success in Open Source
Avatar for Brian Douglas bdougie
0
48
The Secret Sauce is Open Source
Avatar for Brian Douglas bdougie
0
73
How to get your PR reviewed
Avatar for Brian Douglas bdougie
0
140
Automation w/GitHub Actions
Avatar for Brian Douglas bdougie
0
110
Getting Traction with Actions (2021)
Avatar for Brian Douglas bdougie
1
120

Other Decks in Technology

See All in Technology
AWS Transform CustomでIaCコードを自由自在に変換しよう
Avatar for k-kun duelist2020jp
0
150
20260428_Product Management Summit_tadokoroyoshiro
Avatar for tadokoro_yoshiro tadokoro_yoshiro
14
15k
AndroidアプリとCopilot Studioの統合
Avatar for なかしょ nakasho
0
150
AI와 협업하는 조직으로의 여정
Avatar for Arawn Park arawn
0
510
260422_Sansan_Tech_Talk__関西_vol.3_データ活用のリアル__矢田__.pdf
Avatar for SansanTech sansantech
PRO
0
120
スクラムの中で AI-DLC workflow を 使い始めて3ヶ月の振り返り
Avatar for 株式会社カミナシ kaminashi
0
130
基盤を育てる 外部SaaS連携の運用
Avatar for Hiroto Gamo gamonges_dresscode
1
120
Oracle AI Database@AWS：サービス概要のご紹介
Avatar for oracle4engineer oracle4engineer
PRO
4
2.4k
AIはハッカーを減らすのか、増やすのか？──現役ホワイトハッカーから見るAI時代のリアル【MEGU-Meet】
Avatar for サイバーセキュリティクラウド cscengineer
PRO
0
210
データを"持てない"環境でのアノテーション基盤設計
Avatar for SansanTech sansantech
PRO
1
150
AWS Agent Registry の基礎・概要を理解する/aws-agent-registry-intro
Avatar for Renya Kujirada ren8k
3
410
AIが自律的に働く時代へ Amazon Quick で実現するAIエージェント紹介
Avatar for こーへい koheiyoshikawa
0
110

Featured

See All Featured
A designer walks into a library…
Avatar for Paul Jervis Heath pauljervisheath
211
24k
Distributed Sagas: A Protocol for Coordinating Microservices
Avatar for Caitie McCaffrey caitiem20
333
22k
Six Lessons from altMBA
Avatar for Skipper Chong Warson skipperchong
29
4.2k
Lessons Learnt from Crawling 1000+ Websites
Avatar for Charles Meaden charlesmeaden
PRO
1
1.2k
Understanding Cognitive Biases in Performance Measurement
Avatar for Philip Tellis bluesmoon
32
2.9k
Unsuck your backbone
Avatar for Amy Palamountain ammeep
672
58k
Amusing Abliteration
Avatar for ianozsvald ianozsvald
1
160
Side Projects
Avatar for Sacha Greif sachag
455
43k
Helping Users Find Their Own Way: Creating Modern Search Experiences
Avatar for Dan Newman danielanewman
31
3.2k
Become a Pro
Avatar for Speaker Deck speakerdeck
PRO
31
5.9k
Dominate Local Search Results - an insider guide to GBP, reviews, and Local SEO
Avatar for Greg Gifford greggifford
PRO
0
150
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
Avatar for Kevin Liebholz kevinliebholz
37
6.4k

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