Skip to content

Latest commit

 

History

History
67 lines (39 loc) · 3.51 KB

faqs.md

File metadata and controls

67 lines (39 loc) · 3.51 KB

FAQs

Where did you come up with this?

By no means is this the 'right' or 'only' way to build a React or React Native App. We have however, worked on various apps built with React and React Native, that are 'in the wild' right now. So the ideas presented here are simply based on experience.

Code Style Guide?

We're using Airbnb's JS/React Style Guide with ESLint linting. We just like it :)

Is this a "Universal" app?

To be clear, No it isn't. We've tried sharing absolutely everything across web and native mobile apps - and have run into road blocks where we've needed to undo the "universalism".

Our opinion for performant and maintainable solutions, is to:

  • Share things like data structures, libraries and business logic
  • And hand craft optimal user-interfaces for each platform

React, hah? How do I?

React Native Express is a great site to get you started, specifically:

Once you've got your head around the basics, checkout the React Native and React websites, specifically

How do I customize the App Display Name and Expo Icon?

You can edit app.json to include configuration keys under the expo key.

To change your app's display name, set the name key in app.json to an appropriate string.

To set an app icon, set the icon key in app.json to be either a local path or a URL. It's recommended that you use a 512x512 png file with transparency.

How do I eject from 'Create React Native App' and Expo?

If you want to build and deploy your app yourself, you'll need to eject from CRNA and use Xcode and Android Studio.

This is usually as simple as running npm run eject in your project, which will walk you through the process. Make sure to install react-native-cli and follow the native code getting started guide for React Native.

How do I customize the Native Icon?

Once you have ejected the app, you might want to change the app icons for iOS and Android. You can yse the app-icon utility to generate all of the required icons for each required size.

Install the tool with npm install -g app-icon, or if you are using NPM 5.2.0 or later use npx to run the tool without installing it:

npx app-icon generate -i ./src/images/app-icon.png

This will generate the icon in all required sizes. You can also add labels to icons, which can be useful for testing. This example labels the icon with 'beta' and the current version number:

npx app-icon label -i ./src/images/app-icon.png -o temp.png --top beta --bottom $(jq .version package.json)
npx app-icon generate -i temp.png

Icon Labelled with Beta and Version Number