DEV Community

Cover image for I Understand Flexbox!

I Understand Flexbox!

James Cox on August 23, 2020

I just want to take a moment and celebrate a pretty big moment for me. I have been attempting to use flexbox on and off for months now, and having ...
Collapse
 
_garybell profile image
Gary Bell

I'll get there with it one day. I don't do enough front end to get a chance for it to click properly. Until it does, I will keep referring to my go-to (and bookmarked) guide: css-tricks.com/snippets/css/a-guid...

Collapse
 
jamesncox profile image
James Cox

Yep! Already have that one bookmarked and have referred to it many times.

I'm not sure where I'll end up at my first job, backend or front end. I enjoy front end more, but I feel like the scope of what I don't know is so much wider on the front end. Whenever I feel like I've mastered something, there are 30 new concepts to learn.

Collapse
 
jlohani profile image
Jayant Lohani

Congrats. 🎉
I too am grinding on flexboard as well as grids. Currently studying from freecodecamp.
Was a bit hesitating to start these two topics as they seem tough but started them as a 30DayCSS Challenge.✌

Collapse
 
jamesncox profile image
James Cox

I have been putting off Grid for a while now. Flexbox was a bit easier for me. I'm excited to learn Grid now that Flexbox makes a bit more sense to me.

Collapse
 
jlohani profile image
Jayant Lohani

That's great. Do share your experience.
I am also in the last week of my 30dayCSS challenge. Saved the entire week for Grid and Flexboard. Lets see how it goes.

Collapse
 
vtrpldn profile image
Vitor Paladini

Ahhh, that feeling is great, isn't it? Congratulations on pushing forward!

Flexbox is my favorite thing in CSS, I'm sure it will be useful lots of times in your journey.

Collapse
 
jamesncox profile image
James Cox

Thanks, Victor!

I’m excited to create something without the help of any component libraries and see what I come up with. Not sure what to make yet, but maybe I can do rebuild a section of my memes/gifs app? Who knows!

Collapse
 
pinkylalwani profile image
Pinky Lalwani

A Good Start 👍
Flexbox is awesome. I finished with the Flexbox and Grid Properties. To put my learning into action I'm cloning the Microsoft website using Flexbox grid, A Grid system based on the Flexbox Property.
Looking forward to your post. 🙂

Thread Thread
 
jamesncox profile image
James Cox

Cloning websites is a great idea and probably an excellent way to test your flexbox/grid skills. Grid is next for me. I avoided it for a long time, but now that I went through the process of learning flexbox, I think I'll enjoy learning grid better now!

Collapse
 
sincerelybrittany profile image
Brittany

CONGRATULATIONS! I look forward to your post tomorrow and cant wait until I have the same "aha!" moment!

Collapse
 
jamesncox profile image
James Cox

Thank you 🙏 I am sure yours will come! For me it was just trying things a few different times a few different ways until it clicked. I am not a UX/UI developer but learning how to do this stuff is still super satisfying for me.

Collapse
 
kamo profile image
KAIDI

From the post picture I thinks it's
flexboxfroggy.com/
Good one to understand flex

Collapse
 
jamesncox profile image
James Cox

Yes it is! Thank you for mentioning that. I was planning on referencing it in my tutorial I'm about to write today, but I probably should mention it here since I use its picture.

Collapse
 
stereoplegic profile image
Mike Bybee

That will come in handy for working with React Native as well, even if its flex properties don't map exactly 1:1 with CSS.

Collapse
 
jamesncox profile image
James Cox

What is something you've accomplished lately that made you really proud of yourself? We should always share and celebrate those moments!

Collapse
 
octaneinteractive profile image
Wayne Smallman

Congratulations, now explain this madness to me.