React Native Nerds: Recent Episodes

React Native Nerds

Join Spencer Carli and Jonathan Wheat as they discuss React Native topics you need to know about to become a better developer.

View Details

This week, Jon ramps up his brewing plans with a logo contest, Spencer's girlfriend comes through and lands an XBox and hopefully is overcoming his motion sickness.

In the React arena we discuss state management and if you've never used anything more than component state we got you covered. You'll learn when to up your state game and possibly which type of state management solution will work for you and your app.

If you've gotten into Redux or MobX, this is still interesting because we discuss the differences between multiple solutions and you may hear something that may make you switch!

0:00 - Introduction

0:05 - Jon's update / Brewery news

8:13 - Spencer's update

12:58 - State Management in 2021

14:08 - What is State

20:32 - Context

24:24 - Redux / Redux Toolkit

33:23 - MobX / MobX State Tree

40:23 - Recoil

43:38 - Apollo

45:14 - ReactQuery

49:38 - Zustand

54:10 - When to use 'em

56:58 - Migrating from one to another

58:31 - Wrap Up

Links:

  • Jon’s logo contest at LogoMyWay
    • https://www.logomyway.com/28555/friends/5dc00bc4e5
  • https://kentcdodds.com/blog/application-state-management-with-react
  • Zustand
    • https://github.com/pmndrs/zustand
  • MobX vs Redux
    • https://www.youtube.com/watch?v=UeRUT5H6XPI
  • I’m never using Recoil.js
    • https://www.youtube.com/watch?v=XEYiYpASG2A

Spencer's Shameless Plugs

React Native Fundamentals Workshop https://youtu.be/rLmdmLhfwvQ React Native School https://reactnativeschool.com

Jon's Shameless Plugs

FastLane Cheat Codes (Sign Up Now) https://fastlanecheatcodes.com

View Details

