All Projects → lucianomlima → react-native-template-basic

lucianomlima / react-native-template-basic

Licence: MIT license
A simple React Native template with ESlint, Enzyme, Flow, Prettier and custom scripts

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to react-native-template-basic

React Ssr Starter
All have been introduced React environment
Stars: ✭ 20 (+42.86%)
Mutual labels:  eslint, enzyme, prettier
nest-boilerplate
Nest.js boilerplate with CircleCI, Commitizen, Commitlint, Docker-Compose, ESLint, GitHub Actions, Husky, Lint-staged, OpenAPI, Prettier, PostGreSQL, Travis CI, TypeORM
Stars: ✭ 16 (+14.29%)
Mutual labels:  eslint, prettier, lint-staged
Reeakt
A modern React boilerplate to awesome web applications
Stars: ✭ 116 (+728.57%)
Mutual labels:  eslint, enzyme, prettier
Webpack React Boilerplate
Minimal React 16 and Webpack 4 boilerplate with babel 7, using the new webpack-dev-server, react-hot-loader, CSS-Modules
Stars: ✭ 358 (+2457.14%)
Mutual labels:  eslint, enzyme, prettier
zero
📦 A zero config scripts library
Stars: ✭ 17 (+21.43%)
Mutual labels:  eslint, prettier, lint-staged
Typescript Express Starter
🚀 TypeScript Express Starter
Stars: ✭ 238 (+1600%)
Mutual labels:  eslint, prettier
TypeScript-in-Nodejs-Starter
A starter kit for Node.js project written with TypeScript.
Stars: ✭ 39 (+178.57%)
Mutual labels:  prettier, lint-staged
uno-game
🎴 An UNO Game made in Javascript
Stars: ✭ 93 (+564.29%)
Mutual labels:  eslint, lint-staged
figma-plugin-typescript-boilerplate
Figma plugin TypeScript boilerplate to start developing right away
Stars: ✭ 43 (+207.14%)
Mutual labels:  eslint, prettier
React Redux Universal Boilerplate
An Universal ReactJS/Redux Boilerplate
Stars: ✭ 165 (+1078.57%)
Mutual labels:  eslint, enzyme
coderplex
(Old) Frontend for coderplex.org
Stars: ✭ 40 (+185.71%)
Mutual labels:  enzyme, prettier
bradgarropy.com
🏠 my home on the web
Stars: ✭ 58 (+314.29%)
Mutual labels:  eslint, prettier
React-Redux-Enterprise
A React-Redux boilerplate for enterprise/large scaled web applications
Stars: ✭ 77 (+450%)
Mutual labels:  eslint, enzyme
React Starter Kit
React, Redux, Webpack, Material UI, Boostrap 4, Code Splitting, HMR
Stars: ✭ 229 (+1535.71%)
Mutual labels:  eslint, prettier
react-app-boilerplate-2018
Bootstrap for a React App with Redux, React Router, Styled Components, Jest and Hot Reloading,
Stars: ✭ 20 (+42.86%)
Mutual labels:  enzyme, prettier
Eslint Config Wesbos
No-Sweat™ Eslint and Prettier Setup - with or without VS Code
Stars: ✭ 2,293 (+16278.57%)
Mutual labels:  eslint, prettier
vue-antdesign-admin-template
Ant Design Pro Vue Template
Stars: ✭ 127 (+807.14%)
Mutual labels:  eslint, prettier
web-build-tool-demo
比较全面的前端构建工具demo,拿来即练,不定时更新,包含git npm gulp webpack babel typescript husky eslint tslint lint-stage prettier等
Stars: ✭ 42 (+200%)
Mutual labels:  eslint, prettier
generator-bunny
🐰 Jumpstart node module, like a bunny!
Stars: ✭ 13 (-7.14%)
Mutual labels:  eslint, prettier
website
Personal website and blog built with Next.js, Preact, MDX, Tailwind CSS and hosted on Vercel.
Stars: ✭ 17 (+21.43%)
Mutual labels:  eslint, prettier

React Native Basic App Template

A simple basic template to start a new React Native app with ESLint and custom scripts.

Requirements

  • node
  • react-native-cli
  • yarn

Usage

Create a new project passing a template:

react-native init [ProjectName] --template basic-app

Wait for download dependencies.

Install Husky git hooks

Git hooks is not installed by default, because when start a new React Native app, you don't have a git repository started. To fix this, first init git repo with git init . inside you [ProjectName] dir and after this run on terminal:

node node_modules/husky/lib/installer/bin install

Finish installation

Run node setup.js to inject custom scripts and remove unnecessary files.

For VSCode users

If you use Path Intellisense extension add the following to settings.json:

  "path-intellisense.mappings": {
    "~": "${workspaceRoot}/src"
  }

Flow configuration

Open .flowconfig file. Go to the [options] section and find the line where is module.name_mapper. Add this to the next line:

module.name_mapper='^~\/\(.*\)$' -> '<PROJECT_ROOT>/src/\1'

It should look like the following:

module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub'
module.name_mapper='^~\/\(.*\)$' -> '<PROJECT_ROOT>/src/\1'

Includes

  • ESlint (extends Airbnb)
  • Husky
  • Lint Staged
  • Prettier
  • Flow
  • Enzyme

Custom Scripts

  • android:install - Run in Release mode
  • ios:install - Run in Release mode
  • project:clean - Clean project
  • prettier:check - Check for unformatted files
  • prettier:all - Format files
  • flow - Run Flow
  • lint - Run lint
  • start - Start Metro Bundler
  • start:clean - Start Metro Bundler without cache
  • test - Run jest
  • test:watch - Run jest in watch mode

Contributing

Clone this repo with git clone https://github.com/lucianomlima/react-native-template-basic react-native-template-basic-app cause npm needs project dir name to be equal to project name in package.json.

To execute the project with your changes, you can use the absolute path of cloned repo with react-native-cli:

react-native init [PROJECT_NAME] --template file:///path/to/repo

License

MIT

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].