Free UI/UX design course
Learn how to create exceptional designs by reading my new tutorial.
Start learningMDBootstrap tutorial
As with Bootstrap, here too let's start with a key question:
What exactly is MDBootstrap?
MDBootstrap a.k.a. MDB (or MDB UI KIT) is a library that greatly extends the capabilities of regular Bootstrap.
You can look at MDBootstrap as Bootstrap on steroids. And it's free.
Why use MDBootstrap?
MDBootstrap contains all the features of Bootstrap and additionaly provides you with:
- Hundreds of additional quality components, design blocks & templates
- Much better design than Bootstrap
- Much wider customization, theming and optimization options than Bootstrap
- Integration with Material Design (a design system created by Google)
- Integration with the most popular JavaScript libraries, such as React, Angular or Vue
- Integration with the most popular backend and CMS technologies such as WordPress, Node.js, PHP and many more
- Integration with TypeScript
- Dozens of high-quality, free tutorials (like the one you're reading right now)
- Playground, where you can freely experiment with the code directly in your browser
- Integration with MDB GO and MDB CLI, i.e. free hosting and an open-source deployment platform, thanks to which you can publish your website for free on the Internet in a few seconds
- Much, much more that you will learn in this course
MDBootstrap has 4 versions dedicated to the most popular front-end technologies.
In addition, each of these versions has its own package in the latest Bootstrap v.5, and in the older Bootstrap v.4. Of course, I recommend you always use the latest version.
Note: MDB Standard is built with the default Bootstrap 5 version, and supported by plain JavaScript
Note: MDB jQuery is built with the default Bootstrap 4 version, and supported by jQuery library
Prerequisites: This course assumes that you are already familiar with HTML and CSS. Knowledge of JavaScript is not required, although it is useful.
If you are not very comfortable with the above topics, please check out our related tutorials first:
- HTML for beginners
- CSS for beginners
- (optionally) JavaScript for beginners
I also assume you've followed the previous 2 tutorials (or at least you know and understand the topics we've covered there):
Join the conversation
If you have any questions or difficulties with the course, please post a question in our community forum.
About the author
At the end of this short introduction, a word about me.
My name is Michal, I am a co-founder of MDB and I will have the pleasure to introduce you to the world of our ecosystem 🙂 I hope you will find it not only extremely useful, but also super interesting and enjoyable.
If you want, we can stay in touch on twitter. I publish there useful stuff related to web development and UI / UX design.
❌Avoid presenting too much information at once, especially when it lacks a clear hierarchy and all actions seem equally important.
— Michal Szymanski (@ascensus_mdb) November 3, 2022
âś…Hierarchy is fundamental. The user should always know what the main action is expected of him.
Want more tips? Check👉https://t.co/TqwpyKjst0 pic.twitter.com/SZnBXAt8zt
Let’s get started!
About author
Michal Szymanski
Co Founder at MDBootstrap / Listed in Forbes „30 under 30" / Open-source enthusiast / Dancer, nerd & book lover.
Author of hundreds of articles on programming, business, marketing and productivity. In the past, an educator working with troubled youth in orphanages and correctional facilities.