Professional Css 2023 (Flexbox & Grid & Animations & More)

Professional Css 2023 (Flexbox & Grid & Animations & More)
Published 1/2023
MP4 | Video: h264, 1280×720 | Audio: AAC, 44.1 KHz

Master modern CSS in 2023 by building 2 beautiful projects with Flexbox, Grid, Animations & Transitions, and much more!

What you’ll learn

How to code CSS in 2023 by building realistic projects from scratch and seeing how it all fits together

Avoid hundreds of beginner mistakes so the people who have to interact with your code have it easy

Implement simple-to-complex layouts with Flexbox & CSS Grid

Crucial best practices in 2023 that every CSS-coder should know (e.g. use rem instead of px)

Implement awesome CSS animations & transitions

Implement Responsive Web Design (RWD) for mobile, tablet, laptop & desktop with media queries (@media)

Use the most popular CSS pre-processor (Sass/SCSS) and the value it adds

Why people use BEM and differences with coding CSS in React/Vue/Angular

Implement a simple build process for CSS (add vendor prefixes and minify CSS file)

Stop struggling with CSS – it becomes fun once you have mastered things like Flexbox (trust me)

Master all critical concepts for a front-end developer

Tons of easy design tricks you can use to drastically improve the look of your projects

BONUS: By going through the course you’ll naturally improve design and HTML too

Requirements

None required, it’s beginner friendly

Description

Overview

Section 1: Introduction

Lecture 1 Introduction

Lecture 2 IMPORTANT: Project resources (e.g. image URLs)

Section 2: SocialEditor (Project 1)

Lecture 3 Project Introduction

Lecture 4 Setup & Basics

Lecture 5 Header

Lecture 6 VS Code Extension: Live-Server

Lecture 7 Header Animation

Lecture 8 Flexbox

Lecture 9 Overall Structure

Lecture 10 Sidebar

Lecture 11 BEM

Lecture 12 Panel

Lecture 13 Info-Bar

Lecture 14 Editing Component

Lecture 15 Responsiveness

Section 3: BetterPhotos (Project 2)

Lecture 16 Project Introduction

Lecture 17 Setup

Lecture 18 App Structure

Lecture 19 CSS Grid

Lecture 20 Header

Lecture 21 Sass (SCSS Syntax)

Lecture 22 Intro Section

Lecture 23 Upload Section

Lecture 24 Footer

Lecture 25 Gallery

Lecture 26 Steps

Lecture 27 Responsiveness

Lecture 28 Build Process

Section 4: Loose Ends

Section 5: Closing

Lecture 30 Congratulations! (BONUS Lecture)

Front-end developers who want to finally master CSS,Developers who want to learn critical concepts like Flexbox, CSS Grid, Animations & Transitions, and more,Developers who want to know how to build modern websites & web apps with modern CSS,Anyone interacting with CSS – creating/updating their own website, designers who have to touch CSS, etc.