From 7a0afbf6b07cf16a19206832b0cd058e228691c2 Mon Sep 17 00:00:00 2001 From: Bogdan Mavlo Date: Thu, 4 Aug 2022 21:11:08 +0300 Subject: [PATCH] Environment configs & bump versions Add .env configs Add .gitignore Update README Add Scripts section to README Add react-native-config package Bump packages versions --- .env.development | 1 + .env.production | 1 + .env.staging | 1 + .gitignore | 68 ++++++++++++++++++++++ README.md | 144 +++++++++++++++++++++++++++++++++++++++-------- package.json | 85 +++++++++++++++------------- 6 files changed, 238 insertions(+), 62 deletions(-) create mode 100644 .env.development create mode 100644 .env.production create mode 100644 .env.staging create mode 100644 .gitignore diff --git a/.env.development b/.env.development new file mode 100644 index 0000000..b240bab --- /dev/null +++ b/.env.development @@ -0,0 +1 @@ +API_URL=https://dev.myapi.com diff --git a/.env.production b/.env.production new file mode 100644 index 0000000..1cf3bf5 --- /dev/null +++ b/.env.production @@ -0,0 +1 @@ +API_URL=https://prod.myapi.com diff --git a/.env.staging b/.env.staging new file mode 100644 index 0000000..cb0047e --- /dev/null +++ b/.env.staging @@ -0,0 +1 @@ +API_URL=https://stage.myapi.com diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..e4bd6a9 --- /dev/null +++ b/.gitignore @@ -0,0 +1,68 @@ +# Project + +package-lock.json +ios/Podfile.lock + + +# OSX +# +.DS_Store + +# Xcode +# +build/ +*.pbxuser +!default.pbxuser +*.mode1v3 +!default.mode1v3 +*.mode2v3 +!default.mode2v3 +*.perspectivev3 +!default.perspectivev3 +xcuserdata +*.xccheckout +*.moved-aside +DerivedData +*.hmap +*.ipa +*.xcuserstate + +# Android/IntelliJ +# +build/ +.idea +.gradle +local.properties +*.iml +*.hprof + +# node.js +# +node_modules/ +npm-debug.log +yarn-error.log + +# BUCK +buck-out/ +\.buckd/ +*.keystore +!debug.keystore + +# fastlane +# +# It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the +# screenshots whenever they are needed. +# For more information about the recommended setup visit: +# https://docs.fastlane.tools/best-practices/source-control/ + +*/fastlane/report.xml +*/fastlane/Preview.html +*/fastlane/screenshots + +# Bundle artifact +*.jsbundle + +# Ruby / CocoaPods +/ios/Pods/ +/ios/tmp.xcconfig +/vendor/bundle/ diff --git a/README.md b/README.md index 993d5d0..5eee149 100644 --- a/README.md +++ b/README.md @@ -1,54 +1,132 @@ -# 🍍 Pineapple RN template +mvp structure + +# 🍍 Pineapple ReactNative template + +# 🐸 Dependencies -# 🐸 Dependencies - [Async Storage](https://www.npmjs.com/package/@react-native-async-storage/async-storage) - Key-value storage +- [Axios](https://github.com/axios/axios) - Networking +- [Date-fns](https://date-fns.org) - Date utility +- [Formik](https://formik.org) - Build forms +- [React Native Config](https://www.npmjs.com/package/react-native-config) - Environment configs +- [React Native Gesture Handler 2](https://www.npmjs.com/package/react-native-gesture-handler) - Gestures - [React Native Keychain](https://www.npmjs.com/package/react-native-keychain) - Secure storage +- [React Native Splash Screen](https://www.npmjs.com/package/react-native-splash-screen) - Splash screen +- [React Native Svg](https://github.com/react-native-svg/react-native-svg) - Create SVG - [React Navigation](https://reactnavigation.org/docs/getting-started/) - Navigation between screens & bottom tabs - [React Navigation Devtools](https://reactnavigation.org/docs/devtools/) - Tools to debug navigation +- [Reanimated 2](https://docs.swmansion.com/react-native-reanimated/docs) - Animations - [Redux Toolkit](https://redux-toolkit.js.org/introduction/getting-started) - State manager & RTK queries -- [Axios](https://github.com/axios/axios) - Networking -- [Date-fns](https://date-fns.org) - Date utility -- [Formik](https://formik.org) - Build forms - [Yup](https://github.com/jquense/yup) - Form validation -- [RNGH 2](https://www.npmjs.com/package/react-native-gesture-handler) - Gestures -- [Reanimated 2](https://docs.swmansion.com/react-native-reanimated/docs) - Animations -- [React Native Svg](https://github.com/react-native-svg/react-native-svg) - Create SVG -- [React Native Splash Screen](https://www.npmjs.com/package/react-native-splash-screen) - Splash screen -# πŸ‘¨β€πŸ’» Development dependencies +# πŸ‘¨β€πŸ’» Development dependencies + - [Module Resolver](https://www.npmjs.com/package/babel-plugin-module-resolver) - Path aliases - [SVG Transformer](https://github.com/kristerkari/react-native-svg-transformer) - Use SVG as components -- [RN Flipper](react-native-flipper) - Enable Flipper debugger +- [Flipper](react-native-flipper) - Enable Flipper debugger # πŸ™ˆ Setup -## Main branch +## Main branch + +> **πŸ“ NOTE:** Main branch is used only for demonstration purposes. If you want to use this template, please use Core branch + 1. Install dependencies & pods 
-npm i && cd ios && pod install
+npm run setup
+
+2. Build a project +
+// iOS
+npm run ios
+
+// Android 
+npm run android
-2. Build a project with XCode or Android Studio 3. Make some coffee while project is buildingβ˜•οΈ -4. Run Metro bundler (if it's not opened yet) and run an application ## Core branch + 1. Create a new project with TypeScript template: 
 npx react-native init AwesomeTSProject --template react-native-template-typescript
-2. Move the files from this repository to a project we just created -3. [Configure splash screen for iOS & Android](https://www.npmjs.com/package/react-native-splash-screen) -4. [Configure react-navigation](https://reactnavigation.org/docs/getting-started/#installing-dependencies-into-a-bare-react-native-project) -5. [Configure Reanimated 2 for Android](https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/installation#android) -6. Install dependencies -7. Install pods -8. Build a project with XCode or Android Studio +2. Install dependencies & pods +
+npm run setup
+
+3. Move the files from this repository to a project we just created +4. [Configure React Native Config](https://www.npmjs.com/package/react-native-config) +5. [Configure splash screen for iOS & Android](https://www.npmjs.com/package/react-native-splash-screen) +6. [Configure react-navigation](https://reactnavigation.org/docs/getting-started/#installing-dependencies-into-a-bare-react-native-project) +7. [Configure Reanimated 2 for Android](https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/installation#android) +8. Build a project +
+// iOS
+npm run ios
+
+// Android 
+npm run android
+
+ +# πŸ“œ Scripts + +### Start a Metro bundler +
+npm run start
+
+ +### Install dependencies and pods +
+npm run setup
+
-# πŸ› Debug +### Remove all packages and clear cache +
+npm run reset
+
+ +### Run android +> **πŸ“ NOTE:** Build will be created with Debug configuration +
+// Development 
+npm run android
+
+// Staging 
+npm run android:staging
+
+// Production 
+npm run android:production
+
+ +### Create APK +
+// Staging 
+npm run deploy-android:staging
+
+// Production 
+npm run deploy-android:production
+
+ +### Run iOS +> **πŸ“ NOTE:** Build will be created with Debug configuration +
+// Development 
+npm run ios
+
+// Staging 
+npm run ios:staging
+
+// Production 
+npm run ios:production
+
+ +# πŸ› Debug This template is integrated with [Flipper](https://fbflipper.com) to debug an application ### Flipper plugins + - [react-navigation](https://reactnavigation.org/docs/devtools/) - [redux-flipper](https://www.npmjs.com/package/redux-flipper) @@ -56,3 +134,23 @@ This template is integrated with [Flipper](https://fbflipper.com) to debug an ap - [πŸŒ… Splash screen & AppIcon generator](https://appicon.co) - [🧬 Convert SVG to React Native component](https://react-svgr.com/playground/?native=true) +- [πŸ”€ Add custom fonts](https://www.bigbinary.com/learn-react-native/adding-custom-fonts) + +[![alt text][1.1]][1] +[![alt text][2.1]][2] + +If you have any suggestions or questions feel free to make a Pull Request or contact us! + +## Run by + +[OmiSoft](https://omisoft.net/?utm_source=github&utm_medium=social) + +[1]: http://www.twitter.com/omisoftnet +[2]: http://www.facebook.com/omisoftnet +[1.1]: http://i.imgur.com/wWzX9uB.png "twitter icon without padding" +[2.1]: http://i.imgur.com/fep1WsG.png "facebook icon without padding" + +## License + +ReactNative PineApple Template is released under the MIT license. +See the [LICENSE](./LICENSE.md) for details. diff --git a/package.json b/package.json index 9d5702f..70c74a9 100644 --- a/package.json +++ b/package.json @@ -3,54 +3,61 @@ "version": "0.0.1", "private": true, "scripts": { - "android": "react-native run-android", - "ios": "react-native run-ios", - "start": "react-native start", - "test": "jest", - "lint": "eslint . --ext .js,.jsx,.ts,.tsx" + "start": "npx react-native start --reset-cache", + "setup": "npm i && cd ios && pod install", + "reset": "rm -rf node_modules/ && npm cache clear && watchman watch-del-all", + "android": "ENVFILE=.env.development npx react-native run-android", + "android:staging": "ENVFILE=.env.staging npx react-native run-android", + "android:production": "ENVFILE=.env.production npx react-native run-android", + "ios": "ENVFILE=.env.development npx react-native run-ios --device --configuration Debug", + "ios:staging": "ENVFILE=.env.staging npx react-native run-ios --device --configuration Debug", + "ios:production": "ENVFILE=.env.production npx react-native run-ios --device --configuration Debug", + "build-android:staging": "cd android && ENVFILE=.env.staging ./gradlew assembleRelease && open ./app/build/outputs/", + "build-android:production": "cd android && ENVFILE=.env.production ./gradlew assembleRelease && open ./app/build/outputs/" }, "dependencies": { - "@react-native-async-storage/async-storage": "^1.17.3", - "@react-native-community/cli": "^7.0.3", - "@react-navigation/bottom-tabs": "^6.3.1", - "@react-navigation/devtools": "^6.0.7", - "@react-navigation/native": "^6.0.10", - "@react-navigation/native-stack": "^6.6.1", - "@reduxjs/toolkit": "^1.8.1", - "axios": "^0.26.1", - "date-fns": "^2.28.0", + "@react-native-async-storage/async-storage": "^1.17.7", + "@react-native-community/cli": "^8.0.5", + "@react-navigation/bottom-tabs": "^6.3.2", + "@react-navigation/devtools": "^6.0.8", + "@react-navigation/native": "^6.0.11", + "@react-navigation/native-stack": "^6.7.0", + "@reduxjs/toolkit": "^1.8.3", + "axios": "^0.27.2", + "date-fns": "^2.29.1", "formik": "^2.2.9", - "react": "17.0.2", - "react-native": "0.68.0", - "react-native-gesture-handler": "^2.3.2", - "react-native-keychain": "^8.0.0", - "react-native-reanimated": "^2.7.0", - "react-native-safe-area-context": "^4.2.4", - "react-native-screens": "^3.13.1", + "react": "18.2.0", + "react-native": "0.69.3", + "react-native-config": "^1.4.6", + "react-native-gesture-handler": "^2.5.0", + "react-native-keychain": "^8.1.1", + "react-native-reanimated": "^2.9.1", + "react-native-safe-area-context": "^4.3.1", + "react-native-screens": "^3.15.0", "react-native-splash-screen": "^3.3.0", - "react-native-svg": "^12.3.0", - "react-redux": "^7.2.8", - "redux-flipper": "^2.0.1", + "react-native-svg": "^12.4.3", + "react-redux": "^8.0.2", + "redux-flipper": "^2.0.2", "yup": "^0.32.11" }, "devDependencies": { - "@babel/core": "^7.12.9", - "@babel/runtime": "^7.12.5", - "@react-native-community/eslint-config": "^2.0.0", - "@types/jest": "^26.0.23", - "@types/react-native": "^0.67.3", - "@types/react-test-renderer": "^17.0.1", - "@typescript-eslint/eslint-plugin": "^5.17.0", - "@typescript-eslint/parser": "^5.17.0", - "babel-jest": "^26.6.3", + "@babel/core": "^7.18.10", + "@babel/runtime": "^7.18.9", + "@react-native-community/eslint-config": "^3.1.0", + "@types/jest": "^28.1.6", + "@types/react-native": "^0.69.5", + "@types/react-test-renderer": "^18.0.0", + "@typescript-eslint/eslint-plugin": "^5.32.0", + "@typescript-eslint/parser": "^5.32.0", + "babel-jest": "^28.1.3", "babel-plugin-module-resolver": "^4.1.0", - "eslint": "^7.32.0", - "jest": "^26.6.3", - "metro-react-native-babel-preset": "^0.67.0", - "react-native-flipper": "^0.142.0", + "eslint": "^8.21.0", + "jest": "^28.1.3", + "metro-react-native-babel-preset": "^0.72.0", + "react-native-flipper": "^0.157.0", "react-native-svg-transformer": "^1.0.0", - "react-test-renderer": "17.0.2", - "typescript": "^4.4.4" + "react-test-renderer": "18.2.0", + "typescript": "^4.7.4" }, "resolutions": { "@types/react": "^17"