Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Building Dapps with React
Search
Glenn Reyes
March 10, 2023
Programming
0
96
Building Dapps with React
Glenn Reyes
March 10, 2023
Tweet
Share
More Decks by Glenn Reyes
See All by Glenn Reyes
Advanced TypeScript for React
glennreyes
0
77
TypeScript Patterns for Better React Components
glennreyes
1
470
GraphQL for React Developers
glennreyes
0
180
When things go wrong, get errors right!
glennreyes
0
120
GraphQL for JS developers
glennreyes
1
150
Third-Party or Custom Code? The Art of Software Decisions
glennreyes
0
70
UI/UX challenges of Web3 and Dapps
glennreyes
0
160
Secrets of building robust UI components
glennreyes
0
370
Building modern React applications
glennreyes
0
210
Other Decks in Programming
See All in Programming
Google Opalで使える37のライブラリ
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
neginasu
2
1.4k
Introduce Hono CLI
yusukebe
6
3.1k
AI駆動で0→1をやって見えた光と伸びしろ
passion0102
1
810
Go言語はstack overflowの夢を見るか?
logica0419
0
520
他言語経験者が Golangci-lint を最初のコーディングメンターにした話 / How Golangci-lint Became My First Coding Mentor: A Story from a Polyglot Programmer
uma31
0
340
ソフトウェア設計の実践的な考え方
masuda220
PRO
4
640
pnpm に provenance のダウングレード を検出する PR を出してみた
ryo_manba
1
150
TransformerからMCPまで(現代AIを理解するための羅針盤)
mickey_kubo
7
4.9k
contribution to astral-sh/uv
shunsock
0
530
実践Claude Code:20の失敗から学ぶAIペアプログラミング
takedatakashi
18
8.3k
Android16 Migration Stories ~Building a Pattern for Android OS upgrades~
reoandroider
0
130
Featured
See All Featured
Docker and Python
trallard
46
3.6k
Principles of Awesome APIs and How to Build Them.
keavy
127
17k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
130k
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.2k
Why You Should Never Use an ORM
jnunemaker
PRO
59
9.6k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
49
3.1k
It's Worth the Effort
3n
187
28k
We Have a Design System, Now What?
morganepeng
53
7.8k
The Power of CSS Pseudo Elements
geoffreycrofte
80
6k
Making the Leap to Tech Lead
cromwellryan
135
9.6k
YesSQL, Process and Tooling at Scale
rocio
173
15k
Designing for humans not robots
tammielis
254
26k
Transcript
Glenn Reyes @glnnrys Building Dapps with React Workshop
Glenn Reyes @glnnrys 🇵🇭 living in 🇦🇹 Software Engineer
at @avantgarde fi nance building @enzyme fi nance 🤍 Web3, React, GraphQL, UIs 🚴 Sports & 🎸 Music
Goals for today
@glnnrys · glennreyes.com 💡 Learn
@glnnrys · glennreyes.com 🤪 Fun
@glnnrys · glennreyes.com 🏁 Success!!!
Agenda For today 🧑🏫 Short intro 🤸 Exercise 🫣 Review
🤩 Repeat!
What is a blockchain?
None
What is Ethereum?
Ethereum is the community-run technology powering the cryptocurrency ether (ETH)
and thousands of decentralized applications.
What are Smart Contracts?
A "smart contract" is simply a program that runs on
the Ethereum blockchain.
Read — Query a node on the network Write —
Send a transaction
What is Web3?
New iteration of the World Wide Web
Web3 Architecture
None
Dapp
Decentralized App
Questions?
Building a Dapp
Ethereum Data Solidity Logic Hardhat EVM Smart Contracts Ethereum Development
Environment Ethereum Tooling MetaMask Wallet Identity
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
Let’s get started!
https://github.com/glennreyes/ react-dapp-workshop