The first resource I went over was from css-tricks.com, where I found a comprehensive guide to flexbox. The guide went over key components of flexbox, with a focus on all the different properties for the parent element (flex container) and the child elements (the flex items). It had a lot of visuals included in the guide, which helped me better grasp and understand the topic. Overall, I found this resource super helpful.
The next resource I used was from the MDN website. Out of all the resources I found, this one was the most in depth on the topic, as expected. The visuals/graphics also weren't as fun as the first resource. However, this resource covers a lot of nuances that other resources might miss, though it makes the topic feel a little overwhelming. Overall, I learned a lot from it.
The final resource I used was less of a documentation, and more of a live demo on how flexbox works. I found this to be quite helpful in understanding how all the different flex properties work and connect to each other. I spent quite a bit of time playing around with all the different options on here, and feel like I understand this topic a little bit better now.
Overall, there exists a plethora of free resources on the topic of flexbox on the web. While flexbox is intimidating to anyone first learning it, with a bit of study and practice, you can quickly get good at the basics of designing your web pages with flexbox.