Dash Bootstrap Card - the Advanced Stuff
Charming Data
A more advanced tutorial on the Dash Bootstrap Card and how a well-built card can give your dashboard a professional look.
The Code: https://github.com/Coding-with-Adam/Dash-by-Plotly/tree/master/Bootstrap/Card-Advanced
Dash Bootstrap Card Docs: https://dash-bootstrap-components.opensource.faculty.ai/docs/components/card/
Bootstrap Icons: https://icons.getbootstrap.com/
Dash Bootstrap Cheatsheet: https://dashcheatsheet.pythonanywhere.com/
Card Article (Bonus Dash Book Content): https://github.com/DashBookProject/Plotly-Dash/blob/master/Bonus-Content/Components/cards.md
The Book of Dash: https://nostarch.com/book-dash
Video layout: 00:00 - What you will learn and code 01:28 - Minimal bootstrap card 03:45 - Color and centered text 06:51 - Bootstrap icons 12:08 - Cards side by side 17:47 - Image and link 23:07 - Live App with Cards 25:19 - API and App layout 26:00 - the Callback 28:20 - make_card function 33:20 - resources
š Your support keeps Charming Data running, which is proudly a 100% member-supported educational channel: Patreon: https://www.patreon.com/charmingdata GitHub: https://github.com/sponsors/Coding-with-Adam YouTube: https://www.youtube.com/channel/UCqBFsuAz41sqWcFjZkqmJqQ/join ... https://www.youtube.com/watch?v=THB9AEwdSXo
244935937 Bytes