Back to Skills

scaffold-shiny-app

pjt222
Updated Yesterday
4 views
17
2
17
View on GitHub
Metadesigndata

About

This Claude Skill scaffolds new Shiny applications in R using golem (production), rhino (enterprise), or vanilla (prototype) frameworks. It handles project initialization and creates the first module, ideal for starting dashboards, data explorers, or production-ready web apps. Use it to quickly bootstrap interactive R web applications with proper structure.

Quick Install

Claude Code

Recommended
Primary
npx skills add pjt222/agent-almanac -a claude-code
Plugin CommandAlternative
/plugin add https://github.com/pjt222/agent-almanac
Git CloneAlternative
git clone https://github.com/pjt222/agent-almanac.git ~/.claude/skills/scaffold-shiny-app

Copy and paste this command in Claude Code to install this skill

Documentation

搭 Shiny 應用

以 golem、rhino、或素本之搭,立新 Shiny 應用,附生產可用之結構。

用時

  • 立新 R 之交互網應用乃用
  • 立儀表或數探索之原型乃用
  • 立生產 Shiny 為 R 包(golem)乃用
  • 啟企業 Shiny 之項目(rhino)乃用

  • 必要:應用之名
  • 必要:框架之擇(golem、rhino、或素本)
  • 可選:是否含模之搭(默:是)
  • 可選:是否用 renv 管依(默:是)
  • 可選:展之目標(shinyapps.io、Posit Connect、Docker)

第一步:擇框架

依項目之求擇宜之框:

框架宜於結構
golem生產應用以 R 包散R 包附 DESCRIPTION、試、vignette
rhino企業應用附 JS/CSS 之建管線box 模、Sass、JS 打包、rhino::init()
速原型與學一 app.R 或 ui.R/server.R 對

得:依範與團之需明擇框。

敗則:不知何擇,默用 golem——其結構最備,可後簡之。素唯宜於棄之原型。

第二步:搭項目

Golem 之路

golem::create_golem("myapp", package_name = "myapp")

此立:

myapp/
├── DESCRIPTION
├── NAMESPACE
├── R/
│   ├── app_config.R
│   ├── app_server.R
│   ├── app_ui.R
│   └── run_app.R
├── dev/
│   ├── 01_start.R
│   ├── 02_dev.R
│   ├── 03_deploy.R
│   └── run_dev.R
├── inst/
│   ├── app/www/
│   └── golem-config.yml
├── man/
├── tests/
│   ├── testthat.R
│   └── testthat/
└── vignettes/

Rhino 之路

rhino::init("myapp")

此立:

myapp/
├── app/
│   ├── js/
│   ├── logic/
│   ├── static/
│   ├── styles/
│   ├── view/
│   └── main.R
├── tests/
│   ├── cypress/
│   └── testthat/
├── .github/
├── app.R
├── dependencies.R
├── rhino.yml
└── renv.lock

素之路

app.R

library(shiny)
library(bslib)

ui <- page_sidebar(
  title = "My App",
  sidebar = sidebar(
    sliderInput("n", "Sample size", 10, 1000, 100)
  ),
  card(
    card_header("Output"),
    plotOutput("plot")
  )
)

server <- function(input, output, session) {
  output$plot <- renderPlot({
    hist(rnorm(input$n), main = "Random Normal")
  })
}

shinyApp(ui, server)

得:項目目已建,諸搭文件皆存。

敗則:golem 者,確 golem 已裝:install.packages("golem")。rhino 者,自 GitHub 裝:remotes::install_github("Appsilon/rhino")。素者,確 shiny 與 bslib 已裝。

第三步:配依

Golem/素

# Initialize renv
renv::init()

# Add core dependencies
usethis::use_package("shiny")
usethis::use_package("bslib")
usethis::use_package("DT")         # if using data tables
usethis::use_package("plotly")     # if using interactive plots

# Snapshot
renv::snapshot()

Rhino

依管於 dependencies.R

# dependencies.R
library(shiny)
library(bslib)
library(DT)

得:諸依錄於 DESCRIPTION(golem)或 dependencies.R(rhino),且以 renv 鎖。

敗則:renv::init() 敗,察寫之權。包裝敗,察 R 之版合否。

第四步:立首模

Golem

golem::add_module(name = "dashboard", with_test = TRUE)

