Last week, I first heared about React Native Ubuntu. I thought: That’s awesome - Now I can develop desktop applications for all major operating systems (since there is also a React Native Windows and React Native MacOS). So I had to give it a try.
The only problem: My main laptop is running Fedora, and I do not want to switch to Ubuntu just for toying with a new technology. Well, I tried anyway, and I was pleasantly surprised that it was not very hard to set up. (Wouldn’t it be really cool if Canonical and RedHat would work together on react native and renamed it to “React Native Linux”? Tell them!).
So, here’s what I did to install and run the react native starter app on my Fedora system:
Clone the GitHub Repo
I will clone the react-native-ubuntu repository to a directory where I have my development libraries (“devel-libs” in this case):
[devel-libs]$ git clone https://github.com/CanonicalLtd/react-native -b ubuntu
And then you need to install sinopia (a local npm registry), uninstall the react-native command line interface, reinstall it from the ubuntu branch, change the registry for the globally installed npm to sinopia, …
Wait, what?
Installing Stuff Globally?
So, the developers really want me to modify the global environment on my laptop? I won’t do that. Especially not for playing around with a technology that I might not even need.
The thing is: If your library requires me to install anything globally on my development machine, you have a coupling problem. Which is an architectural problem. Go, fix it.
But: I wanted to try react-native-ubuntu anyway. I thought about using a Vagrant VM, but I first wanted to try to install everything locally - within my example project. And it worked! So throw away the react-native-cli/README.md and bear with me…
Install Qt Dependencies
I actually did install some dependencies globally - The Qt 5 libraries that are needed to compile and run the react-native app:
$ sudo dnf install Qt5Core $ sudo dnf install qt5-default $ sudo dnf install qt5-qtbase-devel
I think those were all. You might need different libraries, depending on your system setup…
Local Installation
Well, let’s just try to install react-native locally, in a directory where I want to create my example application (“example”). “path/to/react-native” is the directory where I’ve checked out the ubuntu branch of react-native before.
[example]$ npm install ~/path/to/react-native [example]$ npm install ~/path/to/react-native/react-native-cli/
Now I can run the react-native-cli from the local installation in “node_modules”:
[example]$ node node_modules/react-native-cli/index.js init TestApp Looks like React Native project already exists in the current folder. Run this command from a different folder or remove node_modules/react-native
OK, react-native-cli wants to download react-native. That’s why the official guide wants me to install sinopia (which I still want to avoid). Maybe there’s a workaround? Let’s delete the react-native module, let the cli do whatever it wants to do, and then install react-native from the ubuntu branch again…
[example]$ rm -rf node_modules/react-native [example]$ node node_modules/react-native-cli/index.js init TestApp [example]$ cd TestApp/ [TestApp]$ rm -rf node_modules/react-native/ [TestApp]$ npm install ~/Documents/Development/react-native [TestApp]$ node ../node_modules/react-native-cli/index.js run-ubuntu
And now our react-native app is running! Isn’t it awesome?
Now I can start playing with developing desktop apps using react-native. Maybe I’ll try react-native-windows next…
