Skip to content

πŸš€πŸš€πŸš€The most fundamental cross-platform project template based on react native. Includes latest iOS, tvOS, Android, Android TV, Android Wear, Web, Tizen, LG webOS, macOS/OSX and Windows platforms

License

Notifications You must be signed in to change notification settings

saadqbal/react-native-vanilla

Β 
Β 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

React Native Vanilla

build universal cross-platform apps with react native




iOStvOSAndroid TVmacOSWindows
AndroidWebTizenLG webOSAndroid Wear

npm version npm downloads License MIT All Contributors PRs Welcome

Most fundamental multi-platform project template based on react native. Includes latest iOS, tvOS, Android, Android TV, Web, Tizen, LG webOS, macOS/OSX and Windows platforms

  • Ideal starting point for advanced multi-platform projects.
  • Uses latest vanilla native project templates including Xcode with Swift and Android with Kotlin support
  • Includes bleeding edge dependencies configured to work with each other


Features:

Development platform

OS Support
Mac YES
Windows YES
Linux untested

Requirements

Stack / Libraries

  • React 16.7.0-alpha.2 react library
  • React Native 0.57.7 for building native apps using react
  • Babel 7.x.x for ES6+ support

Get Started

1. Prerequisites

The recommended way to run specific version of Node and NPM is to use NVM:

nvm install node 10.13.0
nvm alias default node 10.13.0

Tested / Recommended Node configurations:

Node Version NPM Version
10.13.0 6.4.1

2. Installation

On the command prompt run the following commands

$ git clone [email protected]:pavjacko/react-native-vanilla.git

$ cd react-native-vanilla

$ npm run setup

Architecture

Folder Structure

.
β”œβ”€β”€ assets                   # Cross platform assets
β”œβ”€β”€ docs                     # Documentation files
β”œβ”€β”€ platforms                # Platform specific projects / code
β”‚   β”œβ”€β”€ android              # Android platform project
β”‚   β”œβ”€β”€ androidtv            # Android TV configured platform project
β”‚   β”œβ”€β”€ androidwear          # Android Wear configured platform project
β”‚   β”œβ”€β”€ ios                  # iOS Xcode platform project
β”‚   β”œβ”€β”€ macos                # macOS Electron platform project
β”‚   β”œβ”€β”€ tizen                # Tizen platform project
β”‚   β”œβ”€β”€ tvos                 # tvOS Xcode platform project
β”‚   β”œβ”€β”€ web                  # Webpack based project
β”‚   β”œβ”€β”€ webos                # Web OS platform project
β”‚   └── windows              # Windows desktop platform project
β”œβ”€β”€ src                      # Source files
β”œβ”€β”€ tests                    # Automated tests
β”œβ”€β”€ utils                    # Tools and utilities
β”œβ”€β”€ LICENSE
└── README.md

iOS

  • Latest swift based Xcode project
  • Cocoapods Workspace ready
  • Swift 4.1 Support

Requirements

Project Configuration

Feature Version
Swift 4.1
Deployment Target 11.4

Run

npm start
npm run ios

Android

  • Latest Android project
  • Kotlin Support
  • Support for Gradle 4.9
  • Support for Android JSC (improved support for JavascriptCore like ES6 syntax)

Requirements

Project Configuration

Feature Version
Gradle 4.10.1
Android Gradle 3.3.1
Kotlin 1.3.20
Target SDK 27
JSC org.webkit:android-jsc:r224109

First time installation

create file named local.properties in <PROJECT_ROOT>/platforms/android

with paths to your Android SDK. Usually:

ndk.dir=/Users/<USER>/Library/Android/sdk/ndk-bundle
sdk.dir=/Users/<USER>/Library/Android/sdk

Run

NOTE: make sure you have 1 android device connected or 1 emulator running

npm start
npm run android

tvOS

  • Latest swift based Xcode project
  • Cocoapods Workspace ready
  • Swift 4.1 Support

Requirements

Project Configuration

Feature Version
Swift 4.1
Deployment Target 11.4

Run

npm start
npm run tvos

Android TV

  • Latest Android project
  • Kotlin Support
  • Support for Gradle 4.9
  • Support for Android JSC (improved support for JavascriptCore like ES6 syntax)

Requirements

Project Configuration

Feature Version
Gradle 4.10.1
Android Gradle 3.3.1
Kotlin 1.3.20
Target SDK 27
JSC org.webkit:android-jsc:r224109

First time installation

create file named local.properties in <PROJECT_ROOT>/platforms/androidtv

with paths to your Android SDK. Usually:

ndk.dir=/Users/<USER>/Library/Android/sdk/ndk-bundle
sdk.dir=/Users/<USER>/Library/Android/sdk

Run

NOTE: make sure you have 1 android device connected or 1 emulator running

npm start
npm run androidtv

Web

  • Supports Chrome, Safari, Firefox, IE10+

Requirements

  • no extra requirements required

Project Configuration

Feature Version
Webpack 3.11.0
react-native-web 0.9.1
Babel Core 7.1.2

Run

npm run web

open browser URL: http://localhost:8080


Tizen

  • Latest Tizen project
  • Support for Tizen 4.0

Requirements

Project Configuration

Feature Version
Tizen Studio 2.5
Tizen SDK 4.0
react-native-web 0.9.1
Babel Core 7.1.2

Make sure you have tizen-cli configured in your env variables:

export PATH="<USER_PATH>/tizen-studio/tools/ide/bin:$PATH"
export PATH="<USER_PATH>/tizen-studio/tools/emulator/bin:$PATH"

Emulator

Make sure you have at least 1 TV VM setup

emulator-manager
em-cli list-vm

em-cli launch --name T-samsung-4.0-x86

Run

npm run tizen

or specific simulator:

npm run tizen T-samsung-4.0-x86

LG webOS

  • Latest LG webOS Project

Requirements

Project Configuration

Feature Version
cli-webos 0.0.2
react-native-web 0.9.1
Babel Core 7.1.2

Make sure you have ares-cli configured in your env variables:

export PATH="<USER_PATH>/Library/webOS_TV_SDK/CLI/bin:$PATH"

Test above path by running

ares -V

Emulator

  • launch webOS emulator usually located in something like:
<USER_PATH>/Library/webOS_TV_SDK/Emulator/v4.0.0/LG_webOS_TV_Emulator_RCU.app

Run

npm run webos

macOS

  • support for OSX/macOS
  • Based on Electron

Requirements

  • n/a

Project Configuration

Feature Version
electron 2.0.0
react-native-web 0.9.1
electron-builder 20.28.2

Run

npm run macos

Windows

  • support for Windows 10+
  • Based on Electron

Requirements

  • Windows dev environment

Project Configuration

Feature Version
electron 2.0.0
react-native-web 0.9.1
electron-builder 20.28.2

Run

npm run windows

Distribute

npm run windows:dist

Android Wear

  • Latest Android project
  • Kotlin Support
  • Support for Gradle 4.9
  • Support for Android JSC (improved support for JavascriptCore like ES6 syntax)

Requirements

Project Configuration

Feature Version
Gradle 4.10.1
Android Gradle 3.3.1
Kotlin 1.3.20
Target SDK 27
JSC org.webkit:android-jsc:r224109

First time installation

create file named local.properties in <PROJECT_ROOT>/platforms/androidwear

with paths to your Android SDK. Usually:

ndk.dir=/Users/<USER>/Library/Android/sdk/ndk-bundle
sdk.dir=/Users/<USER>/Library/Android/sdk

Run

NOTE: make sure you have 1 android wear device connected or 1 wear emulator running

npm run androidwear

Contributors


Pavel Jacko

πŸ“–

Daniel Marino Ruiz

πŸ“–

Sander Looijenga

πŸ“–

David Rielo

πŸ“–

Discussions

coming soon


Community

Special thanks to open-source initiatives this project utilises, notably:


LICENSE

MIT

About

πŸš€πŸš€πŸš€The most fundamental cross-platform project template based on react native. Includes latest iOS, tvOS, Android, Android TV, Android Wear, Web, Tizen, LG webOS, macOS/OSX and Windows platforms

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 45.3%
  • Kotlin 35.0%
  • Ruby 14.0%
  • HTML 2.4%
  • Swift 1.5%
  • Shell 1.3%
  • Other 0.5%