Tutorialspoint

April Learning Carnival is here, Use code FEST10 for an extra 10% off

Tailwind CSS : Build and Deploy Responsive Websites

person icon Nseabasi Udondian

4.3

Tailwind CSS : Build and Deploy Responsive Websites

Learn TailwindCSS, style your HTML easily and faster.

updated on icon Updated on Apr, 2024

language icon Language - English

person icon Nseabasi Udondian

category icon IT & Software,Tailwind CSS

Lectures -28

Duration -5.5 hours

4.3

price-loader

30-days Money-Back Guarantee

Training 5 or more people ?

Get your team access to 10000+ top Tutorials Point courses anytime, anywhere.

Course Description

This course is a Tailwind Course that suits the interests of both Developers who are new to TailwindCSS and Developers who wish to sharpen their already existing TailwindCSS skills.

Tailwind is  utility-first CSS framework packed with classes  that can be composed to build any design, directly in your markup thereby enabling you to rapidly build modern websites without ever leaving your HTML. With Tailwind, you do not need to write a single line of CSS.

In this course, you will learn how to setup the Development Environment for Tailwind, where you will install Tailwind using Node Package Manager (NPM), create a package.json file as well as a Tailwind.config.js file.

This course also teaches Tailwind utilities related to Container, Display, Color, Backgrounds, Padding, Margin, Typography, Borders, Flexbox, Grid, Shadow, Tables, Transform, Transition, Animation and lots more.

In this course, you will learn how to push your website to github and then deploy to the web using Netlify.

At the end of it all, you will be able to use TailwindCSS to apply styles to your HTML without writing a single line of CSS.

This course promises to be worth your while.

Below are the topics that this course offers:

1. Introduction to Tailwind

2. Adding Tailwind to your project

3. Tailwind Config.js file

4. Padding in Tailwind

5. Margin in Tailwind

6. Font Family in Tailwind

7. Font Style and Weight

8. Letter Spacing and Line Height

9. Text Align, Text Color, Text Opacity

10. Background Image

11. Background Size

12. Sizing and Hover in Tailwind

13. Borders

14. Box Shadow and Table

15. Transform

16. Transition and Animation

17. Customizing Animation

18. Display

19. Flexbox

20. Grid

21. Git and Netlify

Who this course is for:

  • Absolute Beginners to TailwindCSS
  • Seasoned Developers who are already working with Tailwind but wish to sharpen their Tailwind CSS skills


Goals

What will you learn in this course:

  • Introduction to Tailwind

  • Adding TailwindCSS to Your Project

  • Setting Up TailwindCSS Config File

  • Responsive Design in TailwindCSS

  • Customizing Breakpoints in TailwindCSS

  • Padding in TailwindCSS

  • Margin in TailwindCSS

  • Font Family in TailwindCSS

  • Font Size in TailwindCSS

  • Font Style and Weight in TailwindCSS

  • Letter Spacing and Line Height in TailwindCSS

  • Text Align, Text Color, Text Opacity, Text Decoration

  • Background Image in TailwindCSS

  • Background Size, Background Repeat, Background Attachment

  • Sizing and Hover TailwindCSS

  • Border in TailwindCSS

  • Box Shadow and Table in TailwindCSS

  • Display in TailwindCSS

  • Flexbox in TailwindCSS

  • Grid in TailwindCSS

  • Transform in TailwindCSS

  • Transition and Animation in TailwindCSS

  • Customizing Animation in TailwindCSS

  • Project: Building a responsive Website using TailwindCSS

  • Push The Website to Github

  • Deploy the Website using Netlify

Prerequisites

What are the prerequisites for this course?

  • To be able to follow along, you should have good enough knowledge of HTML and CSS


Tailwind CSS : Build and Deploy Responsive Websites

Curriculum

Check out the detailed breakdown of what’s inside the course

Introduction
4 Lectures
  • play icon Introduction to Tailwind 04:13 04:13
  • play icon Setup of Local Development Environment 07:59 07:59
  • play icon Adding Tailwind to your project 14:55 14:55
  • play icon Tailwind Config File 02:10 02:10
Responsive Design in Tailwind
2 Lectures
Tutorialspoint
Spacing in Tailwind
2 Lectures
Tutorialspoint
Typography
5 Lectures
Tutorialspoint
Background
2 Lectures
Tutorialspoint
Sizing and Hover
1 Lectures
Tutorialspoint
Borders, Box Shadow, and Table
2 Lectures
Tutorialspoint
Display, Flexbox, and Grid
3 Lectures
Tutorialspoint
Transform, Transition, and Animation
4 Lectures
Tutorialspoint
A project on Building a Responsive Website
1 Lectures
Tutorialspoint
Git and Netlify
1 Lectures
Tutorialspoint
Conclusion
1 Lectures
Tutorialspoint

Instructor Details

Nseabasi Udondian

Nseabasi Udondian

NSE is a seasoned Software Developer who doubles as a Software Development Instructor. She is passionate about teaching and has trained lots of interns, most of whom were absolute beginners.  Some of her students are now skilled Software Developers with gainful employment.

She is known for breaking her courses into very easy-to-understand steps thereby making learning easier, faster, and fun!.

If you want to learn the easy way, this is your spot, get this course by NSE.

She promises that it will be worth your while.

Course Certificate

Use your certificate to make a career change or to advance in your current career.

sample Tutorialspoint certificate

Our students work
with the Best

Related Video Courses

View More

Annual Membership

Become a valued member of Tutorials Point and enjoy unlimited access to our vast library of top-rated Video Courses

Subscribe now
Annual Membership

Online Certifications

Master prominent technologies at full length and become a valued certified professional.

Explore Now
Online Certifications

Talk to us

1800-202-0515