Giải quyết vấn đề với Javascript (câu chuyện của riêng tôi)

Ai ai cũng có những vấn đề của riêng mình, dù to dù nhỏ, cách giải quyết của mỗi người là khác nhau nhưng đích đến là một, vấn đề phải được giải quyết. Điều này vẫn đúng kể cả khi danh từ “người” ở đây được thay thế bằng những đơn vị lớn hơn một chút như “nhóm”, “công ty”, “tập đoàn”. Điều tuyệt vời nhất là công nghệ càng ngày càng phát triển, nó can thiệp vào mọi mặt trong đời sống và khiến cuộc sống của chúng ta trở nên dễ dàng hơn. Những vấn đề, tất nhiên, ít nhiều cũng dần được gỡ bỏ bởi công nghệ nói chung và những ứng dụng tiện ích nói riêng.

Đứa em trai ham nhậu – chuyện ngoài lề

Chuyện là tôi có đứa em trai khá là cao ráo sáng sủa, và khá thích về muộn. Thường thì nó sẽ về trước 12h đêm, hoặc nếu có về muộn hơn cũng sẽ có một tin nhắn hay một cuộc gọi báo cho gia đình. Trong một số ít trường hợp, nó say mèm và tất nhiên không có một cuộc gọi hay tin nhắn nào báo trước cả. Hai, ba giờ sáng vẫn chưa thấy nó về, ấy là lúc tôi cần phải biết nó đang ở đâu. Tôi code vội một ứng dụng Android lấy vị trí của người dùng, tạo một service để nó chạy nền, và tốt nhất là xóa luôn cái icon bên ngoài màn hình home của nó, lén lút cài vào máy nó như một thằng trộm đêm. Kể từ khi ấy, tôi không còn phải nhắn tin gọi điện cho nó hỏi: “Mày đang ở đâu?” làm gì mà cho mệt. Đêm đông lạnh giá biết nó về muộn mà vẫn loanh quanh trong làng thì cũng mặc đấy, mai tính tiếp, hôm nào hứng lên thì đi tìm, vấn đề thế là xong. Một chút về kỹ thuật, tôi viết ứng dụng đó chạy trên nền tảng Android, dựa trên ngôn ngữ Java. Ứng dụng xin quyền internet, location trong manifest và được đóng gói với một file keystore bằng Android Studio.

Vấn đề

Vấn đề to hơn một chút, tôi tham gia một câu lạc bộ tiếng anh của làng, may mắn được làm chủ tịch trong một thời gian khá dài. Để quản lý câu lạc bộ từ các hoạt động thường niên đến những buổi sinh hoạt hàng tuần với những chủ đề nói khác nhau yêu cầu một lượng thời gian kha khá cho việc phân công việc. Một buổi sinh hoạt thường sẽ có 3 phần xoay quanh một chủ đề.

  • Khởi động, làm nóng không khí bằng một trò chơi trong khoảng 15, 20 phút.
  • Thực hành kỹ năng nghe chính tả, sẽ có 1 người dẫn phần này, họ cần phải chuẩn bị một tờ tài liệu in ra nội dung bài nghe với những ô trống cần phải điền vào.
  • Thực hành kỹ năng nói, sẽ có 2 người dẫn dắt phần này, họ cần được báo trước để chuẩn bị chủ đề cũng như sẽ dẫn dắt như thế nào.

Ba phần trên yêu cầu kha khá sức người, sẽ là tốt nhất nếu tự động hóa được phần nào đó công việc chân tay họ phải làm để họ chỉ phải tập trung vào phần chính là luyện tập kỹ năng tiếng anh của mình. Yêu cầu đề ra là: Trong phần khởi động, máy có thể gợi ý cho người dùng những trò chơi nhóm. Trong phần nghe của buổi sinh hoạt, để máy chuẩn bị tài liệu cùng tệp nghe. Trong phần nói, để máy giao việc.

Hướng giải quyết

