Skip to content

Instantly share code, notes, and snippets.

Last active August 17, 2021 17:26
What would you like to do?
React Native - Deployment
<?xml version="1.0" encoding="UTF-8"?>
<!--Xholon Workbook MIT License, Copyright (C) Ken Webb, Tue Aug 17 2021 13:25:36 GMT-0400 (Eastern Daylight Time)-->
() Xholon
Title: React Native - Deployment
InternalName: 5b0bb97117ecbf6976bcbd821d0d9b65
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.
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
- would allow me to use my home computer as a web server
- free or $60.00 per year or more
() search: web offline
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.
How to Work Offline in Mozilla Firefox
Co-authored by Stan Kats, Last Updated: July 22, 2021 Tested
Making PWAs work offline with Service workers
Progressive Web Apps
- a Google site
Andrea found this site
How to Launch an Unreleased iOS App Test – UserTesting
Andrea found this site
TestFlight - Apple Developer
Andrea found this site
Try new Android apps before their official release - Google Play Help
Aug 17: search: react native offline mode
Creating offline-friendly React Native apps - Part 1: General tips
Jul. 23, 2019 Originally published at ・12 min read
A sample React Native app showing practical examples of how to make offline-friendly apps.
both of these links are broken
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.
React Native Network Info API for Android, iOS, macOS & Windows. It allows you to get information on:
Connection type
Connection quality
CachedImage component for react-native
4 years ago
KSW not very popular
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).
<!-- domain objects -->
<!-- quantities -->
<Height superClass="Quantity"/>
<port name="height" connector="Height"/>
<Height>0.1 m</Height>
<Brick multiplicity="2"/>
<Blockbehavior implName="org.primordion.xholon.base.Behavior_gwtjs"><![CDATA[
var a = 123;
var b = 456;
var c = a * b;
if (console) {
//# sourceURL=Blockbehavior.js
<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() {
toString: function() {
return "testing:" + testing;
//# sourceURL=Heightbehavior.js
<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 implName="org.primordion.xholon.base.Behavior_gwtjs"><![CDATA[
console.log("I'm another brick behavior");
<SvgClient><Attribute_String roleName="svgUri"><![CDATA[data:image/svg+xml,
<svg width="100" height="50" xmlns="">
<rect id="PhysicalSystem/Block" fill="#98FB98" height="50" width="50" x="25" y="0"/>
<rect id="PhysicalSystem/Block/Height" fill="#6AB06A" height="50" width="10" x="80" y="0"/>
]]></Attribute_String><Attribute_String roleName="setup">${MODELNAME_DEFAULT},${SVGURI_DEFAULT}</Attribute_String></SvgClient>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment