Build Responsive Facebook Clone With Pure HTML5 CSS3

Build Responsive Facebook Clone With Pure HTML5 & CSS3, available at $39.99, has an average rating of 5, with 95 lectures, based on 1 reviews, and has 109 subscribers.

You will learn about You will learn Flexbox model master Flexboxs properties and gain skills to enhance your web designs. You will Learn CSS selectors with the help of CSS selectors you will be able to select and target specific elements on your web page. You will Learn CSS Tips and Tricks. You will be able to Master your CSS skills 100% This course is ideal for individuals who are Beginner who wants to learn Website Development It is particularly useful for Beginner who wants to learn Website Development.

Enroll now: Build Responsive Facebook Clone With Pure HTML5 & CSS3

Summary

Title: Build Responsive Facebook Clone With Pure HTML5 & CSS3

Price: $39.99

Average Rating: 5

Number of Lectures: 95

Number of Published Lectures: 95

Number of Curriculum Items: 95

Number of Published Curriculum Objects: 95

Original Price: $64.99

Quality Status: approved

Status: Live

What You Will Learn

You will learn Flexbox model master Flexboxs properties and gain skills to enhance your web designs.

You will Learn CSS selectors with the help of CSS selectors you will be able to select and target specific elements on your web page.

You will Learn CSS Tips and Tricks.

You will be able to Master your CSS skills 100%

Who Should Attend

Beginner who wants to learn Website Development

Target Audiences

Beginner who wants to learn Website Development

Imagine having the knowledge to design and create a website like facebook from scratch. It’s not just about replicating it, it’s all about having the knowledge and skill sets to bring such a website to life.Well, I’m here to teach you HTML, CSS, and web design, by building the Facebook websitestep-by-step.

Welcome to “Mastering HTML5 & CSS3 By Creating Facebook with Pure CSS,” the ultimate course that will give you the ability to build a Facebook-like social networking website using only HTML5 and CSS3. Whether you’re a beginner or have no prior experience, this course is designed to take you from zero to mastery in web design.

Throughout this course, you will dive deep into HTML5 and CSS3, learning the essential tips and tricks required to construct a fascinating website. By following step-by-step video lectures, you will gain hands-on experience and practical skills, enabling you to build a social networking website similar to Facebook.

But the benefits don’t end there. This course goes beyond teaching you how to replicate Facebook’s design. It empowers you to enhance your overall web development skills, equipping you with valuable knowledge that can be applied to any website project. You’ll learn the principles of responsive design, ensuring your website runs and functions flawlessly across various devices, including computers, tablets, and smartphones.

By the end of this course, you’ll have the confidence and expertise to create a remarkable social networking website or any other website using HTML5 and CSS3. So, whether you’re aspiring to become a professional web designer or simply want to expand your skill-set, this course is the perfect choice to unlock your full potential in web development.

Course Curriculum

Chapter 1: Facebook Layout & Flex-Box model

Lecture 1: Course Introduction

Lecture 2: Introduction

Lecture 3: Understanding the Facebook layout

Lecture 4: Creating wrapper for tow main section of the website.mp4

Lecture 5: Understanding The Header Layout

Lecture 6: Creating Header Layout In Html

Lecture 7: Creating Facebook Logo Section In HTML

Lecture 8: Creating Center Nav in HTML

Lecture 9: Right Nav Layout In HTML

Lecture 10: Lets Learn About Simple Basic CSS Selectors

Lecture 11: Getting Started

Lecture 12: Display Flex and Flex-Direction

Lecture 13: Flex-Shrink

Lecture 14: Flex Basis , Flex-Wrap, Flex

Lecture 15: Creating Some Flex Classes

Lecture 16: Adding Left-Div classes

Lecture 17: Adding Center Div Classes

Lecture 18: Adding Right-Div Classes

Lecture 19: Desiging Left Div Section

Lecture 20: Designing Right Div Section

Lecture 21: Desigining Center Div Section

Lecture 22: Justify Content and Align-Items

Lecture 23: 22 Createing Classes of Justfiy & Align-Items

Lecture 24: Designing Right Menu Icons

Lecture 25: Designing Name Wrap

Lecture 26: Hover & Transistion To The Right Menu

Lecture 27: Removing Background Color From Selected Menu

Lecture 28: Creating Span for Notification

