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