Running jupyter-dash in docker container - python-3.x

Question

I have created a docker file, by following https://www.youtube.com/watch?v=QkOKkrKqI-k
The docker builds perfectly fine and runs jupyter lab. Also, I can run a simple dash application.
import plotly.express as px
from jupyter_dash import JupyterDash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output
# Load Data
df = px.data.tips()
# Build App
app = JupyterDash(__name__)
app.layout = html.Div([
html.H1("JupyterDash Demo"),
dcc.Graph(id='graph'),
html.Label([
"colorscale",
dcc.Dropdown(
id='colorscale-dropdown', clearable=False,
value='plasma', options=[
{'label': c, 'value': c}
for c in px.colors.named_colorscales()
])
]),
])
# Define callback to update graph
#app.callback(
Output('graph', 'figure'),
[Input("colorscale-dropdown", "value")]
)
def update_figure(colorscale):
return px.scatter(
df, x="total_bill", y="tip", color="size",
color_continuous_scale=colorscale,
render_mode="webgl", title="Tips"
)
# Run app and display result inline in the notebook
app.run_server(mode='inline') --> This doesn't work
app.run_server(mode='jupyterlab') --> This doesn't work
# app.run_server(mode='external') --> This doesn't work
In dockerfile I expose port 8888 and 8050. Also after the build of the docker file, I run the the docker file with expose port commands to 8888 and 8050 respectively like below.
docker run -it -p 8888:8888 -p 8050:8050 <image-name>
However, when I run my dash application on an external mode:
Then it shows me
and when I try to connect that URL, I found it's not working.
Does anyone know how to fix this? I know how to use the flask to open up the application, but I would like to follow the traditional way as suggested in the video.
Dockerfile:
FROM python:3.8.0
RUN git clone --depth=1 https://github.com/Bash-it/bash-it.git ~/.bash_it && \
bash ~/.bash_it/install.sh --silent
RUN curl -sL https://deb.nodesource.com/setup_12.x | bash - && \
apt-get upgrade -y && \
apt-get install -y nodejs && \
rm -rf /var/lib/apt/lists/*
RUN pip install --upgrade pip && \
pip install --upgrade \
numpy \
pandas \
dash \
Jupyterlab \
ipywidgets \
jupyterlab-git \
jupyter-dash
RUN jupyter lab build
# RUN pip install --upgrade pip && \
# pip install --upgrade \
# jupyterlab "pywidgets>=7.5"
RUN jupyter labextension install \
jupyterlab-plotly#4.14.3 \
#jupyter-widgets/jupyterlab-manager \
#jupyterlab/git
COPY entrypoint.sh /usr/local/bin/
RUN chmod 755 /usr/local/bin/entrypoint.sh
COPY config/ /root/.jupyter/
EXPOSE 8888 8050
VOLUME /notebooks
WORKDIR /notebooks
# ENTRYPOINT ["/usr/local/bin/entrypoint.sh"]
CMD jupyter lab --ip=* --port=8888 --allow-root

Answer 1

I'm not sure if my answer is the right approach, but I made it work.
if anyone has any better solutions please post here.
the docker file remains the same.
after the build of the docker image I run,
docker run -it -p 8888:8888 -p 8050:8050 <ImageName>
The only change I made is (the hostname in app.run_server)
So my main command looks like this :
app.run_server(mode='inline', host="0.0.0.0", port=8050, dev_tools_ui=True)
this works for both inline, external, and jupyterlab.