-----------------------------------------------------------

Link to final project code:

https://github.com/chrisdixon161/healthy-juice-bar

You can view the final project here:

https://healthy-juice-bar.netlify.app/

-----------------------------------------------------------

Introduction To Tailwind CSS

When building websites most of us fall into either 2 camps.

Either you are a coder or a designer. I am certainly not the best designer by a long way, but I still need the sites I build to look good. There are many frameworks and libraries out there to help with this, but many of them enforce their own particular way of doing things.

This is where Tailwind CSS comes into play. We can write our HTML as we normally do, and then make use of carefully designed class names called utility classes, to provide a clean and professional look to our projects. All while staying inside of our HTML.

This is especially useful when a project grows. Rather than constantly thinking of new class names and ever-growing stylesheets,

Tailwind offers a consistent design system your whole team can also use too.

Providing simple utilities for controlling almost everything such as spacing, colors, typography, and layout, and responsiveness.

This class is a complete introduction to Tailwind for beginners, but you should have some experience of HTML & CSS before taking it to get the best out of this class.

We cover all of the essentials such as:

Setting up Tailwind using various methods
Speeding up development with a live server
Tailwind utility classes & how to use them
Mobile-first styling
The color palette
Spacing utilities
Flexbox for general and responsive layout
Responsive design & breakpoints
Adding custom CSS
Tailwind directives
Deployment
And lots more!

Tailwind is a great skill to learn and can really help the look of your projects without a huge amount of work. I look forward to teaching you all about it, and I will see you inside the class!

Krishna R

Senior Frontend Developer

--

3