강의

멘토링

로드맵

BEST
Programming

/

Front-end

Áp dụng ngay vào thực tế Kiểm thử Frontend - Phần 1. Nền tảng kiểm thử: Kiểm thử đơn vị・Kiểm thử tích hợp

Thông qua bài giảng này, bạn sẽ nắm bắt được các loại kiểm thử front-end tổng thể và học cách viết các kiểm thử đáng tin cậy bằng cách lựa chọn các kiểm thử phù hợp với tình huống.

(4.9) 74 đánh giá

969 học viên

  • hanjungv
단위테스트
통합테스트
프런트엔드
검증
Software Test
JavaScript
React
vitest

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

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

  • Các khái niệm quan trọng cần thiết để viết bài kiểm tra

  • Cách viết test frontend để tăng độ tin cậy cho code bạn viết

  • Hướng dẫn viết kiểm thử đơn vị và tích hợp bằng vitest

  • Hướng dẫn sử dụng các công cụ kiểm thử như Testing Library, MSW


🎊 이벤트 🎊 

Nhận coupon giảm 30% cho Phần 1!

📌 Liên kết (77,000 -> 53,600원)

1. Làm thế nào để sử dụng coupon?Bạn có thể sử dụng coupon bằng cách nhấp vào coupon mong muốn tại [Giỏ hàng khóa học → Chọn coupon → Coupon có thể sử dụng].
2. Làm thế nào để đăng ký coupon?Coupon sẽ được phát hành khi bạn nhập mã coupon sở hữu tại [Giỏ hàng khóa học → Chọn coupon], [Dashboard → Hộp coupon].

Nếu bạn đã tham gia khóa học Phần 1, hãy nhận coupon giảm giá 50% cho Phần 2!

Chúng tôi đang chia sẻ coupon giảm giá 50% cho phần 2 dành cho những bạn đã hoàn thành tất cả các bài giảng phần 1, giúp bạn mua với giá rẻ hơn. Hãy truy cập bài viết dưới đây và sử dụng coupon trước khi mua!

📌 Bài viết link: 링크
⚠️ Bài viết này chỉ hiển thị cho người đã mua phần 1.

Chúng tôi hỗ trợ chi phí khóa học cho sinh viên và người chuẩn bị việc làm 💪

Để các bạn sinh viên không có thu nhập hoặc đang chuẩn bị việc làm bớt gánh nặng tài chính, nếu điền và gửi form thì chúng tôi sẽ tặng coupon giảm giá 50%. Nếu link đăng ký đang mở thì có thể đăng ký được. Chúng tôi ủng hộ việc học tập của các bạn. Hãy cố gắng lên! 🔥

📌 Link đăng ký: https://forms.gle/ohs7KywvSGXoJXGM7
⚠️ Chủ đề này có thể hơi khó đối với những bạn mới bắt đầu học FE. Hãy chắc chắn kiểm tra kiến thức tiên quyết trước khi tham gia khóa học!


Bạn có đang băn khoăn về những điều này không? 🤔

Tôi tò mò về
frontend test kiểm tra những gì

Việc thử nghiệm bằng tay
trực tiếp trên thiết bị
quá lặp đi lặp lại và mệt mỏi

Tôi tò mò về
kiểm thử frontend thực tế được viết
trong công việc

Học các loại test frontend khác nhau và viết test bằng cách sử dụng các ví dụ gần với trường hợp thực tế!

  • 🤔 Bạn đã quen với việc tạo ứng dụng ở một mức độ nào đó, nhưng có lo lắng liệu nó có thực sự hoạt động tốt trong môi trường production không?
  • 🤔 Mọi người đều nói rằng việc test thực sự cần thiết nhưng có quá nhiều loại test frontend khác nhau khiến bạn không dám bắt đầu phải không?
  • 🤔 Bạn có muốn xác minh và tự động hóa nhiều thứ hơn trong khi vẫn cố chấp với một loại test cụ thể không?
  • 🤔 Bạn có muốn tổng hợp về mục đích của test và loại test nào cần viết không?

Nếu bạn đang có những băn khoăn này, thì bạn đã tìm đúng chỗ rồi!
"Áp dụng ngay vào thực tế - Frontend Testing" được chúng tôi khuyến nghị cho các bạn.

Khóa học được các chuyên gia Frontend thực tế khuyến nghị!

