← Back to list

How to Create and Deploy a Dash App in Replit (Step-by-Step Guide)

Build, deploy, and share a Python data dashboard using Dash and Replit — no servers, no DevOps.

KEVIN ANDRES SOSSA VALENCIA · 2025-12-28 23:12 · 0 claps · 4.2 min read
#dash-app #deployment #data-science #replit #python
Open on Medium ↗
Wiki topics: ML · Machine Learning ☁️ · DevOps & Cloud 🔬 · Science · General 🎬 · Film & Television

How to Create and Deploy a Dash App in Replit (Step-by-Step Guide)

Build, deploy, and share a Python data dashboard using Dash and Replit — no servers, no DevOps.

Why I Built This Project?

For many data scientists, building dashboards is easy — deploying them is not. Between servers, cloud services, and configuration files, deployment often becomes the real challenge.

For a long time, deploying data applications felt unnecessarily complex. You had to worry about servers, environments, dependencies, and hosting — often more than the data itself. This project started as a simple experiment: could I build and deploy a Python data dashboard with minimal friction?

Using a public Kaggle dataset on housing prices in Chile, I built a small analytical dashboard with Dash and deployed it entirely using Replit — from development to production.

👉 Live App (available until January 19, 2026):

[embed]Dash Edit descriptiondashproject--kevinsossa.replit.app

In this article, I’ll walk you through exactly how I did it, step by step, so you can replicate the process with your own data.

Table of Contents:

  1. What is Dash?
  2. What is Replit?
  3. Project Overview
  4. Building the App Step by Step
  5. Deploying to Production on Replit
  6. Conclusion
  7. References

The final dashboard. Image created by the author.

The final dashboard. Image created by the author.

1. What Is Dash?

Dash is a Python framework for building analytical web applications without writing JavaScript. It is built on top of Flask and Plotly, making it ideal for data scientists who want to turn analyses into interactive dashboards. Dash is basically low-code framework for rapidly building data apps in Python.

If you want a deeper technical explanation, I previously wrote an article fully dedicated to Dash:

[embed]How to Choose between Power BI and Dash-Plotly Choosing a good BI tool or Data App software development…medium.com

2. What Is Replit?

Replit is an online development environment that allows you to code, run, and now deploy applications directly from your browser. What makes Replit especially attractive is the deployment is almost frictionless — no server configuration, no Docker, no cloud provider setup.

Replit workspace screenshot

Replit workspace screenshot

For fast prototyping and educational projects, it’s a powerful tool.

3. Project Overview

The dashboard analyzes housing data in Chile, focusing on:

  • Price distribution
  • Relationship between price and number of bedrooms
  • Area distribution by location (comuna)

[embed]Valor Casas Usadas, Chile, RM, 18/07/2023 Avisos de venta de casas de la Region Metropolitana, Santiagowww.kaggle.com

The goal was not to build a complex system, but a clear, interactive, and deployable data product.

4. Building the Dash App Step by Step

4.1 Replit Setup

  1. Create a new Python Repl
  2. Add the required libraries to requirements.txt:
dash
pandas
numpy
plotly
dash-bootstrap-components
gunicorn
  1. Upload the Kaggle dataset (Info.csv) to the workspace

4.2 App Structure in 5 Steps

Step 1: Import Libraries and Load Data

import pandas as pd
import plotly.express as px
from dash import Dash, html, dcc, Input, Output
import dash_bootstrap_components as dbc

Info = pd.read_csv('Info.csv')

Step 2: Initialize the Dash App

app = Dash(__name__, external_stylesheets=[dbc.themes.BOOTSTRAP])
server = app.server

**server is critical** for deployment on Replit.

Step 3: Define the Layout

The layout uses Bootstrap containers, rows, and cards to organize:

  • A price range slider
  • Four interactive charts (scatter, histogram, pie, sunburst)

