RobustX / Chương trình học / Chuyên đề / Phát triển phần mềm / Lập Trình Javascript Cho Frontend

LẬP TRÌNH JAVASCRIPT CHO FRONTEND

Nếu HTML là “bộ xương” và CSS là “diện mạo”, thì JavaScript chính là “bộ não và hệ thần kinh” mang lại sự sống cho một trang web. Đây là khóa học then chốt, đưa bạn từ một người thiết kế trang web tĩnh thành một lập trình viên có khả năng xây dựng các ứng dụng web động, thông minh và có tính tương tác cao. Việc làm chủ JavaScript là kỹ năng không thể thiếu để tạo ra những trải nghiệm người dùng hiện đại và là nền tảng cho toàn bộ sự nghiệp Frontend.

Chương trình được thiết kế để trang bị cho bạn kỹ năng lập trình JavaScript một cách bài bản, tập trung vào cú pháp hiện đại (ES6+) và các ứng dụng thực tế trên môi trường trình duyệt. Bạn sẽ học cách sử dụng JavaScript để “giao tiếp” và điều khiển mọi thành phần trên trang web thông qua DOM Manipulation. Bạn sẽ làm chủ việc xử lý các sự kiện từ người dùng (nhấp chuột, nhập liệu) để tạo ra các phản hồi tức thì. Đặc biệt, bạn sẽ nắm vững kỹ thuật lập trình bất đồng bộ với Promise và Async/Await để làm việc với các API mà không làm gián đoạn trải nghiệm người dùng.

Thời lượng: 42h

Hình thức đào tạo:

    • Đào tạo trực tiếp tại lớp học
    • Đào tạo trực tuyến
    • Đào tạo hybrid (trực tuyến kết hợp trực tiếp)
    • Đào tạo tại văn phòng khách hàng

KẾT QUẢ ĐẠT ĐƯỢC:

  1. LÀM CHỦ JAVASCRIPT HIỆN ĐẠI 
    Sử dụng thành thạo cú pháp và các tính năng mới nhất để viết code sạch, hiệu quả và dễ bảo trì.
  2. THAO TÁC VÀ ĐIỀU KHIỂN DOM
    Có khả năng truy cập, thay đổi, tạo mới hoặc xóa bỏ bất kỳ phần tử HTML nào bằng mã JavaScript.
  3. XÂY DỰNG TRẢI NGHIỆM TƯƠNG TÁC
    Thành thạo việc xử lý các sự kiện từ người dùng để tạo ra ứng dụng web có tính phản hồi ngay lập tức.
  4. THÀNH THẠO LẬP TRÌNH BẤT ĐỒNG BỘ
    Nắm vững cách dùng Fetch API, Promise, async/await để lấy dữ liệu từ server mà không làm “đứng” giao diện.
  5. XÂY DỰNG ỨNG DỤNG FRONTEND HOÀN CHỈNH
    Có khả năng tự xây dựng một ứng dụng web phía client hoàn chỉnh, tích hợp HTML, CSS và logic JavaScript.

Đối tượng tham gia

Sinh viên

Cần trang bị kỹ năng lập trình frontend cốt lõi để đáp ứng các yêu cầu của thị trường.

Lập trình viên

Đến từ các nền tảng khác, muốn chuyển hướng sự nghiệp sang lĩnh vực phát triển web.

Người chuyển ngành

Muốn bổ sung kỹ năng lập trình JavaScript để xây dựng các trang web động.

Người muốn học web

Cần một lộ trình bài bản để hệ thống hóa lại kiến thức và nâng cao kỹ năng .

