Didn’t take long for me to find time to write in here again. It occurred to me that I should write about what learning Bootstrap in the FreeCodeCamp challenges was like… and that I should also mention a couple of other points:
- I still have some things to touch up in this blog and make less… well, like I just started one and left all the default text in-like.
- Just because I’m learning web development doesn’t mean that I’m going to style everything fancy, including this blog. (although it’s always on the potential idea list)
- This blog is mostly intended to follow my adventures in learning web development from zero to full stack on FreeCodeCamp (hence the play on the name of my blog, nightcamper)
That being said, I’m going to talk about what Bootstrap was like after having learned basic HTML and CSS (which that really wasn’t exactly exciting or constructive, but a necessity for the future I’m sure). I mentioned the importance of Frameworks and tools in my last blog post, and that especially applies when it comes to Bootstrap. I only learned the CSS library portion of Bootstrap, but that alone changed a LOT about how I styled my pages.
What I was working with was a portion of Bootstrap that was a CSS library, with its own classes that have certain styles. Bootstrap is intended for something called “Responsive Design”, which I interpret in laymen’s terms as a one-size-fits-all scaling and accessibility solution for web content of all kinds. The gist of it is this: You lock all of your visible page content in a div element and give it the Bootstrap class assignment of “container” or “container-fluid”. “container” is if you had specific sizes in mind to fit across all types of devices, “container-fluid” usually just takes the whole width of whatever you’re viewing the page on. From there, any more elements to your page, you add in this div, and a lot of the time you’ll be putting Bootstrap classes to those too to make sure it shows as it should (col-md-*, col-xs-* where * = the amount of columns the element will span up to 12) and even to enhance the look (btn-danger, btn-info for any button elements, etc).
Bootstrap saved me a lot of time with things, allowing quick styling of elements, easy positioning on the webpage to make sure it shows right on all devices, and FontAwesome (which was used in the challenges for Bootstrap) allowed for some very nice-looking icons to be put on buttons! I’ve only just scratched the surface of what Bootstrap can do I’m sure, and it really did make my page look a lot better; Much better than what I would have accomplished trying to do it without Bootstrap!
I’m hoping to come back to this and explore more of what Bootstrap can do at a later date, but jQuery is now on the horizon and I want to see what THAT can do. I’ll write up on that when I finish it, because right after that I’ll be going in to my first front-end projects (shudder). Thanks for reading, and if you had any questions you wanted me to try to answer, or anything specific you want to see written up in a blog post, just let me know. I’ll get my contact info properly put in right after posting this, promise!
Nightcaper's FCC Blog - The Journey 