Wednesday, January 27, 2021

React Native Setup

After tinkering with React Native over the past few weeks I think I now feel like I grasp most of the fundamentals. Something I struggled with initially was simply trying to debug code as you were now working out of the browser. This is the setup that I'm currently working with.

  1. Initialize a new Expo project

    expo init subscription-app-client
    
  2. Pick a UI library to use, this is something that I feel that's even more important than developing for the web, it's very difficult to just use CSS and the components React Native gives you, I'm currently using React Native Paper after trying Native Base

  3. Think about how to route between different screens, currently I'm just using state based routing and not a library like React Navigation

  4. Start the Expo server

    yarn start
    
  5. The easiest way to debug I've found is to scan the QR code that Expo gives you with your native photos app and then view all your console.logs in terminal, don't use the iOS simulator it's absolute trash

  6. To connect to a Rails backend I needed to start the server where it can bind to any IP

    rails s -b 0.0.0.0
    
  7. I also needed to setup my cors.rb file with my own local IP

  8. To make fetch requests from React I needed to fetch from my local IP to the default port 3000 which rails is running on

    fetch(`${IP}/subscriptions`)