Câu chuyện

Câu chuyện là cuối tuần vừa rồi trong lúc đang rảnh rảnh ngồi suy nghĩ, mình thấy là một lập trình viên thì không nên ngừng trau dồi kiến thức và làm mới bản thân bằng cách Hack một cái gì đó. Và rồi mình tự đặt ra cho bản thân 1 khoảng thời gian vào cuối tuần, gọi là Hack Time.

Hack time

Mình đã tự đặt ra định nghĩa và nguyên tắc cho Hack time như sau:

  • Là khoảng thời gian để tạo ra 1 sản phẩm mới hoàn chỉnh và có thể chạy được ở môi trường production
  • Thời gian hoàn thành sản phẩm phải ngắn, tối đa là 48 tiếng, tối thiểu là 2 tiếng
  • Bế quan tỏa cảng trong thời gian này, tập trung hết khả năng của bản thân
  • Sản phẩm làm ra nên có tính thực tiễn cao, không giúp ích được cho người khác thì ít nhất cũng phải giúp ích cho bản thân
  • Khuyến khích học một ngôn ngữ/quy trình gì mới.

Nghĩ ý tưởng

Thế giờ đến ý tưởng thì sao? Dạo gần đây mình canh cách cái gì? Hay là mình có thể làm gì để nâng cao hiệu suất làm việc?

A đúng rồi, dạo gần đây trên lớp học, các thầy cô giáo suốt ngày post tài liệu vào group lớp làm mình phải lên Facebook để kiểm tra bài tập, deadline... Và kết quả cứ sau mỗi lần vào thì chưa kịp gõ tên Group lên thanh search thì đã gặp phải mấy cái hình, với clip hấp dẫn ở News Feed Facebook, vậy xong...thế là lại scroll vô hạn :)))

Ok vậy là viết 1 cái gì đó để chặn cái news feed này lại. Chỉ cần nó ko cho mình nhìn thấy thôi thì mình sẽ nhớ ra mình phải làm gì, và tất nhiên nó vẫn phải cho mình xem lúc mình muốn :D

Và cuối cùng mình đã quyết định chọn viết thử 1 cái extension cho Chrome để làm điều này, đơn giản vì mình nghĩ nó sẽ là dễ làm nhất vì toàn là xử lý javascript trên DOM, hơn nữa Chrome Extension mình lại chưa làm bao giờ. Vậy thì thử thôi.

Stop Scrolling Facebook

Mô tả

Là một extension cho chrome có tác dụng:

  • Chặn News Feed để người dùng khỏi bị phân tâm khi vào Facebook (đặc biệt với những người hay vào Facebook chỉ để làm việc như mình)
  • Người dùng được phép xin thêm 1 khoảng thoài gian để xem News Feed (15s, 1 phút, 5 phút)

Sản phẩm

  • Các bạn có thể cài vào Chrome TẠI ĐÂY
  • Hình ảnh DEMO
    Stop Scrolling Facebook screenshot

Source code

Các bạn có thể tham khảo toàn bộ source code tại đây
https://github.com/tobernguyen/stop-scrolling-facebook

Quá trình làm

Ok vậy là Stop Scrolling Facebook ra đời. Mình mất khoảng tổng cộng 6 tiếng để thực hiện và đưa lên Chrome Web Store:

  • Học cách viết 1 extension cho Chrome (~30 phút)
  • Thiết lập môi trường (~30 phút)
  • Tất nhiên là code code code (~ 3 giờ)
  • Nghiên cứu cách publish lên Chrome Web Store (~5 phút)
  • Làm các ấn phẩm cho sản phẩm (icon, screenshots, promotional title image, description) (mất hơn 1 giờ)

Các thứ thu được

Mình học được kiến thức mới cũng nhiều mà quan trọng là cũng vững tay nghề về Javascript hơn, trước đây mới chỉ amatour nhưng sau khi làm extension này thì cũng đã cứng lên chút ít vì vừa làm phải vừa search và đọc khá nhiều.

  • ES6 Javascript
  • Setup môi trường dev + production với npmwebpack
  • Một chút về Photoshop để làm icon và screenshot cho app
  • Vui, mình dùng được mà bạn bè mình cũng dùng được ;)
  • Là tiền đề để tiếp tục Hack time vào các tuần tới.

Các bạn nếu tải về dùng thử mà thấy có ích thì Review cho mình 5 sao nhé, còn nếu có gì chưa hay thì hãy comment và góp ý nha :D