DEV Community

loading...
Cover image for The first UI Kit for Bootstrap 5! Using Material Design 2.0

The first UI Kit for Bootstrap 5! Using Material Design 2.0

marveluck profile image Mateusz Leciejewski Updated on ・1 min read

Bootstrap 5

Bootstrap's first alpha was officially released on June 16, 2020.

Along with the new version of the most popular HTML, CSS, and JS library, there were most anticipated changes released - jQuery was removed & the project switched to plain JavaScript. However, this is only the beginning of changes

You may learn more about the changes implemented into v.5 with this video


MDB 5 alpha

Just a few days after the release of the new Bootstrap version, the first UI Kit for Bootstrap 5 using Material Design 2.0 was released!

What are the key features of the MDB 5 UI Kit? The most important is simplicity and ease of use, and we owe it to:

  • Latest Bootstrap 5 & Material Design 2.0
  • 500+ material UI components
  • Super simple, 1-minute installation
  • Detailed docs & multiple practical examples
  • Lots of tutorials
  • Plenty of free templates
  • Plain javascript (but works also with jQuery)
  • Huge and active community
  • MIT license - free for personal & commercial use

Learn more about Material Design for Bootstrap 5

Get Started & be ahead of everyone

Installation takes only one minute

Discussion

pic
Editor guide
Collapse
miketalbot profile image
Mike Talbot

Could you give me the highlight points about why Bootstrap 5 with MD is worth choosing over other frameworks? I have a feeling I could get some of that from the video you linked but its 85 minutes long and I have a work-induced short attention span :)

Currently I use Material-UI with React for ref.

Collapse
lemraus profile image
Armel Chausse

From a React developer perspective, the UI framework I had the best success with is Semantic UI React. I tried Material UI React for a while but I found it to be way less intuitive. I used to write style for all of my components in plain CSS or SCSS but I have been way more productive since I stopped reinventing the wheel for each and every button or menu I want to create. I'm wondering what UI framework do you guys use with React?

Collapse
cnsr profile image
Yaroslav

I've tried Material UI, Semantic UI and ant.design. Out of the three Semantic UI was the most comfortable to work with. Haven't really used bootstrap in React, but for static sites its my go-to.

Collapse
paulendurrr profile image
Paul

None of the text entries seem to work on mobile, tried in both Firefox nightly and Chrome on Android.
Hopefully that's just a bug with their demo site and not the kit itself!

Collapse
marveluck profile image
Mateusz Leciejewski Author

Thanks for the report ❤️ We'll check and fix it, but if you can provide more details, it would be easier for us to diagnose the problem :)

However, because this is the alpha version, errors may occur up to the stable version & we really appreciate it when any bug is reported to us!

Collapse
paulendurrr profile image
Paul

It looks like focus is pulled away from the text input when you try to tap into it.
This video shows the problem: streamable.com/nlulnl
Happy to provide more info if required!

Collapse
lovetronics888 profile image
lovetronics888

I would definitely come to bootstrap since they are using plain Javascript.i hate jQuery

Collapse
pau1phi11ips profile image
Paul Phillips

Hate's a bit of a strong word for jQuery? It revolutionised JavaScript.

Collapse
cnpandya profile image
Chirag Pandya

can u send official link of Bootstrap 5 ?

Collapse
pau1phi11ips profile image
Paul Phillips

v5.getbootstrap.com/ it's still in Alpha release

Collapse
sm0ke profile image
Sm0ke

Thanks for sharing.
Some sample pages (a simple landing page, login) would be nice & useful.

Collapse
jwp profile image
John Peters

That's beautiful!

Collapse
spiritbro1 profile image
spiritbro1

man that was fast

Collapse
amirdarx profile image
amir

awesome things , Tnx for sharing