Lecture 29: summarize the section 1

Chapter 2: Creating Layout & Combinator & Pseudo Selectors

Lecture 1: Understanding Content Wrapper Html Struture

Lecture 2: Create Layout For Content Wrapper

Lecture 3: Create Post Wrap

Lecture 4: Creating Html Layout For cpost-input-wrap

Lecture 5: Adding Classes and Designing Image

Lecture 6: Creating post wrap

Lecture 7: Box Shadow Property

Lecture 8: Adding Background and Broder-radius

Lecture 9: Designing Create Post Bottom

Lecture 10: Designing cpost-bottom menu

Lecture 11: Adding Color and Giving Center Position

Lecture 12: Nth-Child Selector Pseudo Class Selector

Lecture 13: Creating HTML Layout of Create Popup Box

Lecture 14: Designing the Create Popup Box

Lecture 15: Designing the Create Post Header

Lecture 16: Designing the TextArea

Lecture 17: Creating Create Post Footer Layout in HTML

Lecture 18: Adding The Create Post Footer Classes

Lecture 19: Align the Element of the Create Post Footer

Lecture 20: Designing the Create Post Footer Menu Div

Lecture 21: Designing the Create Post Footer Second Menu

Lecture 22: Creating HTML Stucture of The Middle Section

Lecture 23: Designing The Middle Section

Lecture 24: Creating The Post Button

Lecture 25: Comibinators Selectors

Lecture 26: Lets learn Something new about Label and Input Checkbox

Lecture 27: Adding Label and Checkbox, Applying The Technique

Lecture 28: Adding the Label and Checkbox to Hide & Show The Create Popup Box

Chapter 3: Creating the Post & Root Class and CSS Variable

Lecture 1: Creating the Html Structure of the Post

Lecture 2: Now lets design the Post

Lecture 3: Fixing the Span and Adding the Icons

Lecture 4: Creating the Like,Comment & Share

Lecture 5: Designing Post Nav Top Section

Lecture 6: Root Seudo Class and CSS Variable

Lecture 7: Adding Border And Color and Removing Text-Decoration

Lecture 8: Creating Hover Effect

Lecture 9: Designing the Comment Section

Lecture 10: Align Items In Our Desire Position

Lecture 11: Now we are going to add the Classes inside the CSS

Lecture 12: Design The Section Which We Previously Created

Lecture 13: Addining Padding and the Width Property

Lecture 14: Creating The Section For The User Input

Lecture 15: Understanding The User Input And Contenteditable

Lecture 16: Desiging The Input Section

Lecture 17: Now We Work On Textarea Removing Outline and Adding Placholder etc..

Lecture 18: Empty Pseudo Class & Pseudo Element

Lecture 19: Fixing The TextArea & Changing Color of The Placeholder & Icons

Lecture 20: Now We Are Going to Design The Icons

Chapter 4: Creating Side Sections & Responsive Design

Lecture 1: Creating HTML Structure for The Left-Section

Lecture 2: Adding The Classes of the Left-Section

Lecture 3: Creating CSS Color Variable

Lecture 4: Designing the Left-Section-top list items

Lecture 5: Designing the Icons

Lecture 6: Creating the Left-Section-Bottom

Lecture 7: Designing the Left-Section-Bottom

Lecture 8: Creating The HTML Structure of The Right-Section

Lecture 9: Designing the Rigth-Section

Lecture 10: CSS Unites vh, vw & Linear-gradient

Lecture 11: Understanding the Media Queries

Lecture 12: Sticky Left & Right Section In Our Desire Position

Lecture 13: Creating Dropdown Menu only using CSS

Lecture 14: Creating Html Layout For DropDown Menu

Lecture 15: Makeing Our Site Responsive

Lecture 16: Making Header Section Responsive

Lecture 17: Making Center Section Responsive

Lecture 18: Now Making Site Responsive For Ipad & tablates

Instructors

Meezan ud din
Web Designer Instructor at Udemy

Rating Distribution

1 stars: 0 votes

2 stars: 0 votes

3 stars: 0 votes

4 stars: 0 votes

5 stars: 1 votes

Frequently Asked Questions

How long do I have access to the course materials?

You can view and review the lecture materials indefinitely, like an on-demand channel.

Can I take my courses with me wherever I go?

Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!