Hey @aengland, welcome! That’s definitely possible. I would recommend using flask-sqlalchemy in conjunction with Dash. SQLAlchemy is a Python library for interacting with SQL databases. Dash is built on top of flask, and flask-sqlalchemy is an extension of flask that adds support for SQLAlchemy.
The flask-sqlalchemy docs, and the sqlalchemy docs are both very comprehensive, though consequently also maybe a little overwhelming.
The main thing you need to know when reading flask-sqlalchemy examples and porting them to Dash is to replace instances of
app (which will be a Flask app in the examples) with
app.server, which is the Flask app running your Dash app.
Here’s an example to get you started that I based on the flask-sqlalchemy minimal application from their docs. It uses a SQLite database saved to
/tmp/. To get this working with your MySQL database you would just need to change the URI. I didn’t want to distract from the database logic, so the app itself is pretty ugly.
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output, State
from flask_sqlalchemy import SQLAlchemy
app = dash.Dash()
app.server.config["SQLALCHEMY_DATABASE_URI"] = "sqlite:////tmp/test.db"
db = SQLAlchemy(app.server)
id = db.Column(db.Integer, primary_key=True)
username = db.Column(db.String(80), unique=True, nullable=False)
email = db.Column(db.String(120), unique=True, nullable=False)
return "<User %r>" % self.username
app.layout = html.Div(
dcc.Input(id="username", placeholder="enter username", type="text"),
dcc.Input(id="email", placeholder="enter email", type="email"),
html.Button("add user", id="add-button"),
[State("username", "value"), State("email", "value")],
def add_and_show_users(n, username, email):
if n is not None:
# if button clicked, add user
# get all users in database
users = db.session.query(User).all()
html.Span([html.H5("Username: "), u.username]),
html.Span([html.H5("Email: "), u.email]),
for u in users
if __name__ == "__main__":