diff --git a/_collection-base/08-visualization/02-graphs/02-python/03-intro-to-dash-widgets.md b/_collection-base/08-visualization/02-graphs/02-python/03-intro-to-dash-widgets.md index c02c12d..da91c92 100644 --- a/_collection-base/08-visualization/02-graphs/02-python/03-intro-to-dash-widgets.md +++ b/_collection-base/08-visualization/02-graphs/02-python/03-intro-to-dash-widgets.md @@ -184,6 +184,17 @@ app.layout = [ ] ``` +
+The `app.layout` in a Dash application is highly customizable to fit your needs. It can include a variety of [dash components](#dash-components) such as multiple graphs, tables, sliders, dropdowns and other widgets to facilitate interactive communication with users. This flexibility allows you to build complex, data-driven dashboards that can respond to user inputs in real-time, providing a dynamic and engaging user experience. +
+ +
+…about the [Dash components](#dash-components) in the section below, including: +* [HTML components](#html-components) +* [Core components](#core-components) + * [Graph components](#graph-components) +
+ **4. Callbacks** Implement callback functions that define the interactivity of the app. These functions specify how inputs (user interactions) update the outputs (displayed components).
@@ -221,64 +232,58 @@ Then, your app can be explored in any web browser at What the script does? +# Define app callbacks (if any) - *This setup creates a basic interactive web application with a title and a placeholder for a graph.* - The provided code: - * initializes a Dash application by importing elementary components (`Dash`, `html`, `dcc`), - * creates an **app** instance (`app = Dash()`) - * and defines the **layout** with a centered title (`html.H1`) and a graph object (`dcc.Graph`). The application layout is assigned to `app.layout`. +# Deploy app on the local Python server +if __name__ == '__main__': + app.run(debug=True) +``` + +
What the script does? + +*This setup creates a basic interactive web application with a title and a placeholder for a graph.* - Finally, the app is deployed on a local Python server with `app.run(debug=True)` when the script is run directly. -
+The provided code: +* initializes a Dash application by importing elementary components (`Dash`, `html`, `dcc`), +* creates an **app** instance (`app = Dash()`) +* and defines the **layout** with a centered title (`html.H1`) and a graph object (`dcc.Graph`). The application layout is assigned to `app.layout`. + +Finally, the app is deployed on a local Python server with `app.run(debug=True)` when the script is run directly. + + +**4. Run the App:** Execute the following command in the terminal: -4. **Run the App:** Execute the following command in the terminal: ```bash python dash_app.py ``` -5. **Explore:** Open your web browser and navigate to
http://127.0.0.1:8050 to see your app. +**5. Explore:** Open your web browser and navigate to http://127.0.0.1:8050 to see your app. ![python-dash-minimal-app]({{ images_path }}/dash-minimal-app.png) -
-The `app.layout` in a Dash application is highly customizable to fit your needs. It can include a variety of [dash components](#dash-components) such as multiple graphs, tables, sliders, dropdowns and other widgets to facilitate interactive communication with users. This flexibility allows you to build complex, data-driven dashboards that can respond to user inputs in real-time, providing a dynamic and engaging user experience. -
- -
-…about the [Dash components](#dash-components) in the section below, including: -* [HTML components](#html-components) -* [Core components](#core-components) - * [Graph components](#graph-components) -
- # Dash components