Packt
Tailwind CSS From Scratch - Learn by Building Projects
Packt

Tailwind CSS From Scratch - Learn by Building Projects

Gain insight into a topic and learn the fundamentals.
Beginner level

Recommended experience

14 hours to complete
3 weeks at 4 hours a week
Flexible schedule
Learn at your own pace
Gain insight into a topic and learn the fundamentals.
Beginner level

Recommended experience

14 hours to complete
3 weeks at 4 hours a week
Flexible schedule
Learn at your own pace

What you'll learn

  • Create and design rapid layouts and custom styles using Tailwind CSS.

  • Understand and describe the fundamentals and environment setup with Tailwind CLI.

  • Apply breakpoint classes and media queries effectively.

Details to know

Shareable certificate

Add to your LinkedIn profile

Recently updated!

September 2024

Assessments

5 assignments

Taught in English

See how employees at top companies are mastering in-demand skills

Placeholder
Placeholder

Earn a career certificate

Add this credential to your LinkedIn profile, resume, or CV

Share it on social media and in your performance review

Placeholder

There are 11 modules in this course

In this module, we will introduce you to the course by discussing the outcomes and project details, explaining what Tailwind CSS is, and guiding you through the initial setup of your development environment.

What's included

5 videos1 reading

In this module, we will delve into the foundational aspects of Tailwind CSS, focusing on utility-first design, color management, spacing, typography, layout, positioning, backgrounds, shadows, borders, and filters.

What's included

9 videos

In this module, we will expand on Tailwind CSS fundamentals by exploring interactivity, responsive design with media queries, and advanced layout techniques using columns, Flexbox, and Grid. We will also cover transitions, animations, and customization options.

What's included

9 videos1 assignment

In this module, we will improve your development environment by teaching you how to set up Tailwind CLI, use directives and functions, and configure optional tools like Webpack and PostCSS for a more efficient workflow.

What's included

3 videos

In this module, we will engage in hands-on learning through mini projects, focusing on creating useful components and layouts with Tailwind CSS to solidify your understanding and skills.

What's included

6 videos

In this module, we will guide you through the creation of a Clipboard website, covering the setup and configuration, designing various sections, and deploying the project to Netlify for live hosting.

What's included

8 videos1 assignment

In this module, we will build a Loopstudios website, focusing on setting up the project, designing the hero section, features, and creations, and ensuring responsiveness before deploying to Vercel.

What's included

9 videos

In this module, we will develop the Shortly website, covering the setup, navbar, hero section, link shortening form, and JavaScript validation, ensuring a fully functional and responsive design.

What's included

9 videos

In this module, we will create a testimonial grid project, focusing on the setup, designing individual testimonial boxes, applying grid classes, and utilizing the line clamp plugin for better text management.

What's included

6 videos1 assignment

In this module, we will build the Fylo website, covering the setup, header design with dark mode, JavaScript for color modes, and creating the hero section, features, testimonials, and smooth scroll functionality.

What's included

8 videos

In this module, we will develop the Bookmark Manager website, focusing on the setup, navbar, hero section, tabs layout, JavaScript for interactive elements, and ensuring a responsive design.

What's included

10 videos2 assignments

Instructor

Packt
Packt
170 Courses2,469 learners

Offered by

Packt

Recommended if you're interested in Mobile and Web Development

Why people choose Coursera for their career

Felipe M.
Learner since 2018
"To be able to take courses at my own pace and rhythm has been an amazing experience. I can learn whenever it fits my schedule and mood."
Jennifer J.
Learner since 2020
"I directly applied the concepts and skills I learned from my courses to an exciting new project at work."
Larry W.
Learner since 2021
"When I need courses on topics that my university doesn't offer, Coursera is one of the best places to go."
Chaitanya A.
"Learning isn't just about being better at your job: it's so much more than that. Coursera allows me to learn without limits."

New to Mobile and Web Development? Start here.

Placeholder

Open new doors with Coursera Plus

Unlimited access to 7,000+ world-class courses, hands-on projects, and job-ready certificate programs - all included in your subscription

Advance your career with an online degree

Earn a degree from world-class universities - 100% online

Join over 3,400 global companies that choose Coursera for Business

Upskill your employees to excel in the digital economy

Frequently asked questions