When Github released Codespaces, I honestly didn’t think I would ever drop my editor for a tab running in my browser. Well, I was wrong.
What React Native accomplished amazingly well in the first place was to simplify mobile development. Everything you had learned about web could now also be used for mobile apps.
Although this was a big jump following the Cordova/Ionic era, a major problem remained: native knowledge was still required to get somewhere, whether it was XCode or their gibberish Objective-C.
Fortunately, if you have been using React Native lately, you must have heard of Expo and how it has exponentially improved over the years. Expo managed to simplify all the bits and bobs of React Native that still made it difficult to use, namely native libraries and tools.
Now you might be wondering where I am going with this. Bare with me.
Altogether, we turned two codebases into one for a cross-platform application using React Native. We then went from using many tools and sometimes different native languages to only one with Expo.
Today, we are going from a computer with enough storage and RAM to run an application to literally any browser on any machine — which theoretically includes your phone too.
Let’s dive into React Native with Codespaces.
A toolbox in your browser
In case you missed it: since VS Code runs in an embedded browser, it can also run in a regular browser.
So what’s the craic? In a nutshell, Codespaces are virtual machines running projects hosted on Github, all visually packed in VS Code. This means you can work on any git project you have, from anywhere and on every device.
Since VS Code includes all the plugins you need and has an incredibly powerful Intellisense (especially if you are all into TypeScript), this is everything you need to run an Expo project.
Tell me how
To start using Expo in Codespaces, the way-to-go is to create a project on your machine first. Run the following from any folder:
expo init your-application
Then you will need a Github project to send all your local code over there. Create a repository:
If it all worked out well, you should get quick commands to push your code over to Github:
Once it’s done, you can delete your local repository since we won’t need it again. Now hit refresh, go to Code, Open with Codespaces and New codespace:
And voilà! Your codespace should open with your Expo project in it.
Now, we have a few steps left to get it running inside the Expo Go/client on your phone:
- Open a terminal in Codespaces
- Install Expo CLI with
npm install -g expo-cli(or its yarn equivalent)
- Install your project dependencies with
- Log in with your Expo account with
This is required to get your app showing on your phone automatically.
- Important: run
expo start --tunnelSince your code is running on a virtual machine far, far away from your internet network, the only way to get access is to use a tunnel that will grant you access over a different network using a URL given by Expo.
If you followed the steps till now, you should see your app showing up in your Expo client:
You are not dreaming, this is your application running right from Github Codespaces. You can run this from any other device and all you need is your Github account.
When you think about it, this is amazing. You can develop an entire cross-platform native mobile application from your browser.
6 years ago, I remember one of my friends being so excited over Sublime Text Monokai theme. What this means is that 6 years ago, both VS Code and React Native were still not out there and all we could be excited about were the premises of modern technologies.
At first, we have seen concerns over yet another Electron-based editor and a merely-good cross-platform alternative. Today, they both turned into the simplest way of creating a mobile application, all even from a browser.
I cannot express how much I feel excited about all the progress that has been made in such a short time. I even myself wouldn’t have ever thought of coding in a browser…I mean really, a browser mate?
Looking at how fast Expo and Github are growing makes me extremely hopeful about what is lying ahead. This was the first time I coded an entire app from a browser, and I am all in now.
Note: this new application I mentioned above helps you achieve more of your daily tasks. It is simple and well-designed, you should give it a shot.