So sánh react native và reactjs năm 2024

Hiện nay có nhiều bạn mới bắt đầu học về React Native và đều có những băn khoăn về hai khái niệm: ReactJs và React Native. Hai thằng này có tên gần giống nhau, liệu có phải là cùng một lò sinh ra không? Các viết code và cơ chế hoạt động có giống nhau không?..v.v

Show

    So sánh react native và reactjs năm 2024

    Hôm nay, mình sẽ cùng nhau khám phá ReactJs và React Native giống và khác nhau chỗ nào nhé!

    Nội dung chính của bài viết

    1. Xứ mệnh của hai thư viện ReactJs và React Native

    ReactJS là một thư viện Javascript được tạo bởi Facebook nhằm giải quyết các vấn đề performance và khả năng tương thích cho các ứng dụng web. Tức là ReactJs là một thư viện front-end dành cho các ứng dụng web. ReactJS ra đời vào năm 2011, nó đã mang đến một triển vọng mới về rendering pages điều sẽ tạo ra sự linh động và trải nghiệm responsive.

    Còn React Native thì sao?

    React Native là một framework dùng để phát triển các ứng dụng cho mobile(Cụ thể là Android và IOS). được phát hành sau ReactJS 4 năm, sau khi ReactJS đã tràn ngập khắp giới lập trình web.

    ReactJS và React Native chỉ có một điểm tương đồng, còn lại là khác nhau hoàn toàn.

    Đó chính là Javascript!

    Để trở thành React Native developer có trình độ, bạn phải có một số lượng kiến thức chuyên sâu về JavaScript ES6. Bởi vì ReactJS là cốt lõi của React Native, hiểu biết về cái cũ là chìa khóa cho cái mới.

    \>>> Đọc ngay: React Native là gì?

    2. Khi bắt đầu một dự án mới

    Với ReactJS, developer cần phải lựa chọn các module tốt nhất và cần thiết nhất trước khi bắt đầu một dự án.

    Trong khi React Native cung cấp mọi thứ cần thiết. Bạn có thể viết ngay một ứng dụng bằng React Native chỉ với một dòng command. Điều này làm cho người mới chuyển sang học React Native đỡ khó khăn rất nhiều.

    • Đừng bỏ lỡ: React Native – Hướng dẫn chi tiết cài đặt môi trường

    3. HTML – điểm khác biệt lớn

    React Native không sử dụng HTML để hiển thị giao diện ứng dụng(lý do đơn giản là nếu sử dụng HTML thì React Native có khác gì tạo web app rồi nhúng vào webview không? tốc độ sẽ lại chậm như rùa _)

    Thay vào đó, React Native cung cấp các component hoạt động cũng tương tự, và hầu hết chúng có thể được biến đổi thành các phần tử tương đương trong HTML

    Ví dụ:

     tương đương với

    biến thành

    .

    Do đó, các thư viện được sử dụng với ReactJS không thể sử dụng trong React Native. React Native không sử dụng thẻ CSS hoặc sử dụng chúng theo cách khác, tương tự như Flexbox.

    4. Gestures và animations

    React Native cung cấp một thư viện tương tự như Velocity.js có tên là Animated. Nó còn cung cấp LayoutAnimation, nhưng chỉ có iOS mới hỗ trợ tốt.

    Để tương tác với cử chỉ của người dùng, React Native đã cung cấp PanResponder. Khi áp dụng nó vào một View, bạn có thể kích hoạt xử lý các sự kiện touch của người dùng

    5. Những điểm khác biệt còn lại

    Giữa ReactJS và React Native có nhiều điểm khác biệt hơn là điểm tương đồng. Tuy nhiên, vẫn còn đó một số đặc điểm có liên quan đến cả hai.

    Mọi người thường nói đùa rằng sự tương đồng lớn nhất đó là cả hai đều thiếu tài liệu. Nhưng điểm yếu này đang dần được khắc phục bởi nhà phát hành.

    React-Native sử dụng ReactJS làm thư viện JavaScript chính. Vì vậy để xây dựng một ứng dụng đa nền tảng, bạn cần thông thạo JavaScript và kiến thức về cú pháp của React.

    Ngoài ra, bạn có thể sử dụng hầu hết các công cụ dành cho ReactJS trong khuôn khổ React Native. Ví dụ: Công cụ Chrome Dev để hiển thị console logs hay inspecting để kiểm tra các yêu cầu mạng hoặc Redux DevTools để kiểm tra trạng thái của Redux store.

    Hiện tại, trên VNTALKING có rất nhiều bài viết hướng dẫn lập trình React Native dành cho người chưa có kinh nghiệm:

    • Series học React native cơ bản
    • Lập trình React Native hay Ionic: Đâu là lựa chọn tốt nhất để startup?

    Tóm lại

    Cả ReactJS và React Native đều là những công cụ tuyệt vời để xây dựng và chuyển đổi nhanh UI phức tạp từ phiên bản cũ sang phiên bản mới. Điều này không khó cho những ai thích JavaScript. Tuy nhiên bạn cần nhớ là:

    • React Native là một framework trong khi ReactJS là một thư viện JavaScript
    • React Native không sử dụng HTML
    • ReactJS và React Native đều dựa trên component-based
    • Bạn có thể viết các native mobile components trong React Native để tạo cảm giác là ứng dụng này thực sự dành cho thiết bị di động.

    Bạn đã phân biệt được ReactJS và React Native chưa? Hãy cho mình biết ý kiến của bạn về hai “anh em cùng cha này ” nhé? Bài viết sau mình sẽ giới thiệu với các bạn cách thiết kế ứng dụng tương thích với Iphone X, tất nhiên là bằng React Native rồi. Các bạn đón đọc nhé!