CAUTION: This is an experimental code. Now it isn't stable, isn't production ready and sometimes is ugly
- Render on platforms
- WEB (React)
- Mobile: OS, Android (React Native)
- Desktop: Windows, MacOS, Linux (React + Electron)
- UI
- common Universal components
- and platform-specific where you want
- navigation: drawer, tabs
- UI: buttons, tabs, switches ...
- adaptive for devices: phones | tablets | desktop
- adaptive for width and rotation changes
- platform-spicific navigation
- WEB - react-router
- Mobile - react-navigation
- WEB
- Server side rendering support
- Tools
- IntelliSense due to TypeScript typings
- Hot reloading
Live demo https://react-cross-platform.github.io/
Smells like future front-end!
- TypeScript
- ReactXP for reusable UI
- Navigation
- WEB - React Router
- Mobile - React Navigation
- Redux to manage app's state
- Apollo Client to manage data from GraphQL API
- GraphQL server using Python Graphene (Live demo)
The commands in the instructions below assume you are in the root of this repo.
- run
yarn
. This fetches the dependencies
- run
yarn run web-watch
. This compiles the TypeScript code and recompiles it whenever any files are changed - open
index.html
in your browser to view the result
- if you work with React Native for first time - try "Building Projects with Native Code" from Rect Native Getting Started docs to configure iOS / Android enviroments
- run
yarn run rn-watch
. This compiles the TypeScript code and recompiles it whenever any files are changed. - in another command prompt run
yarn start
. This starts the React Native Packager - build and run project
- for iOS run
react-native run-ios
- for Android run
react-native run-android
- for iOS run
Help wanted! https://github.com/react-cross-platform/reactxp-shop/issues