JavaScript hoàn thành trong một lần: Từ JavaScript thuần đến phát triển SPA

Hãy cùng học từ cú pháp cơ bản đến các khái niệm chuyên sâu và phát triển SPA bằng Vanilla JavaScript nhé🔥

(4.8) 158 đánh giá

8,420 học viên

Độ khó Cơ bản

Thời gian Không giới hạn

JavaScript
JavaScript
SPA
SPA
DOM
DOM
REST API
REST API
JavaScript
JavaScript
SPA
SPA
DOM
DOM
REST API
REST API

Đánh giá từ những học viên đầu tiên

Đánh giá từ những học viên đầu tiên

4.8

5.0

Chan

89% đã tham gia

Tôi đã từng học các khóa học JavaScript một hoặc hai lần rồi. Nhưng lạ thay, tôi luôn cảm thấy như mình đã biết, nhưng khi thực sự muốn sử dụng thì lại không được, và tình trạng này cứ tiếp diễn mãi. Khóa học này đã giúp tôi sắp xếp từng phần mơ hồ đó một cách rõ ràng. Không chỉ giải thích cú pháp rồi kết thúc, mà còn liên tục giải thích tại sao cần khái niệm này, và sau này nó được sử dụng như thế nào trong SPA, điều đó thật tuyệt vời. Đặc biệt phần dự án rất hay. Thông thường chỉ gõ theo rồi kết thúc, nhưng khóa học này có luồng: dự án trung gian → nhận ra vấn đề → bổ sung khái niệm → dự án cuối cùng, nên không thể không suy nghĩ. Thành thật mà nói thì không dễ, nhưng nhờ đó mà học được rất nhiều. Tài liệu khóa học (handbook) cũng được tổ chức rất tốt, nên không chỉ khi học mà cả khi ôn tập tôi cũng liên tục tham khảo. Tôi muốn giới thiệu khóa học này cho những ai muốn sắp xếp lại JavaScript một cách đúng đắn.

5.0

산독기

100% đã tham gia

Tôi đã hoàn thành khóa học! Điều tôi cảm nhận được khi hoàn thành khóa học là rất vui vì có thể nghe được một khóa học được chuẩn bị thật kỹ lưỡng với mức giá hợp lý. Các khóa học lập trình có giá cả rất đa dạng, và tôi hiện tại cũng đang học nhiều khóa học khác nhau, nhưng không phải khóa học nào đắt tiền thì giảng viên sẽ trả lời câu hỏi tốt hay có cập nhật code. Vì vậy tôi đã rất thất vọng với một giảng viên nào đó, nhưng khi nghe khóa học của anh Hyobin thì thực sự khác biệt rõ rệt. Tuy hơi ngại khi so sánh với người khác, nhưng tôi mong những nhà giáo dục như anh Hyobin sẽ ngày càng thành công hơn. Nếu anh mở rộng khóa học sang React hay Next.js ngoài JavaScript thì sẽ rất tuyệt! Với tư cách là người dùng Inflearn n năm, đây là khóa học có tính hiệu quả chi phí cao nhất và bổ ích nhất. Tất nhiên dự án cuối cùng khá khó, nhưng tôi nghĩ độ khó đó có ý nghĩa là phải khiêm tốn ôn tập lại, nên nó đã tạo động lực cho tôi. Tôi chưa bao giờ viết đánh giá khóa học dài như thế này, nhưng vì đã trở thành fan của anh Hyobin nên tôi viết đánh giá này để giới thiệu cho những người khác! Sổ tay chi tiết, phát âm rõ ràng, ví dụ gọn gàng, trả lời câu hỏi nhanh chóng, v.v. không có điểm nào đáng tiếc. Mong anh sẽ ngày càng nổi tiếng hơn ở Inflearn và trong ngành giáo dục! Cảm ơn anh vì khóa học hay!

5.0

kimday365

100% đã tham gia

