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.
I clone Instagram by seeing karl's videos(https://www.youtube.com/watch?v=mDgEqoQUBgk).
in src:
-
components:
- posts
- sidebar
-
constants
-
contex we have roots.
-
helpers
-
hooks
-
pages
-
lib (firebase is going to live in here)
-
services (firebase functions in here)
-
styles (tailwindcss folder(app/tailwind))
Client side rendered app: react (cra)
-
our database is on firebase
-
external dependency: react-loading-skeleton
- tailwindcss