All Expo documentation fails to say where in the app to put the code

[rbreitenbach]

For instance, on the Facebook and Firebase documentation, it gives sample code but doesn’t say where to place it. Please help!

[mbezhanov]

I hope I am understanding your question correctly, but I think initializing a project via expo init project-name using the tabs template will provide some answers:

$ expo init test
? Choose a template: tabs
[16:28:18] Extracting project files...
[16:28:19] Customizing project...

Your project is ready at /test
To get started, you can type:

  cd test
  expo start
$ tree test
./test/
├── App.js
├── app.json
├── assets
│   ├── fonts
│   │   └── SpaceMono-Regular.ttf
│   └── images
│       ├── icon.png
│       ├── robot-dev.png
│       ├── robot-prod.png
│       └── splash.png
├── babel.config.js
├── components
│   ├── StyledText.js
│   ├── TabBarIcon.js
│   └── __tests__
│       └── StyledText-test.js
├── constants
│   ├── Colors.js
│   └── Layout.js
├── navigation
│   ├── AppNavigator.js
│   └── MainTabNavigator.js
├── package.json
├── screens
│   ├── HomeScreen.js
│   ├── LinksScreen.js
│   └── SettingsScreen.js
└── __tests__
    └── App-test.js

9 directories, 20 files

So, you can put your bootstrap logic in App.js, your React components in ./components, your React Navigation screens in ./screens, and your stack, switch and tab navigator definitions in ./navigation.

If you use Redux, you can put your actions and reducers, in example, in ./store:

$ tree store
store
├── actions
│   ├── actionTypes.js
│   ├── auth.js
│   └── ui.js
├── createStore.js
├── reducers
│   ├── auth.js
│   └── ui.js
└── utils.js

But in the end, it’s really up to you to decide how exactly to organize your code. Expo is unopinionated.

[adamjnav]

As @mbezhanov mentioned, Expo is unopinionated so you can determine what flow and structure works best for your project.

Cheers,

Adam

[rbreitenbach]

Thanks for your answers. Still unclear on Expo and Google Sign In, for instance. I think the Expo documentation is way outdated and says nothing about where the sample code should be inserted, e.g., inside AppNavigation, MainTabNavigation, App.js, screens, etc. And why isn’t there a simpler way to authenticate inside Expo? A little off-topic, but still pertains to Expo documentation not clearly indicating where the sample code should be inserted in the template code. It’s probably my own lack of foundation in React Native and Javascript that is posing difficulties, as well.