Book Image

Creating Interfaces with Bulma

By : Jeremy Thomas, Oleksii Potiekhin, Mikko Lauhakari, Aslam Shah, Dave Berning
Book Image

Creating Interfaces with Bulma

By: Jeremy Thomas, Oleksii Potiekhin, Mikko Lauhakari, Aslam Shah, Dave Berning

Overview of this book

Bulma is a lightweight configurable CSS framework that handles all the hard work of Flexbox for you. Bulma makes creating web interfaces an easy and interesting job. This book begins with an overview of the basics of Bulma ? its terms and its concepts. Then, while designing a login page for your application, you’ll learn how to use the various tools provided by Bulma to create HTML forms and control their layout and flow. In the later chapters, you’ll design an admin area for your application, thus learning to use Bulma’s navigation and menu components. You will also add the components to your user interface for common things such as boxes, lists, and media groups, and then create pagination. As you progress through the book, you’ll create and layout some other components for your interface, including tables, design dropdown lists, and finally to integrate your web application with JavaScript. By the end of this book, you’ll be able to use the features of Bulma to your advantage and build web interfaces quickly and easily.
Table of Contents (15 chapters)
8
8. Creating more tables and selecting dropdowns

Chapter 9. Creating notifications and cards

At this point, you’ve explored a decent amount of what the Bulma framework has to offer. There are a lot of component and modifier classes that you can choose from. We hope you can see how you are able to create clean and structured user interfaces without custom CSS code. That’s pretty cool. Of course, you can always modify Bulma with your own variables or add your own custom styles.

There are a few aspects of Bulma that this book hasn’t explored yet: notifications and cards. Let’s wrap up the application, and in later chapters of the book, you’ll learn about using Bulma with Vanilla JavaScript as well as the Angular, Vue, and React frameworks.

Note: To see the full code of the example used in this book take a look at the book’s accompanying GitHub page.

The dashboard is the page the user lands on after logging in. It is usually the last page to be designed because it acts as both a summary of and...