Install and configure the essential VSCode extensions for the Instagram clone project, including ESLint, ES7 React/Redux snippets, and Prettier, to enable linting, formatting, and format on save.

Create app’s folder structure with components, context, helpers, lib, services for Firebase functions, pages, and books, using Tailwind for styling; a seed file will be provided in the next video.

Register your app in Firebase, copy and paste the SDK config to initialize the project, then import and run the seed script to populate Firestore and fix duplicates.

Continue building login page with a two-column responsive layout in tailwindcss, placing an iPhone image with instagram app in 3/5 column and form in 2/5 column at md breakpoints.

Implement a use auth listener hook to track login status with Firebase Auth, persist the user in local storage, and clear it on sign-out for a React Instagram clone.

Create a user.js in the contacts folder and wire it to a user context with useAuthListener. Wrap the app with the user context provider to access login user across routes.

Modify the sidebar by restructuring its folder, creating user and suggestions components, updating imports, and moving files into a dedicated sidebar folder to streamline the React layout.

Pass username and full name as props to the user component, implement prop types validation, and render a loading skeleton before displaying a linked avatar.

Develop the suggestions page in a React app by fetching suggested profiles using the user id from Firebase, and manage loading with a React loading skeleton while data loads.

Create a timeline by building a post component and a usePhotos hook to fetch logged-in user photos, render with React skeleton, and guide users to add photos if none.

Create a getPhotos function in Firebase JS to fetch photos from Firestore for followed users, map data with user details and like status, and prepare timeline content.

Render and display photos in a React app by sorting by date created, newest first, and using a React skeleton loader for loading states.

Create a post component and export a post function, passing content as a prop and defining a prop-types shape for user name, image source, caption, and date created.

Create an image component in a React project by defining src and caption props, validating with prop types, and rendering an image with alt text and spacing tweaks.

Create an actions.js file to toggle photo likes in a firebase firestore collection, updating likes with array union or remove, driven by user context and a heart ui.

Implement protected routes to auto-redirect authenticated users to the dashboard and guard login and signup pages from access when not logged in, using React Router navigation and user props.

Continue working on the profile page by integrating the common header and fetching user photos by user ID from Firebase, while managing photos and followers state.

Develop and finalize the profile header, implement a follow/unfollow toggle with live follower count using Firebase updates, and handle profile picture rendering with default image fallbacks.

Build a photos component for a profile page in a React TailwindCSS Firebase Instagram clone, rendering photo grids with conditional skeletons, image cards, overlays showing likes and comments.