강의

멘토링

커뮤니티

Programming

/

Web Development

Học JavaScript qua câu chuyện

Đây là khóa học dự án thực tế về việc thêm các tính năng tương tác bằng JavaScript vào trang web quán cà phê đã được hoàn thiện đẹp mắt với HTML và CSS. Bạn có thể học một cách tự nhiên tất cả các kiến thức cơ bản về JavaScript từ click button, lọc menu, form đặt bàn, toggle dark mode cho đến kết nối API thông qua câu chuyện của Minji và thầy Code. Chỉ với 5 giờ học, ngay cả người mới bắt đầu cũng có thể tạo ra ứng dụng web động.

8 học viên đang tham gia khóa học này

  • sarc
javascript기초
웹인터랙션
스토리텔링
dom조작
비동기프로그래밍
JavaScript
ES6
Interactive Web
DOM
javascript-event

Bạn sẽ nhận được điều này sau khi học.

  • Bạn có thể nắm vững tất cả các cú pháp cơ bản của JavaScript thông qua các dự án thực tế

  • DOM manipulation cho phép kiểm soát trang web một cách động

  • Có thể triển khai tương tác người dùng thông qua xử lý sự kiện

  • Bạn có thể học các JavaScript pattern thường được sử dụng trong thực tế

  • Có thể hiển thị dữ liệu thời gian thực bằng cách tích hợp API


Học JavaScript qua câu chuyện - Thổi hồn vào trang web quán cà phê của Minji

Khóa học này giúp bạn thành thạo JavaScript bằng cách trực tiếp xây dựng 'Quán cà phê của Minji' sống động, thay vì việc học thuộc lòng nhàm chán.

Thông qua trải nghiệm thực tế thổi 'sức sống' giúp website có thể click, di chuyển và phản hồi, bạn có thể có được những dự án hoàn thiện với độ hoàn thành cao có thể sử dụng ngay làm portfolio xin việc.

Nếu bạn chỉ có kiến thức cơ bản về html/css, khóa học dựa trên storytelling này chắc chắn sẽ nâng cấp bạn từ 'người xây dựng website' thành 'nhà phát triển web'.


1. Thay vì 'học thuộc ngữ pháp' nhàm chán, hãy 'tạo ra quán cà phê'

  • Hầu hết các khóa học JavaScript thông thường khiến bạn phải học thuộc lòng riêng lẻ các cú pháp như biến, hàm, vòng lặp nên rất nhàm chán và khiến bạn bối rối không biết phải áp dụng như thế nào trong thực tế.

    • Giống như chỉ học tên và định nghĩa của cưa, búa, đinh cần thiết cho xây dựng, mà thực tế lại không xây nhà vậy.

  • Khóa học này theo một câu chuyện lớn là 'hoàn thành trang web quán cà phê của Minji', vì vậy bạn có thể áp dụng ngay vào thực hành sau khi học ngữ pháp và xem kết quả bằng mắt thường.

    • Thông qua phương pháp này, các bạn sẽ có trải nghiệm tạo ra các tính năng thực tế có thể sử dụng ngay lập tức thay vì phải băn khoăn "Cái này dùng ở đâu nhỉ?".



2. Website sống là gì?

  • Một trang web 'sống động' có nghĩa là khả năng phản ứng và chuyển động ngay lập tức theo hành động của người dùng (client).

    • Nếu HTML và CSS tạo ra khung xương và hình dạng của website (cấu trúc và nội thất của ngôi nhà), thì JavaScript đóng vai trò thổi hồn vào website đó (điện, nước, cửa chuyển động).

  • Khi học JavaScript, bạn sẽ có thể tạo ra những trang web động 'có thể nhấp chuột, di chuyển và phản ứng'.

    • Ví dụ, tất cả các chức năng như thay đổi menu khi nhấn nút, hoặc hiển thị thông báo cảnh báo khi nhập thông tin sai trong form đặt chỗ đều thuộc về lĩnh vực của JavaScript.



3. Lộ trình cốt lõi học trong 5 tuần: Thao tác DOM là trọng tâm

  • Khóa học này bao gồm tổng cộng 5 phần, 15 tập, với tổng thời gian học khoảng 5.3 giờ (320 phút), ngắn gọn và tập trung.

    • Trong 2 tuần đầu tiên (Section 1, 2) sẽ củng cố cú pháp cơ bản của lập trình và hiểu về chính ngôn ngữ JavaScript.

  • Điều thực sự thổi sức sống vào trang web bắt đầu từ phần thao tác DOM (Document Object Model Manipulation) (Tuần 3, Phần 3).

    • Thao tác DOM là quá trình học 'tìm kiếm phần tử', 'thay đổi style', 'thêm/xóa phần tử', có nghĩa là khả năng có thể tùy ý điều khiển các phần cụ thể của trang web.