Tôi đã chuẩn bị chuyển việc và sau gần 5 năm lại quay trở lại với FE. Khi bắt đầu lại thì không biết nên học từ đâu, cảm thấy rất bối rối, Qua việc nghe bài giảng này, từ việc ôn tập lại những phần tôi đã biết sơ qua trước đây, đến cấu trúc ngữ pháp mới, và các khóa học nâng cao như đơn vị object / property / component, tôi đã có thể học được rất nhiều điều bổ ích. Đặc biệt việc tiến hành dự án thực sự là khoảng thời gian rất có ích. Không chỉ đơn thuần học kiến thức cơ bản & ngữ pháp mà còn học được cách sử dụng trong thực tế sẽ như thế nào, Thay vì tạo todo list như mọi lần, việc tiến hành một dự án mới đã là khoảng thời gian thú vị hơn nữa! Tôi rất mong chờ bài giảng tiếp theo! Cảm ơn bài giảng hay :)

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

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

  • Các khái niệm JavaScript cần thiết cho phát triển thực tế

  • Lập trình bất đồng bộ thông qua đối tượng Promise và async/await

  • Component và mô-đun hóa

  • Thao tác với các phần tử web bằng DOM API

  • Quản lý trạng thái bằng cách sử dụng state và setState

  • Phát triển SPA không cần thư viện

  • Điều hướng thông qua History API

  • Sử dụng JavaScript như React

🍀 Các học viên của khóa học 'Bước chân đầu tiên vào JavaScript dành cho Web Frontend'
hãy mua khóa học với mức giá ưu đãi (giảm 35%) thông qua liên kết dưới đây nhé!!

-> Liên kết mã giảm giá

🤯 Vanilla JavaScript
Tại sao chúng ta cần phải học nó một cách chi tiết?

Vanilla JavaScript về cơ bản có nghĩa là viết mã bằng
JavaScript thuần túy mà không cần bất kỳ thư viện hay khung (framework) nào.

Học Vanilla JavaScript là một quá trình quan trọng để xây dựng nền tảng phát triển web,
giúp bạn có thể hiểu được nguyên lý cơ bảncách thức hoạt động của JavaScript,
cũng như có thể sử dụng các công cụ và công nghệ đa dạng một cách hiệu quả. efficiently.

Ngay cả trong những tình huống sử dụng các thư viện như React.js, bạn vẫn có thể hiểu được cách các công nghệ này hoạt động, và
có thể rèn luyện khả năng phát triển tự do mà không phụ thuộc vào thư viện, vì vậy
việc học JavaScript thuần túy là một quá trình rất quan trọng đối với các nhà phát triển.

Khóa học JavaScript hoàn thành trong một lần là..!

Khóa học này bao gồm các cú pháp JavaScript mới nhất, giúp bạn học cách phát triển 2 dự án thông qua việc sử dụng
JavaScript thuần túy mà không cần thư viện, từ gọi API, thao tác DOM, cho đến quản lý trạng thái, định tuyến (routing) và phát triển SPA.

Học cú pháp JavaScript mới nhất
phiên bản ES6+

Từ API, thao tác DOM, quản lý trạng thái, đến phát triển SPA, tất cả trong một!

Kiểm tra nội dung và học lặp lại
thông qua tổng cộng 2 dự án

Bạn có thể học các khái niệm về JavaScript cùng với tài liệu giảng dạy chỉnh chu 👍
Tất cả tài liệu giảng dạy đều được cung cấp dưới dạng tệp pdf như dưới đây.

Xem trước tài liệu bài giảng Phần 1~Phần 5

Xem trước tài liệu bài giảng Section 6~Section 9

Sau khi hoàn thành khóa học JavaScript trọn gói, bạn có thể phát triển 2 dự án như
dưới đây.

Dự án giữa kỳ

Dự án cuối khóa

Để giúp bạn kiểm tra những phần chưa hiểu rõ trong khi học, hoặc
có thể ôn tập lại nội dung ngay cả sau khi kết thúc khóa học,
chúng tôi cũng cung cấp sổ tay (handbook) đi kèm để bạn có thể xem cùng với bài giảng như hình dưới đây! as shown in the image below!

