React Native Web Full App Tutorial - Build a Workout App for iOS, Android, and Web

Channel:
United States freeCodeCamp.org
Subscribers:
10,700,000
Published on ● Video Link: https://www.youtube.com/watch?v=_CBYbEGvxYY


Duration: 3:41:03
298,307 views
3,900

Learn to use React Native for Web to create a workout app that works on Android, iOS, and the web. The app uses Mobx, Typescript, React Navigation, React Hooks, AsyncStorage / Localstorage, and more. Once the app is complete, you will learn how to deploy it to Netlify.

💻 Code: https://github.com/benawad/react-native-web-series

⭐️ Contents ⭐️
⌨️ (0:00:00) Setting Up a React Native Web Project
⌨️ (0:09:04) Setting Up React Native Hooks
⌨️ (0:15:03) Setting Up a React Native Web Monorepo
⌨️ (0:28:24) Configuring React Native for Yarn Workspaces
⌨️ (0:39:58) How to use Mobx with React Hooks
⌨️ (0:49:15) Navigation in React Native Web
⌨️ (1:03:28) Styling a Component in React Native Web
⌨️ (1:27:40) Mobx Root Store
⌨️ (1:45:20) Workout Timer with Mobx
⌨️ (2:11:20) React Router with React Native Web
⌨️ (2:22:45) How to Persist Mobx Stores
⌨️ (2:30:47) Storing and Displaying Workout History
⌨️ (2:54:33) React Router Params in React Native Web
⌨️ (3:17:30) Floating Action Button React Native Web
⌨️ (3:34:45) Deploy React Native Web to Netlify

⭐️ Links: ⭐️
🔗 https://stronglifts.com/apps/
🔗 https://github.com/necolas/react-native-web/blob/master/docs/guides/client-side-rendering.md

🔗 VSCode settings used: https://gist.github.com/benawad/1e9dd01994f78489306fbfd6f7b01cd3

Course from Ben Awad. Check out his YouTube channel: https://www.youtube.com/benawad97

--

Learn to code for free and get a developer job: https://www.freecodecamp.org

Read hundreds of articles on programming: https://medium.freecodecamp.org

And subscribe for new videos on technology: https://youtube.com/subscription_center?add_user=freecodecamp



Other Videos By freeCodeCamp.org


2019-04-02ReasonML Programming - Full Course for Beginners
2019-03-29Develop an AI to play Connect Four - Python Tutorial
2019-03-27Python Online Multiplayer Game Development Tutorial
2019-03-27React Native Web Deployment (P7D8) - Live Coding with Jesse
2019-03-25Create a C# Application from Start to Finish - Complete Course
2019-03-22React Native with Hooks (P7D7) - Live Coding with Jesse
2019-03-212d Game Dev Unity Tutorial - Hyper Casual Game
2019-03-20React Native Web Game Styles (P7D6) - Live Coding with Jesse
2019-03-19Learn Vue.js - Full Course for Beginners - 2019
2019-03-15React Native Web Game Logic Part 2 (P7D5) - Live Coding with Jesse
2019-03-13React Native Web Full App Tutorial - Build a Workout App for iOS, Android, and Web
2019-03-11How to Make a Custom Website from Scratch using WordPress (Theme Development) - 2019 Tutorial
2019-03-08React Native Web Game Logic (P7D4) - Live Coding with Jesse
2019-03-07How to Code Like a Pro (with Dylan Israel)
2019-03-06React Native Web UI Building (P7D3) - Live Coding with Jesse
2019-03-04Intro to Data Science - Crash Course for Beginners
2019-03-01React Native Web Setup Part 2 (P7D2) - Live Coding with Jesse
2019-02-27Foundation CSS Framework Tutorial - Crash Course for Beginners
2019-02-25Unity 3D Tutorial - Beat Em Up Fight Game
2019-02-21MongoDB with Python Crash Course - Tutorial for Beginners
2019-02-19Python Algorithms for Interviews


Tags:
react native web
react native
mobx
react native web tutorial
react native web app
react native web course
react native for beginners
typescript
react native tutorial
netlify
react
deploy to netlify
components
react hooks
react navigation
javascript