Project đôi khi cách tệ nhất để học JavaScript

Một trong những lời khuyên nguy hiểm nhất cho người học JavaScript là “cứ việc làm projects thôi.”

Hiển nhiên, project là phương tiện tuyệt vời để học tập bất cứ ngôn ngữ lập trình nào. Tuy nhiên, vấn đề xuất hiện khi người ta cứ vồ vập lấy những project khó nhằn trong khi lại chưa đủ kiến thức cơ bản để đánh giá được làm thế nào là đúng hay sai.

Vấn đề này rất quan trọng, vì nếu nhảy vào một project quá sớm, người ta có thể trở nên chán nản và hoàn toàn từ bỏ JavaScript luôn.

Tôi sẽ không để bạn đi vào vết xe đổ này, vậy nên, trong bài viết, bạn sẽ đọc về:

  • Những cái bấy mà người học JavaScript thường sa vào, và lý do tại sao
  • Ví dụ cụ thể của các project thường khiến người ta bỏ học JavaScript
  • Cách tránh những cái bẫy thường gặp và học tập hiệu quả hơn
  • Khi nào và làm cách nào để bắt đầu nhảy vào project
  • Cách xác định nên sử dụng khái niệm nào khi bạn bắt đầu thực hiện project

Mục tiêu của bài viết này là để truyền sự tự tin trong học tập, dù bạn đang học JavaScript hay bất cứ ngôn ngữ lập trình nào khác.

Những lời “thỏ thẻ” thường dẫn đến thất bại

Một trong những câu nói tôi thường nghe nhất từ những người muốn học JavaScript là “Để tôi lập slideshow nhanh đã.”

Họ thử lập slideshow, và một trong hai tình huống sau sẽ xảy ra:

  • Mọi thứ có vẻ khó khăn, và họ tự nhủ họ sẽ “quay lại học sau” – và thường có ý nghĩa thật sự là vĩnh viễn bỏ cuộc.
  • Họ sẽ lập được slideshow, nhưng vì họ phải tìm hiểu quá nhiều tài liệu cùng một lúc, họ sẽ không thể áp dụng được về sau. Không biết áp dụng là họ chán nản, và chán nản, một lần nữa, dẫn đến vĩnh viễn bỏ cuộc.

Tại sao việc này lại sảy ra?

Cái bẫy quá lớn, Quá sớm

Người học JavaScript thường chọn slideshow làm project đầu tiên của mình vì nghe nó có vẻ đơn giản.

Khi họ bắt tay vào thực hiện, họ lại thấy khó hơn mình tưởng. Tạo slideshow có thể dính đến array, function, loop, animation, timing, thậm chí là listener, DOM manipulation và hơn thế nữa. Đây là một con số khái niệm mới lạ vô cùng choáng ngợp cho những ai mới chân ướt chân ráo bước vào lĩnh vực này.

Bỗng nhiên, một project tưởng chừng dễ nhằn lại trở nên vô cùng khó khăn. Sự khác biệt so với kỳ vọng ban đầu gây ra hiệu ứng tâm lý vô cùng kinh khủng. Người học tự nhủ “Nếu dễ thế này mà làm không được, thì chắc tôi không hợp với JavaScript rồi”.

Giải quyết mọi vấn đề trong Scalable Social Network – Đăng kí ngay!
Giải quyết mọi vấn đề trong Scalable Social Network – Đăng kí ngay!

Thay vào đó, một số người sẽ thành công cho ra đời một slideshow, nhưng đây sẽ là bản chấp vá từ sự trợ giúp của hàng tá bài hướng dẫn cùng những thấu hiểu khá ít ỏi về mọi thứ đang diễn ra. Trong những trường hợp này, bạn thường nghe những câu như, “Tôi đã có thể làm đúng theo hướng dẫn, nhưng rồi lại chả áp dụng được cho bản thân.”

Dù có làm được hay không đi chăng nữa, kết quả cuối cùng thường là cảm giác chán chường có thể khiến người ta từ bỏ học JavaScript.

Những kịch bản này không chỉ xảy đến với slideshow mà còn với các project mà người học nhảy vào lúc quá sớm. Ví dụ, một to-do list nghe có vẻ đơn giản, nhưng lại có thể biến thành một full-stack project nếu data được lưu trữ bên ngoài bộ nhớ cục bộ hoặc cookies của trình duyệt.

Khi ai đó bắt đầu học JavaScript, việc xác định trước độ khó của một project không phải là điều dễ dàng, và đó là ngọn nguồn của vấn đề.

Project nào làm người ta bỏ ngang?

Để cũng cố vấn đề hơn, sau đây là một số project nghe-có-vẻ-dễ cụ thể mà người ta thường thực hiện quá sớm, và các khái niệm thực sự có liên quan.