Sổ tay (Trang web giáo án bài giảng)

🙋🏻‍♀️ Tôi đề xuất khóa học này cho những đối tượng sau:

Từ cơ bản đến nâng cao trong một lần!
Những ai muốn học từ các khái niệm cơ bản đến chuyên sâu cùng một lúc.
Hãy học các khái niệm cần thiết thông qua việc trực tiếp phát triển dự án.

Tôi đang chuẩn bị xin việc ở vị trí Frontend.
Những người đang chuẩn bị tìm việc để trở thành nhà phát triển Frontend.

Hãy học các khái niệm về thao tác DOM, quản lý trạng thái và SPA.

Tôi không rành về Vanilla JavaScript.
Dành cho những bạn đang sử dụng React.js, Next.js nhưng chưa tự tin về JavaScript.

Hãy học lại các khái niệm cần thiết trước khi sử dụng thư viện và framework.

Sau khi hoàn thành khóa học..

  • Bạn có thể hiểu được cú pháp cơ bản của Vanilla JavaScript cũng như các khái niệm từ cơ bản đến nâng cao.

  • Bạn có thể hiểu được các khái niệm như phương thức mảng, xử lý bất đồng bộ, thành phần và mô-đun hóa thường được sử dụng trong thực tế. that are frequently used in the field.

  • Bạn có thể phát triển thao tác DOM, gọi API, quản lý trạng thái, và phát triển SPA chỉ bằng JavaScript.


  • Bạn có thể học React.js và Next.js một cách dễ dàng hơn.

💥 Điểm khác biệt so với các bài giảng khác là đây

Khóa học JavaScript hoàn thành trong một lần này có những điểm khác biệt sau đây.

Giải thích chi tiết khái niệm thông qua tài liệu bài giảng

Hình ảnh động được áp dụng vào tài liệu sạch sẽ và trực quan, cùng với mã ví dụ, bạn sẽ được học tập một cách tỉ mỉ từ ngữ pháp và khái niệm cơ bản cho đến các khái niệm chuyên sâu.

Mã ví dụ cùng nhau soạn thảo

Trực tiếp viết các khái niệm đã học vào VSCode.
Thực hành viết mã JavaScript cùng nhau thông qua lập trình trực tiếp (live coding).

Phát triển dự án giữa kỳ và học thêm các khái niệm bổ sung

Dự án giữa kỳ giúp bạn kiểm tra xem mình đã hiểu rõ những nội dung đã học hay chưa thông qua việc trực tiếp phát triển dự án. Sau đó, bạn sẽ nhận diện các vấn đề của dự án đã phát triển và học thêm các khái niệm cần thiết để tạo ra một dự án tốt hơn.

Ôn tập toàn bộ nội dung thông qua việc phát triển dự án cuối khóa

Chúng ta sẽ cùng nhau phát triển dự án cuối khóa bằng cách sử dụng tất cả nội dung đã học trong bài giảng. Bạn có thể ôn tập lại các nội dung một lần nữa trong quá trình phát triển dự án.

Cung cấp tất cả tài liệu

Đối với các học viên, chúng tôi cung cấp giáo trình bài giảng dưới dạng trang web (sổ tay),
còn mã nguồn dự án và các tài liệu được sử dụng trong bài giảng sẽ được cung cấp tương ứng qua github và tệp pdf.

🔎 Tôi muốn biết chi tiết về chương trình học cụ thể

Chương trình giảng dạy của khóa học JavaScript trọn gói như sau:

📌 Phần 1. Cơ bản về JavaScript ~ Phần 2. Bất đồng bộ và API

Đầu tiên, bạn sẽ được học các cú pháp cơ bản và khái niệm chuyên sâu thông qua tài liệu bài giảng (ppt), sau đó
áp dụng những nội dung đã học để trực tiếp viết mã ví dụ nhằm củng cố vững chắc các khái niệm.

