Skip to content
UdemyWeb DevelopmentPaid courseBeginner levelCertificate

Tailwind CSS and Nextjs | Learn by building project (Udemy.com)

Build candy store using Tailwind CSS and NEXTJS fun project-based course.

Created by: Kei Blokhin

Last updated February 2023

icon
What you will learn

  • Gain confidence using Tailwind Css
  • Learn how to customize  theme and make you website design consistent
  • Reduce the hours of complicated coding
  • Learn how to use Figma to speed up development
  • Learn how to make any project responsive with breakpoints

How it compares

Against the other 815 rated Udemy courses in Web Development on CourseDuck:

  • Rating4.2 out of 5higher than 13% of them
  • Reviews25#798 of 816 by number of reviews
  • Length5.5 hoursshorter than 59% of them
  • Last updatedFebruary 2023earlier than 70% of them

icon
Course Description

Build candy store using Tailwind CSS and NEXTJS  fun project-based course. We will start by learning  basics of Tailwind CSS.  Then we going to build a completely responsive candy store website using Tailwind CSS and NEXTJS. Let's take a look at the outline for this course...


FIRST PART OF THIS COURSE


We will learn all about a certain aspect of Tailwind like typography, margin and padding, box shadows,  containers, grid, flex e.t.c This allows us to  have basic understanding of Tailwind  and will help to us to start building our main project.


SECOND PART OF THIS COURSE


We going to build  completely responsive multi-page candy store website. Website have very modern and clean-looking design.   In this section we going to build many different components. Also will have a bit of javaScript for things like  drawer menu and showing current page name when navigating to different pages.     You will learn how to add different fonts to project, also how  to configure global variables to make you website design consistent. 

I provide Figma template to this project.  So you not only gonna learn how to effectively build modern websites, but also how to use Figma to speed up developing process.

This section will give you all the knowledge you need to create powerful projects without the long-winded and time-consuming explanations.

You’ll learn how to build a beautiful multi-page website with effective user interfaces. You’ll gain a better understanding of how to make websites that are mobile friendly through in-depth, step by step video instruction, so you’ll never feel overwhelmed.

By the end of the course, you will have developed a clearer understanding of how to use  Tailwind CSS and Nextjs as well as harnessing some powerful skills to enable you to create your own stunning websites in less time.


By the end of this course, you will

  • Gain confidence using Tailwind CSS

  • Learn how to make any project responsive with breakpoints

  • Learn how to customize  theme and make you website design consistent

  • Learn best practices for folder  and files structure

  • Reduce the hours of complicated coding

  • Build on pre-existing designs

  • Learn how to use Figma to speed up development

  • Improve user experiences

  • Understand how and where to implement UI components

With clear tutorials and one-to-one support available for any questions you might have, this course is ideal for those who are ready to take the next step towards building their career as a frontend developer.

icon
Udemy Discount

The discount is applied through our link. Open the course from here and Udemy's current promotional price is applied at checkout on most courses, no code to type.

Some courses are excluded from Udemy's promotions. If the price does not drop, clear your browser cookies and use the button again.

icon
Instructor Details

Kei Blokhin

Hi there! I’m a self-taught full stack developer. Through years of hard work and commitment to creating breath-taking projects I would like to share my knowledge with you.

My goal is to save you from falling into some of the common, but frustrating, pitfalls that come with this industry, setting you up with the knowledge to achieve success in your career as a full-stack developer.

I grew up in Kazakstan before moving to China, and then to Japan, where I’ve continued to improve my skills and expand my knowledge, ready to help you improve your developer skills.

I’m passionate about full-stack development and I’ll be right here with you every step of the way. I use React, Nextjs, Typescript, Graphql, AWS , Express in my projects.

My passion means I don’t believe in just giving you boring descriptive texts that you’ll have to force your way through and instead I want to encourage learning by guiding you as you build your own projects in real time, giving you a sense of accomplishment and showing your progression as you move through this course.

My many years of experience and dedication to programming means that I can show you how to work with the essential programs you need to design stunning websites. If you want to step into the wonderful world of programming, join me and I’ll teach you everything you need to know to get started. 


I speak 4 languages Chinese, English, Russian and Japanese.

icon
More Web Development courses

$19.99

$89.99

$89.99

$79.99

$10.99

$84.99

icon
Reviews

4.2

25 ratings on Udemy

Select a bar to show only those reviews.Select the bar again to show every rating.

By Sabrina nastasi on 11/29/2025

It was a great course!

By Saurabh Bhadauriya on 4/14/2025

This course is awesome.

By Oloyede Paul on 5/15/2024

This is the go-to course for busy developers interested in learning Nextjs + TailwindCSS. This is a good course.

By James Bourque on 8/11/2023

Initially I gave this course a five star, but that was after only having gone through the first section which did a very good job of explaining the basics of tailwind. However, once it went into the hands on, there was very little explanation of why certain things were being done. For example, the tailwind.config.js seems like a pretty important component to all of this, but outside of copying things into the file there was no real explanation of how to use it and what all you could do with it. He did give a nice tip on making sure everything you're using is within the extend block, but outside of that it was just copying and pasting. It seems like you could easily make one video solely on that file, how things get hooked up, and how you would reference it from your code. I honestly stopped a quarter of the way through the second section as I was literally just coding what the dude was saying to code which doesn't really help me learn as you don't get to pick up on the reasons why you are doing what you are doing. If you're getting this course because you want to code one site that is very similar to the one built in this tutorial then maybe this course is for you; Otherwise, keep looking.

By Tara Evans on 2/25/2023

Overall, I finished with a pretty good feel for Tailwind. This course does really help with understanding how to create pathing between next.js and tailwind. There are a lot of places where mistakes are made and the code just magically changes without it being pointed out or explained. There could be a lot more explanation as to which divs are affecting what. I was hoping to understand the nesting better but I'm still just as confused as going in. The project itself was fun to build.

By 이주현 on 2/2/2023

걍 코드만 나열하지 구조 설명은 하나도 안해줌

By Ala Svistun on 12/14/2022

Tutor was knowledgeable and as clear as could be expected with the explanation. Good course that would recommend to others. Thank you, I learnt an enormous amount this day.

By Razvan Andrei on 12/21/2024

Showing all 8 reviews on CourseDuck

Read all 25 reviews on Udemy

icon
Quality Score

No CourseDuck member has rated this course yet. Taken it? Give each part a thumbs up or down.

Content Quality
/
Video Quality
/
Qualified Instructor
/
Course Pace
/
Course Depth & Coverage
/

Overall Score : 84 / 100