"Đây là khóa học mà bạn có thể học được tất cả từ tính cần thiết của test code đến các khái niệm testing đa dạng và phương pháp ứng dụng. Những ai chưa quen thuộc với testing có thể nắm vững khái niệm testing thông qua khóa học, còn những ai đã từng viết test code trước đây có thể học cách viết test code hiệu quả và có ý nghĩa hơn thông qua các ví dụ và thực hành trong khóa học để áp dụng vào công việc thực tế."

- Nhà phát triển Frontend tại Kurly Yoo Kyung-sang

"Khi viết test code, có những lúc bản thân cần phải thuyết phục chính mình. 'Liệu việc test có làm trễ tiến độ phát triển không?' 'Có đúng khi test cái này không?' 'Có nên test những nội dung sẽ thay đổi sau này không?'"

Khóa học này đang cho thấy các kỹ thuật đa dạng về cách có thể kiểm thử một trang web mua sắm đơn giản một cách chiến lược. Sau khi xem hết video, tôi nghĩ bạn sẽ có thể tự tin viết code kiểm thử mà bản thân có thể thuyết phục được. Tôi hy vọng nhiều người xem video này và có được sự tự tin trong việc kiểm thử.

- Lee Sang Chul, nhà phát triển frontend tại LINE Plus

"Đây là khóa học tập trung vào những điểm cốt lõi từ lý do tại sao phải viết test code cho đến cách viết như thế nào, dựa trên các ví dụ thực tế có thể sử dụng trong công việc. Test code là phần không thể thiếu để tạo ra ứng dụng đáng tin cậy, nhưng tôi luôn băn khoăn về việc nên test cái gì và test như thế nào. Khóa học đã giúp tôi rất nhiều bằng cách sắp xếp và giải thích một cách rõ ràng các tiêu chí và phương pháp đó."

- Kim Eun Bin, nhà phát triển frontend tại LINE Plus

Thông qua khóa học này, hãy hiểu được mục đích của các loại test frontend khác nhau và tạo ra một ứng dụng hoàn thiện, vững chắc. 😍


Khóa học tốt nhất để học
nhiều loại test frontend cùng một lúc 🚀

Trong khóa học này, chúng ta sẽ học nhanh và dễ dàng về unit test, integration test, snapshot test, visual regression test, E2E test qua 2 phần bằng cách sử dụng dự án tương tự như trong thực tế. Hiểu được ưu điểm và hạn chế của từng loại test, nắm rõ mục đích của testing để có thể xây dựng workflow riêng cho bản thân.

Điểm quan trọng của bài giảng!

Từng bước một, bắt đầu từ những khái niệm quan trọng

Tầm quan trọng của việc kiểm thử và các quy tắc, khái niệm chung cần biết khi viết test sẽ được giải thích.

Ngay cả khi có những khái niệm mới lần đầu tiếp xúc

Truyền đạt rõ ràng mục đích tại sao sử dụng từng công cụ và API, đồng thời xem xét kỹ lưỡng định nghĩa của từng loại test và phương pháp lựa chọn đối tượng.

để có thể tự học và phát triển

Cung cấp các ví dụ và đáp án để bạn có thể tự viết test dựa trên nội dung đã học, hỗ trợ việc học test một cách hiệu quả.

Tương tự như thực tế công việc

Chúng tôi cung cấp dự án ví dụ để bạn có thể dễ dàng áp dụng trong thực tế bằng cách viết test dựa trên ví dụ về trang thương mại điện tử giao tiếp với môi trường server thực tế để học cú pháp và công cụ.


Phần 1 bao gồm tổng cộng năm phần
được cấu thành 📚

Phần 1
Chuẩn bị viết test Frontend

  • Tìm hiểu thử nghiệm là gì và xem xét hiệu quả khi viết mã thử nghiệm.
  • Chúng ta sẽ tìm hiểu các quy tắc để viết test đúng cách khi viết test cho frontend.
  • Giới thiệu về các tính năng của dự án mẫu sẽ được sử dụng trong tương lai.

Phần 2
Unit Test là gì?

  • Giải thích về khái niệm và mục đích của unit test.
  • Giải thích về nội dung cần được xác minh khi viết unit test.
  • Giới thiệu về framework kiểm thử Vitest và viết unit test dựa trên mã ví dụ.
  • Trong quá trình này, chúng ta sẽ tìm hiểu về các cú pháp cần thiết để viết test như Matcher và Assertion, it, setup, teardown.
  • Chúng ta sẽ tìm hiểu về Testing Library - công cụ hỗ trợ kiểm thử component.

