Post by account_disabled on Nov 29, 2023 17:02:45 GMT 8
Yesterday, the admin just returned from a Hackathon event. A Hackathon event is a competition to create a product in a short period of time . There will be different tasks. Of course, we need a tool that allows us to create websites as quickly as possible, and in terms of Frontend, using a CSS Framework is a great answer. Recommended article: What is a CSS Framework? Let's get to know each famous CSS Framework. I believe that many people already know about Bootstrap / Foundation, especially Bootstrap. This has become a tool that most website creators choose to use. And as a result, the website will all look the same.
For beginners who have never used Bootstrap, the admin has given out slides teaching how to use Phone Number List Bootstrap 3 in the blog. As for Bootstrap 4, you can see detailed instructions on how to use it in the article. A guide teaching you how to use Bootstrap 4 from scratch . Because the admin is bored with Bootstrap and yesterday's competition was short on time (Hackathons normally compete for 2 days and 48 hours, this event only competed for one night, 24 hours, and before you could start coding you had to come up with questions from the Business side. It will take several more hours.) To write Frontend starting from 0, you have to come up with a new design. Definitely couldn't make it in time. In the end, we ended up using a new CSS Framework called Bulma, which is a CSS Framework that uses Flexbox ! I use it and I really like it.
Let's see what's cool about this CSS Framework. What does this article have? Show Bulma and the magic grid (retractable) Increase/decrease columns Then it will shrink and expand for you. Increase/decrease columns Then it will shrink and expand for you. One of the Flexbox's abilities is that it can expand and contract according to the available space. No need to sit and define a class like .col-md-6 like in the old Bootstrap / Foundation (or you can define it and fix the width). Let's look at an example code if you want to make a 5-column grid (if you look carefully, this is one thing that Bootstrap / Foundation can't do because they use 12 grids that can't be divided into 5 columns properly. If you want it, you have to write it yourself.
For beginners who have never used Bootstrap, the admin has given out slides teaching how to use Phone Number List Bootstrap 3 in the blog. As for Bootstrap 4, you can see detailed instructions on how to use it in the article. A guide teaching you how to use Bootstrap 4 from scratch . Because the admin is bored with Bootstrap and yesterday's competition was short on time (Hackathons normally compete for 2 days and 48 hours, this event only competed for one night, 24 hours, and before you could start coding you had to come up with questions from the Business side. It will take several more hours.) To write Frontend starting from 0, you have to come up with a new design. Definitely couldn't make it in time. In the end, we ended up using a new CSS Framework called Bulma, which is a CSS Framework that uses Flexbox ! I use it and I really like it.
Let's see what's cool about this CSS Framework. What does this article have? Show Bulma and the magic grid (retractable) Increase/decrease columns Then it will shrink and expand for you. Increase/decrease columns Then it will shrink and expand for you. One of the Flexbox's abilities is that it can expand and contract according to the available space. No need to sit and define a class like .col-md-6 like in the old Bootstrap / Foundation (or you can define it and fix the width). Let's look at an example code if you want to make a 5-column grid (if you look carefully, this is one thing that Bootstrap / Foundation can't do because they use 12 grids that can't be divided into 5 columns properly. If you want it, you have to write it yourself.
