From the course: Interactive Dashboards with Plotly and Dash
Unlock this course with a free trial
Join today to access over 25,500 courses taught by industry experts.
Grid-based layouts
From the course: Interactive Dashboards with Plotly and Dash
Grid-based layouts
- [Instructor] Okay, so Dash Bootstrap Components is a very rich library that borrows a lot of components that we would see in more traditional web pages. They've basically created flask and react components that are specified for the Dash library. And if you have a strong web development background, you might find yourself using many of these additional DBC components. But one set of components it's absolutely essential for analysts to know are the ones that allow us to build grid-based layouts. The DBC components for rows and columns let you create grid-based layouts. And it is possible to create grid-based layouts with HTML, but I find the DBC implementation of these to be much more intuitive and require a lot less tweaking and trial and error. And so, because I find these more intuitive, this is what you get to learn. But you are always welcome to take a look at other Dash examples on the web if you want to do this in HTML. But I doubt you'll want to go back. And a few notes about…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Contents
-
-
-
-
-
-
-
(Locked)
Intro to dashboard layouts2m 26s
-
(Locked)
Visual elements and layout options4m 40s
-
(Locked)
Revisiting Dash app layouts3m 54s
-
(Locked)
HTML and markdown7m 17s
-
(Locked)
Assignment: HTML and markdown2m 15s
-
(Locked)
Solution: HTML and markdown2m 28s
-
(Locked)
HTML styles5m 58s
-
(Locked)
Styling interactive elements4m 9s
-
(Locked)
Styling Plotly figures3m 4s
-
(Locked)
Assignment: App styling1m 26s
-
(Locked)
Solution: App styling2m 25s
-
(Locked)
Dash Bootstrap components4m 10s
-
(Locked)
Dash Bootstrap themes5m 1s
-
(Locked)
Demo: Applying a Bootstrap theme4m 27s
-
(Locked)
Grid-based layouts6m 44s
-
(Locked)
Demo: Grid-based layouts5m 54s
-
(Locked)
Multiple tabs3m 45s
-
(Locked)
Demo: Multiple tabs3m 48s
-
(Locked)
Assignment: Building a layout1m 27s
-
(Locked)
Solution: Building a layout3m 10s
-
(Locked)
Key takeaways2m 9s
-
(Locked)
-
-