inflearn logo

The Immortal jQuery, Still Alive — From the Basics to Real-World Practice

jQuery, the JavaScript library used by more than 75% of websites worldwide! This course is designed to help you understand the underlying principles and build a solid foundation rather than focusing on flashy effects. Learn everything from the basics of jQuery to practical applications, complete your own portfolio, or put your skills to immediate use in the workplace.

(5.0) 3 reviews

35 learners

Level Basic

Course period Unlimited

HTML/CSS
HTML/CSS
JavaScript
JavaScript
jQuery
jQuery
jquery-selector
jquery-selector
HTML/CSS
HTML/CSS
JavaScript
JavaScript
jQuery
jQuery
jquery-selector
jquery-selector

Reviews from Early Learners

5.0

5.0

준쮸넛

100% enrolled

I used to lack confidence in jQuery, but I'm leaving with newfound confidence after taking this course. The explanations are very easy to understand! Please continue to provide great lectures in the future. Thank you!

What you will gain after the course

  • jQuery Basic Syntax

  • Changing an Element’s Style with jQuery

  • Applying events to elements with jQuery

  • Implementing animations quickly with jQuery

  • Practical Example Tabs You Can Use Right Away

  • Practical accordion example you can use right away (accordion)

  • A practical example lightbox you can use right away

  • A practical back-to-top animation example you can use right away

  • Practical example slides you can use right away (slideshow)

  • Practical Library - Using Swiper JS

  • Practical Library - Using Masonry

  • Practical Library - Using ScrollTrigger

  • Practical Library - Using Fullpage JS

"You’ll miss out if you don’t claim it now! Just subscribe to YouTube and pay half the course fee"

Subscribe & Like & Comment Event

Complete a simple mission and receive a 50% off coupon instantly. This incredible limited-time offer won’t last—claim it now!

Participate in the YouTube subscription & comment verification event: https://forms.gle/wcD2wRVeaG7B7fSj7

Why You Still Need to Learn jQuery

Since its first appearance in 2006, jQuery has been a JavaScript library widely used by web developers. One of the main reasons is that it simplifies the selection and manipulation of HTML elements while ensuring compatibility across various web browsers, thereby improving development productivity.

These advantages of jQuery are reflected in its high usage rate among websites worldwide. For example, as of 2021, approximately 77.8% of the top 10 million websites were using jQuery.

