username = navigation.getParam( 'username' ) ĩ this. my_channel = navigation.getParam( 'my_channel' ) ħ 8 this. pusher = navigation.getParam( 'pusher' ) Ħ this. In the Login screen, start by importing all the packages we need:ģ 4 // get Pusher connection and user's channel from the navigation param 5 this. This allows you to visualize what the code does as we’re adding it: expo start I encourage you to start running the app even if the code is still not complete. We’re now ready to start building the app. env file which contains the placeholder for Pusher app credentials. server - this is where we will add the code for the server component of the app.In this case, we only have the Card.js which renders the individual cards, and Score.js which renders the score and name of the user. app/components - this is where the UI components of the app are stored.We’re using Expo’s vector icons so the file contains the name of the icon, the src (for example, FontAwesome), and the color we want to apply to it. In this case, we only have the cards.js file which contains the definition for the unique cards that the app uses. app/data - this is where hard-coded data is stored.This is very useful for changing the location of the cards that need to be guessed in the screen. It’s used to arrange the items in the array in random order. In this case, we only have the shuffleArray.js file.

app/helpers - this is where the app’s helper functions are stored.Only a starter template with minimum output is available in the starter branch. We only have two screens: Login and Game. app/screens - this is where the app’s screens are stored.Before we proceed to actually code the app, let’s first take a quick look at the files and folders that are already available in the starter project:

Memory card game javascript