In this episode, Jon deal with rats and realizes he can do impressions. Spencer gets motion sick over video games but still wants (yet can't find) an xBox.

Our main topic this week covers how to be lazy when building mobile apps by carefully constructing reusable components saving you time and hopefully frustration.

Building a mobile app can be challenging, but you can make it easier on yourself by using some tools and patterns to build reusable components. meaning you can use the same component in multiple places throughout your app, and in other apps.

0:00 - Intro

0:50 - RATS

8:46 - XBox motion sickness

10:44 - COVID comparisons

11:47 - Mobile news - Calm

15:38 - The key to sleep

16:17 - Main Topic - Custom Components

16:47 - Main Topic For Real This Time

20:16 - Props all the way down

25:52 - Core APIs

26:32 - Storybook

27:58 - Styled Components

29:47 - Keep 'em light

34:23 - Don't optimize before you need to

35:25 - UI Frameworks can help

37:27 - Felixbility

39:15 - WrapUp

Links

  • Calm valuation
    • https://www.businessofapps.com/news/calm-raises-75-million-at-2-billion-evaluation/

Spencer's Shameless Plugs

React Native Fundamentals Workshop https://youtu.be/rLmdmLhfwvQ React Native School https://reactnativeschool.com

Jon's Shameless Plugs

FastLane Cheat Codes (Sign Up Now) https://fastlanecheatcodes.com 39:15 - Wrap Up

View Details

This week Jon is losing his mind and obsessing over his brewery and where it will be, Spencer can't cool and still can't find an Xbox, but does seem to come up with some cheeky titles for his new courses.

When we get down to React Native we cover the important details about the recently released v0.64, what you need to do to prepare and what features are worth knowing about.

0:00 - Intro

0:40 - Spencer can't cook

5:05 - Jon's brewery news

8:17 - Spencer's weekly update

13:31 - Mobile news (Amazon's new MacOS EC2)

15:58 - React Native 0.64

16:01 - Hermes for iOS

17:24 - inline requires

19:42 - Shout Outs

20:53 - React 17

21:14 - Hermes proxy suport

22:02 - Hermes profile command

22:43 - Node 12

23:16 - Android min SDK bump

25:43 - XCode 12

26:57 - Prepare now

29:27 - Wrap Up

Links

  • Amazon adds MacOS
    • https://arstechnica.com/gadgets/2020/12/amazon-web-services-adds-macos-on-bare-metal-to-ec2/
  • https://github.com/facebook/react-native/releases
  • https://github.com/react-native-community/releases/issues/214
  • https://github.com/react-native-community/releases/blob/20a632d3a61153f813c020ef2c6bca6910958a10/CHANGELOG.md
  • https://react-native-community.github.io/upgrade-helper/

Spencer's Shameless Plugs

React Native Fundamentals Workshop https://youtu.be/rLmdmLhfwvQ React Native School https://reactnativeschool.com

Jon's Shameless Plugs

FastLane Cheat Codes (Sign Up Now) https://fastlanecheatcodes.com

View Details

This week Spencer really wants an XBox and keeps getting denied, if anyone has a hookup - let him know. Jon gets sucked into the mechanical keyboard community.

Then we focus in React Native and talk about how it all works with transpiling and polyfills,. The best part is that you don't need to understand all of this to use it and make great Apps.

03:20 - Jon fell down the mechanical keyboard rabbit hole 08:10 - Apple Cutting Fees to 15% (if making less than $1mil/year) 10:10 - Foxconn and flip phones 12:40 - Spencer’s warning: he just learned what he’s talking about 14:40 - What is a JavaScript Runtime? 16:00 - The different JavaScript Runtimes available (presently) and when they’re used 20:30 - Flamboyant claims: the key to listener engagement 21:20 - How transpiling “just works”® in React Native 28:45 - What APIs are available in React Native? Talking polyfills. 31:00 - What is Hermes and how does it fit in? 34:45 - Where to learn more about this stuff

  • Apple price cut
    • https://www.zdnet.com/article/apple-slices-commission-rates-with-launch-of-new-small-business-app-developer-program
  • Foxconn’s folding iPhone
    • https://appleinsider.com/articles/20/11/16/foxconn-allegedly-testing-apples-folding-iphone-for-release-in-2022
  • More information
    • https://reactnative.dev/docs/javascript-environment
    • https://medium.com/swlh/react-natives-re-architecture-in-2020-9bb82659792c
    • https://www.youtube.com/watch?v=7gm0owyO8HU
  • Babel resources we talked about
    • https://babeljs.io/
    • https://babeljs.io/docs/en/babel-plugin-transform-parameters
    • https://babeljs.io/docs/en/config-files/

Spencer's Shameless Plugs

React Native Fundamentals Workshop https://youtu.be/rLmdmLhfwvQ React Native School https://reactnativeschool.com

Jon's Shameless Plugs

FastLane Cheat Codes (Sign Up Now) https://fastlanecheatcodes.com

View Details

We have a new friends of the show - Peter Piekarczyk joins us to talk about his company Draftbit and how it can help accelerate your mobile app development using their interface. Build multiple screens, complex UIs with their drag-n-drop interface, tweak properties to get it just right and view the generated code, or export your app so you're not jailed into their system! Oh did I mention you can scan a QR code at any point and view it immediately on your device? Pretty amazing.

We also talk about beer, black Friday preparations, travel during these weird times and a lot more.

0:00 - Welcome

0:35 - Introduction of our guest

3:31 - Jon's update (brewery fun)

5:40 - Spencer's update (Firebase, and Black Friday preparation)

6:27 - Peter's update (Travel)

7:50 - Hammerspoon and Home Assistant

11:06 - Mobile News (Apple's One More Thing event)

17:15 - Draftbit

24:25 - Reason / Rescript

30:11 - Draftbit's Origin Story

33:17 - Workflow

39:29 - Video tutorials

40:39 - Getting access

42:32 - Wrap Up

Links:

  • Apple’s One More thing event
    • video only - https://www.youtube.com/watch?v=umoEDgl_xBo
    • write up + video - https://www.theverge.com/2020/11/10/21550892/apple-arm-silicon-event-macbook-air-pro-mini-mac-big-sur-biggest-announcements
  • Hammerspoon
    • https://www.hammerspoon.org
  • Home Assistant
    • https://www.home-assistant.io/
  • ReasonML
    • https://reasonml.github.io/
  • ReScript
    • https://rescript-lang.org/
  • Find Draftbit Online
    • Twitter: https://twitter.com/draftbit (@draftbit)
    • Web: https://draftbit.com
  • Find Peter Online
    • Twitter: https://twitter.com/peterpme (@peterpme)
    • Github: https://github.com/peterpme
    • Web: https://peterp.me

View Details

Releasing this early this week

Because we talk about the "One More Thing" event on November 10th

Did you know that Spencer wants to be a gamer now? He thinks hiring a VA is going to give him that time haha. Jon is looking to fill in any free time he had but opening a brewery in his town and plans are flying all over the place. We would be remiss if we didn't mention quickly the burning trash heap that is our Election process.

BUT you're here for mobile development, so ...

Do your mobile apps look like crap? Yea we thought so too. We're going to cover how you can up your design skills, without having to take a course. With the resources we'll talk about you'll be able to figure out how to improve an app you're written or how to build it correct the first time. We run through UI design / UX design flows / css and layout tips as well as using a pre-built design system.

0:00 - Welcome / the state of the US Dumpster fire

2:20 - Jon's building a brewery

6:24 - Spencer is a wannabe Gamer and hired a VA

13:36 - The vintage iPhone 5c

20:09 - Main topic intro

21:52 - Dribble

26:04 - UI Design Daily

28:10 - UX Archive

32:11 - FlatIcon.com

33:40 - UI Design sub-reddit

34:26 - Refactoring UI

39:31 - App analysis and critique

43:20 - CSS skills

44:33 - FlexBox Froggy

49:38 - Goldfish projects

Links:

  • iPhone 5c is “Vintage” with limited support
    • https://9to5mac.com/2020/11/03/iphone-5c-is-now-considered-a-vintage-device-with-limited-support/
  • One More Thing event - on November 10th
    • https://arstechnica.com/gadgets/2020/11/one-more-thing-apple-announces-livestreamed-event-for-november-10/
    • Prices
      • https://www.tomsguide.com/news/apple-silicon-macs-explained-everything-you-need-to-know-about-arm-macbooks
  • Dribbble
  • UXArchive
  • UI Design Daily
  • https://www.flaticon.com/packs
  • https://www.reddit.com/r/UI_Design/
  • UI kits
    • UIKitten
      • https://akveo.github.io/react-native-ui-kitten/
    • React Native Elements
      • https://react-native-elements.github.io/react-native-elements/
    • Nativebase
      • https://nativebase.io/
    • Shoutem
      • https://shoutem.github.io/
    • React native paper
      • https://reactnativepaper.com/
    • React Native Material Kit
      • http://xinthink.github.io/react-native-material-kit/
    • React Native Material UI
      • https://github.com/xotahal/react-native-material-ui
  • Refactoring UI

Spencer's Shameless Plugs React Native Fundamentals Workshop

https://www.youtube.com/watch?v=rLmdmLhfwvQ

React Native School

https://reactnativeschool.com

Jon's Shameless Plugs FastLane Cheat Codes (Sign Up Now)

https://fastlanecheatcodes.com

View Details

This week Jon sells his car and and Smoky The Bear (aka Spencer) talks about how ONLY YOU can prevent Chimney Fires.

When they settle down for the show topic, the guys review the cool packages, posts and projects they've come across recently. There's some pretty neat things covered in this episode and really isn't even the tip of the iceberg.

If you have one to add - let us know and we'll mention it and YOU on the show.

0:17 - Welcome

0:44 - Jon's catchup / car and demo

3:30 - Spencer's catchup and fire prevention lesson

7:19 - Spencer's new class about building a chat app

8:19 - Brewery Teaser... because Jon doesn't have enough to do

12:01 - Main Topic! Finally, right???

12:24 - Old packages and projects and the headache they are

13:07 - Drink Up [drinking game app]

13:55 - React Native Bottom Sheet - [package]

17:18 - Can it be done in React Native -

19:32 - Lottie animation package - [package]

23:30 - React Native Camera Kit - [package]

24:59 - Hermes JavaScript Engine - [core react native feature]

25:51 - React Native Game Engine - [package / engine]

30:57 - Shared Element Transition -

33:42 - Gas Buddy migration to React Native - [Blog Post]

32:42 - Wrap Up

Links: * Drink Up + https://github.com/Redseb/DrinkUpqw * React Native Bottom Sheet + https://github.com/gorhom/react-native-bottom-sheet * Season 4 of “Can it be done in React Native?” + https://www.youtube.com/playlist?list=PLkOyNuxGl9jxB_ARphTDoOWf5AE1J-x1r * Lottie + https://github.com/lottie-react-native/lottie-react-native * React Native Camera Kit + https://github.com/teslamotors/react-native-camera-kit * HERMES + https://github.com/facebook/react-native/pull/29914 * React Native Game Engine + https://github.com/bberak/react-native-game-engine + https://github.com/bberak/react-native-game-engine-handbook * Shared Element Transition series + https://www.youtube.com/playlist?list=PLQocKVqyqZDShhQWAzxS42cSP7ydl6blD * Gas Buddy rebuild + https://medium.com/@djmax/react-native-were-really-doing-this-8e69d7b7194f

Spencer's Shameless Plugs React Native Fundamentals Workshop

https://www.youtube.com/watch?v=rLmdmLhfwvQ

React Native School

https://reactnativeschool.com

Jon's Shameless Plugs FastLane Cheat Codes (Sign Up Now)

https://fastlanecheatcodes.com

View Details

It's a big week for us, we discover that Spencer wants to hang up his laptop for a lathe and be a wood worker and why Jon is living MTV's Big Brother - sharing a living space with strangers.

Microsoft is rebuilding their apps with React Native, there's been several important albeit un-exciting updates to React and Node and we talk about NPM trying to go to war with Yarn.

For this week's topic we dive into what GraphQL is (and is not), why it's pretty cool and we cover both client and server implementations including 3rd party services.

01:30 - Spencer’s off week and lack of an update 02:04 - Jon on why to read the fine print of your Airbnb reservation 03:30 - The News (Microsoft using React Native, React v17, Node v15, NPM v7) 07:45 - News Continued, Talking about Draftbit 10:35 - What is Graphql? A high level discussion. 14:10 - How does Graphql work? What’s the integration look like? 18:00 - Why Graphql is so nice for mobile development 20:00 - Walking through an example of using Graphql for Jon’s conference app 24:45 - Graphiql. An amazing development tool for Graphql 26:00 - No more endpoint versioning 27:30 - Implementing Graphql 36:40 - Graphql is to REST as REST was to SOAP? Maybe not as dramatic… 37:10 - Jon repaving the road to hell

Links:

  • Microsoft on React Native
  • React v17.0.0 released - no new features!!
  • Node v15 released
  • npm v7 released
  • Draftbit
  • Graphql.org
  • Available Graphql tools
  • What is GraphQL - intro
  • Apollo GraphQL
  • GraphCMS

Spencer's Shameless Plugs React Native Fundamentals Workshop

https://www.youtube.com/watch?v=rLmdmLhfwvQ

React Native School

https://reactnativeschool.com

Jon's Shameless Plugs FastLane Cheat Codes (Sign Up Now)

https://fastlanecheatcodes.com

View Details

Whelp, if you record often enough, you'll have a disaster. Unfortunately Jon's mic was all static and very noisy for the first part of the show, so this episode doesn't have our typical catchup and mobile news sections. This is VERY unfortunate because Jon actually had a lot of extra time this past week to do some research and first hand dinking around with his app and talks about the different things he did.

We jump straight into securing your app, from how to securely store data to jail break protection.

0:00 - Intro

1:30 - environment vars (react-native-dotenv, react-native-config)

7:13 - expo-secure-store, react-native-keychain, react-native-sensitive-info

9:01 - Auth / Deep linking

11:44 - SSL Pinning

15:18 - Obfuscation

18:22 - Jailbreak protection

25:26 - Outro

Links

  • https://reactnative.dev/docs/security
  • Javascript Obfuscation
    • https://github.com/javascript-obfuscator/react-native-obfuscating-transformer
    • https://www.youtube.com/watch?v=oUwWmoJwSLA
  • SSL Pinning
    • https://www.thesslstore.com/blog/an-introduction-to-pinning/
    • https://itnext.io/react-native-security-ssl-pinning-cde086210d58
  • React-Native-SSL-Pinning
    • https://github.com/MaxToyberman/react-native-ssl-pinning

React Native Fundamentals Workshop

https://www.youtube.com/watch?v=rLmdmLhfwvQ

React Native School

https://reactnativeschool.com

FastLane Cheat Codes (Sign Up Now)

https://fastlanecheatcodes.com

View Details

Jon's back! In this episode we catch up a bit since it's been a couple weeks since we've spoken, we celebrate Spencer's launch of Spectrum 3, hit some Epic news and dive into the best ways we learn with tips along the way.

0:00 - Intro

1:07 - Jon's moving saga and office space

5:11 - Spencer's update, Spectrum launch and camping naked

7:55 - NEWS: React Native Radio

8:31 - Digital Ocean App Platform

11:13 - EPIC News / Court Date

11:44 - The Best Way To Learn [#clickBait]

13:25 - Doc diving

19:54 - The proper way to use tutorials + critical thinking

24:44 - Suck it up buttercup - if you're stuck, push through it

28:55 - Saturation and Emersion

29:56 - Community Involvement

33:21 - Open source contributions / good first issue

34:50 - Translation as a means of learning

36:15 - Book - Make It Stick

39:46 - Spencer's course review by Jon

42:34 - Community and Egghead.io

44:17 - Wrap up

Links:

  • Apple / Epic Trial
    • https://www.scribd.com/document/479056578/Epic-vs-Apple-Starts-May-3
  • Digital Ocean App Platform
    • https://www.digitalocean.com/blog/introducing-digitalocean-app-platform-reimagining-paas-to-make-it-simpler-for-you-to-build-deploy-and-scale-apps/
    • https://www.digitalocean.com/pricing/#app-platform
  • Make it Stick
    • https://www.amazon.com/Make-Stick-Science-Successful-Learning/dp/0674729013
    • https://kentcdodds.com/blog/how-i-teach

React Native Fundamentals Workshop

https://www.youtube.com/watch?v=rLmdmLhfwvQ

React Native School

https://reactnativeschool.com

FastLane Cheat Codes (Sign Up Now)

https://fastlanecheatcodes.com

View Details

In this episode, Jon ditches Spencer so he can move all his things and Spencer catches you up with his latest project and talks about dealing with Bugs that you didn't write yourself.

0:20 - Where’s Jon?! 1:12 - Spencer Update: The perpetual “launching rebuild soon” 1:38 - Free React Native Fundamentals Workshop available 3:20 - How to dealing with bugs when you can’t upgrade the package/an update isn’t available yet with patch-package 7:20 - Dealing with large bugs/changes/feature additions - using your own fork 9:20 - Why you should contribute your fixes back 10:30 - Hacktoberfest - Great time to start contributing (but make it valuable contributions!) 11:06 - These are temporary solutions - don’t forget to remove them when you can do a proper update

Links

  • patch-package
  • Fork a repo
  • React Native Fundamentals Workshop

React Native Fundamentals Workshop

https://www.youtube.com/watch?v=rLmdmLhfwvQ

React Native School

https://reactnativeschool.com

FastLane Cheat Codes (Sign Up Now)

https://fastlanecheatcodes.com

View Details

Jon and Spencer discuss the sessions from React Native EU that they enjoyed.  ACTUAL MOBILE NEWS .... and React Native News!

0:00 - Intro 3:52 - iOS 14 6:10 - Android 11 7:52 - New iPad & Trying to Figure out how Stylus’ work 10:13- Expo SDK 39 11:16 - Main Topic - React Native EU 11:50 - Day 1: Modernizing React Native’s JavaScript 14:30 - Day 1: Visual Regression Test in React Native 17:24 - Day 1: Testing Library Meets React Native 20:58 - Day 1: Performance Does Matter 25:35 - Day 2: Xcode complexity? No More 28:28 - Day 2: The Great Divide: Bridging Native Modules to React Native 30:10 - Day 2: GraphSQL and React Native, urql 30:20 - Day 2: GraphQLifying 31:20 - Day 2: Who Said it?

React Native School

https://reactnativeschool.com

FastLane Cheat Codes (Sign Up Now)

https://fastlanecheatcodes.com

View Details

This week Spencer and Jon talk about how to implement authentication workflows into you app.  Using this overall methodology, you can shove whatever auth you want into your app.  Continue with Epic news and a cool new phone that may be Jon's breaking point to change to Android

0:00 - Intro1:39 - Soundbooth news6:24 - Mobile News6:34 - Samsung Transparent Display9:34 - Epic News11:54 - Upcoming Apple Event15:44 - JWTs vs Cookies17:39 - Navigation Setup19:54 - Storing Auth State24:24 - Where to save sensitive data26:54 - Managing Forgot Password/Reset Password29:09 - Losing Authorization

React Native School

https://reactnativeschool.com

FastLane Cheat Codes (Sign Up Now)

https://fastlanecheatcodes.com

View Details

Spencer and Jon help you boost the performance in your Flatlist components, because if implemented badly, it can really take a toll on your app, rendering blanks, and causing laggy behavior.

They dig into various performance boosting items you can take a look at in your own app. Walk away with faster loading lists, control scrolling and the memory associated with your items.

0:00 - Introduction

7:53 - Mobile News

8:09 - ZTE - first ever behind the screen camera

9:50 - Open Bot - an Android robotics framework

12:40 - Surface Duo is hitting reviewers

13:58 - Why Jon doesn't have any time

15:16 - FlastList / ScrollView

19:20 - Disaster befalls Jon (again)

19:45 - SectionList

23:45 - InitialNumToRender

25:05 - MaxToRenderPerBatch

25:43 - Use a device

28:50 - WindowSize

29:19 - ListItem complex components

31:10 - Icon Sizes

33:05 - 3rd party / external packages

35:39 - RenderItem anonymous functions

40:35 - RecyclerListView

43:31 - Wrap Up

Links:

  • ZTE behind the screen camera
    • https://arstechnica.com/gadgets/2020/09/zte-announces-the-worlds-first-phone-with-a-behind-the-screen-camera/
    • https://www.youtube.com/watch?v=iw-XkNU1KLE&feature=youtu.be
  • OpenBot
      • https://www.openbot.org/
      • GitHub: https://github.com/intel-isl/OpenBot
      • Demonstration: https://www.youtube.com/watch?v=qc8hFLyWDOM
  • Optimizing Flatlist Configuration - https://reactnative.dev/docs/optimizing-flatlist-configuration
  • RecyclerListView
    • https://github.com/Flipkart/recyclerlistview
  • How to use RecyclerListView with React Native
    • https://www.youtube.com/watch?v=32ZM72CKtTE

React Native School

https://reactnativeschool.com

FastLane Cheat Codes (Sign Up Now)

https://fastlanecheatcodes.com

View Details

This week Jon drives down that Road To Hell he paved with good intentions, and faces the fact that hope sucks and he'll never have time to do the things he wants to.

On the brighter side of the podcast, Spencer dives into various ways to make things move in your app, from screen transitions, interfacing with gestures to moving pictures around on the screen. This primer of the various popular animation libraries will help you get started, or at least familiarize yourself with the differences if/when you hear or read about them.

0:00 - Welcome

1:49 - Spencer's Week

4:00 - Jon's Week

9:38 - Mobile News - Spotify may be a target for Apple

10:37 - Fortnite News

12:21 - ARWES - SciFi UI library (React)

14:24 - Main Topic - Animations

15:48 - LayoutAnimation

18:40 - Animated

22:55 - PanResponder

25:10 - Reanimated (v1)

28:09 - Reanimated (v2)

30:14 - React Native Gesture Handler

34:07 - WrapUp

Links:

  • Spotify Virtual Events
    • https://techcrunch.com/2020/08/26/spotify-is-developing-a-virtual-events-feature/
  • Napster sold to MelodyVR
    • https://www.theguardian.com/music/2020/aug/25/napster-sold-british-startup-melodyvr-surprise-deal
  • Arwes (Web) … but wait!
    • https://arwes.dev/
  • Fortnite is splitting into two different games because of Epic and Apple’s fight
    • https://www.theverge.com/2020/8/26/21402547/fortnite-epic-games-apple-ios-macos-two-different-games
  • LayoutAnimation
    • https://reactnative.dev/docs/layoutanimation
  • Animated
    • https://reactnative.dev/docs/animated#docsNav
  • PanResponder
    • https://reactnative.dev/docs/panresponder
  • Reanimated
    • https://github.com/software-mansion/react-native-reanimated
  • React Native Gesture Handler
    • https://github.com/software-mansion/react-native-gesture-handler
  • William Candillon
    • https://www.youtube.com/watch?v=dLC64ye-M94
  • Learn Reanimated v2 (William Candillon)
    • https://start-react-native.dev/reanimated-2

React Native School

https://reactnativeschool.com

FastLane Cheat Codes (Sign Up Now)

https://fastlanecheatcodes.com

View Details

This week we're joined by Jamon Holmgren to talk about React Native Community, the Lean Core initiative, Ignite, Reactotron and more.

0:00 Intro

0:53 - Pronunciation apologies

2:22 - Jamon's week of small, annoying, don't have a good answer for it issues

7:22 - Spencer's week

9:09 - Mobile News / Epic Battle

17:26 - Pentagon's UFO Taskforce

19:49 - Getting to know Jamon

24:00 - Why Infinite Red chose React Native

33:06 - Podcasts

33:43 - Managing with 3 partners

41:55 - WebView

47:13 - What is the React Native Community

49:22 - Ignite

54:17 - Breaking Changes and Maintaining Ignite

57:09 - Continued use of Ignite in your projects

59:24 - Ignite with Expo support

1:02:23 - Reactotron

1:03:27 - Keep in touch with newsletters

1:04:41 - Chain React

1:05:56 - Finding Jamon

Links:

  • How to find Jamon
    • https://twitter.com/jamonholmgren
    • https://jamonholmgren.com/
  • Infinite Red
    • https://infinite.red/
  • Ignite
    • https://github.com/infinitered/ignite
  • IR Academy
    • https://academy.infinite.red/
  • Apple / Epic Battle
    • https://www.macrumors.com/2020/08/17/apple-terminate-epic-developer-accounts-august-28/?scrolla=5eb6d68b7fedc32c19ef33b4
    • 198Fort-nite Video
      • https://youtu.be/euiSHuaw6Q4
    • The original 1984 Apple Video
      • https://www.youtube.com/watch?v=VtvjbmoDx-I
    • 10,000 phone for sale
      • https://www.businessinsider.com/iphones-with-fortnite-selling-on-ebay-for-thousands-2020-8
  • Pentagon Announces Task Force to Study UFOs
    • https://www.vice.com/en_us/article/z3e8pw/pentagon-announces-task-force-to-study-ufos
  • React Native Fundamentals Workshop
    • https://github.com/ReactNativeSchool/react-native-fundamentals
  • React Native Community
    • https://github.com/react-native-community
  • React Native EU 2019: Jamon Holmgren
    • https://www.youtube.com/watch?v=Wx9slbOTD6Q

React Native School

https://reactnativeschool.com

FastLane Cheat Codes (Sign Up Now)

https://fastlanecheatcodes.com

View Details

These days it's super easy to build an app with robust back-end APIs. No one has time (or let's be real, desire) to do dev-ops, so we talk about FireBase and it's myriad of offerings from simple key/value store through various extensions like image resizing.

We have some weird phone news as Microsoft is back in the phone game again, Air BnB tries to go public even with a big COVID hit to their business (and Apple breathing down their neck) and we get our first iTunes ratings and review! WOOT!

0:00 - Intro

0:10 - Selling Jeeps and Jurassic Park

3:18 - Spencer deletes his work

5:28 - Jon's contract work and press conference

8:36 - Mobile news

8:40 - First time Review & Rating - Thanks its_me_hugo!

9:19 - Air BnB going public

10:58 - Microsoft's Surface Duo

14:18 - Firebase Overview

18:26 - React Native Firebase

19:03 - Spencer's experience with Firebase

20:25 - Why use Firebase

21:36 - Two options to implement Firebase

23:55 - Authentication

26:35 - Cloud Firestore

31:08 - Cloud Messaging

34:01 - Cloud Storage

35:35 - Resize Images

36:79 - Trigger Email

43:41 - Crashlytics / Analytics

47:57 - Downsides to Firebase

55:56 - Wrap up

Links:

  • Community Classrooms Project
    • https://www.communityclassrooms.org/
  • Microsoft Surface Duo
    • https://arstechnica.com/gadgets/2020/08/microsofts-surface-duo-is-1400-and-comes-with-a-tiny-3600mah-battery/
  • Air BnB
    • https://www.cnbc.com/2020/08/11/airbnb-plans-to-confidentially-file-for-ipo-this-month.html
  • Jon’s BnB - Trowell Historic Inn, Jesup GA :)
    • http://trowellhistoricinn.com (come visit!!)
  • Firebase
    • https://firebase.google.com/
  • Docs: React Native Firebase
    • https://rnfirebase.io/
  • Firebase vs React Native Firebase
    • https://stackshare.io/stackups/firebase-vs-react-native-firebase
  • Video: React Native Firebase | Install Firebase React Native Tutorial
    • https://www.youtube.com/watch?v=LYi1gwPWDto
  • Tutorial: How to Build a React Native App and Integrate It with Firebase
    • https://www.freecodecamp.org/news/react-native-firebase-tutorial/

React Native School

https://reactnativeschool.com

FastLane Cheat Codes (Sign Up Now)

https://fastlanecheatcodes.com

View Details

What an episode, Spencer, the testing king leads us on a detailed journey through Kent C. Dodds' Testing Trophy. From static "tests" through end-to-end, we cover it. Sprinkled in there with some stories of Jon's denial he's A.D.D, and Spencer's hot time when he couldn't sleep.

0:00 - Intro

2:12 - Corrections

2:45 - Listener Mike writes in

4:07 - Main Topic Testing

4:42 - Mobile News - React Testing Library changes

7:15 - Our week - Jon doesn't have ADD

11:42 - Our Week - Spencer's hot time in the old town

15:22 - Testing Trophy

16:34 - Static testing

21:28 - Unit tests

23:39 - What is Jest

26:17 - Integration tests

34:17 - End-To-End tests with Detox

41:31 - Testing resources / TDD

43:22 - Jon's stupid and finds TDD resources

44:35 - We need to be more open-minded

46:10 - Sign off

Links

    • Write tests. Not too many. Mostly integration - https://kentcdodds.com/blog/write-tests
    • Static vs Unit vs Integration vs E2E Testing for Frontend Apps - https://kentcdodds.com/blog/unit-vs-integration-vs-e2e-tests
    • ReactNativeTesting.io
      • https://reactnativetesting.io
    • React Testing Library (Kent C. Dodds)
      • https://kentcdodds.com/blog/introducing-the-react-testing-library
    • https://testingjavascript.com/
    • Learn TDD
      • https://learntdd.in

React Native School

https://reactnativeschool.com

FastLane Cheat Codes (Sign Up Now)

https://fastlanecheatcodes.com

View Details

Offline Storage and Databases In this sleepy little episode Jon pines to be back in his 20's when he pulls an all-nighter and gets so much done. We cover Storing JSON objects in AsyncStorage, different methods of hydration, why it's important to recognize the size of an open source community when choosing a package and/or software solution, and wrap it up with a plea to tweet us, dammit!

0:00 - Intro

0:17 - Welcome and why Jon's tired

8:56 - Main topic - Offline Storage

9:44 - AsyncStorage and Spencer's app

16:43 - Sqlite database as a solution

16:50 - Realtime database / React Native Firebase as a sync solution

18:09 - pouchDB and a lesson in jenky hydration methods

21:09 - Realm / MongoDB

24:00 - Deciding on a solution based on the size of its community

27:50 - Learn Offline storage (React Native School)

29:30 - Thanks and goodbye

Links

  • Apple threatens AirBnB
    • https://www.imore.com/apple-threatens-remove-airbnb-app-store-over-virtual-experiences-commission
  • AsyncStorage
    • https://reactnative.dev/docs/asyncstorage
  • React Native Firebase
    • https://rnfirebase.io/
  • Realtime database
    • https://rnfirebase.io/database/usage
  • PouchDB
    • https://pouchdb.com/
  • Sqlite
    • https://github.com/andpor/react-native-sqlite-storage
  • Realm DB
    • https://realm.io/
  • Build Offline Capable React Native Apps
    • https://www.reactnativeschool.com/building-offline-react-native-apps

React Native School

https://reactnativeschool.com

FastLane Cheat Codes (Sign Up Now)

https://fastlanecheatcodes.com

View Details

Spencer and Jon welcome Gant Laborde, CIO of Infinite Red, AI Enthusiast, Tech genius and all around great guy to talk about a plethora of items. Our main topic is UI Kitten, a way to get a new app up and running without having to worry about design.

0:00 - Introductions

4:14 - Typescript or Not Typescript

8:13 - The argument for Typescript

11:21 - All about Gant

13:09 - Hot dog Not Hot dog

15:30 - AI-FYI Newsletter

16:12 - Free AI Course

16:21 - Deep Fake Drawing and MIT's Nixon / Moon Disaster film

18:39 - AI is a magic power

20:35 - Gant's status update

21:12 - Jon's status update

22:19 - Specner's update

24:57 - Clients and understanding skills

25:18 - The Hammer Invoice

26:20 - Virtual Coffee

28:22 - UI Kitten

40:00 - Ignite CLI

44:28 - Spencer's not a designer

45:19 - Repo in life

46:21 - Open source contributions

50:02 - Wrap up

Links:

  • MIT creates disturbing ‘deepfake’ video of Nixon announcing Apollo 11 disaster
    • https://nypost.com/2020/07/20/mits-deepfake-video-of-nixon-announcing-apollo-11-disaster-surfaces/
  • In event of moon disaster
    • https://www.archives.gov/files/presidential-libraries/events/centennials/nixon/images/exhibit/rn100-6-1-2.pdf
  • Apollo 11 ‘disaster’ video project highlights growing danger of deepfake tech
    • https://www.space.com/apollo-11-disaster-deepfake-video-tech.html
  • Moon Disaster Project
    • https://moondisaster.org/
  • Moon Disaster Film
    • https://moondisaster.org/film
  • Gant’s Nicholas Cage Talk
    • https://www.youtube.com/watch?v=oJXaIoRZdBM
  • Gant’s Website
    • https://gantlaborde.com/
  • React Native EU Virtual Edition (Free Registration)
    • https://www.react-native.eu/
  • AI FYI Site and Newsletter
    • https://ai-fyi.com/
  • AI Demystified: 5 day Mini-Course
    • https://academy.infinite.red/p/ai-demystified-free-5-day-mini-course
  • Infinite Red
    • https://infinite.red/
  • Chain React Conference
    • https://cr.infinite.red/

React Native School

https://reactnativeschool.com

FastLane Cheat Codes (Sign Up Now)

https://fastlanecheatcodes.com

View Details

Disaster strikes, and hilarity ensues 1/2 way through the recording, but because I'm an awesome editor, I moved it to the beginning of the episode so you don't have to wait :)

React Native released a blog post about their Team Principles. It's often easy to criticize Facebook for what they do, but they really have this figured out.

Then we jump over to review the new features of React Native 0.63, the new improved logBox functionality, Pushable, and other awesome features. Two thumbs up to upgrade to 0.63 if you're able to.

Show Notes

0:00 - The Soundbooth

0:46 - Celibrating Episode #10

3:10 - Main Topic Summary

3:30 - React Native Team Principles blog post and discussion

8:54 - Learn Once, Write Anywhere

11:30 - Jon's update

13:28 - Spencer's update

16:50 - Main Topic : React Native 0.63

16:58 - LogBox

22:17 - Pressible

23:30 - PlatformColor()

27:44 - DynamicColorIOS()

28:52 - Dropping support for iOS9

30:30 - The Strange ability to embed a in a component (WTF?)

31:25 - iOS LaunchScreen requires StoryBoard

33:19 - ChangeLog

33:49 - Spencer's pull request for ReactNavigation

35:18 - Clifhanger for episode 11 :)

React Native School

https://reactnativeschool.com

FastLane Cheat Codes (Sign Up Now)

https://fastlanecheatcodes.com

View Details

This week Jon and Spencer celebrate the fact you are indeed listening, or at least downloading the show.

Then Salt & Peppa talk about how you can push it with One Signal, Firebase, AWS and Urban Airship.  They get into the types and benefits of using push notifications in your app, and dare you, the listeners to hit us up on Twitter.

Links

  • 4 Questions to Ask When Choosing a Push Notification Provider for a React Native App: https://www.reactnativeschool.com/4-questions-to-ask-when-choosing-a-push-notification-provider-for-a-react-native-app
  • OneSignal Docs / API Docs
    • React Native SDK - https://documentation.onesignal.com/docs/react-native-sdk-setup
    • REST API Docs - https://documentation.onesignal.com/reference/create-notification

View Details

This week Spencer and Jon talk about Apple's return to physicality in design and then dive into deep linking into your mobile applications. They cover the two different types of deep linking (URL Schemes and Universal) and dream up interesting (and probably stupid) ways to utilize them.

0:15 - Weekly catchup

1:11 - News - Neumorphic design

6:45 - Deep Linking

19:30 - Outro

Links

  • Neumorphism
    • https://www.inputmag.com/design/apple-macos-big-sur-the-rise-of-neumorphism
  • Deep Linking Video Course
    • https://www.reactnativeschool.com/deep-linking/
  • React Navigation v5 Docs
    • https://reactnavigation.org/docs/deep-linking/
  • Deep Linking in React Native with Universal Links and URL Schemes
    • https://medium.com/@rossbulat/deep-linking-in-react-native-with-universal-links-and-url-schemes-7bc116e8ea8b

