Build the original Instagram with React Native & Firebase

Rusty Courses, Experienced full stack web & mobile dev

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
52 Lessons (6h 31m)
    • 1. Intro

      0:48
    • 2. Setup Firebase project

      3:34
    • 3. Setup React Native app

      4:20
    • 4. Connect firebase project to react app

      4:49
    • 5. Intro to firebase auth

      1:55
    • 6. Using email and pass to register user

      5:21
    • 7. Check if user is logged in and how to sign out

      4:40
    • 8. Using Facebook login

      12:19
    • 9. Using email and pass login with TextInput

      14:41
    • 10. Intro to firebase database

      1:58
    • 11. How to set, update and delete data in firebase

      5:31
    • 12. Fetch data from the database

      5:14
    • 13. Firebase security rules

      7:39
    • 14. Structure Firebase database

      1:50
    • 15. Intro to firebase storage

      2:09
    • 16. Intro to firebase storage securty rules

      3:58
    • 17. Create and setup app from the command line

      7:38
    • 18. Adding base components to each screen

      2:39
    • 19. Starting to setup the feed screen

      6:37
    • 20. Adding a FlatList to the feed screen

      6:26
    • 21. Adding some styling to our FlatList

      3:40
    • 22. Create Firebase project and connect to our app

      3:28
    • 23. Structure database for project

      7:26
    • 24. Begin to make calls to the database to fetch information

      10:41
    • 25. Update our FlatList to user data from our database

      11:53
    • 26. Add security rules to app (part one)

      9:55
    • 27. Add security rules to app (part two)

      5:25
    • 28. Check if user is logged in

      6:27
    • 29. Make sure user is logged in whilst creating Profile UI

      5:46
    • 30. Building out Profile UI

      14:41
    • 31. Creating our profile modal screen & adding back button

      24:26
    • 32. Adjust comment file & add button to open comment screen

      2:16
    • 33. Building the upload screen part one

      4:23
    • 34. Building the upload screen part two

      10:22
    • 35. Building the upload screen part three

      9:35
    • 36. Building the upload screen part four

      10:01
    • 37. Building the upload screen part five

      15:53
    • 38. Create function to process photo and add to feed

      11:39
    • 39. Update FlatList to display uploaded photos

      3:16
    • 40. Create component to show list of photos across different screens

      14:57
    • 41. Building comments screen part 1

      6:29
    • 42. Building comments screne part 2

      14:08
    • 43. Building comments screen part 3

      8:27
    • 44. Building comments screen part 4

      10:17
    • 45. Profile to fetch details from database

      4:28
    • 46. Add edit profile form to profile page

      10:21
    • 47. Create save profile function

      2:39
    • 48. New component to contain login and sign up

      7:36
    • 49. Add login and signup buttons to component

      6:05
    • 50. Create login and signup functions

      16:32
    • 51. Create user object and test signup function

      3:50
    • 52. Final adjustments to the app

      9:29
11 students are watching this class

Project Description

You are now ready for the next step. Using what you have learnt in this course and following its steps you can now make your own version of the photo feed app.

Student Projects