Tailwind CSS Crash Course with React – Build a Responsive Landing Page (Parallax Effect)

Get Your Free 14 Day Trial Of ClickFunnels Here!!

Subscribe: k

Learn how to style your components & websites without writing a single line of css. In this tutorial we will use Tailwind CSS, a utility-first CSS framework to build a responsive landing page in React.

We will also cover hot topics including accessibility and responsive design.

Timestamps

0: 00​ – Intro
1: 17 – Let’s get familiar with the app we will be working on
1: 47 – Install & Configure TailWind CSS
6: 57 – Setup React Router Dom
8: 51 – Boilerplate code
12: 16 – Boilerplate Header Component
14: 56 – Styling components using TailWind CSS
16: 02 – Accessibility with TailWind CSS
18: 47 – Style Header Component
20: 28 – Responsive Design using TailWind CSS
21: 12 – Finish styling our Header Component
32: 15 – Build & Style our Hero Banner
43: 08 – Handle Page Content
44: 49 – Build & Style our Footer Component
48: 48 – Build & Style our Cards Component
59: 47 – Quick Fix
1: 00: 35 – Outro

GitHub Project Repo: b

Don’t forget to comment, like and subscribe

My Website:

Social Media:
Follow me on GitHub:
Follow me on FaceBook: t

#reactjs #tailwindcss #reacthooks #developer #javascript #programming

You May Also Like