[Source: https://w3techs.com/technologies/overview/javascript_library]

In this way, jQuery has established itself as a standard tool for web development over many years. Therefore, learning jQuery can be a great help in understanding and maintaining the vast amount of existing code. Additionally, since many websites still use jQuery, becoming familiar with it can be useful across a variety of projects.

Of course, although modern frameworks and libraries such as React and Vue.js have been attracting attention recently, jQuery’s simplicity and broad compatibility remain appealing features. Therefore, learning jQuery as a web developer will serve as an important foundation for understanding both past and present technologies.

Examples of Websites Using jQuery

Samsung Electronics https://www.samsung.com/sec/


On Samsung Electronics’ homepage, if you inspect the head tag in the Elements section of the developer tools, you can see that it uses the jQuery library, the slick (slideshow) library, the swiper library, and the masonry library.

Asiana Airlines - https://flyasiana.com/C/KR/KO/index




Asiana Airlines uses the jQuery and Swiper libraries, and because it makes extensive use of dates, it also uses moment.js.


Binggrae - https://www.bing.co.kr/



The Binggrae site uses masonry, slick, and other libraries. Scripts applied commonly are placed in common.js, while scripts that operate on individual pages are separated and used as main, sub, and so on.

Many other websites are also built and maintained using jQuery.

Therefore, in this course, you will learn jQuery’s basic syntax, commonly used functions, and basic examples such as tabs and accordions. You will also learn practical libraries such as Swiper JS, Masonry, and fullPage.js.

Introducing the main topics covered.

Part A

Learn the basic syntax of jQuery.

We will learn everything from loading jQuery to the order in which it loads. Using jQuery, we will select elements, change the styles of the selected elements, and apply events to them.

Easily implement animations with jQuery. You can fine-tune them by specifying the animation’s duration, speed, and function.


This is part of the source for learning jQuery events.

This is an example for learning the basics of events and animations.

Part B

In Part B, we implement tabs, accordions, lightboxes, back-to-top buttons, and slideshows, which are among the most commonly used UI/UX elements when creating web pages. We write the HTML structure for implementing the effects, design the effects in advance with CSS, and implement the script so that the effects are triggered by various events.



This is the completed tab screen.

This is the completed accordion.

This is the completed lightbox.

This is the completed Back to Top Animation.

This is the completed slideshow.

Part C

In Part C, we learn how to use widely used libraries in practice, including Swiper, Masonry, and ScrollTrigger.


This is the completed Swiper JS library.

This is the completed Masonry library.

This is the completed version using the ScrollTrigger library.

Part D

In Part B, you will use fullpageJS to create a webpage that smoothly moves to the next slide when you scroll the wheel.

Create a graph using SVG and work with jQuery to create an animation in which the border fills in.




This is the completed profile page using fullpage JS.

Example files and the completed version are provided.

The example file can be downloaded from the materials for Lesson 2 (jQuery Syntax – Loading Order).


The complete files can be downloaded from the materials for Lesson 17 (Fullpage JS).


Communication channels (survey, 1:1 open chat room)✒

Students can share their feedback and ask questions at any time through the Google Form and 1:1 open chat room introduced in the Announcements section.


Recommended for
these people

Who is this course right for?

  • Those who have learned HTML, CSS, and JavaScript

  • A job seeker preparing to become a web publisher

  • Those preparing a portfolio

  • Those preparing for the Web Design Development Craftsman (formerly Web Design Craftsman) certification

Hello
This is ezweb

Career Verified

3,001

Learners

77

Reviews

4

Answers

4.9

Rating

15

Courses

I am a web front-end instructor specializing in everything from practical front-end training and on-site lectures for companies and institutions to producing online courses.

■ Specialized Front-End Courses
HTML/CSS, JavaScript, React, Firebase, Figma, AI-assisted web development, and more
I provide step-by-step training from web publishing to practical front-end development.

■ Available to lecture at companies, organizations, and educational institutions
Training for corporate practitioners, KDT programs, university and academy special lectures, etc.
Curricula can be tailored to the target audience and their skill level, and on-site lectures can be provided.

■ Online course design and production available
From planning online lecture curricula to creating teaching materials, PPTs, hands-on materials, and sample code,
we can handle the entire process of producing online educational content, including lecture filming and content delivery.

■ Both online and offline classes available
In addition to offline academy classes, we offer various formats tailored to the educational environment,
including live online classes and recorded content production.


■ Key Activities

  • ESTSOFT KDT Frontend Course

  • Green Computer Academy Web Publishing and Front-End Courses

  • Runs the web publishing YouTube channel ‘ezweb’.

  • Authored books on web publishing and web design


■ Books
2021.07 / The Complete Guide to Using Figma for Web Design & Web Publishing / BJ Public

2022.08 / Web Publishing for Those New to Coding  / Youngjin Publishing

2023.10 / 2024 SD Edu Yuseonbae Web Design Craftsman Practical Exam Tutoring Notes / Sidaegosi Planning

2024.11 / 2025 SD Edu Yuseonbae Web Design Technician Practical Exam Tutoring Notes / Sidae Exam Planning

2025.11 / 2026 SD Edu Yoo Seon-bae Web Design Craftsman Practical Exam Tutoring Notes / SidaeGosi Planning

 

More

Reviews

All

3 reviews

5.0

3 reviews

  • mrnobody님의 프로필 이미지
    mrnobody

    Reviews 8

    ∙

    Average Rating 5.0

    5

    35% enrolled

    Thank you for the great lecture.

    • ezweb
      Instructor

      Thank you for your valuable course review.

  • ekfdud911479님의 프로필 이미지
    ekfdud911479

    Reviews 1

    ∙

    Average Rating 5.0

    5

    100% enrolled

    I used to lack confidence in jQuery, but I'm leaving with newfound confidence after taking this course. The explanations are very easy to understand! Please continue to provide great lectures in the future. Thank you!

    • ezweb
      Instructor

      Thank you for your valuable review. ^^

  • sang416님의 프로필 이미지
    sang416

    Reviews 8

    ∙

    Average Rating 5.0

    5

    65% enrolled

    ezweb's other courses

    Check out other courses by the instructor!

    Similar courses

    Explore other courses in the same field!

    25% off for new members

    $13.20

    25%

    $13.20