Space Viewer - Rocket Infos
Space Viewer is an iOS and Android app, built with React Native. You can view information about upcoming and previous rocket launches worldwide, thanks to launchlibrary.net.
The app has several lists, that lead the user to a screen, where they can see more detailed information about the rocket launch. These could be:
- Location (where it launches)
- Date (when it launches)
- Details about the mission
- Links to the video stream, to watch the launch live
The technology stack has changed since I initially developed the app. When I initially started buiding it in 2018, Redux/Saga, React Navigation and React component classes were used.
After some months of the initial release, I've added End-to-End (E2E) tests, based on Detox and Appium. The reason I did both is because I wanted to compare both. I've documented my experience here.
Continuous Integration and Delivery
The next iteration of the project was the addition of a test and build automation, or CI/CD. I've configured Github Actions, Fastlane and Detox to run E2E test after each commit and before each automatic release to the app stores. This dramatically simplified the release process, once configured correctly.
Next, I've enabled the app to be used for React Native Web.
React Native Web
React Native Web is a tool (library) to reuse your React Native components for the Web. This means, writing code once and using it across Android, iOS and Web. The idea behind it is not (in my opinion), to write your whole code to be used on the web. Rather, you could share critically, complicated or just same looking components across these platforms.
A common way to solve this problem is by having a monorepo. This is basically a collection of multiple repositories to be used as a single one. This can improve code browsing, code reusing and version management (invidual versions for sub-packages for example).
Below you may see a "lite" version rendered of the app to web using React Native Web. Please note that this rather a beta-version and should show the practibility of React Native Web: