React Native Vanilla

build universal cross-platform apps with react native

iOS	tvOS	Android TV	macOS	Windows
Android	Web	Tizen	LG webOS
				...

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

---

• Get Started
  • 1. Prerequisites
  • 2. Installation
• Architecture
• iOS
  • Requirements
  • Project Configuration
  • Run
• Android
  • Requirements
  • Project Configuration
  • Run
• tvOS
  • Requirements
  • Project Configuration
  • Run
• Android TV
  • Requirements
  • Project Configuration
  • Run
• Web
  • Requirements
  • Project Configuration
  • Run
• Tizen
  • Requirements
  • Project Configuration
  • Run
• LG webOS
  • Requirements
  • Project Configuration
  • Run
• macOS
  • Requirements
  • Project Configuration
  • Run
• Windows
  • Requirements
  • Project Configuration
  • Run
  • Distribute
• Contributors
• Discussions
• Community
• LICENSE

---

Features:

Development platform

OS	Support
Mac	YES
Windows	YES
Linux	untested

Requirements

• Node 8.x or newer
• NPM 6.2.0 or newer
• React Native for development

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 8.11.4
nvm alias default node 8.11.4

Tested / Recommended Node configurations:

Node Version	NPM Version
8.11.4	5.6.0

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 platfrom assets
├── docs                     # Documentation files
├── platforms                # Platform specific projects / code
│   ├── android              # Android platform project
│   ├── androidtv            # Android TV convigured 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
├── 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

• CocoaPods 1.5.3 or newer
• Xcode for iOS development

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

• Android Studio for Android development
• Android SDK 23.0.1 or newer for Android development

Project Configuration

Feature	Version
Gradle	4.9-RC1
Android Gradle	3.3.0-ALPHA3
Kotlin	1.2.50
Target SDK	27
JSC	org.webkit:android-jsc:r224109

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

• CocoaPods 1.5.3 or newer
• Xcode for iOS development

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

• Android Studio for Android development
• Android SDK 23.0.1 or newer for Android development

Project Configuration

Feature	Version
Gradle	4.9-RC1
Android Gradle	3.3.0-ALPHA3
Kotlin	1.2.50
Target SDK	27
JSC	org.webkit:android-jsc:r224109

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

• Tizen SDK 4.0

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

• LG Emulator v3.0.0

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

---

Contributors

Pavel Jacko 📖	Daniel Marino Ruiz 📖	Sander Looijenga 📖	David Rielo 📖

---

Discussions

coming soon

---

Community

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

• https://www.npmjs.com/package/react-native
• https://www.npmjs.com/package/react-native-web
• https://www.npmjs.com/package/webpack
• https://www.npmjs.com/package/babel-cli
• https://www.npmjs.com/package/electron

---

LICENSE

MIT