React Crash Course for Beginners 2021 - Learn ReactJS from Scratch in this 100% Free Tutorial!

May 5, 20211205750


Get Started with React.js and learn how to build amazing websites with ReactJS! Full Project included, 100% free! Join our bestselling ReactJS course: https://acad.link/reactjs Join our Academind Community on Discord: https://academind.com/community Check out all our other courses: https://academind.com/courses ---------- Timestamps: Introduction 00:00 What is React 00:27 First React Code 04:15 Building SPAs 11:40 React Alternatives 13:41 Creating a React Project 16:48 Setting Up a Code Editor 25:03 Diving Into the Created Project 28:07 How React Works & Understanding Components 34:38 More About Components & Styling with CSS Classes 42:15 Building & Reusing Another Component 47:50 Pros & Dynamic Content 55:09 Handling Events 1:00:27 Adding More Components 1:07:07 Introducing State 1:12:48 Event Props 1:21:07 Adding Routing 1:28:15 Adding Links & Navigation 1:45:07 CSS Modules 1:50:28 Outputting Lists 1:56:14 Adding More Components´2:02:04 Props Children 2:11:52 Adding a Form 2:20:31 Getting User Input & Handling Form Submission 2:29:30 Preparing the App for HTTP 2:39:15 Sending a Post Request 2:46:07 Navigating Programmatically 2:51:25 Getting Started with Fetching Data 2:55:07 useEffect 3:04:32 Introducing React Context´3:14:40 Context Logic & Different Ways of Updating State 3:25:43 Using Context in Components 3:31:37 More Context Usage 3:43:48 Summary 3:50:42 ---------- Code Files & Snapshots: Vanilla JS vs React Project Code: https://github.com/academind/react-complete-guide-code/tree/01-getting-started/code/react-vs-vanilla-js-example Style Files & Dummy Data: https://github.com/academind/react-complete-guide-code/tree/zz-reactjs-summary/extra-files Code Snapshots: https://github.com/academind/react-complete-guide-code/tree/zz-reactjs-summary/code Further Resources: React vs Angular vs Vue Comparison: https://academind.com/tutorials/angular-vs-react-vs-vue-my-thoughts/ Building a REST API with NodeJS: https://academind.com/tutorials/building-a-restful-api-with-nodejs/ Connecting SPAs to Databases: https://academind.com/tutorials/connect-to-database/ What is State?: https://academind.com/tutorials/what-is-state/ ---------- • Go to https://www.academind.com and subscribe to our newsletter to stay updated and to get exclusive content & discounts • Follow @maxedapps and @academind_real on Twitter • Follow @academind_real on Instagram: https://www.instagram.com/academind_real • Join our Facebook community on https://www.facebook.com/academindchannel/ See you in the videos! ---------- Academind is your source for online education in the areas of web development, frontend web development, backend web development, programming, coding and data science! No matter if you are looking for a tutorial, a course, a crash course, an introduction, an online tutorial or any related video, we try our best to offer you the content you are looking for. Our topics include Angular, React, Vue, Html, CSS, JavaScript, TypeScript, Redux, Nuxt.js, RxJs, Bootstrap, Laravel, Node.js, Progressive Web Apps (PWA), Ionic, React Native, Regular Expressions (RegEx), Stencil, Power BI, Amazon Web Services (AWS), Firebase or other topics, make sure to have a look at this channel or at academind.com to find the learning resource of your choice!