

Github GitHub - karlhadwen/instagram: Subscribe to my YouTube channel: https://b...
source link: https://github.com/karlhadwen/instagram
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

Building Instagram from Scratch Using React, Tailwind CSS, Firebase (11+ Hour Tutorial Here: https://youtu.be/AKeaaa8yAAk)
Extended paid version here (3 hours 30 mins extra): https://gum.co/react-instagram-clone
Summary
This application (Instagram clone) was built using React (Custom Hooks, Context), Firebase & Tailwind CSS. I have built the following pages within this application: login, sign up, dashboard & lastly the user profile page. There are four different pages, some are public and some are private with auth listeners. Firebase firestore handles all the data, and that data is retrieved using a custom hook.
I used Tailwind CSS for this project and I really enjoyed using it. I used styled components in my previous project, but I have now converted all my projects to Tailwind CSS for ease of use. This will be my last project using Firebase as it's far too complex to use and far too complex to test (especially with Cypress). With Jest, it's also tedious to test Firebase as there's no great mocking library, so you end up just repeating yourself in the tests a lot.
Extended Videos - Tailwind CSS Responsive, React Testing Library & Cypress Tests
If you're interested in the paid version of this course which includes making this application responsive and testing via React Testing Library and Cypress, you can find that here: https://gum.co/react-instagram-clone - a purchase shows your appreciation and allows me to spend more time making videos
Subscribe
Subscribe to my YouTube channel here: http://bit.ly/CognitiveSurge where I build projects like this! And don't forget, you can contribute to this project (highly encouraged!).
Recommend
-
79
README.md Building Todoist from Scratch Using React (Custom Hooks, Context), Firebase & React Testing Library (
-
17
https://www.youtube.com/watch?v=nxuSMtWGZjc&ab_channel=NDCConferencesAbout this pageOur systems have detected unusual traffic from your computer network. This page checks to see if it's really you sending the...
-
15
https://www.youtube.com/watch?v=mUs6elEwo_U&ab_channel=MichaelGillilandAbout this pageOur systems have detected unusual traffic from your computer network. This page checks to see if it's really you sending th...
-
13
https://www.youtube.com/watch?v=mT1viL5Uqc0&ab_channel=nojafAbout this pageOur systems have detected unusual traffic from your computer network. This page checks to see if it's really you sending the requests,...
-
19
https://www.youtube.com/watch?v=ghqz3VO_Qo4&t=208s&ab_channel=.NETFoundationAbout this pageOur systems have detected unusual traffic from your computer network. This page checks to see if it's really you s...
-
19
https://www.youtube.com/watch?v=a90qwyS1Suc&ab_channel=dotNETAbout this pageOur systems have detected unusual traffic from your computer network. This page checks to see if it's really you sending the requests...
-
8
If you are a programmer/web developer then you definitely should follow these YouTube channel. PS. The list is not in any specific order FreeCodeCamp
-
11
Top 5 YouTube Channels Every UI Designer Should Subscribe.As designers, we have to learn and grow our knowledge so we become better every day and by subscribing to these creators you’ll be increasing...
-
7
Weekend poll: What would it take to get you to subscribe to YouTube Premium? By Will Sattelberg Published 12 hours ago ...
-
7
Instagram Channels: dear Instagram, we (still) didn’t ask to subscribeYou’d think they would have learned their lesson by now.
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK