React Native - Deployment

xholonWorkbook.xml

<?xml version="1.0" encoding="UTF-8"?>
<!--Xholon Workbook http://www.primordion.com/Xholon/gwt/ MIT License, Copyright (C) Ken Webb, Tue Aug 17 2021 13:25:36 GMT-0400 (Eastern Daylight Time)-->
<XholonWorkbook>

<Notes><![CDATA[
() Xholon
------
Title: React Native - Deployment
Description: 
Url: http://www.primordion.com/Xholon/gwt/
InternalName: 5b0bb97117ecbf6976bcbd821d0d9b65
Keywords: 

My Notes
--------
August 13, 2021
GWP React Native app.
How do we deploy the app to various platforms, specifically, for now, so that various people can test it.
We are especially interested in how people can field test it in Gatineau Park using Android, iOS, and Web.

() https://ngrok.com/
    Expose a local web server to the internet
    ngrok allows you to expose a web server running on your local machine to the internet. Just tell ngrok what port your web server is listening on.llow
    KSW
     - would allow me to use my home computer as a web server
     - free or $60.00 per year or more

() search: web offline

() https://medium.com/swlh/how-to-make-your-web-apps-work-offline-be6f27dd28e
    How to Make Your Web Apps Work Offline - The Power of Javascript and Browser Apis
    Bowei Han, Nov 1, 2019
    I recently had the opportunity to add offline capabilities to an existing application using service workers, cache storage, and IndexedDB.
    The technical work required to make the application work offline boiled down to four distinct tasks that I’ll be covering in this post.

() https://www.wikihow.com/Work-Offline-in-Mozilla-Firefox
    How to Work Offline in Mozilla Firefox
    Co-authored by Stan Kats, Last Updated: July 22, 2021 Tested

() https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps/Offline_Service_workers
    Making PWAs work offline with Service workers

() https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps

() https://web.dev/progressive-web-apps/
    Progressive Web Apps
    - a Google site

() https://help.usertesting.com/hc/en-us/articles/115003371111-How-to-Launch-an-Unreleased-iOS-App-Test
    Andrea found this site
    How to Launch an Unreleased iOS App Test – UserTesting

() https://developer.apple.com/testflight/
    Andrea found this site
    TestFlight - Apple Developer

() https://support.google.com/googleplay/answer/7003180?hl=en
    Andrea found this site
    Try new Android apps before their official release - Google Play Help

Aug 17: search: react native offline mode

() https://dev.to/wernancheta/creating-offline-friendly-react-native-apps-part-1-general-tips-oea
    Creating offline-friendly React Native apps - Part 1: General tips
    Jul. 23, 2019 Originally published at pusher.com ・12 min read 

() https://dev.to/wernancheta/creating-offline-friendly-react-native-apps-part-2-real-world-example-5903

() https://github.com/anchetawern/RNOffline
    A sample React Native app showing practical examples of how to make offline-friendly apps.

() https://pusher.com/tutorials/offline-react-native-part-1
() https://pusher.com/tutorials/offline-react-native-part-2
    both of these links are broken

() https://github.com/rgommezz/react-native-offline
    Handful of utilities you should keep in your toolbelt to handle offline/online connectivity in React Native.
    It supports iOS, Android and Windows platforms.
    You can leverage all the functionalities provided or just the ones that suits your needs, the modules are conveniently decoupled.

() https://www.npmjs.com/package/@react-native-community/netinfo
    React Native Network Info API for Android, iOS, macOS & Windows. It allows you to get information on:
      Connection type
      Connection quality

() https://github.com/kfiroo/react-native-cached-image
    CachedImage component for react-native
    4 years ago

() https://www.npmjs.com/package/@georstat/react-native-image-cache
    KSW not very popular

() https://www.npmjs.com/package/react-native-fast-image
    KSW this is the most popular when I query npmjs for: react native image cache
    react-native-fast-image, TypeScript, 8.3.7 • Public • Published 24 days ago
    Performant React Native image component.
    
    React Native's Image component handles image caching like browsers for the most part.
    If the server is returning proper cache control headers for images you'll generally get the sort of built in caching behavior you'd have in a browser.
    Even so many people have noticed:
     - Flickering.
     - Cache misses.
     - Low performance loading from cache.
     - Low performance in general.
    FastImage is an Image replacement that solves these issues. FastImage is a wrapper around SDWebImage (iOS) and Glide (Android).
() https://github.com/DylanVann/react-native-fast-image

]]></Notes>  

<_-.XholonClass>

  <!-- domain objects -->
  <PhysicalSystem/>
  <Block/>
  <Brick/>
  
  <!-- quantities -->
  <Height superClass="Quantity"/>
  
</_-.XholonClass>

<xholonClassDetails>
  <Block>
    <port name="height" connector="Height"/>
  </Block>
</xholonClassDetails>

<PhysicalSystem>
  <Block>
    <Height>0.1 m</Height>
  </Block>
  <Brick multiplicity="2"/>
</PhysicalSystem>

<Blockbehavior implName="org.primordion.xholon.base.Behavior_gwtjs"><![CDATA[
  var a = 123;
  var b = 456;
  var c = a * b;
  if (console) {
    console.log(c);
  }
  //# sourceURL=Blockbehavior.js
]]></Blockbehavior>

<Heightbehavior implName="org.primordion.xholon.base.Behavior_gwtjs"><![CDATA[
  var myHeight, testing;
  var beh = {
    postConfigure: function() {
      testing = Math.floor(Math.random() * 10);
      myHeight = this.cnode.parent();
    },
    act: function() {
      myHeight.println(this.toString());
    },
    toString: function() {
      return "testing:" + testing;
    }
  }
  //# sourceURL=Heightbehavior.js
]]></Heightbehavior>

<Brickbehavior implName="org.primordion.xholon.base.Behavior_gwtjs"><![CDATA[
  $wnd.xh.Brickbehavior = function Brickbehavior() {}

  $wnd.xh.Brickbehavior.prototype.postConfigure = function() {
    this.brick = this.cnode.parent();
    this.iam = " red brick";
  };

  $wnd.xh.Brickbehavior.prototype.act = function() {
    this.brick.println("I am a" + this.iam);
  };
  //# sourceURL=Brickbehavior.js
]]></Brickbehavior>

<Brickbehavior implName="org.primordion.xholon.base.Behavior_gwtjs"><![CDATA[
  console.log("I'm another brick behavior");
]]></Brickbehavior>

<SvgClient><Attribute_String roleName="svgUri"><![CDATA[data:image/svg+xml,
<svg width="100" height="50" xmlns="http://www.w3.org/2000/svg">
  <g>
    <title>Block</title>
    <rect id="PhysicalSystem/Block" fill="#98FB98" height="50" width="50" x="25" y="0"/>
    <g>
      <title>Height</title>
      <rect id="PhysicalSystem/Block/Height" fill="#6AB06A" height="50" width="10" x="80" y="0"/>
    </g>
  </g>
</svg>
]]></Attribute_String><Attribute_String roleName="setup">${MODELNAME_DEFAULT},${SVGURI_DEFAULT}</Attribute_String></SvgClient>

</XholonWorkbook>