Installation
- Facebook App Id
- Firebase app with relevant configuration files for android, ios and web
- 1.Run yarn install on the root folder
Please do not add any firebase libs to the native code , only via rn-firebase
- 1.
- 2.Download config files to the relevant directories in /android and /ios folders.
- 3.Enable the following sign in methods : Email/Password, Facebook, Apple Sign In and Anonymous
- 4.Create Firestore database
- 5.Create 2 composite indexes (not mandatory at this stage as after you run app you would get an error with link to create those indexes) : a. collection id - quizzes, field path - category Ascending and field path = date Descending b. collection id - quizzes, field path - id Ascending and field path = date Descending
Facebook
- 1.Create new facebook app and follow instructions for the quick start and how to configure the app id in the android and ios apps
Apple
- 1.Enable apple sign in and push notifications via developer console, go to apple developer and to your account, identifiers , choose your app identifier, and enable push notifications and apple sign in capabilities.
Im referring in this section to the relevant docs of the platforms, as its better to read the updated docs directly from the platforms websites
- 1.react native firebase config's - please refer to docs here in this sections: a. app b. authentication c. firestore
Please note, react native firebase already includes all the xcode frameworks ,so please do not install them manually as it would cause many build errors
- 1.apple sign in - enable apple sign in by going to your app target -> capabillities and enable Apple Sign In
- 2.react native paper - refer to docs here. a. please note - as react native paper uses react-native-vector-icons, there is need to manually install this fonts. android - please add this gradle line in the bottom of your app build.gradle file :
apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"where you should replace node modules with your library path if its different in ios you should manually install each of the fonts by downloading them and adding them into info.plist file. example :<key>UIAppFonts</key> <array> <string>FontAwesome.ttf</string> <string>MaterialIcons.ttf</string> <string>MaterialCommunityIcons.ttf</string> <string>Montserrat-Black.ttf</string> <string>Montserrat-BlackItalic.ttf</string> <string>Montserrat-Bold.ttf</string> <string>Montserrat-BoldItalic.ttf</string> <string>Montserrat-ExtraBold.ttf</string> <string>Montserrat-ExtraBoldItalic.ttf</string> <string>Montserrat-ExtraLight.ttf</string> <string>Montserrat-ExtraLightItalic.ttf</string> <string>Montserrat-Italic.ttf</string> <string>Montserrat-Light.ttf</string> <string>Montserrat-LightItalic.ttf</string> <string>Montserrat-Medium.ttf</string> <string>Montserrat-MediumItalic.ttf</string> <string>Montserrat-Regular.ttf</string> <string>Montserrat-SemiBold.ttf</string> <string>Montserrat-SemiBoldItalic.ttf</string> <string>Montserrat-Thin.ttf</string> <string>Montserrat-ThinItalic.ttf</string> </array>
Next, you'll need to add facebook data:
Android: create file names strings.xml in res/values folder, and add there the following data
<resources>
<string name="app_name"><YOUR_APP_NAME></string>
<string name="facebook_app_id"><YOUR_FACEBOOK_APP_ID></string>
</resources>
For IOS :
add these to the info.plist file :
<key>CFBundleURLTypes</key>
<array>
<dict>
<key>CFBundleURLSchemes</key>
<array>
<string>fb<YOUR_FB_APP_ID></string>
</array>
</dict>
</array>
<key>FacebookAppID</key>
<string><YOUR_FB_APP_ID></string>
<key>FacebookDisplayName</key>
<string><YOUR_FACEBOOKP_DISPLAY_NAME></string>
- 1.
- 1.run yarn install from root folder
- 2.Lunch ios emulator and click on play in xcode
- 3.For android there is need to run react-native run-android to start metro server if its didnt start yet
- 1.
- 2.
- 3.
- 4.
- 5.Next steps is to follow the installation guide
After installing mobile app, dashboard should be quite simple to install as it contain already node and react.
- Install libs using yarn install from root of /quizzelda-web folder
- To run just use yarn build form root fo/quizzelda-web
- create file names config.json in quizzelda-web/src/lib directory
- add the following code there
{
"apiKey": <YOUR_FIREBAS_WEB_KEY>,
"authDomain": <YOUR_FIREBAS_AUTH_DOMAIN>,
"databaseURL": <YOUR_FIREBASE_DB_URL>,
"projectId": <YOUR_FIREBASE_PROJECT_ID>,
"storageBucket": <YOUR_FIREBASE_STORAGE_BUCKET>,
"messagingSenderId": <YOUR_FIREBASE_SENDER_ID>
}
After yarn start it should open chrome page with localhost:3000 and thats it
Last modified 2yr ago