https://github.com/santoshshinde2012/streamlit-app
Streamlit Demo App
https://github.com/santoshshinde2012/streamlit-app
data-science python react streamlit
Last synced: 2 months ago
JSON representation
Streamlit Demo App
- Host: GitHub
- URL: https://github.com/santoshshinde2012/streamlit-app
- Owner: santoshshinde2012
- Created: 2024-07-31T16:29:30.000Z (almost 2 years ago)
- Default Branch: master
- Last Pushed: 2024-08-03T18:54:21.000Z (almost 2 years ago)
- Last Synced: 2026-03-30T07:56:11.974Z (3 months ago)
- Topics: data-science, python, react, streamlit
- Language: CSS
- Homepage:
- Size: 473 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 📦 Streamlit App
Streamlit is a powerful tool for creating interactive web applications using Python. However, there are times when the built-in components may not meet your specific needs. In such cases, you can create custom components using modern front-end technologies like Vite, React, and TypeScript. This guide will walk you through the process of setting up a custom component for your Streamlit app, enabling a seamless integration of sophisticated front-end features with the simplicity of Python.
## How to run locally
1. Make sure to install required python packages
```
pip install -r requirements.txt
```
2. Make sure to install all required npm packages in frontend project
```
cd streamlit-app/rbutton/frontend
npm install
```
3. If you want to run application dev mode update `.env` file
```
DEV_MODE=true
// this path is for your running frontend application
FRONTEND_HOST=http://localhost:5173
```
4. If you want to run production build
```
cd streamlit-app/rbutton/frontend
npm run build
```
## Demo App
[](https://app-app-jxe6thwxf43qfvabwmrrlk.streamlit.app/)
## Project Structure
````
streamlit-app/
├── streamlit_app.py
├── .env
├── requirements.txt
├── rbutton/
│ ├── __init__.py
│ ├── frontend/
│ │ ├── dist/
│ │ │ ├── index.html
│ │ │ ├── assets
│ │ │ │ ├── index.js
│ │ │ │ └── index.css
│ │ ├── src/
│ │ │ ├── App.tsx
│ │ │ ├── assets
│ │ │ │ └── ...
│ │ │ ├── components
│ │ │ │ └── ...
│ │ │ └── ...
│ │ ├── package.json
│ │ └── vite.config.ts
````
## Further Reading
- [30 Days of Streamlit](https://30days.streamlit.app/)
- [How to build your own Streamlit component](https://blog.streamlit.io/how-to-build-your-own-streamlit-component/)
- [Understanding Streamlit's client-server architecture](https://docs.streamlit.io/develop/concepts/architecture/architecture)
- [Wiki](https://github.com/streamlit/streamlit/wiki)
### Connect with me on
