Tailwind CSS From Scratch (Coursework)

This repository contains my coursework for the Tailwind CSS From Scratch course from Udemy. The course focuses on learning how to create modern layouts using the Tailwind CSS framework and emphasizes the use of utility classes over component-based frameworks like Bootstrap.

Course Overview

The course is structured into three main sections:

1. The Sandbox:

We begin by exploring various aspects of Tailwind CSS in a sandbox environment. These experiments focus on:

• Colors and Typography
• Spacing and Sizing
• Flexbox and Grid
• Utility Classes and Customization

This part allows for experimentation with individual features of Tailwind before jumping into real projects.

2. Mini-Projects:

Using what was learned in the sandbox, we then build small, practical projects such as:

• Email Subscribe Card
• Pricing Grids
• Product Modal
• Image Gallery
• Login Modal

These mini-projects provide hands-on experience with Tailwind classes in practical scenarios.

3. Full Website Projects:

We move on to larger, real-world landing pages and websites that implement modern design practices. Some projects integrate a bit of JavaScript for interactivity like menus and tabs. Key projects include:

• Clipboard: A software product landing page focused on flexbox.
• Loopstudios: A VR company website with responsive mobile menus and JavaScript.
• Shortly: A link-shortening tool with form validation and DOM manipulation.
• Testimonial Grid: A grid-based layout showcasing Tailwind's grid utilities.
• Fylo: A product page with light/dark mode saved to local storage.
• Bookmark: A bookmark manager landing page with a dynamic background, hamburger menu, and tabs.

🏅 Certificate of Completion

🔗 Course Link

Check out the course: Tailwind CSS From Scratch | Learn By Building Projects