📌 Phần 3. DOM và DOM API

Sau khi tìm hiểu kỹ về DOM, chúng ta sẽ học về nhiều DOM API khác nhau để có thể thao tác với DOM.

Vừa học cách thao tác với các phần tử form thường dùng, vừa trực tiếp thao tác với DOM bằng cách sử dụng DOM API.

📌 Phần 4. Từ khóa this và hàm mũi tên

Chúng ta sẽ tìm hiểu về từ khóa this trong JavaScript và thông qua thực hành để kiểm tra xem giá trị nào được ràng buộc (binding) với this tùy theo từng tình huống.

Sau đó, chúng ta cũng sẽ tìm hiểu về mối quan hệ giữa this và hàm mũi tên (arrow function), cũng như giữa this và hàm thông thường (regular function).

📌 Phần 5. Dự án giữa kỳ

Chúng ta sẽ phát triển một trang web đơn giản bằng cách sử dụng những nội dung đã học cho đến nay.
Chúng ta sẽ phát triển trang web và từng bước xác định các vấn đề phát sinh trong quá trình sản xuất.

📌 Phần 6. Component và Hệ thống Module

Chúng ta sẽ tìm hiểu về hệ thống component và module để giải quyết các vấn đề phát sinh trong quá trình phát triển dự án giữa kỳ.
Đầu tiên, chúng ta sẽ học qua tài liệu bài giảng và mã ví dụ, sau đó áp dụng những nội dung đã học vào dự án giữa kỳ để giải quyết các vấn đề.

📌 Phần 7. Quản lý trạng thái và SPA

Học về quản lý trạng thái và SPA, những khái niệm cần thiết để giải quyết các vấn đề phát sinh trong dự án giữa kỳ.
Tìm hiểu quản lý trạng thái là gì và cách phát triển nó, đồng thời xem xét các khái niệm về SPA và MPA cũng như CSR và SSR. Cuối cùng, áp dụng những nội dung đã học để chỉnh sửa mã nguồn dự án giữa kỳ..

📌 Phần 8. Dự án cuối khóa

Sử dụng tất cả những nội dung đã học từ trước đến nay để phát triển dự án cuối khóa.

Chúng ta sẽ tìm hiểu các tính năng cần thiết cho một trang web, cùng nhau chia nhỏ chúng thành các thành phần (component) theo từng chức năng, sau đó trực tiếp phát triển trang web bằng VSCode.

Tính năng tìm kiếm, tính năng lọc,chuyển trang và các chức năng khác sẽ được phát triển. are among the features to be developed.

💬 Câu hỏi thường gặp

Q. Người không chuyên có thể học được không?

Vì khóa học bao gồm cả các khái niệm cơ bản và cung cấp cả tài liệu giảng dạy, nên ngay cả những người mới bắt đầu học lập trình cũng có thể theo học. Tuy nhiên, hãy học đi học lại nhiều lần nhé!

Tôi muốn nghe thử bài giảng trước!

Chúng tôi đang công khai miễn phí 8 bài giảng.

Đối với những bạn muốn nghe thử bài giảng trước,
hãy học thử các bài giảng có ghi chữ 'Xem trước'.

Hỏi: Tôi không chắc liệu khóa học này có giúp ích được gì không..

Nếu bạn đã biết JavaScript ở một mức độ nhất định,
hãy thử tự chẩn đoán thông qua danh sách kiểm tra dưới đây nhé!