Về phần khởi động, bên trong ứng dụng cần có sẵn một số trò chơi bao gồm cách chơi, người dùng cũng có thể thêm vào, mỗi khi người dùng chạy phần này, ứng dụng sẽ ngẫu nhiên lấy ra một trò chơi nhóm. Với bài toán này, việc thao tác với cơ sở dữ liệu khá cơ bản chỉ là thêm sửa xóa, tạo một danh sách với đối tượng tùy biến với các trường cần thiết như tên trò chơi, cách chơi, thời gian, số lượng người chơi, … là hoàn thành.
Phần thực hành kỹ năng nghe chính tả, thường sẽ là nghe bài hát, vậy ứng dụng phải có khả năng cung cấp lời bài hát sau khi người dùng nhập tên bài hát cùng tên ca sĩ. Sau đó, tùy theo mức độ người làm phần nghe muốn bài nghe đó dễ hay khó mà lượng từ vựng sẽ thay đổi. Việc tìm kiếm sẽ thông qua một trang web khác để lấy kết quả, (crawl/API). Ở mức độ căn bản nhất, độ khó của một bài nghe sẽ được tính theo số lượng ký tự của một từ, chưa xét về ngữ nghĩa. Bài toán quy về thao tác với chuỗi, sẽ có một số thuật toán con bao gồm bên trong như tìm từ, đếm độ dài từ, … (những hàm đã có sẵn).
Phần thực hành kỹ năng nói, mình cần một tập thành viên, bao gồm các trường như tên, tuổi, cấp độ, … ứng dụng chọn ngẫu nhiên hai thành viên trong câu lạc bộ ở hai cấp độ khác nhau, hoặc chỉ huy có thể chọn lựa, khi chọn xong sẽ có thông báo tới thành viên. Bài toán quy về tác vụ nền, kết hợp với hàm random sau khi đã thỏa mãn các tùy chọn của người dùng.

Javascript – một cái nhìn mới

Bài toán giờ không chỉ dành cho đứa em trai dùng máy Android ham nhậu mà cho một nhóm người với nhiều loại thiết bị khác nhau bao gồm AndroidOS và IOS và Web. Không quá khó để hoàn thiện ứng dụng bên phía Android, nhưng phần còn lại nằm ở IOS, web và trên mây (server side, thao tác với cơ sở dữ liệu trả về front end side thông qua API). Sự thật là ứng dụng trên nền tảng Android không thể chạy trên Iphone và xử lý hộ phía server. Ngắn gọn là, một vấn đề đang có vẻ cần khá nhiều sức lực và công cụ để giải quyết. Tin vui là có lẽ tôi không phải ôm quá nhiều công cụ để giải quyết bài toán này, chỉ javascript là đủ.

Xử lý Server side

Bắt đầu từ phía server side, NodeJS sẽ xử lý thao tác với cơ sở dữ liệu sau đó trả về kết quả thông qua API khi client gọi. Việc chỉ xoay quanh việc đọc ghi thành viên cùng trò chơi nhóm.

Xử lý Client side

Rõ ràng là một ứng dụng web nhỏ như thế này sẽ khá là thừa thãi để dùng PHP cùng với laravel framework hoàn thiện web app, tôi chọn React – con đẻ của Facebook. Bắt đầu với create-react-app, việc quản lý view của app sẽ rất mượt mà khi tận dụng được điểm mạnh của virtual DOM. Như các bạn cũng đã biết, đối với mỗi object đều có virtualDOM của chúng. Giống như một bản sao giản lược của DOM thật, virtualDOM có đủ các thuộc tính cần thiết duy chỉ có khả năng thay đổi DOM thật là không thể. Khi một React object được render, virtualDOM được thay đổi, nhưng thay đổi này không ngay lập tức được thể hiện qua DOM thật mà sẽ có sự so sánh giữa virtualDOM cũ và virtualDOM mới. React biết được chính xác object nào đã được thay đổi sau quá trình “diffing” và cập nhật object đó trên DOM thật.  

Bên cạnh React, React Native sinh ra dành cho di động, dù rằng API của React Native đến native OS (Android / IOS) vẫn còn khá hạn chế nhưng tin vui là mình có thể viết thêm API. Với tính năng nhận thông báo, OneSignal là một lựa chọn không tồi.  Điều tuyệt vời nhất là React Native vẫn dùng ngôn ngữ javascript, vẫn là React và virtualDOM, tôi không phải học thêm bất cứ ngôn ngữ nào khác.

Điều quan trọng nhất

Cùng một vấn đề có thể có nhiều cách giải quyết, tôi chỉ đang chia sẻ cách tôi giải quyết vấn đề cũ theo một cách mới, một cách tối ưu hơn so với cách cũ của tôi. Cũng như tôi luôn tin rằng điều quan trọng nhất vẫn là vấn đề phải được giải quyết sau đó mới tới vấn đề được giải quyết như thế nào, cách giải quyết của bạn chắc chắn sẽ khác cách của tôi nhưng luôn có một điểm chung đó là: chúng ta đều đang nỗ lực hết sức mình để tìm ra hướng giải quyết cho vấn đề mình đang gặp phải và không ngừng cải thiện nó. Không phải là ngôn ngữ, không phải là công cụ, đó mới chính là cách chúng ta trưởng thành. 

Comments

Let’s make a great impact together

Be a part of BraveBits to unlock your full potential and be proud of the impact you make.