Description
Flexbox Simplified is a project-based training course on designing web pages with Flexbox published by famous YouTuber Kevin Powell. Kevin Powell is one of the famous CSS teachers and YouTubers in the field of website design and programming, who works exclusively and project-oriented in the field of CSS language. His YouTube channel has more than 250 thousand subscribers and is one of the most popular YouTube channels in the field of programming and website development. Flexbox is one of the relatively new capabilities of the CSS language, which greatly simplifies the layout of pages compared to the old and traditional methods and creates a lot of flexibility for web developers and designers. Working with Flexbox is very simple, but in large and large dimensions, it may cause difficulties for new programmers.
Flexbox is a semi-modern architecture and mechanism that has changed everything related to website layout. Aligning different parts of the website and determining the exact size of columns and rows dynamically and percentage was one of the big problems of web programmers, which Flexbox has solved to a great extent. Flexbox behaves in a special and new way and is usually a bit difficult for traditional programmers to troubleshoot and debug. Among the most important challenges that programmers face while working with flexbox are balancing and equalizing columns and rows, changing the size and shape of elements individually and in groups, preventing the phenomenon of overflowing elements, aligning elements next to each other. And on each other, responsiveization of elements and columns, change of starting direction from right to left and left to right, etc.
What you will learn in the Flexbox Simplified course:
- Layout of websites with flexbox
- Creating layouts and responsive websites with Flexbox
- Aligning columns and different elements of the website
- Change the size of elements in groups and individually
- Preventing the phenomenon of overflowing elements or overflowing
- Change the starting direction from right to left and left to right
Course details
Publisher: Kevin Powell
teacher: Kevin Powell
English language
Training level: introductory to advanced
Number of courses: 70
Training duration: 4 hours and 42 minutes
Course headings
Welcome to the course!
My approach
The software I’ll be using
The Discord Community
The file structure
Introduction to declaring display: flex
The flex container
The flex items – part 1
The flex items – part 2
The flex items – part 3
The flex items – part 4
A challenge
Introduction to flexing our muscles
flex-direction basics
Collapsing margins
flex-direction – part 2
The order property
flex-grow
flex-shrink
Grow & Shrink Challenge
Grow & Shrink Solution
Another challenge
My solution
Visualizing with our dev tools
Introduction to flex-basis
The basics of flex-basis
flex-basis challenge
flex-basis solution
Introduction to alignment and justification
Justification basics
Justification continued
Justification and flex-direction
align-items basics
align-items: baseline
Aligning and justifying buttons
A simple navigation – challenge
A simple navigation solution
A simple navigation follow-up challenge/solution
A look at align-self
Alignment and Justification form challenge
Alignment and Justification form solution
flex-wrap introduction
The basics of flex-wrap
flex-wrap and flex-direction
flex-wrap challenge
flex-wrap solution
Using flex-wrap with flex-grow and flex-shrink
Layouts with flex-wrap
flex-wrap challenge #2
Solution to the challenge
The flex-flow shorthand
A look at align-content
The place-content shorthand
Introduction to the magic of margins
auto margins and flexbox
Fixing a floating footer
Introduction to gap
the gap property
Creating a fallback for gap
flex-grow, revisited
Pushing flex-grow to its limits
A use case
Introduction to patterns and layouts
Equal columns, every time
Content / Sidebar
Adaptable sidebar
Grid-ish
Combining layouts and patterns
The holy albatross
The end!
Flexbox Simplified course prerequisites
I’m assuming you are comfortable with the basics of writing HTML & CSS.
I won’t be looking at all the CSS involved, but really focusing specifically on the flexbox parts of it.
Course images
Flexbox Simplified course introduction video
Instructions for use and tips
After Extract, view with your favorite Player.
Subtitle: None
Quality: 1080p
download link
Password file(s): www.downloadly.ir
Size
1.34 GB
Be the first to comment