Nội dung khóa học

 1. Giới thiệu JavaScript và Cú pháp Cơ bản
    • Vai trò của JavaScript:
      • Tìm hiểu vai trò của JavaScript trong việc tạo ra các trang web động, hoàn thiện “bộ ba” HTML-CSS-JS.
    • Cách nhúng code:
      • Nắm vững các cách khác nhau để nhúng mã JavaScript vào một trang web HTML.
    • Biến và phạm vi:
      • Tìm hiểu về cách khai báo biến với var, let, const và khái niệm Hoisting trong JavaScript.
    • Kiểu dữ liệu:
      • Phân biệt các kiểu dữ liệu nguyên thủy và kiểu đối tượng, cách chúng được sử dụng trong lập trình.
    • Điều khiển luồng:
      • Thực hành các toán tử, biểu thức và các câu lệnh điều khiển luồng cơ bản như if/else, switch, for, while.
 2. Hàm và Cấu trúc Dữ liệu trong JS
    • Hàm:
      • Học cách định nghĩa và sử dụng hàm, hiểu về phạm vi biến (scope) và closures.
    • Hàm mũi tên (Arrow Function):
      • Làm quen với cú pháp hàm mũi tên gọn gàng, hiện đại trong ES6+.
    • Mảng (Array):
      • Tìm hiểu cách khởi tạo mảng và sử dụng các phương thức xử lý mảng thông dụng như map, filter, reduce.
    • Đối tượng (Object):
      • Nắm vững cách khởi tạo đối tượng, truy cập thuộc tính, phương thức và làm việc với dữ liệu JSON.
 3. Thao tác DOM (DOM Manipulation)
    • Hiểu DOM:
      • Tìm hiểu về Document Object Model (DOM) như một cây cấu trúc, nơi mọi phần tử HTML là một node.
    • Truy xuất phần tử:
      • Học cách truy xuất các phần tử HTML từ mã JavaScript bằng các phương thức như querySelector, getElementById.
    • Thay đổi nội dung và thuộc tính:
      • Thực hành thay đổi nội dung, thuộc tính và style của các phần tử HTML bằng mã JavaScript.
    • Tạo/xóa phần tử:
      • Nắm vững cách tạo, thêm và xóa các phần tử HTML một cách động.
 4. Xử lý Sự kiện (Event Handling)
    • Mô hình sự kiện:
      • Hiểu về mô hình sự kiện của trình duyệt, bao gồm Event Bubbling và Capturing.
    • Đăng ký lắng nghe sự kiện:
      • Học cách đăng ký lắng nghe các sự kiện với phương thức addEventListener một cách linh hoạt.
    • Các loại sự kiện phổ biến:
      • Tìm hiểu và thực hành với các sự kiện phổ biến như click, mouseover, keydown, submit.
    • Thực hành:
      • Xây dựng các chức năng tương tác như menu ẩn/hiện, slideshow ảnh, và xác thực form phía client.
 5. Lập trình Bất đồng bộ và AJAX
    • Khái niệm bất đồng bộ:
      • Hiểu khái niệm bất đồng bộ và vai trò của Event Loop trong JavaScript để xử lý các tác vụ dài.
    • Promise:
      • Học cách sử dụng Promise để xử lý các tác vụ bất đồng bộ một cách tuần tự và dễ quản lý.
    • Fetch API:
      • Sử dụng Fetch API để gửi các yêu cầu mạng (GET, POST…) đến server và lấy dữ liệu.
    • Async/Await:
      • Làm chủ cú pháp async/await hiện đại để viết code bất đồng bộ trông giống như code đồng bộ, giúp code sạch hơn.
 6. ES6+ và Lập trình Hiện đại
    • ES6 Modules:
      • Học cách tổ chức mã nguồn thành các module độc lập bằng import và export.
    • Lập trình Hướng đối tượng (OOP):
      • Giới thiệu cú pháp class, constructor, inheritance trong ES6 để xây dựng các đối tượng.
    • Các tính năng hữu ích khác:
      • Khám phá các tính năng hữu ích khác như Destructuring, Spread/Rest Operator, và Template Literals.
    • Best Practices:
      • Nắm vững các quy tắc giúp viết mã JavaScript sạch, chuyên nghiệp và dễ bảo trì.
 7. Đồ án cuối khóa
    • Xây dựng Ứng dụng Web Tương tác
      • Mục tiêu: Vận dụng toàn bộ kiến thức JavaScript đã học để xây dựng một ứng dụng Single-Page Application (SPA) nhỏ hoàn chỉnh.
      • Quy trình thực hiện:
        • Lập kế hoạch: Lựa chọn đề tài (ví dụ: ứng dụng ghi chú, trang tìm kiếm phim ảnh, ứng dụng thời tiết) và thiết kế giao diện.
        • Dựng giao diện: Xây dựng giao diện tĩnh bằng HTML và CSS.
        • Viết Logic JavaScript:
          • Thao tác DOM và xử lý sự kiện để tạo tính năng tương tác (thêm, sửa, xóa mục).
          • Gọi API bên ngoài bằng Fetch và Async/Await để lấy và hiển thị dữ liệu động.
          • Sử dụng Local Storage để lưu trữ trạng thái của ứng dụng trên trình duyệt.
        • Hoàn thiện: Kiểm tra, sửa lỗi và hoàn thiện ứng dụng.
      • Yêu cầu đầu ra: Một ứng dụng web hoạt động đầy đủ chức năng, mã nguồn được quản lý trên GitHub, và file README.md mô tả dự án.

LỊCH KHAI GIẢNG

(Đang cập nhật)

Đăng ký khóa học

Bài viết liên quan