First exercises working with a CSS framework, in this case Bootstrap:
- Getting to know the new syntax of the Bootstrap framework
- Applying predefined classes in CSS
- Working with a grid
Link to the specifics of the first exercise:
The first results of my efforts: https://mickdellaert.github.io/bootstrap-grid/
-
Repository:
challenge-bootstrap -
Type of Challenge:
Learning Challenge -
Duration: 2 days
-
Deployment strategy : Github page
-
Team challenge :
solo
- Learn to install and work with Bootstrap
- Learning to use the Grid component from Bootstrap
- Learn how to add JavaScript components.
- Learn how easy bootstrap will make you life
From bootstrap to materialize, the world has lots of css frameworks, but what is a CSS Framework?
A CSS Framework is basically a great library of CSS properties applied to general classes. It allows you to both create and fasten the UI for a website.
Well, imagine you need a grid, filled with squares, each square has an icon in there and is clickable, you want that grid to be responsive as well. You are propably able to create that, but how long would that take you? Now imagine for a second, that you have a ready set list of classes that you can use to create this, without writing any CSS code... Once you would know these classnames, you would probably do this assignment in 1/10th of the time...
Look at the list of the most popular CSS frameworks. For now bootstrap is still the most commonly used (in Belgium), though that being said, who knows whether it should be ...
A very nice benefit of bootstrap is that it is more than a CSS framework, it also comes with some often used Javascript components like a carousel, tabs, ...
During your training at BeCode you will use the bootstrap libary, but feel free to play around with other frameworks. The more you know the better!
You can find the Installation guide on the www.getbootstrap.com website. Don't forget to include the JavaScript files if you want the tooltips or Carousel to work in the exercises below!