강의

멘토링

커뮤니티

Programming

/

Web Development

Vanilla JavaScript & Tailwind CSS

Practical web UI development using AI and component-centric UI creation, An essential course for Designers + Developers!

(5.0) 1 reviews

10 learners

Level Basic

Course period Unlimited

  • Michael Kwon
JavaScript
JavaScript
vanilla-javascript
vanilla-javascript
frontend
frontend
TailwindCSS
TailwindCSS
Web Design
Web Design
JavaScript
JavaScript
vanilla-javascript
vanilla-javascript
frontend
frontend
TailwindCSS
TailwindCSS
Web Design
Web Design

What you will gain after the course

  • You can build a fast and efficient development environment using Vite.

  • Learn how to manipulate the DOM, handle events, and implement dynamic UI using Vanilla JavaScript.

  • Quickly implement UI designs using Tailwind CSS without writing long CSS.

  • AI Code Assistant can shorten code writing and improve quality.

  • We will directly implement UI elements commonly used in practice, such as modals, dropdowns, accordions, and toggle menus.

Want to quickly build your foundation and learn modern web development? 🚀

This course is a practical web development course for designers and developers. Without frameworks like React or Vue, you will learn how to efficiently style and implement essential UI components frequently used in practice using only vanilla JavaScript and TailwindCSS.

Learn about these things

1⃣ Vanilla JavaScript Basics

Through vanilla-javascript, the foundation of web development, you will learn everything from basic grammar to DOM manipulation and event handling. You will be able to write code that works without a framework and understand the core concepts of JavaScript.

2⃣ Styling Quickly with TailwindCSS

Learn Tailwind CSS, which allows you to create sophisticated web designs using only classes, without writing complex CSS. Quickly apply styles such as background color, margin, and font size, and easily create responsive web.

tailwindcss

3⃣ Real-world project (UI component development)

Focusing on UI component development , you will create modal windows , drop-down menus , and accordion menus that are frequently used on actual websites. You will connect design and behavior and build skills that can be applied directly to frontend work.

4⃣ Use of AI

You'll also learn how to use AI tools (Google Gemini) to make your development and design work faster and smarter.

🎯 Target audience of the course (Who will take this course?)

  1. Web Designer → Anyone who wants to learn Tailwind CSS and collaborate with developers

  2. Beginner Front-end Developer → Anyone who wants to learn UI development using Vanilla JS and Tailwind

  3. Designers considering transitioning to developers → People who want to use their design sense to do web development

  4. Startup Developer → People who want to create prototypes quickly

  5. Developers who find CSS difficult → People who want to easily handle CSS through Tailwind

Things to note before taking the class

Practice environment

  • Operating System and Version (OS): All OS are supported, including Windows, macOS, and Linux.

  • Tools used: Visual Studio Code, Node.js & npm

  • PC specifications: PC with basic specifications that can access the Internet

Learning Materials

  • Format of learning materials provided: GitHub source code, text lecture materials

  • Volume and Capacity: Learning materials provided for each section

Player Knowledge

This course is designed for beginners who are not familiar with programming or web development . However, if you know the basic knowledge below, you will be able to follow along more easily.

  • HTML, CSS Basics

  • Photoshop or Figma Basics


Recommended for
these people

Who is this course right for?

  • Developer who wants to implement UI using pure JavaScript without a framework

  • Designers & Publishers Who Want to Style Quickly Without CSS

  • For those who want to build UI components commonly used in practice.

  • Those wishing to learn the designer-developer collaboration process

  • Anyone who wants to learn the latest web development environment and efficient development methods

Need to know before starting?

  • HTML, CSS basics

Hello
This is

242

Learners

30

Reviews

17

Answers

4.9

Rating

5

Courses

Starting as a multimedia content creator at a startup, I have not stayed in a single field but have led planning and development across games, web, and multimedia, launching various commercial projects in the industry. I majored in Digital Media and Visual Arts at university and have been creating tutorials while conducting web design, front-end development, and media education (for over 10 years) at major educational institutions.

- Books -

JavaScript Project Book (Hanbit Media, 2017)

Curriculum

All

35 lectures ∙ (4hr 44min)

Course Materials:

Published: 
Last updated: 

Reviews

All

1 reviews

5.0

1 reviews

  • ppipa20102977님의 프로필 이미지
    ppipa20102977

    Reviews 5

    Average Rating 5.0

    5

    30% enrolled

    $26.40

    Michael Kwon's other courses

    Check out other courses by the instructor!

    Similar courses

    Explore other courses in the same field!