Project Khái niệm có liên qua
Quiz Arrays, objects, functions, forms, event listeners
To-do list Arrays, objects, functions, một số dạng lưu trữ (front-end hoặc back-end), DOM manipulation, event listeners
A “little social network” Đây là một project full-stack, ngoài liên đới tới front-end JavaScript, còn dính đến các khái niệm backend có thể kể đến databases, authentication, security, user management, etc.

Mục tiêu là gì?

Mục tiêu của phần này không phải là đễ dọa bạn sợ thử những thứ mới. Bạn có thể tìm đến những project này nhanh hơn bạn tưởng, miễn là bạn không bắt đầu với chúng ngay từ ban đầu.

Tất cả bạn cần là một cách tiếp cận tốt hơn.

Cách họp tập hiệu quả hơn

Sau đây là một số chiến lược giúp bạn tránh đước những cái bẫy liên quan đến việc nhận project từ quá sớm:

  • Bắt đầu từ khái niệm
  • Tập luyện như đời thực

Chiến lược 1: bắt đầu với khái niệm

Thay vì nhảy ngay vào project lớn, hãy thử học tập những mẫu functionality nhỏ trước. Như vậy, bạn sẽ bắt đầu vời một nền tảng kiến thức vững chắc hơn và code dễ hơn về sau

Ví dụ, hiện tex trong một div với innerHTML. Thay đổi màu sắc của text trong một đoạn văn. Cộng hai số với nhau. Viết function đầu tiên của bạn. Làm quen hơn với biến. Lưu trữ một tập chủ thể trong một array hoặc một object. Tạo sự kiện khi nút được nhấn. Biết thêm về logic với ifelse. Thử một số vòng lặp.

Hãy thử nghiệm và thật sự thoải mái với những khái niệm này. Bạn sẽ sớm có thể mình thực hiện rất nhiều thứ. Hơn nữa, những kinh nghiệm mới thu nhặt được sẽ giúp bạn quyết định tìm đến project nào tốt hơn. khi bạn thấy mình thành công nhiều hơn, sự tự tin của bạn sẽ gia tăng, và bạn sẽ có “đà” chạy nhanh hơn nữa, thay vì nhảy vào project lớn và không còn tý đà nào luôn.

Phải công nhận, thách thức rất quan trọng, vì chúng giúp bạn phát triển. Nhích khỏi “vùng thoải mái” của bạn mang lại nhiều lợi ích, nhưng đừng đi quá xa trật khỏi tiến trình của bạn.

Chiến lược 2: luyện tập như đời thực

Khi bạn học tập, hãy đảo bảo dành thời gian ra để tập luyện dưới điều kiện thực. Đồng nghĩa với việc sử dụng text editor và trình duyệt của chính bạn và code mà không dựa vào hướng dẫn.

Càng luyện tập code trong điều kiện thực càng nhiều, bạn càng ít có cảm giác bế tắc khi đến lúc phải thực sự tạo ra thứ gì đó.

Đây là một cách hay để tránh tình trạng dùng hướng dẫn được, nhưng lại chả hướng dẫn được.

Giải quyết mọi vấn đề trong Scalable Social Network – Đăng kí ngay!
Giải quyết mọi vấn đề trong Scalable Social Network – Đăng kí ngay!

Vậy project khi nào sẽ sảy ra?

Khi bạn đã bắt đầu biết được những điểm nền tảng trong JavaScript, bạn sẽ bắt đầu biết được kiểu project nào là khả thi.

Tuy việc thử thách bản thân rất quan trọng, nhưng bạn sẽ không muốn thử xây dựng ứng dụng ngân hàng số end-to-end, trước khi bạn biết cách hiển thị một dòng text lên màn hình đâu.

Khái niệm và một số ví dụ cụ thể bạn có thể học được và các bộ project mini lúc đó bạn có thể thực hiện. Các ví dụ trong bản này được sắp xếp theo hướng mục này làm nền tảng cho mục sau.

Khái niệm mới học được Mini-projects có thể thực hiện
Variables, functions Tạo một function chào mừng lấy tên của bạn từ một biến và hiển thị lời chào trên trang
Xử lý Click, chuyển đổi class Tạo nút “more information” khiến một loạt thông tin xuất hiện hợp biến mất. Hơn nữa, hãy thử tạo hai nút lựa chọn theme. Khi bạn nhấn vào một trong hai nút này, một số thành tố trên trang thay đổi màu và kiểu để phù hợp với theme.
Câu lệnh If, Số ngẫu nhiên Tạo trò chơi có hai cánh cửa và bạn có thể nhấp vào cánh cửa đúng để nhận được phần thưởng.
Thu thập giá trị nhập liệu text,  toán trong JavaScript Tạo máy tính tiền bo tại nhà hàng
Arrays, loops Tạo front end của trang post bài xã hội. Dùng array để giữ một list text posts. Lặp array đó để hiển thị bài posts.

Như vậy ta phải…?

Lần này có vẻ như chúng ta thực hiện các bước theo thứ tự khác đi. Thay vì bắt đầu bằng một dự án và cố gắng chơi chụp bắt với những khái niệm cần có, chúng ta lại bắt đầu với khái niệm và xây dựng dự án dựa trên những khái niệm này.