app.layout = dbc.Container(children=[
    html.H2('Análisis Precio-Ubicacion de Casas'),
    dbc.Col([
        html.H6('Rango de precios'),
        dbc.Card(
            dcc.RangeSlider(id='range-slider',
                            min=0,
                            max=500000,
                            step=1000,
                            marks={
                                0: '0',
                                100000: '100000',
                                500000: '500000',
                            },
                            value=[0, 500000]), )
    ],
            md=6),
    #Fila 1
    dbc.Row([
        #Columna 1
        dbc.Col([dbc.Card(dcc.Graph(id='pie-chart'), )]),
        #Columna 2
        dbc.Col([
            dbc.Card(dcc.Graph(id='sunburst'), ),
        ])
    ]),
    #Fila 2
    dbc.Row(
        [
            #Columna 1 Fila 2
            dbc.Col(dcc.Graph(id='scatter-plot'), md=6),
            #Columna 2 Fila 2
            dbc.Col([
                dbc.Card(dcc.Graph(id='histogram'), ),
            ]),
        ],
        align="center",
    ),
])

Step 5: Add Callbacks

A single callback updates all charts based on the selected price range:

@app.callback(
    Output("scatter-plot", "figure"),
    Output("histogram", "figure"),
    Output("pie-chart", "figure"),
    Output("sunburst", "figure"),
    Input("range-slider", "value"),
)
def update_charts(slider_range):
    df = Info
    low, high = slider_range
    mask = (df['Price_USD'] > low) & (df['Price_USD'] < high)

    scatter_fig = px.scatter(df[mask],
                             x="Price_USD",
                             y="Dorms",
                             color="id",
                             labels={
                                 'Price_USD': 'Precio USD',
                                 'Dorms': 'Dormitorios',
                                 'id': 'Identificacion'
                             },
                             hover_data=['Dorms', 'Total Area', 'Built Area'],
                             title="relacion entre precio y dormitorios")

    histogram_fig = px.histogram(df[mask],
                                 x="Price_USD",
                                 y="Dorms",
                                 color="Baths",
                                 labels={
                                     'Price_USD': 'Precio USD',
                                     'Baths': 'Baños',
                                     'Dorms': 'Dormitorios',
                                 },
                                 nbins=30,
                                 title="Distribucion de precios por baños")

    pie_fig = px.pie(df[mask],
                     values='Total Area',
                     names='Dorms',
                     labels={
                         'Total Area': 'Area Total',
                         'Dorms': 'Dormitorios'
                     },
                     title="Distribucion de areas totales por dormitorios")

    sunburst_fig = px.sunburst(
        df[mask],
        path=['Comuna', 'Dorms'],
        labels={
            'Comuna': 'Comuna',
            'Dorms': 'Dormitorios'
        },
        values='Total Area',
        title="Distribucion de areas totales por comunas y dormitorios")
    pie_fig.update_layout(legend=dict(title=dict(text="Dormitorios")), )

    return scatter_fig, histogram_fig, pie_fig, sunburst_fig

if __name__ == '__main__':
    app.run(debug=True)

This keeps the dashboard responsive and efficient.

5. Deploying to Production on Replit

Deployment in Replit takes only a few steps:

  1. From your Replit App workspace, select Publish at the top.
  2. In the Publishing tab, select your publishing option.
  3. If Add a payment method appears, follow the prompts to add a payment method. I use it for free.

Replit automatically selects the best publishing option for your app based on the project type and your needs.

Within seconds, the Dash app is live and accessible via a public URL.

Publishing tab

Publishing tab

6. Conclusion

This project shows that building and deploying data applications doesn’t have to be complicated. With Dash and Replit, you can transform a dataset into a production-ready dashboard in a single afternoon.

If you’re building data projects for learning or portfolio purposes, this workflow can save you hours of setup — and get your work online faster.

📌 The app will remain available until January 19, 2026, so feel free to explore it here: 👉

[embed]Dash dashproject--kevinsossa.replit.app

7. References


메타데이터
post_id
dd795dc883c2
slug
how-to-create-and-deploy-a-dash-app-in-replit-step-by-step-guide-dd795dc883c2
url
https://medium.com/@kevin_sossav/how-to-create-and-deploy-a-dash-app-in-replit-step-by-step-guide-dd795dc883c2
canonical_url
https://medium.com/@kevin_sossav/how-to-create-and-deploy-a-dash-app-in-replit-step-by-step-guide-dd795dc883c2
author_url
https://medium.com/@kevin_sossav
status
ok
fetched_at
2026-07-30 15:14:27