React Course for Beginners w/ Tailwind CSS [2025]

Learn modern frontend web development using React and Tailwind CSS in this beginner course. ✏️ This course was developed by Alvin Zablan. Check out Alvin's channel: https://www.youtube.com/c/AlvinTheProgrammer 🔗 Learn more frontend development with Alvin: https://react-formula.com/ ❤️ Try interactive React courses we love, right in your browser: https://scrimba.com/freeCodeCamp-React (Made possible by a grant from our friends at Scrimba) 📖 Contents 📖 (0:00:00) Course Introduction (0:04:31) Your First App Exercise - https://react-formula.com/workspace/your-first-app (0:10:00) Rendering Components Exercise - https://react-formula.com/workspace/rendering-components (0:07:54) Passing Props - https://react-formula.com/workspace/passing-props (0:27:52) Passing Props II - https://react-formula.com/workspace/passing-props-ii (0:36:39) Passing Props III - https://react-formula.com/workspace/passing-props-iii (0:45:05) Intro to Tailwind CSS Lecture (0:49:40) Tailwind Basics Exercise - https://react-formula.com/workspace/tailwind-css-basics (0:59:55) Padding & Margin Lecture (1:03:21) Button Style Exercise - https://react-formula.com/workspace/button-style-exercise (1:14:30) Tailwind ClassNames Lecture (1:19:53) Button Component Exercise - https://react-formula.com/workspace/button-style-exercise (1:29:32) Flex Box Lecture (1:34:38) Flex Exercise - https://react-formula.com/workspace/flex-exercise (1:39:26) Flex Column Lecture (1:42:17) Flex Exercise II - https://react-formula.com/workspace/flex-exercise-ii (1:46:21) Analyzing Layouts Lecture (1:51:50) Tailwind Docs Lecture (1:56:04) Analyzing Layouts Exercise - https://react-formula.com/workspace/analyzing-layouts-exercise (2:22:59) Search Page Design Exercise - https://react-formula.com/workspace/search-page-design (2:49:53) Event Handling & State Lecture (2:57:08) Click Event Exercise - https://react-formula.com/workspace/click-event-exercise (3:12:05) Conditional Rendering Exercise - https://react-formula.com/workspace/conditional-rendering-exercise (3:29:28) Counter Exercise - https://react-formula.com/workspace/counter (3:39:27) Light Switch Exercise - https://react-formula.com/workspace/light-switch (3:58:22) Image Carousel Exercise - https://react-formula.com/workspace/image-carousel (4:17:43) Cat Carousel Exercise - https://react-formula.com/workspace/cat-carousel (4:42:11) Outro 🎉 Thanks to our Champion and Sponsor supporters: 👾 Drake Milly 👾 Ulises Moralez 👾 Goddard Tan 👾 David MG 👾 Matthew Springman 👾 Claudio 👾 Oscar R. 👾 jedi-or-sith 👾 Nattira Maneerat 👾 Justin Hual -- Learn to code for free and get a developer job: https://www.freecodecamp.org Read hundreds of articles on programming: https://freecodecamp.org/news