Adapt Dash Web App to Mobile Devices

Make your Dash web app layout responsive to mobile devices. We will use meta tags and Dash Bootstrap as well as Chrome DevTools to manipulate the layout of our app on various devices and screen sizes. Download the code below.

View my book - The Book of Dash:
https://www.amazon.com/Python-Dash-An...
https://github.com/DashBookProject/Pl...

Code:
https://github.com/Coding-with-Adam/D...

Data:
https://drive.google.com/file/d/1B3tV...

Information on meta-tags:
https://stackoverflow.com/questions/2...

Video layout:
00:00 - App demo and what you will learn
03:05 - Two methods to create responsive mobile layout
04:00 - Choose your mobile device
07:24 - Method 1: Meta Tags
14:40 - Limitations of Meta Tags
16:22 - Method 2: Dash Bootstrap
25:30 - Aligning layout with className (CSS)

************************************************************************
👉 If you appreciate these tutorials and would like to support their existence, while enjoying additional Dash Plotly tips:
Patreon:   / charmingdata  
GitHub: https://github.com/sponsors/Coding-wi...
YouTube:    / @charmingdata