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

Building Dapps with React

Avatar for Glenn Reyes Glenn Reyes
March 10, 2023
Programming
0
96

Building Dapps with React

Avatar for Glenn Reyes

Glenn Reyes

March 10, 2023
Tweet

More Decks by Glenn Reyes

See All by Glenn Reyes
Advanced TypeScript for React
Avatar for Glenn Reyes glennreyes
0
77
TypeScript Patterns for Better React Components
Avatar for Glenn Reyes glennreyes
1
470
GraphQL for React Developers
Avatar for Glenn Reyes glennreyes
0
180
When things go wrong, get errors right!
Avatar for Glenn Reyes glennreyes
0
120
GraphQL for JS developers
Avatar for Glenn Reyes glennreyes
1
150
Third-Party or Custom Code? The Art of Software Decisions
Avatar for Glenn Reyes glennreyes
0
70
UI/UX challenges of Web3 and Dapps
Avatar for Glenn Reyes glennreyes
0
160
Secrets of building robust UI components
Avatar for Glenn Reyes glennreyes
0
370
Building modern React applications
Avatar for Glenn Reyes glennreyes
0
210

Other Decks in Programming

See All in Programming
Google Opalで使える37のライブラリ
Avatar for MIKIO KUBO mickey_kubo
3
140
Vueのバリデーション、結局どれを選べばいい？ ― 自作バリデーションの限界と、脱却までの道のり ― / Which Vue Validation Library Should We Really Use? The Limits of Self-Made Validation and How I Finally Moved On
Avatar for ねぎなす neginasu
2
1.4k
Introduce Hono CLI
Avatar for Yusuke Wada yusukebe
6
3.1k
AI駆動で0→1をやって見えた光と伸びしろ
Avatar for passion😎 passion0102
1
810
Go言語はstack overflowの夢を見るか？
Avatar for Takuto Nagami logica0419
0
520
他言語経験者が Golangci-lint を最初のコーディングメンターにした話 / How Golangci-lint Became My First Coding Mentor: A Story from a Polyglot Programmer
Avatar for uMa uma31
0
340
ソフトウェア設計の実践的な考え方
Avatar for 増田 亨 masuda220
PRO
4
640
pnpm に provenance のダウングレード を検出する PR を出してみた
Avatar for mattsuu ryo_manba
1
150
TransformerからMCPまで（現代AIを理解するための羅針盤）
Avatar for MIKIO KUBO mickey_kubo
7
4.9k
contribution to astral-sh/uv
Avatar for Shunsuke Tsuchiya shunsock
0
530
実践Claude Code：20の失敗から学ぶAIペアプログラミング
Avatar for 武田隆志 takedatakashi
18
8.3k
Android16 Migration Stories ~Building a Pattern for Android OS upgrades~
Avatar for Swimmy reoandroider
0
130

Featured

See All Featured
Docker and Python
Avatar for Tania Allard trallard
46
3.6k
Principles of Awesome APIs and How to Build Them.
Avatar for Keavy McMinn keavy
127
17k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
667
130k
StorybookのUI Testing Handbookを読んだ
Avatar for Shingo Yamazaki zakiyama
31
6.2k
Why You Should Never Use an ORM
Avatar for John Nunemaker jnunemaker
PRO
59
9.6k
The Psychology of Web Performance [Beyond Tellerrand 2023]
Avatar for Tammy Everts tammyeverts
49
3.1k
It's Worth the Effort
Avatar for 3n 3n
187
28k
We Have a Design System, Now What?
Avatar for Morgane Peng morganepeng
53
7.8k
The Power of CSS Pseudo Elements
Avatar for Geoffrey Crofte geoffreycrofte
80
6k
Making the Leap to Tech Lead
Avatar for Ryan Cromwell cromwellryan
135
9.6k
YesSQL, Process and Tooling at Scale
Avatar for Rocio Delgado rocio
173
15k
Designing for humans not robots
Avatar for Tammie Lister tammielis
254
26k

Transcript

  1. Glenn Reyes @glnnrys Building Dapps with React Workshop

  2. Glenn Reyes @glnnrys
 
 🇵🇭 living in 🇦🇹 Software Engineer


    at @avantgarde fi nance 
 building @enzyme fi nance 🤍 Web3, React, GraphQL, UIs
 🚴 Sports & 🎸 Music

  3. Goals for today

  4. @glnnrys · glennreyes.com 💡 Learn

  5. @glnnrys · glennreyes.com 🤪 Fun

  6. @glnnrys · glennreyes.com 🏁 Success!!!

  7. Agenda For today 🧑🏫 Short intro 🤸 Exercise 🫣 Review

    🤩 Repeat!

  8. What is a blockchain?

  9. None

  10. What is Ethereum?

  11. Ethereum is the community-run technology powering the cryptocurrency ether (ETH)

    and thousands of decentralized applications.

  12. What are Smart Contracts?

  13. A "smart contract" is simply a program that runs on

    the Ethereum blockchain.

  14. Read — Query a node on the network Write —

    Send a transaction

  15. What is Web3?

  16. New iteration of the 
 World Wide Web

  17. Web3 Architecture

  18. None

  19. Dapp

  20. Decentralized App

  21. Questions?

  22. Building a Dapp

  23. Ethereum Data Solidity Logic Hardhat EVM Smart Contracts Ethereum Development

    Environment Ethereum Tooling MetaMask Wallet Identity

  24. Ethereum Data Solidity Logic Hardhat EVM Smart Contracts Ethereum Development

    Environment Ethereum Tooling MetaMask Wallet Identity Vite React Development Environment Frontend Tooling React User Interfaces Frontend

  25. Let’s get started!

  26. https://github.com/glennreyes/ react-dapp-workshop