Beginner Tailwind [FULL COURSE]
Here’s my full Beginner Tailwind course. Hope you enjoy it. Happy Tailwinding!
X:
Course:
CodePen Template:
00:00:00 Intro
00:01:21 Course Intro
00:02:45 How I Design w/ CSS
00:13:12 CodePen Template
00:17:51 CodePen Tips and Tricks
00:26:36 Tailwind Docs Overview
00:31:01 Tailwind Introduction
00:39:51 Tailwind Resources
00:43:11 What We’ll Build
00:47:35 Spacing, Margin, Padding
00:54:43 Box Properties
01:03:07 Sizing & Numbering System
01:08:22 Typography
01:18:00 Colors
01:25:37 Pseudo Classes
01:29:25 Transitions & Transforms
01:36:48 Animations
01:38:59 Gradients
01:44:54 Restyling
01:53:21 Layout & Positioning
02:00:51 Responsive Classes
02:09:59 Flexbox
02:22:47 Grid
02:34:44 Card Component
02:44:59 Card w/ Image
02:57:03 Responsive Card
03:08:58 Button Component
03:21:40 Outlined Button
03:28:30 Grouped Button
03:40:43 Form
03:53:18 Minimal Form
04:05:00 Colorful Form
04:16:14 Building a Course Site
04:19:10 Tailwind Build System
04:30:39 Purging Unused Classes
04:35:26 Customizing Colors
04:40:09 Deploy to Netlify
04:48:18 VS Code
04:54:41 Setting up HTML
04:59:39 Header Layout
05:05:55 Header Styling
05:12:59 Header Responsive
05:16:33 Hero Layout
05:24:04 Hero Styling
05:37:58 Hero Fun
05:49:12 Hero Responsive
05:53:35 Overview Layout
05:59:58 Overview Styling
06:11:48 Overview Fun
06:17:08 Overview Responsive
06:20:10 About Layout
06:27:15 About Styling
06:33:56 About Responsive
06:36:43 What You’ll Learn Layout
06:46:08 Learn Styling
06:50:37 Learn Fun
07:00:46 Learn Responsive
07:04:12 What You’ll Build
07:14:58 Pricing Layout
07:23:48 Pricing Styling
07:34:17 Pricing Fun
07:43:11 Pricing Responsive
07:49:37 FAQ
07:55:22 Footer Layout
08:05:01 Footer Styling
08:15:31 Footer Fun
08:21:22 Footer Responsive
08:25:35 Fixing Containers
08:28:59 Adding Links
08:31:09 Customizing Tailwind
08:44:22 Extracting Tailwind Styles
08:51:02 Tailwind and Vue
09:03:53 Tailwind Typography
09:10:48 Tailwind Tools
09:15:22 Outro
09:16:29 Recap