Nếu bạn thuộc về từ 8 mục trở lên trong số 10 mục,
bạn không cần phải tham gia khóa học này cũng được 😄

  • Tôi hiểu rõ về phạm vi (scope)hoisting..

  • Hiểu về đối tượng Promisebất đồng bộ, đồng thời có thể gọi API để nhận dữ liệu..

  • Có thể thao tác với DOM bằng JavaScript.

  • Hiểu rõ về this trong JavaScript.

  • Hiểu về SPAcách thức hoạt động của SPA..

  • Có thể triển khai quản lý trạng thái mà không cần thư viện.

  • Có thể thành phần hóa (componentize) trang web theo từng chức năng.

  • Có thể mô-đun hóa các tệp và sử dụng import, export để phát triển.

  • Có thể hiện thực hóa việc định tuyến trang (routing) bằng cách sử dụng history api..

  • Có thể triển khai SPA bằng JavaScript.


📣 Lưu ý trước khi khóa học bắt đầu

Môi trường thực hành

  • Sử dụng trình duyệt Chrome.

  • Sử dụng VSCode để viết mã. (Cách cài đặt và cách sử dụng đã được bao gồm trong bài giảng.)

Tài liệu học tập

  • Tài liệu được sử dụng trong bài giảng được cung cấp dưới định dạng pdf.

  • Nội dung được sử dụng trong bài giảng được cung cấp dưới định dạng trang web.

  • Mã nguồn dự án có thể được kiểm tra thông qua liên kết github.

Kiến thức tiên quyết và lưu ý

  • Kiến thức tiên quyết: HTML, CSS

    • Các thẻ thường được sử dụng trong HTML đang được giải thích trong bài giảng.

    • Mã CSS sẽ được cung cấp riêng.

  • Lưu ý

    • Vui lòng sử dụng trình duyệt Chrome và VSCode để học tập.

    • Câu trả lời cho câu hỏi sẽ được soạn thảo trong vòng 24 giờ.


띠배너

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

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

  • Những người muốn tìm việc làm với vị trí nhà phát triển Front-end

  • Những người muốn vừa phát triển dự án vừa học hỏi nhiều khái niệm khác nhau.

  • Những bạn muốn học Vanilla JavaScript

  • Những người muốn học cùng với tài liệu bài giảng

  • Những người muốn học tập cùng nhiều người khác thông qua các nhóm học tập (study)

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

  • HTML

  • CSS

Xin chào
Đây là hyobin

12,034

Học viên

441

Đánh giá

137

Trả lời

4.9

Xếp hạng

14

Các khóa học

Xin chào, tôi là Kim Hyo-bin 😊
Tôi đang cung cấp các bài giảng dễ hiểu và tận tâm dành cho những bạn mong muốn trở thành nhà phát triển Front-end.

(Hiện tại) Giảng viên đào tạo lập trình Front-end

(Cựu) Trưởng nhóm phát triển Frontend tại Startup


Trang web

https://hyobb.com/

Bài giảng trực tuyến

Sách

Hoạt động bên ngoài

  • Tác giả YozumIT

  • Tiến hành các bài giảng đặc biệt tại Udemy, Codeit, Đại học Nữ Hanyang, v.v.

Thêm

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

Tất cả

