Sebagai pembangun React / JS, anda mungkin pernah terfikir "Adakah saya perlu belajar React Native?" Soalan yang adil dan saya tanya diri saya beberapa tahun lalu . Ternyata, mempelajari React Native pastinya merupakan keputusan yang tepat. Itulah yang menjadikan saya peranan sebagai Sr. Developer Advocate @ Amazon, di mana saya kini menggunakan React Native untuk membina apl merentas peranti Android, Fire TV dan Tablet.
Jika anda sedang berbahas sama ada ingin melangkaui apl web, berikut ialah beberapa pendapat tentang sebab ia patut dipertimbangkan:
Falsafah "belajar sekali, tulis di mana-mana" melangkaui iOS dan Android sahaja – ia kini termasuk platform seperti tvOS, VisionOS dan juga persekitaran desktop seperti react-native-macos
Perkaitan industri: Syarikat utama seperti Amazon, Meta dan Microsoft semuanya menggunakan React Native. Kenapa? Kebolehgunaan semula kod, kos efektif dan ia membolehkan anda membina platform silang.
Sokongan komuniti yang kukuh: React Native mempunyai lebih 100k bintang dan 24k fork di GitHub, dengan kemas kini tetap dan pembangunan aktif.
Kepuasan pembangun yang tinggi: Menurut State of React Native Survey, 90% daripada pembangun akan menggunakan React Native sekali lagi!
Ekosistem bersatu: Komuniti React Native berkumpul di sekitar Expo, yang membawa kepada peningkatan yang lebih pantas, perpustakaan pihak ketiga yang bersepadu dengan baik dan sumber perkongsian yang banyak.
Kedua-duanya menggunakan proses penyelarasan yang sering dirujuk sebagai "DOM maya." Proses ini membezakan satu pokok dengan yang lain untuk menentukan bahagian UI yang perlu dikemas kini. Disebabkan ini, kedua-duanya menyokong muat semula pantas, membolehkan anda melihat perubahan UI dalam masa nyata.
React menyusun untuk dipaparkan dalam penyemak imbas web, memanfaatkan DOM dan API web. Walaupun apabila diakses melalui penyemak imbas mudah alih, ia masih dikekang oleh keupayaan penyemak imbas dan akses terhad kepada ciri peranti asli.
React Native, sebaliknya menyusun kepada kod asli, membenarkan akses terus kepada API dan ciri khusus platform. Ini bermakna apl React Native boleh menggunakan keupayaan peranti seperti akses kamera, pemberitahuan tolak, memberikan pengalaman pengguna asli. Disebabkan ini, ia mengambil pendekatan yang berbeza untuk seni binanya, dengan apa yang dipanggil seni bina "tanpa jambatan", dan bukannya DOM ia mempunyai komponen asli. Ia menggunakan Turbo Native Module dan memanfaatkan Antara Muka JavaScript (JSI) yang membolehkan komunikasi terus antara JavaScript dan kod asli. Seni bina ini baru dan anda mungkin mendengar istilah 'seni bina baharu' dilontarkan. Jika anda berminat untuk mengetahui lebih lanjut, saya telah membincangkan perkara ini dalam artikel sebelumnya.
Kedua-duanya menggunakan JSX untuk menerangkan UI dan menyokong cangkuk React (useState, useEffect, dll.). Ini membolehkan anda mengekalkan gaya pengekodan yang konsisten dan pendekatan pengurusan keadaan merentas kedua-dua perpustakaan.
Kedua-dua React dan React Native mengikut seni bina berasaskan komponen dan komponen mengikut kaedah kitaran hayat yang sama di bawah hud.
Both React and React Native offer flexible approaches to styling components. They both support inline styling, allowing you to apply styles directly to components. Additionally, both enable the creation of reusable style objects.
React and React Native share many core libraries. You can use the same state management libraries like Redux, MobX, and data fetching libraries like Axios or the Fetch API.
Navigation: While in React you might typically using React Router for web navigation, React Native has its own React Navigation library. This is because React (Web) typically uses URL-based navigation, where different components are rendered based on the current URL path. Whereas React Native uses stack-based navigation, mimicking the native mobile app experience. Screens are ‘stacked’ on top of each other, with transitions pushing new screens onto the stack or ‘popping’ them off.
? Note: Remember to name your folder ‘Screens’ instead of ‘Pages’ when structuring your app.
Testing: concepts remain similar across both libraries, focusing on component rendering and event simulation, but the specific testing libraries differ. React uses the React Testing Library, while React Native you would use React Native Testing Library (RNTL), but don’t be put off as RNTL just provides light utility functions on top of React Test Renderer.
? Some React libraries may not be compatible with all React Native platforms due to DOM dependencies, however you can check the platform compatibility of all the libraries at: (https://reactnative.directory)
If you're still on the fence, the rise of Universal React Apps is a really exciting space that is further closing the gap between React and React Native. Universal React libraries and tooling, usually powered by react-native-web enable you to create cross-platform applications that run on iOS, Android, and the Web all from a shared React Native codebase. This lets you share navigation, styling, state management, and business logic saving you time and effort while respecting the unique conventions of each device type.
So as the lines between DOM and Device continue to blur, embracing React Native opens doors to the exciting world of multi-platform app development!
If you are ready to get started check the comments for my favourite resources or comment with yours below ⬇️
The above is the detailed content of Journeying from React to React Native. For more information, please follow other related articles on the PHP Chinese website!