React Tutorial for Beginners
Master React 18 with TypeScript! ⚛️ Build amazing front-end apps with this beginner-friendly tutorial. 🚀 Want the ultimate React deep dive? - Check out my complete course: https://mosh.link/react-course - Subscribe for more awesome content: https://goo.gl/6PYaGF ✋ Stay connected: - Twitter: https://twitter.com/moshhamedani - Facebook: https://www.facebook.com/programmingwithmosh/ - Instagram: https://www.instagram.com/codewithmosh.official/ - LinkedIn: https://www.linkedin.com/school/codewithmosh/ 📖 TABLE OF CONTENT 00:00:00 Course Intro 00:01:55 Prerequisites 00:02:43 What is React? 00:04:57 Setting Up the Development Environment 00:06:24 Creating a React App 00:09:17 Project Structure 00:11:20 Creating a React Component 00:16:41 How React Works 00:19:00 React Ecosystem 00:21:04 Building Components 00:21:40 Creating a ListGroup Component 00:27:15 Fragments 00:29:42 Rendering Lists 00:33:11 Conditional Rendering 00:38:36 Handling Events 00:44:43 Managing State 00:50:44 Passing Data Via Props 00:54:42 Passing Functions Via Props 00:58:27 State Vs Props 01:00:00 Passing Children 01:05:04 Inspecting Components with React Dev Tools 01:07:14 Exercise: Building a Button Component 01:14:15 Exercise: Showing an Alert #react #reactjs #javascript #coding
Timestamps (24)
Course Intro
Prerequisites
What is React?
Setting Up the Development Environment
Creating a React App
Project Structure
Creating a React Component
How React Works
React Ecosystem
Building Components
Creating a ListGroup Component
Fragments
Rendering Lists
when dealing with collections of simple items , you can use array.map( (item,index) => {}), the second argument to the map callback function returns the index of the element of the original array, then, you can simply set the key property using that index
Conditional Rendering
Handling Events
Managing State
Passing Data Via Props
Passing Functions Via Props
State Vs Props
Passing Children
Inspecting Components with React Dev Tools
Exercise: Building a Button Component
Exercise: Showing an Alert