React NativeScript is A React renderer for NativeScript, allowing you to write a NativeScript app using the familiar React style. Very under construction; expect swathing refactors!
I'm always hanging out in the #react chat of the NativeScript Slack if you'd like to talk about this project.
# Make sure that you have `tns` (the NativeScript CLI) installed:
# https://docs.nativescript.org/start/quick-setup
tns create myApp --template tns-template-blank-react
cd myApp
tns previewUnder construction – please be patient! For now, please refer to the examples mentioned below and use the NativeScript Core docs as your guide.
I've ported Shiva Prasad's TypeScript NativeScript Core port of Alex Ziskind's issue-tracking app to React NativeScript. It's called rpstrackerrns and you can find it here.
The app is based on React NativeScript v0.11.0, so may have some minor differences to the latest version, but the general patterns should be the same.
The repo also includes some example UI plugins – I'll likely be changing the APIs for making those, however, so don't assume that approach to remain supported.
There are many complex components to test (or refer to) in sample/app/testComponents/testComponents.ts. GameLoop has some potential ;)
React NativeScript shares most of the good parts of React Native, but above all gives a first-class development experience for interacting with native code. Never write another native module again – you can write your native code inline using JavaScript!
| UI renderer |
React |
|
| Programming language |
JavaScript (with TypeScript typings available) |
|
| Platforms |
iOS + Android + many more |
iOS + Android |
| Bundler |
Metro |
Webpack |
| Codebase |
Absolutely unfathomable |
Very approachable to new contributors |
| Javascript VM threading |
Separate 'JS' thread |
Main (UI) thread |
| Native API access |
"The Bridge"
|
"The platform runtime"
|
How far along is it?
It's feature-equivalent with NativeScript Core! It's just missing documentation to explain how to use it.
Is it production-ready?
Maybe. I don't know what I don't know. Try it out, see if you have any issues, and this will become clearer.
What about plugins?
Very few UI plugins have been adapted for use with React NativeScript so far, and I'm still altering the API for making UI plugins, so expect there to be relatively few UI plugins for a while. But any non-UI plugins will work just fine!
Can this consume React Native projects?
No, but it could with a lot of hard work. Allowing React NativeScript to run projects that were written for React Native is a huge project, but it's theoretically very possible – it would be a project on exactly the same scale as React Native Web. See react-nativescript-compat-react-native for work towards this, where I've ported part of RNTester as a proof-of-concept... 👩🔬👨🔬
Can this consume React Native native modules?
Certainly not UI-based native modules. But all flavours of NativeScript can consume native code, so it can probably consume React Native native modules, though may take a small bit of refactoring 🤔
Stanisław Chmiela (@sjchmiela) produced a proof-of-concept for importing Expo Unimodules into NativeScript that could be used as a basis for this effort. Original discussion here.
A quick list of my own plans (not necessarily in execution order):
- Documentation website
- Document workflow for React Dev Tools integration
- Conference talk 🤞
Wishes:
- Demo apps
- Translated docs
- Starter template in NativeScript Playground
- Lots and lots of plugins
- API compatibility with React Native (very long-term goal)
- Compatibility with major React packages like React Navigation (may depend upon above)
Ideally get in contact via the Slack channel before starting any PRs!