An Anthology of Flexbox Tools and Tutorials (Frontend Development) by@arthur.tkachenko

An Anthology of Flexbox Tools and Tutorials (Frontend Development)

The main source of information is Flexbox Specification. We have a lot of great tutorials and courses, related to flexboxes. For practice I use CodePen, Bitbucket and CodePen. For more information about React and Flexboxes, check this list below:https://dev.to/llorentegerman/simple-layouts-with-flexbox-in-react-55kfhttps://www.npmjs.com/flexbox-grid/ or https://ant.design/ (it have layouts, that using flexboxes)
image

We have a lot of great tutorials and courses, related to flexboxes.

I don’t want to create an article, that will explain the flexbox basics. My goals are to put into one place links, that I find interesting and tell you what you can do, in order to master this tool.

If you’ll find some mistakes, or we forget to put something here — buzz me at comments.

Of course, the main source of information is Flexbox Specification.

If you want to have a practice assessment, you can create a calendar layout using flexboxes, or recreate some of the website blocks from Design Blocks

Full Tutorials

Books to read

Advanced examples

Youtube tutorials

Code generators

I’m not sure if it a good idea to generate code for flexbox layouts. Because you’re not learning at this moment, but at least code will be cross-browser and working well.

Additional Examples

If you want to read about React and Flexboxes, check this list below
to read:

React packages

React Native

TOOLKIT

For practice I use CodePen.

Github — if you ok to share your code with other — My current pick

Bitbucket — if you want to have a free storage

Google drive & Dropbox — if you just want to save your code at cloud

You can also use 

 of some other stuff.

Code editors

Sublime I use it around 6 years. Small size and has everything important.

Atom because it’s baked by GitHub team and it’s also have a GitHub sync.

Stay Tuned!

image
react to story with heart
react to story with light
react to story with boat
react to story with money

Related Stories

L O A D I N G
. . . comments & more!