Airbnb sử dụng React như thế nào ?

React được một số công ty nổi tiếng sử dụng trong các ứng dụng lớn phục vụ cho hàng triệu người, và code base được thay đổi liên tục bởi các engineer.

Có rất nhiều bài báo cho ta thấy về làm thế nào để tạo một app đơn giản như ToDo list với React, nhưng không có bài viết nào về React được dùng thế nào trong sản phẩm.

Đây là lý do tôi đã thực hiện một loạt các bài phỏng vấn, hy vọng phần nào có thể làm rõ hơi việc React được sử dụng như thế nào trong các ứng dụng lớn.

Trong bài viết đầu tiên, tôi đã có vinh dự phỏng vấn Leland Richardson, kỹ sư phần mềm tại Airbnb và cũng chính là người đóng góp thư viện kiểm thử React Enzyme. Đọc qua để biết tại sao họ lại chọn React, họ sử dụng nó như thế nào và đã gặp những khó khăn gì trong quá trình sử dụng.

Có bao nhiêu người trong anh làm việc với React ?

“Tôi đoán có khoảng 50-60 kỹ sư tại Airbnb làm việc thường xuyên với React”

Airbnb đào tạo người mới sử dụng React như thế nào ?

“1. Airbnb có 3 tuần “bootcamp” cho lập trình viên mới. Trong khoảng thời gian đó có nhiều công việc khác nhau, nhưng trong đó chủ yếu là các công việc đơn giản thực hiện như đoạn code cơ bản và cuối cùng là các bài thuyết trình về hệ thống Front-end của chúng tôi.

2. Tổ chức thường xuyên các lớp trao đổi nội bộ, nơi người mới và chuyên gia lâu năm cũng nhau thảo luận.

3. Slack được sử dụng như một “stack overflow nội bộ”. Rất nhiều người sẵn sàng trả lời các câu hỏi bạn đưa ra, và lịch sử chat được tạo thành mục và có thể tìm kiếm. Điều này hữu ích một cách đáng ngạc nhiên.

4. Airbnb có một truyền thống rất hay là review code, điều đó giúp mọi người học hỏi được nhiều điều mới và nâng cao khả năng.”

Theo ý kiến của anh, lợi thế lớn nhất của React là gì ?

“Tái sử dụng: Có thể tái sự dụng các thành phần của React.

Khả năng Refactor: React giúp cho code của bạn dễ dàng refactor và iterate.”

Những khó khăn lớn nhất trong sử dụng React là gì ?

Những người mới làm quen với React và “Hệ sinh thái React” cảm thấy khó khăn về một số khái niệm quản lý state trong context của một app React. Tuỳ theo kinh nghiệm của từng người, mà cách suy nghĩa của họ có thể khác nhau và đó là cách tôi nhận ra vấn đề đến từ đâu.”

Anh quản lý state của app bằng gì ? Flux hay Redux ?

“Chúng tôi sử dụng alt, một thư viện được sử dụng nội bộ. Chúng tôi cũng đang nghĩ tới việc sử dụng Redux trong thời gian sắp tới.”

Anh có sử dụng GraphQL, Relay hoặc một cái gì tương tự để lấy dữ liệu từ back-end không ?

“Bây thì chưa có. Tuy nhiên, chúng tôi sẽ lấy một số ý tưởng từ GraphQL/ Relay và áp dụng vào cơ sở hạ tầng API nội bộ.”

Những JS syntax mà anh dùng để sử dụng ? ES6 ?

“Tôi dùng ES6. Toàn bộ code Javascript mới trong nguồn code đều phù hợp với định hướng của chúng tôi.”

Anh test ứng dụng React bằng cách nào ?

“Chúng tôi sử dụng các thư viện sau:

-Mocha: Chạy test

-Chai: Xác định

-Enzyme: Thư viện testing React.”

JS Bundler mà anh sử dụng là gì ?

“Chúng tôi sử dụng một Bundler và Browserify nội bộ.”

Anh có sử dụng tool nào trong khi code mà thú vị không ?

“Chúng tôi sử dụng rất nhiều quy tắc Linting áp dụng cho cơ sở hạ tầng trong nội, để giúp ngăn chặn các sai lầm thông thường. Nó không áp dụng trong cộng đồng, nhưng tôi nghĩ mọi người nên tìm hiểu về các quy tắc Linting. Nó rất là hữu ích.

Chúng tôi cũng có vài tool mà tôi cũng rất muốn open source, nhưng hiện giờ thì tôi chưa nói được.”

Làm thế nào để quản lý Styles ?

“Hiện tại chúng tôi đang sử dụng SCSS để biên dịch CSS, vì vậy mọi thứ trở nên tốt hơn CSS cũ. Chúng tôi đang kiểm tra thử có giải pháp component-based có thể cải thiện tình trạng hiện tại.”

Anh có sử dụng Flow hoặc Typescript ?

“Hiện tại thì không.”

Anh sử dụng thư viện nào cho việc routing ?

“Chúng tôi có rất nhiều ứng dụng nội bộ và các phần trong đó sử dụng react-router. Tuy nhiên, hầu hết các ứng dụng của chúng tôi không sử dụng bất kỳ JavaScript-based router.”

Anh có sử dụng hay có kế hoạch dùng React Native ?

“Chúng tôi hiện đang tìm hiểu cách dùng React Native cho một số tính năng trên app chính của chúng tôi. Chúng tôi có áp dụng nó cho một vài app, tuy nhiên thông báo cho cộng đồng.”

Airbnb là một trong số ít app lớn chỉ sử dụng React. Trong bài viết tiếp theo của seri này, chúng tôi sẽ trò chuyện với nhà phát triển hàng đầu từ một công ty nổi tiếng, người đó sẽ chia sẻ những hiểu biết và kinh nghiệm về React. Hãy dõi thôi tôi nhé !!

Techtalk via Devnacho