Bạn có chắc chắn muốn xóa bài viết này không ?
Bạn có chắc chắn muốn xóa bình luận này không ?
Tôi đã clone diễn đàn Voz như thế nào.
Ý tưởng
Diễn đàn voz không còn qúa xa lạ với nhiều dev. Giao diện cổ của nó khi dùng mobile thì ức chế lòi dom. Đợt làm lại next voz tưởng ngon hơn, ai ngờ vứt cái phân trang đi, nhiều hôm vào đọc topic đang theo dõi mà kéo mỏi cả tay.
Cộng với thói quen đọc tít để hiểu vấn đề của các vozer thông minh :)), lại muốn sắp xếp lại đống dữ liệu cho nó dễ nhìn hơn. Nhìn phát là biết hôm nay có gì hot.
Chung quy lại thì chỉ là phục vụ cá nhân mình : dễ dùng, thận thiện với mobile, thu lượm thông tin trong một cái vuốt.
Giải quyết
Công nghệ
Vì chỉ là cái trang dành cho mình, không cần tiền để duy trì hosting. Cũng chả có nhu cần đặt quảng cáo mà cướp mất vị trí của trang chính trên Google.
Do đó mình chọn now.sh để tầm gửi, không sử dụng nuxtJS (framework hỗ trợ SEO), mà chỉ dùng VueJS và nền tảng backend của Now.sh làm server side.
Chọn một project mặc định mà now.sh gợi ý (https://zeit.co/import/templates)
Thêm mắm muối cho cháu nó sinh động hơn.
BackEnd
Ở đây sẽ là forder [api]
, mình sẽ sử dụng axios để get dữ liệu, sau đó dùng cheerio để bóc tách dữ liệu trong đó.
Để tối giản việc viết code, mình đưa các config selector cho cheerio bóc tách vào selector.js
như sau:
Config các thẻ selector (cái này có thể đẩy lên database)
Load các thẻ selector lên và bóc tác trong source.
Do admin voz config server của họ, cứ quá nhiều request trên 1 ip đến server voz. Nó sẽ response chậm lại. Gây nên tình trạng load dữ liệu trên các trang siêu nhậm, hoặc là đứng yên khi nhiều người cùng truy cập. Mình đã tiến hành sử dụng app script của google để transfer thêm dữ liệu của họ về bóc tách.
@DangXuanThanh : đoạn này chắc mình sẽ edit lại.
Hiện tại mình đang chỉ dùng 1 ip của now.sh cung cấp cho đọc source voz.vn. Sẽ bị block request khi đông người truy cập vào trang của mình. Nên mình sẽ dùng bot của Google thông qua Google App script (URLFetchAPI) cào dữ liệu. Gia tặng dải IP request lên voz.vn, tránh bị block.
https://developers.google.com/apps-script/guides/web
FrontEnd
Vì mình đoán mọi người chỉ quan tâm nhiều đên việc BE cào dữ liệu ra sao. Nên mình không nói về code phần này nữa.
Kết
Bài viết trên chỉ nói sơ qua về bài toán giải quyết nhu cầu cá nhân, có lẽ sẽ chả áp dụng được trong công việc có nhu cầu thực tế cao hơn. Mong các anh chị em đi qua dúi cho cái phê bình để mình tiến bộ.




