The Complete Flexbox Tutorial: Learn CSS3 Flexbox in 2018

  • CategoryOther
  • TypeTutorials
  • LanguageEnglish
  • Total size314.1 MB
  • Uploaded Bymfp19
  • Downloads258
  • Last checkedApr. 21st '18
  • Date uploadedApr. 21st '18
  • Seeders 1
  • Leechers1
You must create an Account to download torrent!

Infohash : 1C8ABDD49A284768D8549DBFB69E936779133E73

UDEMY COURSE:




Description


After this course, you'll be able to use Flexbox to...

vertically align any element
create modern grids
take up remaining space
add spacing between elements
implement complete site layouts
and much more!


More goodies inside this course:

I'll answer all questions you may have along the way to make sure you reach your learning goals
I've added manual, high-quality captions (CC) to this course
To see Flexbox in practice, 3 mini-projects will manifest your skills and enable you to use Flexbox productively in future web design projects.


What Students Say About Me (taken from other courses of mine)

Such a great course. second one for me with Peter Sommerhoff.
a great Instructor, uses very easy way to explain the materials.

- Ahmed



I absolutely LOVE this course, it teaches everything you need in details
and more! They really do listen to their students and answer as fast as
the road runner. Thanks so much for posting your course and I am
looking forward other courses!

- Ana



Great course, Peter explained it thoroughly, and he answers any questions within a day.

- Dunja



The course covered the required information quickly and concisely
without fluff or wasted motion. It provides sufficient pointers to
additional information and documentation. I thought it was a good
value.

- Robert



I'm glad to have received such great reviews from my students -- and I'll do my best to provide you with the best learning I can as well.



Check out the free preview videos below.

I look forward to seeing you inside :)





***



In this tutorial, you'll learn to use each and every Flexbox property:

Styling flex containers:

flex-direction
justify-content
align-items
flex-wrap
align-content
Then individual flex items:

order
align-self
flex-grow
flex-shrink
flex-basis
flex
At the end, we'll look at real-world Flexbox examples to see what kinds of layouts can be achieved:

Simple grids with Flexbox where all columns in a row have the same size
More advanced Flexbox grids where columns can have arbitrary sizes
Vertical centering to vertically align any element
Media objects, the popular OOCSS pattern
The Holy Grail Layout, a complete site layout with sidebars and sticky footer


As a bonus, this course includes a complete Flexbox Cheat Sheet that you can use to recap all you've learned and to refer back to while using Flexbox.

Additionally, I included the code for a Flexbox demo showcase -- which is like an interactive cheat sheet for you to see in the browser that contains every property and every layout example from this tutorial.

Who is the target audience?
Web designers and developers who want to improve their frontend skills
Designers who want to increase their productivity
Anyone who wants to keep up with newest developments in web standards



For more free Udemy courses: My Free Planet

Please Seed the torrent as long as you can.

Files:

