Bài 2 – React Native – Giới thiệu và hướng dẫn setup công cụ hỗ trợ lập trình React Native

Ở bài trước, mình đã hướng dẫn các bạn cài đặt môi trường phát triển Android. Vậy giờ dùng Text Editor nào, công cụ nào để lập trình React Native? Trong series này mình xin giới thiệu 2 công cụ: Sublime Text 3Visual Studio Code.

1. Visual Studio Code:

Tải về và cài đặt Visual Studio Code. Visual Studio Code là Text Editor gọn nhẹ, giao diện thân thiện dễ sử dụng. hỗ trợ nhiều Extensions, nhiều ngon ngữ lập trình khác nhau. Hỗ trợ công cụ debug, run terminal trực tiếp trong giao diện sử dụng.

Sau khi cài đặt xong, mở công cụ lên nhấn chọn biểu tượng “Extensions” hoặc nhấn tổ hợp phím Ctrl + Shift + X 

Tiếp theo, Ta cần cài đặt snippet hỗ trợ code nhanh hơn cho các bạn mới học. Hãy tìm kiếm và cài đặt các Extensions sau:

  • React Native Tools
  • React-Native/React/Redux snippets for es6/es7

Sau khi cài xong các Extensions thì bạn hãy bật lên để sử dụng:

2. Sublime Text 3:

Tải về và cài đặt Sublime Text 3. Đây là Text Editor quá quen thuộc rồi, gần như là code cái cũng lôi cái này ra dùng được (cũng tuỳ cái nhé). Nói vậy cho nó ngầu. Mình thường dùng Sublime Text để code web chủ yếu, nay thì dùng nó để code React Native. Đây là Text Editor siêu nhẹ. Đơn giản dễ sử dụng.

Giao diện người dùng của Sublime Text 3:

Sau đây mình xin dẫn cài các gói hỗ trợ code React Native cho Sublime Text. Đầu tiên mở Sublime Text lên và cài đặt Package Control . Xem hướng dẫn cài đặt tại đây https://packagecontrol.io/installation.

Sau khi cài xong thì ta sẽ cài các Package hỗ trợ cho React Native. Từ màn hình giao diện chọn Preferences >> Package Control >> Package Control: Install Package. Tiếp theo các bạn gõ vào thanh tìm kiếm vào chọn cài đặt các package sau:

  • Emmet
  • SublimeLinter
  • Babel

Sau khi cài xong 3 package trên thì khởi động lại Sublime Text (để phòng nó chưa nhận được các package). Vào View >> Syntax >> Bable >> JavaScript để bật snippet hỗ trợ cho code trên React Native.

Mình đã hướng dẫn cho các bạn cách setup 2 Text Editor để lập trình React Native. Lần đầu viết blog lên nếu có điều gì sai sót xin mọi người bỏ qua cho. Cảm ơn đã đọc bài viết. Theo dõi và nhấn vào cái chuông dưới góc trái để nhận được thông báo cho bài tiếp theo. Bài sau mình sẽ đi vào kiến thức đầu tiên của React Native, mong các bạn theo dõi.

Series Navigation<< React Native -Bài 1: Hướng dẫn cài đặt môi trường lập trình Android bằng React NativeReact Native – Bài 3: Sử dụng Nox giả lập để chạy và debug code React Native >>

Để lại bình luận

avatar
  Đăng ký theo dõi  
Thông báo về