graph TD
    A["Section 1 & 2: Cơ bản lập trình (Tuần 1-2)"] --> B["Section 3: Thao tác DOM (Tuần 3)"];
    B --> C["Section 4: Tương tác (Tuần 4)"];
    C --> D["Section 5: Tính năng thực tế (Tuần 5)"];
    style B fill:#f9f,stroke:#333,stroke-width:2px



4. 5 tính năng cốt lõi của 'Code Brew Cafe' có thể áp dụng ngay trong thực tế

  • Khi hoàn thành khóa học, bạn sẽ có thể tự hào đưa vào portfolio xin việc 'trang web Code Brew Cafe' hoàn chỉnh.

    • Các tính năng được tạo ra không phải là những ví dụ đơn giản, mà là những tính năng thực tế cần thiết cho các trang web đang vận hành.

  • Các bạn sẽ tự tay triển khai lọc menu (chỉ xem cà phê, chỉ xem tráng miệng), xác thực form đặt bàn (kiểm tra số điện thoại có đúng không), chuyển đổi chế độ tối và nhiều tính năng khác.

    • Đặc biệt, tính năng hiển thị thời tiết thời gian thực cung cấp trải nghiệm học tập công nghệ nâng cao thông qua việc tích hợp và lấy dữ liệu từ API bên ngoài (thông tin từ server khác).



5. Chu kỳ học tập hoàn hảo và danh sách kiểm tra đồ dùng cần thiết

  • Để tối đa hóa hiệu quả học tập, mỗi tập sẽ có nhiệm vụ 3 giai đoạn: nhiệm vụ cơ bản, nâng cao và thưởng.

    • Nhiệm vụ cơ bản là ôn tập nội dung bài giảng, nhiệm vụ nâng cao là áp dụng sáng tạo những gì đã học, và nhiệm vụ thưởng là cấu trúc để xem trước một chút nội dung tiếp theo.

  • Để bắt đầu khóa học này, không cần có kinh nghiệm lập trình, nhưng bạn phải có kiến thức cơ bản về HTML/CSS.

    • Giống như khi vẽ tranh, canvas (HTML) và màu sơn (CSS) phải được chuẩn bị sẵn sàng thì mới có thể học cách cầm cọ (JavaScript) được.


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

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

  • Bạn đã tạo website bằng HTML/CSS nhưng cảm thấy tiếc vì nó chỉ là trang tĩnh

  • Những người muốn tạo ra điều gì đó xảy ra khi nhấp vào nút

  • Những người muốn tạo ra website tương tác với người dùng

  • Những người mới bắt đầu lập trình nhưng muốn khởi đầu với phát triển web

  • Ông chủ muốn thêm chức năng đặt bàn, bộ lọc menu, v.v. vào trang web của quán cà phê, nhà hàng

Cần biết trước khi bắt đầu?

  • Cần có kiến thức cơ bản về HTML/CSS! Bạn cần biết cấu trúc cơ bản của thẻ HTML và cách tạo kiểu CSS. Hãy học trước các khóa học "Học HTML qua câu chuyện" và "Học CSS qua câu chuyện", hoặc ít nhất cũng cần hiểu về cấu trúc trang web và cách tạo kiểu là đủ.

Xin chào
Đây là

135

Học viên

11

Đánh giá

3

Trả lời

3.8

Xếp hạng

5

Các khóa học

안녕하세요. 소셜아카이브 입니다.

소셜 아카이브에서는 '장기 보존의 가치를 지닌 고품질 자료들의 보관소'를 운영하며, 여러분의 업무 방식을 혁신할 세 가지 역할을 수행합니다.

  1. [소프트웨어 엔지니어]카카오 엔터프라이즈에서 백엔드 API를 개발하며 업무 시스템의 근본적인 효율화를 고민했습니다. 이 경험이 AI 자동화 프로세스를 가장 견고하게 설계하는 기반이 됩니다.

  2. [AI 파일럿] 저는 GPT와 AI 툴을 활용하여 실무에서 가장 빠르고 정확한 성과를 도출하는 선행 사용자입니다. 검증된 노하우만을 선별하여 여러분에게 최적의 비행 경로를 제시합니다.

  3. [전문 강사]KB국민은행 IT 아카데미구름에듀의 주강사로서, 복잡한 기술을 실무에 바로 적용 가능한 쉬운 지식으로 풀어내는 전달력을 갖추었습니다.

이 강의는 세 가지 페르소나의 최고 역량이 집약된 고품질의 업무 혁신 자료입니다. 저와 함께 AI를 단순한 도구가 아닌, 미래의 핵심 자산으로 만들어 갑시다.

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

Tất cả

15 bài giảng ∙ (2giờ 49phú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á

Chưa có đủ đánh giá.
Hãy trở thành tác giả của một đánh giá giúp mọi người!

418.122 ₫

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

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!