Scaling Mobile Development

(with React Native, of course)

Aaron Greenwald

01 / Before We Begin
Survey
02 / The Challenge
Single App
Use Existing Web Expertise
Scale Quickly
This isn't easy
(especially on mobile)
03 / Philosophy
Hamilton feared anarchy and thought in terms of order; Jefferson feared tyranny and thought in terms of freedom.
- Someone @ University of Groningen
Independently Governed Teams
Small Central Government
Centralized UX
04 / People
Companies & Guilds
Guild Weeks
Guild Days
(Opposite Day)
Core/Infra Team
Open Source
Experts & Specialists
05 / Code
React Native
FOSS from Day One
Modules
        
export function initModules() {
  require('wix-one-app-bi').default.init();
  require('native-app-wix-login');
  require('wix-one-app-feed');
  require('wix-inbox-mobile');
  require('wix-hotels-mobile-app');
  require('wix-store-merchant-app');
  require('wix-one-app-pos');
  require('wix-one-app-module-blog');
  require('wix-one-bookings-manager');
  require('wix-visitors-mobile-app');
  require('wix-invoices-mobile');
  require('wix-contact-card-mobile');
  require('wix-mobile-media-manager');
  require('wix-one-app-more');
  require('wix-promote-app-module');
  //clubs
  require('wix-one-clubs-chat').default();
  require('wix-one-bookings-member').default();
  require('wix-one-invites').default();
  require('wix-one-clubs-manager').default();
  require('wix-one-clubs-feed').default();
  require('wix-one-activities').default();
  require('wix-one-app-notifications');
}
Module Registry
Component Registry
PubSub Events
Method Invocation
Module Registry
          
// expose
ModuleRegistry.notifyListeners('core.SessionUpdate', session);

// consume
const subscription = ModuleRegistry.addListener('core.SessionUpdate', function (session) {
  // consumer handles updated session here
});
subscription.remove();
          
        
          
// expose (react-native-navigation screen), see note below
ModuleRegistry.registerComponentAsScreen('hotels.Dashboard', () => ComponentClass, store, Provider);

// expose (regular component / view)
ModuleRegistry.registerComponent('hotels.ReservationView', () => ComponentClass);

// consume
const ComponentClass = ModuleRegisry.component('hotels.Dashboard');
          
        
          
// expose
ModuleRegistry.registerMethod('inbox.getContactDetails', () => contactService.getContactDetails);

// consume
const contactDetails = await ModuleRegistry.invoke('inbox.getContactDetails', 'johnsmith@example.com');
No Shared State
Session Management
UI Lib
github.com/wix/react-native-ui-lib
wix-react-native-framework
Demo Apps
06 / Sounds Easy
Do you need to think about this?