Type Errors and More...

Steps for App Development in React Native

July 09, 2023

Intro

Mobile app dev is hard:

  • You have to release the app to the Apple and Google stores
  • You have to work in multiple languages (Swift & Kotlin, probably Objective-C and Java)
  • You need to work in two different IDEs
  • You need to test in two different emulators and devices.

React Native is a great development environment for mobile app development because it simplifies the development process. But its not as simple as it seems. I’m going to list a few steps that I think every developer needs to follow if they are serious about releasing the app.

Also I’m assuming you are using Typescript and have decent knowledge of React.

Steps

I would after each step, build & test and commit the changes.

  1. Developer accounts!
  2. https://developer.apple.com/help/account/get-started/sign-in-to-your-developer-account
  3. https://play.google.com/console/u/0/signup
  4. Change app name
  5. Open app.json and change the displayName.
  6. Change the icons
  7. Try https://icon.kitchen/
  8. Add navigation
  9. React Navigation
  10. Add a splash screen
  11. Most apps need a splash screen: https://github.com/zoontek/react-native-bootsplash
  12. Don’t use the current stylesheets. tailwindcss is great, but it doesn’t work for mobile.
  13. try https://www.nativewind.dev/
  14. Each app needs permissions. Of course it depends on the scope of your app.
  15. good info here: https://rossbulat.medium.com/react-native-managing-app-permissions-for-ios-4204e2286598
  16. use https://github.com/zoontek/react-native-permissions Some examples of libraries you will probably need:
  17. notifications: use https://notifee.app/react-native/docs/overview
  18. GPS: use https://github.com/Agontuk/react-native-geolocation-service
  19. Add State management
  20. I’m using https://legendapp.com/open-source/state/
  21. Add Animation
  22. Give https://legendapp.com/open-source/motion/ a try
  23. Observability: You need to know how your app is being used and what errors it is generating.
  24. Logging (https://logrocket.com/)
  25. Does your app need to play videos?
  26. Use https://github.com/react-native-video/react-native-video
  27. Publishing
  28. Google: https://reactnative.dev/docs/signed-apk-android
  29. Apple: https://reactnative.dev/docs/publishing-to-app-store

Conclusion

So its not that easy even with React Native. Some of these steps may take a considerable amount of time. I’ll create a follow up post if I’m missing something or if I find something interesting…