├── .devcontainer
    └── devcontainer.json
├── .streamlit
    └── config.toml
├── README.md
└── requirements.txt


/.devcontainer/devcontainer.json:
--------------------------------------------------------------------------------
 1 | // For format details, see https://aka.ms/devcontainer.json. For config options, see the README at:
 2 | // https://github.com/microsoft/vscode-dev-containers/tree/v0.209.6/containers/python-3
 3 | {
 4 | 	"image": "mcr.microsoft.com/devcontainers/python:0-3.11-bullseye",
 5 | 	"customizations": {
 6 | 		"codespaces": {
 7 | 			"openFiles": [
 8 | 				"README.md"
 9 | 			]
10 | 		},
11 | 		"vscode": {
12 | 			"settings": {},
13 | 			"extensions": [
14 | 				"ms-python.python",
15 | 				"ms-python.vscode-pylance"
16 | 			]
17 | 		}
18 | 	},
19 | 	// Use 'forwardPorts' to make a list of ports inside the container available locally.
20 | 	"forwardPorts": [
21 | 		8501
22 | 	],
23 | 	// Use 'postCreateCommand' to run commands after the container is created.
24 | 	// Install app dependencies.
25 | 	"postCreateCommand": "pip3 install --user -r requirements.txt",
26 | 	// Use 'postAttachCommand' to run commands after a tool has attached to the container.
27 | 	// Start the app.
28 | 	"postAttachCommand": {
29 | 		"server": "streamlit hello --server.enableCORS false --server.enableXsrfProtection false"
30 | 	},
31 | 	"portsAttributes": {
32 | 		"8501": {
33 | 			"label": "Application",
34 | 			"onAutoForward": "openPreview"
35 | 		}
36 | 	},
37 | 	// Comment out connect as root instead. More info: https://aka.ms/vscode-remote/containers/non-root.
38 | 	"remoteUser": "vscode",
39 | 	"features": {
40 | 		// Optional features for development - increase container boot time!
41 | 		// "ghcr.io/devcontainers-contrib/features/coverage-py:2": {},
42 | 		// "git": "latest",
43 | 		// "github-cli": "latest"
44 | 	}
45 | }


--------------------------------------------------------------------------------
/.streamlit/config.toml:
--------------------------------------------------------------------------------
1 | [server]
2 | enableCORS = false
3 | enableXsrfProtection = false
4 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # Run Streamlit on Codespaces
 2 | 
 3 | [![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/snehankekre/st-codespaces?quickstart=1)
 4 | 
 5 | Fork this repo, add your Streamlit app to it, and run it on GitHub Codespaces. :balloon:
 6 | 
 7 | ## How it works
 8 | 
 9 | - `.devcontainer/devcontainer.json` creates a container with Python 3.10, installs your app dependencies from `requirements.txt`, and launches `streamlit hello`. 
10 |     -  Edit the `postAttachCommand` to launch your app instead of Streamlit Hello. E.g. if your script is `app.py`:
11 |         ```json
12 |         "postAttachCommand": "streamlit run app.py",
13 |         ```
14 | - It uses `forwardPorts` to make port `8501` inside the container available locally.
15 | - Additionally, it sets the following configuration options in `.streamlit/config.toml` so that the app can be run on Codespaces without the addition of command line arguments:
16 | 
17 |     ```toml
18 |     [server]
19 |     enableCORS = false
20 |     enableXsrfProtection = false
21 |     ```
22 | 
23 | ## Example usage
24 | 
25 | Fork this repo, open it on GitHub Codespaces, wait for the container to load, and click the "Open in browser" button in the bottom right corner when it appears to open the Hello app:
26 | 
27 | ![st-codespaces](https://github.com/snehankekre/st-codespaces/assets/20672874/9e31e47f-1fce-4213-a973-e7ed1259a480)
28 | 
29 | 
30 | If it weren't for the `.streamlit/config.toml` file, you would have had to run the following command:
31 | 
32 | ```bash
33 | streamlit hello --server.enableCORS false --server.enableXsrfProtection false
34 | ```
35 | 


--------------------------------------------------------------------------------
/requirements.txt:
--------------------------------------------------------------------------------
1 | streamlit


--------------------------------------------------------------------------------