CSS Mastery Course 2024

Focused View

Olga Neely

4:02:18

84 View

1. Introduction

1. Introduction.html

2. Project setup and installations

1. What to install.mp4

05:18

2. Set up a project.mp4

05:20

Files.zip

3. Basic and intermediate CSS

1. How does CSS actually work.mp4

03:57

2. Box model.mp4

07:31

3. Display properties.mp4

07:51

4. Position properties.mp4

28:02

5. Combinators.mp4

10:08

6. Selectors.mp4

18:26

7. Pseudo elements.mp4

08:52

8. Pseudo classes.mp4

06:21

Files.zip

4. CSS methodologies

1. Block element modifier - BEM.mp4

09:12

2. Object-Oriented CSS - OOCSS.mp4

04:09

3. Atomic CSS.mp4

05:50

4. Scalable and Modular Architecture for CSS (SMACSS).mp4

10:46

5. Reasonable System for CSS Stylesheet Structure (RSCSS).mp4

04:35

6. Inverted Triangle CSS (ITCSS).mp4

04:29

Files.zip

5. Figma for frontend developers

1. Figma overview and tips.mp4

20:23

Files.zip

6. Responsive design

1. Responsive design.mp4

00:35

2. Media Queries.mp4

04:51

3. Container Queries.mp4

01:57

4. Flexbox.mp4

26:06

5. Grid.mp4

12:45

Files.zip

7. SASS

1. What is SASS.html

2. Nesting.mp4

01:23

3. Variables.mp4

01:14

4. Partials & Modules.mp4

02:00

5. Mixins.mp4

04:14

6. Inheritance.mp4

01:38

8. Functions.mp4

02:16

9. LightDark mode using CSS.mp4

02:36

Files.zip

8. Transitions and animations

1. Transitions and animations.mp4

05:28

Files.zip

9. Additional content Fun CSS tricks and tips you should know

1. Truncate Strings in CSS.mp4

02:31

2. Full Height Containers.mp4

01:20

3. New Color Models.mp4

04:02

4. Handy Color Functions.mp4

02:35

5. Variable Fonts and Typography Innovations.html

6.1 Notion Documentation.html

7. Viewport Units.mp4

02:56

Files.zip

10. Additional content books to read

1. Books that I highly recommend you to read in order to become a better developer.html

11. Next steps!

1. Not a goodbye but a see you later!.mp4

00:41

Description

Become a CSS expert by learning all the necessary theory with a huge amount of practice!

What You'll Learn?

Repeat basic CSS theory before going to more advanced concepts
Learn how to do responsive design with CSS with flexbox, grid, media queries
How to install and use SASS. Including mixins, functions, variables, etc
How to work with figma to create a pixel-perfect match with your mockup
Master CSS methodologies
Create animations and transition effects
Discover how to create animations and extend your project's styling capabilities
Learn how to ACTUALLY develop something that is used in real projects using HTML and CSS

Who is this for?

For any developers seeking to become CSS experts and achieve proficiency as frontend developers, this course is the perfect fit.

For mid level developers who don't feel confident enough with CSS.

For anyone who thinks that CSS is weird, buggy or hard.

What You Need to Know?

This course is perfect for beginner and intermediate level developers who want to dive deeper into frontend and learn more about CSS.

In order to use SASS we have to create a javascript project, so you will have to know some HTML, CSS and a bit of JavaScript to attend.

More details

Description
Master CSS fundamentals and advanced techniques in our comprehensive course. Learn responsive website design, Flexbox, Grid, media queries, Sass for enhanced CSS, project-based learning, Figma integration, CSS methodologies for scalability, theming, and dynamic animations. Build your skills to create stunning, responsive web experiences.

What You Will Learn:
Basic CSS Theory: We'll start with a quick refresher on the essentials to ensure a solid foundation before diving into advanced topics.
Responsive Design: Learn the principles of creating responsive layouts that look stunning on any device.
Flexbox and Grid: Master these powerful layout modules to create flexible and structured designs.
Media Queries: Understand how to use media queries effectively to adjust your designs for different screen sizes.
CSS Preprocessors: Get introduced to preprocessors like Sass, enhancing your CSS with additional functionality.
Sass Mixins and Functionality: Learn to write mixins and utilize the full potential of Sass to streamline your CSS workflow.
Project-Based Learning: Apply your knowledge by creating multiple projects with responsive designs.
Figma Integration: Gain proficiency in using Figma to develop accurate representations of your designs.
CSS Methodologies: Explore various methodologies to write maintainable and scalable CSS.
Theming: Discover how to implement theming to create versatile and customizable web applications.
Transitions, Animations: Learn advanced techniques to add dynamic transitions, animations, and custom effects.
Who this course is for:
For any developers seeking to become CSS experts and achieve proficiency as frontend developers, this course is the perfect fit.
For mid level developers who don't feel confident enough with CSS.
For anyone who thinks that CSS is weird, buggy or hard.

User Reviews

Rating

average 0

Total votes0

Focused display

I've spent around 7 years improving my skills as a software engineer, working across diverse environments and with various clients. Throughout my journey, frontend development has become my true passion. I've dedicated myself to mastering this field, and now I'm excited to share my experience with you and help you become an expert too!

Udemy

View courses Udemy

Students take courses primarily to improve job-related skills.Some courses generate credit toward technical certification. Udemy has made a special effort to attract corporate trainers seeking to create coursework for employees of their company.