55 bài giảng ∙ (9giờ 40phú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ả

158 đánh giá

4.8

158 đánh giá

  • minzinging7984님의 프로필 이미지
    minzinging7984

    Đánh giá 1

    Đánh giá trung bình 5.0

    5

    33% đã tham gia

    Các tài liệu trực quan rõ ràng và hơn hết, thật tuyệt khi họ giải thích từng bước một cách chậm rãi thông qua mã hóa trực tiếp. Tôi sẽ tiếp tục học và hoàn thành khóa học! Cảm ơn bạn vì bài giảng tuyệt vời.

    • hyobin
      Giảng viên

      Cảm ơn bạn đã đánh giá tốt😀 Mong bạn kiên trì!!

  • ygvbhy518205님의 프로필 이미지
    ygvbhy518205

    Đánh giá 13

    Đánh giá trung bình 5.0

    Đã chỉnh sửa

    5

    56% đã tham gia

    Tôi đã biết đến khóa học này sau khi xem bài giảng của Lee Jung-hwan và đăng ký vào cộng đồng Hanib. Vì tôi chỉ mới sử dụng SPA chứ chưa tự mình tạo ra nó bao giờ, nên tôi đã nhấn nút thanh toán ngay lập tức 😆😆. Vì đang có việc phải làm nên tôi không thể tham gia thử thách Hanib, nhưng tôi rất hài lòng với khóa học này. Tôi đã tua qua những phần mình đã biết và chỉ nghe phần cuối của bài giảng trong khi ôn tập bằng sổ tay, và tôi rất hài lòng với khóa học này. Cách phát âm của Lee Jung-hwan rất tốt nên nghe rất dễ, còn 효빈님 thì có cách phát âm đặc biệt tốt. Cảm ơn bạn.

    • hyobin
      Giảng viên

      SK님! Cảm ơn bạn vì đánh giá tốt ạ 😊 Bạn có thể tham gia thử thách "Một miếng" để ôn tập lại sau này nhé :) Một lần nữa xin cảm ơn bạn vì đánh giá tốt ạ 👍

  • skateboard295254님의 프로필 이미지
    skateboard295254

    Đánh giá 2

    Đánh giá trung bình 5.0

    5

    100% đã tham gia

    Tôi nghĩ rằng đây là một khóa học phù hợp với những người còn thiếu kiến thức về JavaScript. Tôi cảm thấy rất hữu ích vì tôi có thể nắm bắt được những khái niệm cần thiết về Vanilla JavaScript một cách dễ dàng 👍 Sổ tay được cung cấp giúp tôi viết code dự án một cách thuận tiện!! Nó rất tốt để ôn tập và cũng rất tuyệt để xem cùng với các bài giảng. Tôi đã có thể tham gia một khóa học hay với giá cả phải chăng. Cảm ơn bạn!!

    • hyobin
      Giảng viên

      Chào Ratatouille 😊 Cảm ơn bạn vì những đánh giá khoá học tích cực!! Chúc mừng bạn đã hoàn thành khoá học 🥳🥳

  • pasw91537님의 프로필 이미지
    pasw91537

    Đánh giá 5

    Đánh giá trung bình 5.0

    5

    100% đã tham gia

    Sau khi tham gia khóa học JavaScript đầu tiên về giao diện người dùng web, Tôi rất thích tham gia khóa học này vì tôi hiểu rõ nó. Sau khi nghe khóa học mẫu, nếu bạn thấy khóa học này hơi nặng nề, Tôi khuyên bạn nên tham gia khóa học này để bắt đầu với JavaScript cho giao diện người dùng web. Và nếu bạn có cơ hội Một khóa học về các trang web trung tâm mua sắm mà bạn có thể học bằng cách tạo và theo dõi. Tôi muốn bạn lập kế hoạch và thực hiện nó. Dường như không có nhiều khóa học liên quan đến các trang trung tâm mua sắm như Infron và các trang khác. Khóa học giá cả phải chăng rất hữu ích. Cảm ơn

    • hyobin
      Giảng viên

      Chúc mừng pasw9 đã hoàn thành khóa học 👏 Một khóa học JavaScript có thể được hoàn thành trong một lần học, Đó là một khóa học tốt hơn để tham gia sau khi tham gia khóa học bước đầu tiên!! Trong tương lai, tôi cũng sẽ chuẩn bị một khóa học về trang web trung tâm mua sắm nếu có cơ hội! Cảm ơn bạn đã đánh giá tốt 😊

  • devrooney님의 프로필 이미지
    devrooney

    Đánh giá 3

    Đánh giá trung bình 5.0

    Đã chỉnh sửa

    5

    100% đã tham gia

    Giọng nói rõ ràng và phát âm chuẩn xác nên nghe ở tốc độ 2x vẫn rõ! Và cấu trúc dễ hiểu. Cảm ơn bạn.

    • hyobin
      Giảng viên

      Ông No Hong-gi! Cảm ơn vì những đánh giá tốt đẹp :) Chúc mừng đã hoàn thành khóa học👍👍

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!

744.664 ₫