In this Tailwind CSS tutorial for beginners you will learn what Tailwind CSS is, why you should use it and why it's different to other CSS frameworks such as Bulma, Foundation and Bootstrap.
I will also walk you through step by step how to install Tailwind CSS using NPM and setting up our Tailwind CSS landing page project in VS Code.
???? Get my free guide on learning web development and getting a job: https://joetynan.co.uk
????️ View the code on GitHub: https://github.com/Joe-Tynan/tailwind-series
WATCH NEXT
???? Create a blog using Astro JS: https://youtu.be/9g-t3rb-uco
???? Learn HTML5 for Beginners: https://youtu.be/Rl_szkClckI
???? Create a Spotify clone with Next JS & Tailwind CSS: https://youtu.be/D0mNQ_QOdH8
MY FAVOURITE TOOLS & GEAR
???? Kualo - Super Fast, Reliable & Ethical Web Hosting: http://my.kualo.com/uk/go/01517/webhosting
WHO AM I?
If we haven’t met before, hey I’m Joe, a self taught web developer. Through my videos here on this channel I share web development tutorials to help you learn new languages and technologies and keep improving your development skills.
If you enjoy my content and would like to support me you can buy me a coffee!
☕ Buy me a coffee: https://bmc.link/JoeTynanWeb
TIMESTAMPS
0:00 - Introduction
0:18 - Landing page project overview
01:26 - What is Tailwind CSS?
01:55 - Why is Tailwind different?
03:23 - How to install Node JS
04:26 - Checking if Node JS is installed on our computer
04:59 - Installing Tailwind CSS
06:40 - What is the node modules folder?
06:58 - What are the package.json and package-lock.json files?
07:59 - What is the tailwind.config.json file?
08:28 - How Tailwind works
09:13 - Creating a CSS file and importing Tailwind using directives
10:09 - Running the Tailwind build process
11:31 - How to get the source files for this series
#css #codingtutorial #webdevelopment #webdeveloper #tailwindcss
Disclaimer: some of the links in this description are affiliate links that I earn a kickback from.