Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

YouTube

React Social Media App Design - Dark-Light Mode and Responsive with HTML CSS

Lama Dev via YouTube

Overview

Learn to design a responsive social media application using React, HTML, and CSS in this comprehensive tutorial video. Master the implementation of dark and light modes, React Hooks, Context API, and responsive design techniques. Follow along as the instructor guides you through creating login and registration pages, setting up React Router Dom with protected routes, and designing various UI components including the navbar, left and right menus, user stories, posts, comments, and profile pages. Gain insights into CSS sticky positioning, implementing dark mode with React and Sass, and utilizing the Context API. Conclude with a deep dive into responsive design using React Sass and CSS media queries, equipping you with the skills to build modern, user-friendly social media interfaces.

Syllabus

Introduction
Installation
React Login Page Design
React Register Page Design
React Router Dom Tutorial v6.4
React Router Dom Protected Route Auth
Social Media Website Navbar UI Design
Social Media Website Left Menu UI Design
CSS Sticky Positioning Tutorial
Right Menu UI Design
How to Create Dark Mode using React and Sass
React Dark Mode with Context API
Understanding React Context API
Social Media User Story Section UI Design
Social Media User Post UI Design
Social Media User Comments UI Design
Social Media Website User Profile Page UI Design
React Sass Responsive Design Tutorial CSS media query
Outro

Taught by

Lama Dev

Reviews

Start your review of React Social Media App Design - Dark-Light Mode and Responsive with HTML CSS

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.