One Codebase to Rule Them All - Using React Native Everywhere
summary
Argues a single JavaScript codebase can hit web, iOS, Android, Windows and desktop with 95% code reuse, using React Native Web, React XP, Electron and Microsoft’s React Native for Windows; Expo eases development, Metro bundles mobile, Create React App simplifies web. Shows a live-coded math game (works on web, mobile build attempt stalls), warns about SVG and modal differences, async storage and flipped flex direction, harder debugging and accessibility tradeoffs, and notes React Native Dom is promising but not production ready.
AI-written summary · about
chapters (23)
- 0:00Start
- 1:14Thank You
- 1:40What What React Native Is
- 2:25From React To React Native
- 4:03Navigations
- 4:14Async Storage
- 6:46Leading Options for Using React Native
- 11:36React Native Dom
- 12:28Layout Parity
- 14:01React Native for Windows
- 19:23Package Json
- 21:32Imports
- 29:30Css
- 29:51Styles
- 34:12Accessibility
- 39:55Debugging
- 43:59Live Coding
- 47:24Metro Bundler
- 54:09You Can Also Like Plug in a Device You Get Plug In like Your Android Phone Run It on There but Still Have those Dev Tools up Which Is Really Really Nice so You Can Actually Click and Move Around and See in the Console if Errors Are Coming Up and Anything like that but if if You Start To Develop Too Much on Like Web and Then Try To Go Back and Check It on Mobile and You Get an Error It's It's Difficult To Try To Figure Out Where that Error Entered in So I Made that Mistake Trying To Like Push Forward and Get Things Done Just on the Web Side of Things and Then It Was a Nightmare Going Back to the Mobile and Trying To Figure Out What Was Wrong
- 54:36It's Difficult To Try To Figure Out Where that Error Entered in So I Made that Mistake Trying To Like Push Forward and Get Things Done Just on the Web Side of Things and Then It Was a Nightmare Going Back to the Mobile and Trying To Figure Out What Was Wrong So Definitely Better To Keep Them if You Can't Keep It Open because It It Is Kind of a Drain on the Computer Resources at Least Try like Once a Day To Like Bring It Open Run through Your App Real Quick and See What Happens You Will Need Different Test Suites As Well
- 55:27It's It's Going To Be Totally Different so You'Ll Have Two Completely Different Test Suites any Other Questions Then You Have a Couple Minutes but Yeah that's a Good Question I Don't Think I'M Doing in this Project but I Am So What I Do in a in another Project Is I Bring In Css Files but I Have Two Entry Points so if You'Re Loading It on Web the Entry Point Goes To Like One Index Js File and Then It Basically Just Points Right Back to the Main App File
- 56:34And that's Where You'D Pull those in and You'D Write Normal Css or It Really Could Be Sass-You Just Got To Configure Your Web Pack To Do It Then You Pull those in Mobile It Totally Bypasses that File so They Can Be Pretty Much Identical Files but Just One Has the Css Import and You Would You Can Differentiate Files As Well by Just Putting so It Could Be like App Dot Io Sjs App Dot Android Ijs F Dot Web Dutch Ass and Then When You Go To Import It You Import It as I'M Just Importing App
- 58:05This Is the First Time I Try the Twitter Thing To See if Anybody Wanted To Cool We'Re Good Sometimes People Were Just Shy about like Raising Their Hands so I Wanted To Have another Avenue for Questions but Thank You all So Much for Watching Sorry the Demo Stuff Didn't Work but It Was It Was a Gamble Anyway Hey I Thought It Might Not Work but I Do Get a Lot More Things Working Most of the Time on the Live Coding So Check that Out if You Actually Want To See How this this Works Thanks So Much
related talks
30mJesse Weigel - One Codebase to Rule Them All - Using React Native Everywhere
14mBeyond Mobile: Taking Your React Native App to Desktop and Web
23mThe State of One Codebase For All The Platforms
28mCross-Platform React
50mBuilding Cross Platform Native Mobile Apps using React Native
35mReact Native & Rails, A Single Codebase for Web & Mobile
34mMonorepo: React Web & React Native
18mWrite once, deploy anywhere