How to Code a Piano App with React JS

Описание: In this basics of React code review, I go over how to code a piano. This tutorial is for developers that want to learn React.js and have some basic web development skills. Full disclaimer, this is my first time working with React so feel free to roast me down in the comments section below!

📖 Code - https://github.com/SuboptimalEng/codi...

🎥 YouTube -    / suboptimaleng  
💻 GitHub - https://github.com/SuboptimalEng
🐦 Twitter -   / suboptimaleng  
🧵 Threads - https://www.threads.net/@suboptimaleng
📸 Instagram -   / suboptimaleng  

== [ Resources ] ==
Helpful React Intro Video:    • React - CS50 Beyond 2019  
Web Dev Simplified Piano: https://github.com/WebDevSimplified/J...

== [ Timestamps ] ==
00:00 Piano Demo
00:14 Intro
01:33 Tech Architecture: Key Component
03:09 Tech Architecture: Piano Component
03:56 Setup React Project
04:18 Piano Component
06:11 Key Component
07:14 CSS Styling
08:43 Base Piano
09:53 Refactor Code
11:43 Black/White Keys
14:06 Key Press
17:16 Setup
18:11 KeyDown Listener
20:00 KeyUp Listener
20:56 Example
21:19 Audio Files
21:46 Play Music
24:10 Fin
24:30 Demo

== [ Tags ] ==
#suboptimal #javascript #reactjs