React Native School Become an Expert React Native Developer One Lesson at a Time https://www.reactnativeschool.com/

Fastlane Cheat Codes Learn how easy it is to automate your iOS and Android builds and other mundane mobile development tasks https://fastlanecheatcodes.com/

View Details

This week we investigate Touchables and the many different ways you can have your app accept (or not accept) touches properly.

0:17 - Intro

3:28 - Spotify Lite project

4:53 - TypeScript?

7:27 - Touchables in general

9:35 - TouchableWithoutFeedback

10:30 - Enabling secret features

12:46 - TouchableHighlight

13:55 - TouchableOpacity

14:22 - TouchableHighlight (take 2)

15:01 - TouchableNativeFeedback

16:09 - Legitimization (Drink!)

21:54 - Outro

  • Links
    • Better Cross-Platform React Native Components: https://medium.com/differential/better-cross-platform-react-native-components-cb8aadeba472

View Details

Jon and Spencer talk about their setups, what they use and different approaches to development.

  • Links
    • iOS 14 in 4 minutes
      • https://www.youtube.com/watch?v=YDDguZoYn5I
    • Snapchat's augmented reality camera can identify dog breeds and plant species
      • https://www.businessinsider.com/snapchat-camera-scan-dog-breeds-augmented-reality-snap-partner-summit-2020-6
    • Expo Web
      • https://docs.expo.io/guides/running-in-the-browser/
      • https://github.com/expo/expo/issues/6782
    • RecyclerListview
      • https://github.com/Flipkart/recyclerlistview
    • React Native Scroll Bottom Sheet
      • https://github.com/rgommezz/react-native-scroll-bottom-sheet
    • Visual Studio Code
      • https://code.visualstudio.com
    • Fastlane
      • http://fastlane.tools
    • Installr
      • http://installrapp.com
    • Spencer VSCode Setup
      • https://www.youtube.com/watch?v=T1ZY4eq1m-E
    • Command Line Power User by Wes Bos
      • https://commandlinepoweruser.com/

