Chapters (58)
- 0:00Introduction
- 1:25What is React Native?
- 3:45Expo
- 4:22Setup with Expo
- 6:17Setting up a custom app
- 10:17Setting up Android Studio
- 12:03The directory structure
- 12:42Setting up linting
- 14:33Setting up Prettier
- 16:35Debugging
- 18:17Native components
- 19:00Core components
- 20:17JSX
- 21:29Working with components
- 21:57What are components
- 23:08Creating our first component
- 26:50Styling basics
- 31:17Layout props
- 32:37The current weather screen
- 40:17Adding icons to the screen
- 42:40Components
- 46:01Reviewing what we have learnt so far
- 48:52Creating the upcoming weather component
- 52:17Introducing lists
- 1:19:17Implementing our list
- 1:09:10Key extractors
- 1:11:41Other FlatList props
- 1:15:01Styling our FlatList
- 1:19:23Images
- 1:22:31Using an image in the upcoming weather component
- 1:24:10ImageBackground
- 1:26:05Props
- 1:35:17Refactoring what we have done so far
- 1:43:04Implementing the city screen
- 2:00:17Refactoring the city screen
- 2:15:32Refactoring the current weather screen
- 2:26:25Introducing Navigation
- 2:34:37Implementing tabs in our app
- 2:40:02Styling our tabs
- 2:47:27Extracting the tabs
- 3:06:55State
- 3:15:07The useState hook
- 3:19:24Hooks
- 3:23:24The useEffect hook
- 3:32:05Adding a loading state
- 3:38:31Using the open weather map api
- 3:39:31Getting the users location
- 3:47:36Seting up fetching the api data
- 3:52:38Fetching the Api data
- 4:01:17Making our own hook
- 4:05:17Passing the data to our components
- 4:08:42Updating current weather to use the data
- 4:14:32Updating the upcoming weather to use the data
- 4:18:17Installing Moment
- 4:21:17Updating the city component
- 4:25:53Creating the error screen
- 4:31:42Some last refactoring
- 4:33:59Bonus material
Show the creator's full description
Master React Native with this comprehensive course, covering everything from the basics of setup and components to advanced topics like navigation and fetching API data. Learn to build a weather app from scratch, complete with a sleek user interface and real-time data integration, while exploring concepts like state management, hooks, and styling.
💻 Code: https://github.com/Em01/weather-app-demo
✏️ Course created by @codecupdev
🔗 Instagram: https://www.instagram.com/codecup_dev/
🔗 Twitter: https://twitter.com/codecupdev
❤️ Try interactive React courses we love, right in your browser: https://scrimba.com/freeCodeCamp-React (Made possible by a grant from our friends at Scrimba)
⭐️ Contents ⭐️
⌨️ (0:00:00) Introduction
⌨️ (0:01:25) What is React Native?
⌨️ (0:03:45) Expo
⌨️ (0:04:22) Setup with Expo
⌨️ (0:06:17) Setting up a custom app
⌨️ (0:10:17) Setting up Android Studio
⌨️ (0:12:03) The directory structure
⌨️ (0:12:42) Setting up linting
⌨️ (0:14:33) Setting up Prettier
⌨️ (0:16:35) Debugging
⌨️ (0:18:17) Native components
⌨️ (0:19:00) Core components
⌨️ (0:20:17) JSX
⌨️ (0:21:29) Working with components
⌨️ (0:21:57) What are components
⌨️ (0:23:08) Creating our first component
⌨️ (0:26:50) Styling basics
⌨️ (0:31:17) Layout props
⌨️ (0:32:37) The current weather screen
⌨️ (0:40:17) Adding icons to the screen
⌨️ (0:42:40) Components
⌨️ (0:46:01) Reviewing what we have learnt so far
⌨️ (0:48:52) Creating the upcoming weather component
⌨️ (0:52:17) Introducing lists
⌨️ (1:19:17) Implementing our list
⌨️ (1:09:10) Key extractors
⌨️ (1:11:41) Other FlatList props
⌨️ (1:15:01) Styling our FlatList
⌨️ (1:19:23) Images
⌨️ (1:22:31) Using an image in the upcoming weather component
⌨️ (1:24:10) ImageBackground
⌨️ (1:26:05) Props
⌨️ (1:35:17) Refactoring what we have done so far
⌨️ (1:43:04) Implementing the city screen
⌨️ (2:00:17) Refactoring the city screen
⌨️ (2:15:32) Refactoring the current weather screen
⌨️ (2:26:25) Introducing Navigation
⌨️ (2:34:37) Implementing tabs in our app
⌨️ (2:40:02) Styling our tabs
⌨️ (2:47:27) Extracting the tabs
⌨️ (3:06:55) State
⌨️ (3:15:07) The useState hook
⌨️ (3:19:24) Hooks
⌨️ (3:23:24) The useEffect hook
⌨️ (3:32:05) Adding a loading state
⌨️ (3:38:31) Using the open weather map api
⌨️ (3:39:31) Getting the users location
⌨️ (3:47:36) Seting up fetching the api data
⌨️ (3:52:38) Fetching the Api data
⌨️ (4:01:17) Making our own hook
⌨️ (4:05:17) Passing the data to our components
⌨️ (4:08:42) Updating current weather to use the data
⌨️ (4:14:32) Updating the upcoming weather to use the data
⌨️ (4:18:17) Installing Moment
⌨️ (4:21:17) Updating the city component
⌨️ (4:25:53) Creating the error screen
⌨️ (4:31:42) Some last refactoring
⌨️ (4:33:59) Bonus material
🎉 Thanks to our Champion and Sponsor supporters:
👾 Nattira Maneerat
👾 Heather Wcislo
👾 Serhiy Kalinets
👾 Erdeniz Unvan
👾 Justin Hual
👾 Agustín Kussrow
👾 Otis Morgan
--
Learn to code for free and get a developer job: https://www.freecodecamp.org
Read hundreds of articles on programming: https://freecodecamp.org/news
Description and video by freeCodeCamp.org. This page is an independent companion view; the video is embedded from YouTube.