Phần 3
Viết unit test

  • Chúng ta sẽ xem xét các tiêu chí để lựa chọn đối tượng kiểm thử đơn vị dựa trên ví dụ về trang web thương mại điện tử.
  • Tìm hiểu về Mocking và các phương pháp khởi tạo mocking, đồng thời tìm hiểu cách viết các bài test độc lập.
  • Tìm hiểu cách viết test cho timer - thứ thường xuyên gặp phải khi sử dụng React hooks, và khám phá cách sử dụng hiệu quả hàm act cùng React Testing Library cũng như những điểm cần lưu ý.
  • Chúng ta sẽ tìm hiểu về những hạn chế của unit test.

Phần 4
Kiểm thử tích hợp là gì?

  • Giải thích về khái niệm và mục đích của kiểm thử tích hợp.
  • Chúng ta sẽ xem xét các tiêu chí lựa chọn đối tượng kiểm thử tích hợp dựa trên ví dụ về trang web thương mại điện tử.
  • Chúng ta sẽ tìm hiểu về phương pháp mocking thư viện quản lý state và phương pháp mocking API sử dụng MSW.
  • Chúng ta sẽ xem xét các tiêu chí lựa chọn đối tượng kiểm thử đơn vị dựa trên ví dụ về trang web thương mại điện tử.
  • Chúng ta sẽ tìm hiểu cách sử dụng các hàm tiện ích bất đồng bộ của React Testing Library.

Phần 5
Viết kiểm thử tích hợp

  • Viết test tích hợp dựa trên ví dụ về cửa hàng trực tuyến.
  • Tìm hiểu về những hạn chế của kiểm thử tích hợp.
  • Chúng ta sẽ tìm hiểu cách tự động hóa kiểm thử bằng cách sử dụng GitHub Actions.

Khóa học liên quan

Kiểm thử Frontend áp dụng ngay vào thực tế

2부: Kiểm thử nâng cao - Kiểm thử hồi quy trực quan · Kiểm thử E2E
Link: https://inf.run/DRRLB


Q&A 💬

Q. Tôi có thể học khóa học này trên cả Windows và macOS không?

Có, điều đó hoàn toàn có thể. Khóa học được tiến hành trên macOS và sử dụng môi trường VSCode cùng với trình duyệt (Google Chrome).

Q. Tài liệu học tập có thể tải ở đâu?

Tài liệu bài giảng được bao gồm trong khóa học, và vui lòng tham khảo mã ví dụ trên GitHub.

Q. Có kiến thức nào cần biết trước khi nghe bài giảng không?

Cần có kiến thức cơ bản về JavaScript (ES6) và React. Vì khóa học này nói về testing nên sẽ giới thiệu đơn giản về các công nghệ được sử dụng trong dự án, nhưng cách sử dụng cụ thể thì bạn cần tự học. Chúng tôi sử dụng ở mức độ không quá khó nên bạn hoàn toàn có thể theo kịp nếu vừa học các công nghệ vừa làm theo từ từ.

Q. Có thể học trước các phần mong muốn mà không cần theo thứ tự không?

Khóa học này giải thích tuần tự các khái niệm về testing và cách viết từng loại test, những hạn chế của chúng, đồng thời giới thiệu các phương pháp testing mới để vượt qua những hạn chế đó. Do đó, tôi khuyến nghị bạn nên học tuần tự từ các phần trước.

Q. Phần 1 và phần 2 có phải là các bài giảng liên tiếp không?

Vâng. Khóa học sẽ tiến hành với cùng một dự án ví dụ, và nội dung đã giới thiệu ở phần 1 sẽ không được giới thiệu lại ở phần 2. Nếu có thể, tôi khuyến nghị bạn nên học cả phần 1 và phần 2 cùng nhau.

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

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

  • Những ai muốn tự tin vào đoạn code mình viết thông qua việc kiểm thử

  • Những ai muốn tự động hóa việc kiểm chứng lặp đi lặp lại bằng tay thông qua kiểm tra.

  • Dành cho những bạn luôn tò mò về việc kiểm thử front-end thường xác minh những gì

  • Dành cho những ai muốn học nhiều loại kiểm thử frontend cùng một lúc và xây dựng quy trình làm việc phù hợp.

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

  • JavaScript

  • CSS · HTML

  • React

Xin chào
Đây là

1,573

Học viên

93

Đánh giá

67

Trả lời

4.9

Xếp hạng

2

Các khóa học

코드 조커