Hướng đi này sẽ có tác động mạnh mẽ lên cách học của bạn, vì thay vì nhảy quá nhanh về phía trước và cảm thấy tụt lại phía sau, bạn sẽ học được nền tảng giúp bạn tự tin ở mỗi bước đi. Kiến thức bạn học được sẽ hỗ trợ cho nhau, và chẳng sớm cũng muộn, bạn sẽ tìm đến những project lớn hơn bạn tưởng.

Làm cách nào để biết được mình nên dùng khái niệm nào trong một Project

Giả sử bạn đã biết được một số khái niệm, bạn sẽ bắt đầu thử sức với project.

Làm sao bạn biết được mình sẽ dùng và nên tránh khái niệm nào?

Để sử dụng analogy không code: giả sử bạn đang đóng một chiếc ghế và bạn muốn xiết chặt hai thanh gỗ bằng cái đinh vít. Bạn có thể dùng tay cũng được, nhưng bạn sẽ thấy đau tay và tẻ nhạt. Vì bạn đã biết về cái đinh vít rồi, bạn biết dùng đinh vít thì tốt hơn. Còn đinh vít điện thì nhanh khỏi hỏi.

Trong ví dụ này, bạn càng biết nhiều công cụ, bạn càng biết cách phân tích vấn đề và lựa chọn công cụ phù hợp nhất.

Hãy mang ví dụ này trở lại code, mỗi khái niệm là một công cụ. Bạn càng học được nhiều khái niệm, hộp dụng cụ code của bạn sẽ càng nhiều, và bạn sẽ càng biết được mình phải dùng thứ gì.

Như vậy, dưới đây là một số hướng tư duy trong một project:

  • Trước hết, hãy tách project thành nhiều mẩu code nhỏ hơn.
  • Viết ra bạn muốn mỗi mẩu làm gì. Như vậy, bạn có thể suy nghĩ không bị chi tiết code ảnh hưởng.
  • Xây dựng từng phần một trong project, bắt đầu với khái niệm bạn biết. Nếu bạn đã có học qua về khái niệm trước (thay vì nhảy ngay vào project ngay từ ban đầu), bạn nên có trong tay một bộ cộng cụ khá hưu ích vào lúc này.
  • Khi có lỗ hổng trong kiến thức của bạn, hãy tách thành những mảng tính năng nhỏ nhất mà bạn có thể nghĩ đến Tìm kiếm chúng trên mạng.
  • Trình học tập ở đừng quá ám ảnh với sự hoàn hảo. Sự hoàn hảo sẽ ảnh hưởng đến tốc độ.
  • Đừng ngần ngại thử nghiệm với những ý tưởng mới. Những bài hướng dẫn bóng bẩy bạn thấy trên mạng thường đã qua rất nhiều thử nghiệm trước khi được giới thiệu ở bất cứ đâu.
  • Sau khi tự thử sức với một project, hãy tìm những project tương tự để học từ cách tiếp cận của người khác.

Khi bạn thực hiện những bước này với ngày càng nhiều project, bạn sẽ cảm thấy thoải mái hơn khi phải lựa chọn các khái niệm phù hợp cho công việc.

Việc còn lại phải làm là luyện tập nữa thôi.

Giải quyết mọi vấn đề trong Scalable Social Network – Đăng kí ngay!
Giải quyết mọi vấn đề trong Scalable Social Network – Đăng kí ngay!

Bài học quan trọng

Project có thể coi là một trong những cách tốt nhất và… tệ nhất để học JavaScript. Điểm khác biệt nằm ở chỗ lựa chọn thời điểm.

  • Project quá sớm = bẫy.

Một trong những lý do người ta không thể học được JavaScript là do nhảy vào project mà không biết đủ kiến thức cơ bản. lý do này thường dẫn đến chán nản và bỏ ngang.

  • Khái niệm trước, project sau

Để tránh cái bẫy project, hãy thử nghiệm với khái niệm trước, và thực hiện miniproject dựa trên những khái niệm này. Như vậy, bạn sẽ có được nền tàng vững chắc hơn, ghi nhớ tốt hơn, và tiến độ nhanh hơn. Bạn cũng sẽ ít bị choáng ngợp hơn nữa.

  • Tập luyện như đời thực

Càng luyện tập nhiều ở điều kiện đời thực, bạn sẽ giảm thiểu nguy cơ bế tắc khi đến lúc phải tìm đến hướng dẫn.

Đến cùng, có vẻ như mỗi người lại có một cách tiếp thu kiến thức khác nhau. Không có ý nào trong bài viết này được áp đặt là quy luật cứng nhắc, mà là những gợi ý thân thiện mà hy vọng sẽ giúp bạn hoặc bất cứ ai tránh được những cái bẫy mà đã có quá nhiều người sa vào.

Techtalk via Sitepoint