React Native School

https://reactnativeschool

Fastlane Cheat Codes

https://fastlanecheatcodes.com

View Details

In this episode we discuss Over-the-air updates, what you can and can't do with them, along with probably getting banned from China, how you can maybe sell your app for $7.3 Billion dollars using a $300 starter kit and lots of other stuff.

Links:

  • GrubHub sold for 7.3B
    • https://techcrunch.com/2020/06/10/just-eat-takeaway-confirms-its-gobbling-up-grubhub-in-a-7-3b-deal/
  • React Native template Food Delivery App for $299
    • https://www.instamobile.io/app-templates/food-delivery-restaurant-app-template-react-native/
  • Apple takes down PocketCasts in China at behest of the government
    • https://9to5mac.com/2020/06/10/apple-removes-pocket-casts-podcast-player-from-app-store-in-china-at-government-request/
  • Understanding React Native Deployments
    • https://medium.com/react-native-training/understanding-react-native-deployments-6e54157920b7
  • Code Push (old landing page)
    • https://microsoft.github.io/code-push
  • Microsoft App Center
    • https://appcenter.ms
  • Electrode
    • http://www.electrode.io
  • React Native Windows

    • https://github.com/microsoft/react-native-windows
  • Tutorials

    • Over-the-air updates with CodePush - Spencer / React Native School
      • https://www.reactnativeschool.com/over-the-air-updates-with-codepush
    • ReactNative Codepush Tutorial by Cory McAboy
      • https://www.youtube.com/watch?v=jEEPlqIcICM