此立 R/mod_dashboard.Rtests/testthat/test-mod_dashboard.R

Rhino

app/view/dashboard.R

box::use(
  shiny[moduleServer, NS, tagList, h3, plotOutput, renderPlot],
)

#' @export
ui <- function(id) {
  ns <- NS(id)
  tagList(
    h3("Dashboard"),
    plotOutput(ns("plot"))
  )
}

#' @export
server <- function(id) {
  moduleServer(id, function(input, output, session) {
    output$plot <- renderPlot({
      plot(1:10)
    })
  })
}

於別文件 R/mod_dashboard.R 增模函:

dashboardUI <- function(id) {
  ns <- NS(id)
  tagList(
    h3("Dashboard"),
    plotOutput(ns("plot"))
  )
}

dashboardServer <- function(id) {
  moduleServer(id, function(input, output, session) {
    output$plot <- renderPlot({
      plot(1:10)
    })
  })
}

得:模文件已立,UI 與 server 函皆用正之命名空。

敗則:確模於 UI 函之諸入/出 ID 皆用 NS(id) 包之。無命名空,模多用則 ID 衝。

第五步:行應用

# Golem
golem::run_dev()

# Rhino
shiny::runApp()

# Vanilla
shiny::runApp("app.R")

得:應用於瀏覽器啟而無誤。

敗則:察 R 控台之誤辭。常患:包缺(裝之)、端口被用(以 port = 3839 指他端)、UI/server 之語法誤。

  • 應用目附所擇框之正結構
  • shiny::runApp() 啟而無誤
  • 至少一模已搭,附 UI 與 server 函
  • 諸依已錄(DESCRIPTION 或 dependencies.R)
  • renv.lock 捕諸包之版
  • 模用 NS(id) 為命名空之隔

  • 生產用素:素無試之基、無文檔、無展之器。原型外宜用 golem 或 rhino
  • 模缺命名空:模 UI 之每 inputIdoutputId 必以 ns() 包。忘者默致 ID 衝
  • golem 不用 devtools 之流:golem 應用乃 R 包。用 devtools::load_all()devtools::test()devtools::document()——非 source()
  • rhino 不用 box:rhino 用 box 為模引。勿退至 library()——用 box::use() 為明引

  • build-shiny-module — 立可重用之 Shiny 模附正命名空之隔
  • test-shiny-app — 設 shinytest2 與 testServer() 之試
  • deploy-shiny-app — 展於 shinyapps.io、Posit Connect、或 Docker
  • design-shiny-ui — bslib 之主題與響應之布
  • create-r-package — R 包之搭(golem 應用乃 R 包)
  • manage-renv-dependencies — 詳之 renv 依管

GitHub Repository

pjt222/agent-almanac
Path: i18n/wenyan/skills/scaffold-shiny-app
0
agentsagentskillsai-assisted-developmentclaude-codeskillsteams

Related Skills

content-collections

Meta

This skill provides a production-tested setup for Content Collections, a TypeScript-first tool that transforms Markdown/MDX files into type-safe data collections with Zod validation. Use it when building blogs, documentation sites, or content-heavy Vite + React applications to ensure type safety and automatic content validation. It covers everything from Vite plugin configuration and MDX compilation to deployment optimization and schema validation.

View skill

polymarket

Meta

This skill enables developers to build applications with the Polymarket prediction markets platform, including API integration for trading and market data. It also provides real-time data streaming via WebSocket to monitor live trades and market activity. Use it for implementing trading strategies or creating tools that process live market updates.

View skill

creating-opencode-plugins

Meta

This skill helps developers create OpenCode plugins that hook into 25+ event types like commands, files, and LSP operations. It provides the plugin structure, event API specifications, and implementation patterns for JavaScript/TypeScript modules. Use it when you need to intercept, monitor, or extend the OpenCode AI assistant's lifecycle with custom event-driven logic.

View skill

sglang

Meta

SGLang is a high-performance LLM serving framework that specializes in fast, structured generation for JSON, regex, and agentic workflows using its RadixAttention prefix caching. It delivers significantly faster inference, especially for tasks with repeated prefixes, making it ideal for complex, structured outputs and multi-turn conversations. Choose SGLang over alternatives like vLLM when you need constrained decoding or are building applications with extensive prefix sharing.

View skill