기초부터 완성까지, 프런트엔드(개발부터 테스트까지, 이론과 예제로 배우는 프런트엔드) 저자
12년차 프런트엔드 개발자
(현) 글로벌 컨텐츠 회사 FE 개발 부문 팀장
(전) NHN TOAST Cloud FE 개발 팀장
(전) 삼성 SDS FE 개발자

오프

기초부터 완성까지, 프런트엔드(개발부터 테스트까지, 이론과 예제로 배우는 프런트엔드) 저자
8년차 프런트엔드 개발자
(현) 글로벌 메신저 회사 FE 개발자
(전) NHN TOAST UI 오픈소스 개발자

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

Tất cả

25 bài giảng ∙ (4giờ 42phú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ả

74 đánh giá

4.9

74 đánh giá

  • doooni님의 프로필 이미지
    doooni

    Đánh giá 3

    Đánh giá trung bình 5.0

    5

    72% đã tham gia

    Tôi phải viết mã kiểm tra, tôi phải viết nó... Tôi chỉ đang nghĩ về nó và tôi thực sự muốn làm nó cho đúng nên tôi đã giảng bài. Nội dung bài giảng rất hay, thật tuyệt khi được cung cấp mã nên tôi chỉ tập trung vào mã kiểm tra. Bây giờ tôi đã có đủ can đảm để áp dụng nó vào thực tế! Cảm ơn :)

    • hanjungv
      Giảng viên

      Cảm ơn bạn đã đánh giá tốt!! Nếu bạn gặp khó khăn gì khi đăng ký, vui lòng đặt câu hỏi bất cứ lúc nào!!

  • jdh9811181606님의 프로필 이미지
    jdh9811181606

    Đánh giá 2

    Đánh giá trung bình 5.0

    5

    100% đã tham gia

    Tôi nghĩ nhiều người đang lo lắng về việc kiểm tra là gì, kiểm tra cái gì và kiểm tra như thế nào. Ngay cả những người mới làm quen với thử nghiệm cũng có thể dễ dàng theo dõi bài giảng này. Thật tuyệt khi có thể đạt được điều gì đó bằng cách xem xét cài đặt dự án mẫu tách biệt với thử nghiệm :) Cảm ơn bạn đã tạo ra một khóa học tuyệt vời! Tôi cũng sẽ lắng nghe kỹ phần 2~

    • hanjungv
      Giảng viên

      Tôi rất vui vì bạn đang sử dụng tốt bài giảng! Sẽ hữu ích hơn nếu bạn nghiên cứu phần còn lại của các mã kiểm tra cùng nhau. Hãy nhớ hoàn thành Phần 2 và tôi hy vọng bạn sẽ chia sẻ những gì bạn đã áp dụng vào thực tế! Chúc mừng năm mới~

  • freddy님의 프로필 이미지
    freddy

    Đánh giá 7

    Đánh giá trung bình 5.0

    5

    56% đã tham gia

    • gloriousrsk3277님의 프로필 이미지
      gloriousrsk3277

      Đánh giá 5

      Đánh giá trung bình 5.0

      5

      100% đã tham gia

      Thật tuyệt vời khi được học qua những code ví dụ chất lượng tốt, có thể áp dụng ngay vào thực tế!

      • hanjungv
        Giảng viên

        Sẽ hữu ích hơn nếu bạn học bằng cách xem các mã không xuất hiện trong bài giảng. Tôi hy vọng bạn sẽ đảm bảo hoàn thành khóa học và chia sẻ những gì bạn đã áp dụng vào thực tế! Chúc mừng năm mới~

    • 1ilsang0174님의 프로필 이미지
      1ilsang0174

      Đánh giá 2

      Đánh giá trung bình 5.0

      5

      100% đã tham gia

      Khi viết mã kiểm tra, có những lúc bạn cần phải thuyết phục chính mình. “Liệu lịch trình phát triển có bị lùi lại do thử nghiệm không?”, “Việc thử nghiệm cái này có đúng không?”, “Chúng ta có nên thử nghiệm những thứ sẽ thay đổi trong tương lai không?” Bài giảng này trình bày các kỹ thuật khác nhau để thử nghiệm một cách chiến lược một trang web trung tâm mua sắm đơn giản. Sau khi xem video, tôi nghĩ bạn sẽ có thể tự tin viết mã kiểm tra ở mức chấp nhận được. Tôi hy vọng nhiều người xem video này và có được sự tự tin khi làm bài kiểm tra.

      1.611.840 ₫

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

      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!