Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/stellarfx/shiny-svelte
✨🧡 A project that integrates R Shiny with a modern UI framework using Svelte and ViteJS.
https://github.com/stellarfx/shiny-svelte
r shiny shiny-apps svelte svelte5 typescript vite vitejs
Last synced: 27 days ago
JSON representation
✨🧡 A project that integrates R Shiny with a modern UI framework using Svelte and ViteJS.
- Host: GitHub
- URL: https://github.com/stellarfx/shiny-svelte
- Owner: StellarFX
- License: mit
- Created: 2024-12-12T20:10:07.000Z (about 1 month ago)
- Default Branch: main
- Last Pushed: 2024-12-12T21:29:52.000Z (about 1 month ago)
- Last Synced: 2024-12-12T21:30:18.977Z (about 1 month ago)
- Topics: r, shiny, shiny-apps, svelte, svelte5, typescript, vite, vitejs
- Language: R
- Homepage:
- Size: 38.1 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Shiny Svelte
A project that integrates R Shiny with a modern UI framework using Svelte and ViteJS.
## Table of Contents
- [About](#about)
- [Getting Started](#getting-started)
- [Scripts](#scripts)
- [Dependencies](#dependencies)
- [Development Workflow](#development-workflow)
- [Building for Production](#building-for-production)
## About
This project combines the power of R Shiny for server-side computations with Svelte for creating modern, interactive front-end user interfaces. The development setup is powered by ViteJS for fast bundling and hot-module reloading.
## Getting Started
### Prerequisites
Ensure you have the following installed:
- [Node.js](https://nodejs.org/) (v18 or later recommended)
- [Yarn](https://classic.yarnpkg.com/) (v1.22.x)
- [R](https://www.r-project.org/) (v4.0 or later)
### Installation
Clone the repository and install dependencies:
```bash
# Clone the repository
git clone https://github.com/StellarFX/shiny-svelte.git
# Navigate into the project directory
cd shiny-svelte
# Install dependencies
yarn install
```
## Scripts
### Development
- **`yarn dev`**
Starts both the UI and Shiny server in development mode. This allows you to develop the front-end and back-end simultaneously with hot reloading.
- **`yarn dev:ui`**
Starts the Vite development server for the Svelte UI.
- **`yarn dev:shiny`**
Launches the Shiny server by running the `global.R` script.
### Production
- **`yarn build:ui`**
Builds the Svelte UI for production.
- **`yarn preview`**
Previews the production build locally.
### Code Checks
- **`yarn check:ui`**
Runs static type checks for the Svelte components and TypeScript files.
## Dependencies
### Core
- [Svelte](https://svelte.dev/) (UI framework)
- [R Shiny](https://shiny.rstudio.com/) (Server-side framework for R)
### DevDependencies
- [Vite](https://vitejs.dev/) (Bundler)
- [TypeScript](https://www.typescriptlang.org/) (Static type-checking)
- [Svelte Check](https://github.com/sveltejs/language-tools) (Svelte diagnostics tool)
- [Concurrently](https://github.com/open-cli-tools/concurrently) (Run multiple commands concurrently)
- [Cross-Env](https://github.com/kentcdodds/cross-env) (Set environment variables)
## Development Workflow
1. Start the development servers:
```bash
yarn dev
```
This will start the UI and Shiny servers in parallel.
2. Open the application in your browser:
- Shiny App: [`http://localhost:7000`](http://localhost:7000)
- ~~Frontend: `http://localhost:5173`~~.
3. Make changes to the Svelte components or R scripts, and the application will reload automatically.
## Building for Production
1. Build the UI for production:
```bash
yarn build:ui
```
The production-ready files will be in the `dist` directory.
2. Deploy the `dist` directory alongside your Shiny server for full integration.