Course Information
Registration period
Year-round Recruitment
Course Level
Study Mode
Duration
11 Hour(s) 56 Minute(s)
Language
English
Taught by
Juan Pablo De la torre Valdez
Rating
1 views
Course Overview
Create Modern Web Layouts w/ CSS Grid & Flexbox While Building +10 Real World Projects - SASS & CSS Transitions Included
CSS Grid & Flexbox are the Present & Future for Web Layouts
in this course you're going to learn both tecnologies, and we're building several examples including a AirBNB Clone, Udemy & Netflix Login Page, plus several other projects (the video is enabled to watch for free where you can view all the projects)
We will start with flexbox, a great technology for building one-dimensional layouts, with Flexbox you can create responsive websites really easily, you're going to learn the basics of flexbox, from flex container, flex direction, flex wrap, flex flow and others.
Then we're going to build some projects with Flexbox so you can understand it's features more easily
Also we're going to integrate some nice Tools with Flexbox, such as SASS, NPM , Gulp and also some Advanced CSS with Transitions and Custom Properties.
Then we're moving into CSS Grid aka GRID or CSS Grid Layout, the most advanced way to create a web layout natively in CSS, with CSS Grid you can create more advanced / responsive layouts with breeze, no frameworks are needed anymore!
We're going to build several examples with CSS Grid, plus a Clone of the Website AirBNB and other projects that you can use for your clients or your personal use!
Course Content
- 10 section(s)
- 117 lecture(s)
- Section 1 Introduction to the Course - What we're building & the tools that we need
- Section 2 Flexbox 101 - The Basics of Flexbox
- Section 3 Building a Card Element
- Section 4 Building a Freelancer Website
- Section 5 Buiding Nav Menus with Flexbox
- Section 6 Building a Blog Entry Layout (Holy Grail)
- Section 7 Building a Blog Homepage Layout
- Section 8 Building the Udemy Homepage
- Section 9 Building the Netflix Login Page
- Section 10 Building an Admin Panel with Flexbox
What You’ll Learn
- Learn Flexbox & CSS Grid to create amazing / responsive web layouts
- CSS Grid & Flexbox are the present and the future for web layouts, you will master them in this course
- You will also learn how to implement SASS, Gulp, JavaScript ES6 and other tools in your Designs
- We're building several examples, each is going to be different so you can master this tools
Reviews
-
RRoberto McGhie
The tutor is speaking too fast, with an accent that makes it difficult to understand what he is saying, and he is not explaining things clearly t all.....Poor
-
PPip Coder
This was a great course. At times I had a hard time with the accent but that was probably because I had the video sped up to 2x speed. Some of the video is dated. There isn't a lot of questions. Some is in english and spanish (99% english). The instructor knows his stuff. Not a perfect course but darn good.
-
LLouise Eggleton
Good course. Would like to have seen a project that used both flexbox and css grid. Yes, the final project did use flexbox for the social media menu, but I was hoping for something more comprehensive, perhaps a project involving both css grid and flexbox and some advice about when to use one vs the other.
-
AAlbert Sanchez
This is a great course itself, learning by practicing developing different website pages. The Sass section is nice however not a fan of these processors, don't expect the instructor to answer a single question that doesn't seem to happen however the course is clear and well structured so is unnecessary to ask questions. Sass instead of using the compiler explained I highly recommend using the Visual Studio extension Live Sass Compiler to make your life easier! JavaScript teaching is amazing, especially dynamic templates which the foundations of ReactJS. Highly recommended to learn CSS flexbox and CSS grid! Wonderful course!
