This application is a simple web-based dashboard for managing customer data, built using the Reflex framework. It allows users to add new customer entries and visualize gender distribution through a bar chart.
- Add new users with their name, email, and gender.
- Display a list of users in a table format.
- Visualize gender distribution using a bar chart.
/interactive_dashboard/interactive_dashboard.py: Main application code.
Represents a user with attributes for name, email, and gender.
class User(rx.Base):
name: str
email: str
gender: strMaintains a list of users and prepares data for visualization.
class State(rx.State):
users: list[User] = [...]
users_for_graph: list[dict] = []Adds a new user and updates the gender distribution data.
def add_user(self, form_data: dict):
self.users.append(User(**form_data))
self.transform_data()Renders a user in a table row format.
def show_user(user: User):
...Creates a dialog for adding new users with input fields for name, email, and gender.
def add_customer_button() -> rx.Component:
...Generates a bar chart to visualize the gender distribution of users.
def graph():
...Initializes the application and sets the main page to display the user table and graph.
app = rx.App(...)
app.add_page(index, ...)- Ensure you have Python installed, then create and start a virtual environment
make create-venv- Install the dependencies in your machine
make install- Run the project in your machine
make run-local- After run, the app will be running at: http://localhost:3000 and the backend will be running at: http://0.0.0.0:8000. Open your web browser and navigate to the local server address (usually http://localhost:3000).
- Use the "Add User" button to input new user data.
- View the list of users and the corresponding gender distribution chart.
Feel free to submit issues or pull requests for improvements or bug fixes.
This project is licensed under the Apache License 2.0. See the LICENSE file for details.