[My Free Planet Club] Udemy - The Complete Flexbox Tutorial Learn CSS3 Flexbox in 2017
  • [My Free Planet].url (0.1 KB)
  • [My Free Planet.club].txt (1.1 KB)
    • 05 Flexbox in Practice
    • 021 Flexbox Cheat Sheet.html (1.4 KB)
    • 017 Flexbox Grids_ Creating Responsive Galleries #2 (Extra Flexibility)-subtitle-en.vtt (7.2 KB)
    • 018 Real Vertical Centering with Flexbox (no more vertical-align)-subtitle-en.vtt (7.4 KB)
    • 017 Flexbox Grids_ Creating Responsive Galleries #2 (Extra Flexibility)-subtitle-en.srt (8.3 KB)
    • 018 Real Vertical Centering with Flexbox (no more vertical-align)-subtitle-en.srt (8.4 KB)
    • 016 Flexbox Grids_ Creating Responsive Galleries #1 (Minimal Code)-subtitle-en.vtt (12.8 KB)
    • 020 The Holy Grail Layout-subtitle-en.vtt (14.0 KB)
    • 016 Flexbox Grids_ Creating Responsive Galleries #1 (Minimal Code)-subtitle-en.srt (14.6 KB)
    • 019 The Media Object Pattern-subtitle-en.vtt (15.2 KB)
    • 020 The Holy Grail Layout-subtitle-en.srt (15.9 KB)
    • 019 The Media Object Pattern-subtitle-en.srt (17.3 KB)
    • 021 flexbox-cheat-sheet.pdf (1.0 MB)
    • 018 Real Vertical Centering with Flexbox (no more vertical-align).mp4 (14.4 MB)
    • 017 Flexbox Grids_ Creating Responsive Galleries #2 (Extra Flexibility).mp4 (17.5 MB)
    • 016 Flexbox Grids_ Creating Responsive Galleries #1 (Minimal Code).mp4 (25.9 MB)
    • 020 The Holy Grail Layout.mp4 (29.9 MB)
    • 019 The Media Object Pattern.mp4 (37.6 MB)
    04 Designing Flex Items
    • 011 order - Reordering Flex Items-subtitle-en.vtt (3.4 KB)
    • 012 align-self - Stubborn Children-subtitle-en.vtt (3.7 KB)
    • 011 order - Reordering Flex Items-subtitle-en.srt (3.9 KB)
    • 012 align-self - Stubborn Children-subtitle-en.srt (4.2 KB)
    • 014 flex-shrink - Shrinking Flex Items-subtitle-en.vtt (7.0 KB)
    • 014 flex-shrink - Shrinking Flex Items-subtitle-en.srt (7.9 KB)
    • 013 flex-grow - Letting Children Grow-subtitle-en.vtt (9.3 KB)
    • 015 flex-basis - Setting the Base Size-subtitle-en.vtt (9.7 KB)
    • 013 flex-grow - Letting Children Grow-subtitle-en.srt (10.5 KB)
    • 015 flex-basis - Setting the Base Size-subtitle-en.srt (10.9 KB)
    • 012 align-self - Stubborn Children.mp4 (6.3 MB)
    • 011 order - Reordering Flex Items.mp4 (6.4 MB)
    • 014 flex-shrink - Shrinking Flex Items.mp4 (13.6 MB)
    • 013 flex-grow - Letting Children Grow.mp4 (16.7 MB)
    • 015 flex-basis - Setting the Base Size.mp4 (19.3 MB)
    03 Styling Flex Containers
    • 010 align-content - Justifying Content Along the Cross Axis-subtitle-en.vtt (3.8 KB)
    • 010 align-content - Justifying Content Along the Cross Axis-subtitle-en.srt (4.3 KB)
    • 008 align-items - Aligning Items Along the Cross Axis-subtitle-en.vtt (4.8 KB)
    • 008 align-items - Aligning Items Along the Cross Axis-subtitle-en.srt (5.4 KB)
    • 009 flex-wrap - Multiple Rows & Wrapping Inside Flex Containers-subtitle-en.vtt (5.4 KB)
    • 009 flex-wrap - Multiple Rows & Wrapping Inside Flex Containers-subtitle-en.srt (6.1 KB)
    • 007 justify-content - Justifying Items Along the Main Axis-subtitle-en.vtt (7.7 KB)
    • 007 justify-content - Justifying Items Along the Main Axis-subtitle-en.srt (8.6 KB)
    • 006 flex-direction - Creating Row & Column Layouts-subtitle-en.vtt (9.4 KB)
    • 006 flex-direction - Creating Row & Column Layouts-subtitle-en.srt (10.7 KB)
    • 010 align-content - Justifying Content Along the Cross Axis.mp4 (6.4 MB)
    • 008 align-items - Aligning Items Along the Cross Axis.mp4 (9.3 MB)
    • 009 flex-wrap - Multiple Rows & Wrapping Inside Flex Containers.mp4 (10.4 MB)
    • 007 justify-content - Justifying Items Along the Main Axis.mp4 (12.7 MB)
    • 006 flex-direction - Creating Row & Column Layouts.mp4 (14.0 MB)
    06 Where to go from here___
    • 022 A Quick Recap & What's Next-subtitle-en.vtt (4.6 KB)
    • 022 A Quick Recap & What's Next-subtitle-en.srt (5.2 KB)
    • 023 Bonus Lecture_ Skyrocket Your Web Design Skills!.html (7.7 KB)
    • 022 showcase.zip (71.6 KB)
    • 022 A Quick Recap & What's Next.mp4 (13.1 MB)
    01 Welcome To The Flexbox Course!
    • 001 How To Make The Most Of This Course-subtitle-en.vtt (5.5 KB)
    • 001 How To Make The Most Of This Course-subtitle-en.srt (6.2 KB)
    • 001 How To Make The Most Of This Course.mp4 (17.2 MB)
    02 Let's Dive Right In_ Learn The Flexbox Basics
    • 004 How Do I Use Flexbox_-subtitle-en.vtt (5.5 KB)
    • 003 What About Browser Support for Flexbox_-subtitle-en.vtt (6.0 KB)
    • 004 How Do I Use Flexbox_-subtitle-en.srt (6.3 KB)
    • 005 Flexbox Principles-subtitle-en.vtt (6.4 KB)
    • 003 What About Browser Support for Flexbox_-subtitle-en.srt (6.8 KB)
    • 005 Flexbox Principles-subtitle-en.srt (7.2 KB)
    • 002 What is Flexbox and Why Should I Use It_-subtitle-en.vtt (7.8 KB)
    • 002 What is Flexbox and Why Should I Use It_-subtitle-en.srt (8.8 KB)
    • 004 showcase.zip (71.6 KB)
    • 004 How Do I Use Flexbox_.mp4 (8.5 MB)
    • 005 Flexbox Principles.mp4 (9.8 MB)
    • 003 What About Browser Support for Flexbox_.mp4 (11.1 MB)
    • 002 What is Flexbox and Why Should I Use It_.mp4 (12.5 MB)
  • ~uTorrentPartFile_13A18C6F.dat (54.7 KB)

Code:

  • UDP://TRACKER.LEECHERS-PARADISE.ORG:6969/ANNOUNCE
  • UDP://TRACKER.COPPERSURFER.TK:6969/ANNOUNCE
  • UDP://TRACKER.OPENTRACKR.ORG:1337/ANNOUNCE
  • UDP://TRACKER.ZER0DAY.TO:1337/ANNOUNCE
  • UDP://EDDIE4.NL:6969/ANNOUNCE
  • UDP://TRACKER.LEECHERS-PARADISE.ORG:6969/ANNOUNCE
  • UDP://TRACKER.COPPERSURFER.TK:6969/ANNOUNCE
  • UDP://TRACKER.OPENTRACKR.ORG:1337/ANNOUNCE
  • UDP://TRACKER.ZER0DAY.TO:1337/ANNOUNCE
  • UDP://EDDIE4.NL:6969/ANNOUNCE
  • UDP://TRACKER.LEECHERS-PARADISE.ORG:6969/ANNOUNCE
  • UDP://TRACKER.COPPERSURFER.TK:6969/ANNOUNCE
  • UDP://TRACKER.OPENTRACKR.ORG:1337/ANNOUNCE
  • UDP://TRACKER.ZER0DAY.TO:1337/ANNOUNCE
  • UDP://EDDIE4.NL:6969/ANNOUNCE