View Details

We review the release of React Native 0.62, the different features and why these may (or may not) impact your life, workflow, and overall happiness. We also dig into the change log, jump into some Git goodness and stress the continued Legitimization [drink!] of React Native and gush all over how great it is becoming.

Advisory: You may need a box of tissues for this one folks.

Links:

  • Announcing React Native 0.62 with Flipper
    • https://reactnative.dev/blog/2020/03/26/version-0.62
  • Appearance
    • https://reactnative.dev/docs/appearance
  • AccessibilityInfo
    • https://reactnative.dev/docs/accessibilityinfo
  • AppleTV package
    • https://github.com/react-native-community/react-native-tvos
  • React Native Windows
    • https://github.com/microsoft/react-native-windows
  • Upgrade Support
    • https://github.com/react-native-community/upgrade-support
  • LogBox
    • https://reactnativejobs.com/blog/react-native-logbox-debugging/
  • React Dev Tools v4
    • https://reactjs.org/blog/2019/08/15/new-react-devtools.html
  • 0.62 Change Log
    • https://github.com/react-native-community/releases/blob/master/CHANGELOG.md#0620

View Details

If you write code, you write bugs and sometimes finding why those bugs happen is insanely difficult.  We talk about some new first class support in React Native for Flipper, a fantastic debugging tool.

  • Flipper Website
    • https://fbflipper.com/
  • YouTube
    • Flipper: The Extensible DevTool Platform for React Native - Michel Weststrate aka @mweststrate
      • https://youtu.be/WltZTn3ODW4
    • React Native Flipper debugger - Announcing React Native 0.62 with Flipper
    • https://youtu.be/qsaNOILmSXw
  • Parashuram's blog
    • Using Flipper with React Native
    • http://blog.nparashuram.com/2019/09/using-flipper-with-react-native.html

View Details

In this episode we review Context and what it can do for you and your apps.  How it eliminates pro-drilling, how to access and affect state multiple components and screens deep.

Links:

  • React Native Context Docs
    • https://reactjs.org/docs/context.html
  • Wes Bos' video
    • https://www.youtube.com/watch?v=XLJN4JfniH4

View Details

What's new in React Navigation v5 and why you definitely should upgrade.

Links:

  • https://reactnavigation.org/blog/2020/02/06/react-navigation-5.0
  • https://reactnavigation.org/docs/upgrading-from-4.x/

View Details

Starting a new podcast about React Native and we try to qualify ourselves and why we think we're nerd enough to talk to you about this stuff.