Skip to content

Instantly share code, notes, and snippets.

@calendee
Created September 10, 2019 12:37
Show Gist options
  • Save calendee/ac7fcb73367771ab68d0857248449f35 to your computer and use it in GitHub Desktop.
Save calendee/ac7fcb73367771ab68d0857248449f35 to your computer and use it in GitHub Desktop.
ReactJS Dallas Meetup Presentation

ReactJS Dallas Meetup Demo

Overview

Show Ionic Framework Docs

Show Create New Project

  • ionic start ionic-react-tabs-rc1 tabs --type=react
  • ionic start ionic-react-blank blank --type=react
  • ionic start sidemenu-react sidemenu --type=react

Demonstrate Sidemenu Project

cd /Users/jn/Documents/Apps/react-js-dallas-ionic-framework-demo
git checkout demo-stage-1

Describe how sample has:

  • global state management for Events and User
  • prettier
  • linting

Demonstrate mobile vs desktop layout Demonstrate on device : https://ionic-sidemenu.netlify.com with Capto Comment out and demonstrate how a traditional react app handles changing routes and lacks navigation animation Explain how Ionic Router extended React Router to "cache" views to recreate the mobile experience, even on desktop Add ViewManager back and show maintaining state, transitions, etc

Add buttons

Code in demo-stage-2

  • Demonstrate changing button color
  • Demonstrate clicking triggers logging

Add Authenticated Routing

Code in demo-stage-3

Add FAB

Code in demo-stage-4

Questions?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment