강의

멘토링

로드맵

Inflearn brand logo image
Programming

/

Web Publishing

jQuery bất tử vẫn còn sống - Từ cơ bản đến thực tế

jQuery, thư viện javascript được sử dụng bởi hơn 75% trang web trên toàn thế giới! Nội dung khóa học được xây dựng để bạn có thể củng cố những kiến thức cơ bản, hiểu rõ nguyên lý hoạt động thay vì chỉ tập trung vào những hiệu ứng hào nhoáng. Hãy học từ cơ bản đến nâng cao về jQuery để hoàn thành portfolio của riêng bạn hoặc áp dụng ngay vào công việc thực tế.

(5.0) 2 đánh giá

18 học viên

  • ezweb
제이쿼리
이론 중심
웹퍼블리싱
HTML/CSS
JavaScript
jQuery
jquery-selector

Dịch cái này sang tiếng Việt

  • Cú pháp cơ bản của jQuery

  • Thay đổi kiểu dáng của phần tử bằng jQuery

  • Áp dụng sự kiện cho một phần tử bằng jQuery

  • Triển khai hoạt ảnh nhanh chóng với jQuery

  • Các ví dụ thực tế để sử dụng ngay lập tức cho kỳ thi TABS

  • Accordion (dạng thực tế, ví dụ có thể sử dụng ngay)

  • Lightbox thực tế có thể sử dụng ngay

  • Hoạt ảnh quay lại đầu trang (back to top) với ví dụ thực tế có thể sử dụng ngay.

  • Các slide trình bày ví dụ thực tế, có thể sử dụng ngay.

  • Thư viện thực tế - Sử dụng Swiper JS

  • Sử dụng thư viện thực tế - Masonry

  • Thư viện thực tế - Sử dụng ScrollTrigger

  • Sử dụng thư viện thực tế - Fullpage JS

Tại sao bạn vẫn nên học jQuery

jQuery là một thư viện JavaScript được nhiều nhà phát triển web sử dụng rộng rãi kể từ khi nó xuất hiện lần đầu vào năm 2006. Một trong những lý do chính là nó làm tăng năng suất của nhà phát triển bằng cách đơn giản hóa việc lựa chọn và thao tác các phần tử HTML đồng thời đảm bảo khả năng tương thích trên nhiều trình duyệt web khác nhau.

Những ưu điểm của jQuery được thể hiện qua việc nó được sử dụng rộng rãi trên các trang web trên toàn thế giới. Ví dụ, tính đến năm 2021, khoảng 77,8% trong số 10 triệu trang web hàng đầu đang sử dụng jQuery.

[ Nguồn: https://w3techs.com/technologies/overview/javascript_library ]

Vì vậy, jQuery từ lâu đã là một công cụ chuẩn trong phát triển web. Do đó, việc học jQuery sẽ giúp bạn hiểu và duy trì các cơ sở mã lớn hiện có. Ngoài ra, nhiều trang web vẫn sử dụng jQuery, vì vậy việc học nó có thể hữu ích cho nhiều dự án.

Tất nhiên, các framework và thư viện hiện đại như React và Vue.js đã trở nên phổ biến gần đây, nhưng tính đơn giản và khả năng tương thích rộng rãi của jQuery vẫn còn hấp dẫn. Do đó, với tư cách là một nhà phát triển web, việc học jQuery sẽ là nền tảng có giá trị để hiểu cả công nghệ quá khứ và hiện tại.

Ví dụ về một trang web sử dụng jQuery

Điện tử Samsung https://www.samsung.com/sec/


Nếu bạn nhìn vào phần thẻ head của phần tử bằng công cụ dành cho nhà phát triển trên Samsung Electronics Home, bạn có thể thấy thư viện jQuery, thư viện slick (trình chiếu), thư viện swiper và thư viện masonry đang được sử dụng.

Hãng hàng không Asiana - https://flyasiana.com/C/KR/KO/index




Trong trường hợp của hãng hàng không Asiana Airlines, chúng tôi sử dụng thư viện jquery và swiper và vì chúng tôi sử dụng nhiều dữ liệu ngày tháng nên chúng tôi sử dụng moment.js.


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



Trong trường hợp của trang Binggrae, các kỹ thuật như masonry, slick, v.v. được sử dụng và tập lệnh thường được áp dụng là common.js, các tập lệnh hoạt động trên mỗi trang được chia thành trang chính, trang phụ, v.v.

Ngoài ra, nhiều trang web khác cũng sử dụng jQuery để tạo và duy trì trang web.

Trong bài giảng này, chúng ta sẽ tìm hiểu ngữ pháp cơ bản của jQuery, các hàm đại diện, tab, accordion và các ví dụ cơ bản khác, đồng thời tìm hiểu thêm các thư viện thực tế đại diện như swiper js, masonry và fullpage JS.

Giới thiệu nội dung học tập chính.

Phần A

Tìm hiểu cú pháp cơ bản của jQuery.

Bắt đầu với jQuery load, hãy tìm hiểu thứ tự tải. Sử dụng jQuery để chọn các phần tử, thay đổi kiểu và áp dụng các sự kiện cho các phần tử được chọn.

Dễ dàng triển khai hoạt ảnh với jQuery. Lúc này, bạn có thể tinh chỉnh hoạt ảnh bằng cách ghi thời gian, tốc độ và chức năng.


Đây là một phần của nguồn để tìm hiểu về sự kiện jquery.

Một ví dụ để tìm hiểu những điều cơ bản về sự kiện và hoạt ảnh.

Phần B

Trong Phần B, chúng ta sẽ triển khai UI/UX được sử dụng phổ biến nhất khi tạo trang web: tab, accordion, lightbox, back-to-top và slide. Tạo cấu trúc HTML để triển khai hiệu ứng, thiết kế hiệu ứng trước bằng CSS và triển khai tập lệnh để hiệu ứng được triển khai theo nhiều sự kiện khác nhau.



Đây là màn hình tab đã hoàn tất.

Đây là chiếc đàn accordion đã hoàn thiện.

Đây là hộp đèn đã hoàn thiện.

Đây là phiên bản hoàn chỉnh của Hoạt hình Quay lại đầu trang.

Đây là bản trình chiếu đã hoàn thành.

Phần C

Trong Phần C, bạn sẽ học cách sử dụng các thư viện được sử dụng rộng rãi trong thực tế, chẳng hạn như Swiper, Masonry và ScrollTrigger.


Đây là thư viện Swiper JS đầy đủ.

Đây là thư viện Masonry đầy đủ.

Đây là thư viện ScrollTrigger hoàn chỉnh.

Phần D

Trong Phần B, chúng ta sẽ sử dụng fullpageJS để triển khai một trang web có thể di chuyển mượt mà sang trang tiếp theo khi bạn di chuyển bánh xe.

Tạo biểu đồ bằng SVG và sử dụng jQuery để tạo hiệu ứng động cho phần viền.




Đây là trang hồ sơ hoàn chỉnh sử dụng JS toàn trang.

Có cung cấp các tệp mẫu và bài tập đã hoàn thành.

Có thể tải xuống các tệp ví dụ từ tài liệu của Bài 2 (Ngữ pháp jQuery - Thứ tự tải).


Có thể tải xuống tệp đầy đủ từ tài liệu Bài 17 (JS toàn trang).


Cửa sổ giao tiếp (khảo sát, phòng trò chuyện mở 1:1)

Học sinh có thể cung cấp ý kiến ​​và câu hỏi của mình bất kỳ lúc nào thông qua khảo sát của Googlephòng trò chuyện mở 1:1 được giới thiệu trong phần Có gì mới .


Khuyến nghị cho
những người này

Khóa học này dành cho ai?

  • Người đã học HTML, CSS, Javascript

  • Tôi là một sinh viên mới tốt nghiệp đang chuẩn bị cho công việc nhà xuất bản.

  • Người đang chuẩn bị hồ sơ năng lực (portfolio)

  • Dành cho những ai đang chuẩn bị cho chứng chỉ Kỹ năng viên phát triển thiết kế web (trước đây là Chứng chỉ Kỹ năng thiết kế web).

Xin chào
Đây là

2,522

Học viên

49

Đánh giá

3

Trả lời

4.9

Xếp hạng

8

Các khóa học

■ [현재] 그린컴퓨터아트학원 웹퍼블리싱, 프론트엔드 강의
■ [현재] 웹 퍼블리싱 유튜브 채널 'Rock's Easyweb' 운영
■ 더조은 컴퓨터아카데미 웹 퍼블리싱 강사
■ 한빛 컴퓨터아카데미 웹 퍼블리싱 강사
■ 프론트엔드 퍼블리셔, 프론트엔드 퍼블리싱 전문강사
■ UI/UX 웹 디자인 포트폴리오 강의


[ 도서 ]
2021.07.19 출간 / 웹디자인 & 웹퍼블리싱을 위한 피그마 완벽 활용서 / 비제이퍼블릭

2022.08.25 출간  / 코딩을 처음이라 with 웹 퍼블리싱  / 영진출판사

2023.10 출간 /2024 SD에듀 유선배 웹디자인기능사 실기 과외노트 / 시대고시기획

2024.11 재판 /2025 SD에듀 유선배 웹디자인기능사 실기 과외노트 / 시대고시기획

 

[ 수상경력 ]
2022.08 그린컴퓨터 아트 학원 종로지점 - 우수강사 2021.06 그린컴퓨터 아트 학원 종로지점 - 우수강사 2018.06 그린 컴퓨터아카데미 신촌 지점 - 우수강사 2017.05 그린 컴퓨터아카데미 신촌 지점 - 우수강사 2016.05 그린 컴퓨터아카데미 신촌 지점 - 우수강사 2015.10 그린 컴퓨터아카데미 신촌 지점 - 우수강사 

 

 

 

Chương trình giảng dạy

Tất cả

17 bài giảng ∙ (5giờ 30phút)

Tài liệu khóa học:

Tài liệu bài giảng
Ngày đăng: 
Cập nhật lần cuối: 

Đánh giá

Tất cả

2 đánh giá

5.0

2 đánh giá

  • tomomo님의 프로필 이미지
    tomomo

    Đánh giá 7

    Đánh giá trung bình 5.0

    5

    35% đã tham gia

    좋은 강의 감사합니다.

    • 이지웹
      Giảng viên

      소중한 수강평 감사드립니다.

  • Jonas Kahnwald님의 프로필 이미지
    Jonas Kahnwald

    Đánh giá 3

    Đánh giá trung bình 5.0

    5

    65% đã tham gia

    358.730 ₫

    Khóa học khác của ezweb

    Hãy khám phá các khóa học khác của giảng viên!

    Khóa học tương tự

    Khám phá các khóa học khác trong cùng lĩnh vực!