9.2 Shiny 이해

Shiny는 R 스크립트를 사용하고 웹에서 매우 쉽게 액세스할 수있는 대시보드를 만드는 데 사용할 수 있다. 그러나 대부분의 R 패키지와 마찬가지로 시스템에 훨씬 더 깊이 들어가 진정한 맞춤형 경험을 구축할 수 있다. 여기서는 Shiny의 좋은 시작점을 제공하기 위해 기본 사항에 대해 논의할 것이다.하지만이 패키지를 실제로 마스터하려면 https://shiny.rstudio.com/에서 자습서와 Shiny로 가능한 것을 보여주는 문서 등을 참고하기 바란다.

Shiny 코드는 사용자 인터페이스와 서버라는 두 가지 책임 영역으로 구분된다. 이를 “프런트 엔드”와 “백 엔드”라고도 한다. 아이디어는 슬라이더 및 버튼과 같은 시각적 사용자 인터페이스 요소는 앱의 프런트 엔드 부분에 위치시키고, 숫자 크런칭 및 데이터 분석은 앱의 백 엔드 부분에 위치시키는 것이다.

생성한 코드에는 사용자 인터페이스와 서버가 모두 포함된 파일이 하나뿐이다. 또한 선택한 옵션이나 앱을 처음 코딩한 사람에 따라 이 두 구성 요소가 별도의 파일로 분리되어 표시된다.

9.2.1 사용자 인터페이스

사용자 인터페이스는 생성된 “app.R”파일에 코딩된 ui 개체에 포함되어 있다. ui 개체를 만드는 코드는 app.R 파일의 위쪽에 있다.

ui <- fluidPage(
    
    # Application title
    titlePanel("Old Faithful Geyser Data"),

    # Sidebar with a slider input for number of bins
    sidebarLayout(sidebarPanel(
        sliderInput("bins", "Number of bins:",
                    min = 1,
                    max = 50,
                    value = 30)
    ),

    # Show a plot of the generated distribution
    mainPanel(
            plotOutput("distPlot")
            )
    )
)

이 전체 코드 블록은 쉼표로 구분된 두 개의 매개 변수 titlePanel과 sidebarLayout로 호출되는 하나의 함수 fluidPage 이다 . 이 함수의 결과는 ui 개체에 할당된다. 이 ui 개체는 이 파일의 끝 부분에서 Shiny 앱을 시작하는 함수에 대한 매개 변수로 사용된다.

잠시 속도를 늦추고 위의 코드를 실제로 살펴보자. 이것은 아마도 코드 작성하는 방법과는 다를 것이다. 함수 이름에 사용된 단어는 무슨 일이 일어나고 있는지를 나타낸다. 잠깐 생각해 보면, 더 복잡한 것이 뒤 따르는 제목을 포함하는 페이지를 보게 될 것이라고 기대할 수 있다(지금은 무시한다). 그림 9-3에서 처음 보았던 “Old Faithful Geyser Data”라는 제목이 어디에서 오는지 명확하게 볼 수 있다.

Shiny 프런트 엔드를 구축하기 위한 필수 프로세스는 다음과 같다. 앱에 무언가를 추가하려면 쉼표로 구분된 목록에 새 함수 호출을 포함한다. 예를 들어, Old Faithful이 무엇인지 설명하기 위해 HTML 단락을 추가하려면 titlePanel 바로 뒤에있는 공간에 p 함수를 추가 할 수 있다.

# Define UI for application that draws a histogram

ui <- fluidPage(

    # Application title
    titlePanel("Old Faithful Geyser Data"),
    p("Old Faithful is a cone geyser located in Yellowstone National Park in Wyoming, 
       United States. It was named in 1870 during the Washburn-Langford-Doane Expedition. 
       Wikipedia 2019."),

결과는 그림 9.4에서 볼 수있는 웹 앱이 된다. 본질적으로 동일한 앱이지만 이제 일부 텍스트 컨텍스트가 포함된다.

Shiny 앱에 단락 추가

그림 9.4: Shiny 앱에 단락 추가

앱을 구축할 때 페이지에 조각을 계속 추가한다. 일부 함수는 p 함수와 같은 간단한 HTML 구성 요소이고 일부는 Shiny에만 해당된다. 종종 앱의 레이아웃을 정의하기 위해 다른 개체 내에 중첩된 개체를 찾는다. 쉼표로 구분된 목록에 매개 변수로 나타나는 두 개의 다른 개체로 구성된 전체 fluidPage의 개체인 sidebarLayout에서 이를 확인할 수 있다.

# Sidebar with a slider input for number of

bins
sidebarLayout(
sidebarPanel(
sliderInput("bins"
,
"Number of bins:"
,
min = 1,
max = 50,
value = 30)
),
# Show a plot of the generated distribution
mainPanel(
plotOutput("distPlot")
)
)

위의 두 구성 요소는 sidebarPanel과 mainPanel 이다.

sidebarPanel에는 사용자가 시각화를 제어하는 ​​데 사용할 슬라이더를 정의하는 또 다른 중첩 개체 sliderInput이 포함되어 있다. 첫 번째 매개 변수 값 bin을 inputID라고하며 웹 앱의 서버 백엔드에서 구성 요소를 식별하는 데 사용된다.

mainPanel에는 그래픽을 표시하는 개체인 plotOutput이 포함된다. plotOutput에서 매개 변수는 inputID로 사용되므로 서버 구성 요소가이 개체를 식별할 수 있으므로 강조 표시된다.

결론적으로, ui 객체는 이제 제목을 표시하는 개체를 포함한다. 제목, 단락, 슬라이더 컨트롤, 플롯 그리고 레이아웃 등을 적용하기 위한 기타의 개체들 등을 표시하는 개체들을 포함한다. 개체들 중 슬라이더와 플롯 등의 두 개체는 서버가 슬라이더에서 값을 검색하고 그래픽을 표시할 위치를 알 수 있도록 inputID 매개 변수도 포함하고 있다.

9.2.2 서버

서버 구성 요소는 백 엔드의 무거운 작업을 처리한다. 이 예에서 서버는 분석을 수행하고 플롯을 생성하는 R 코드를 실행하기 위해 사용자 인터페이스에서 사용자가 정의한 매개 변수를 수집한다. inputID는 입력과 출력 구성 요소를 모두 식별하는 데 사용된다. 다음은 입력과 출력이 강조 표시된 서버 코드이다.

# Define server logic required to draw a histogram

server <- function(input, output) {
    output$distPlot <- renderPlot({

        # generate bins based on input$bins from ui.R
        x <- faithful[, 2]
        bins <- seq(min(x), max(x),
                length.out = input$bins + 1)

        # draw the histogram with the specified
        # number of bins 
        hist(x, breaks = bins, 
                col = 'darkgray',
                border = 'white')
    })
}

위의 코드에서 서버 객체에 익명 함수를 할당하고 있다. 이러한 기능은 위의 사용자 인터페이스에서 수행한 것과 약간 다르다. 사용자 인터페이스에서는 단순히 함수 호출의 결과를 ui 개체에 할당하고 여기서는 익명 함수 형태의 명령 집합을 서버 개체에 할당한다. 이러한 지침은 사용자 인터페이스의 활동에 응답하는 데 사용된다.

굵게 표시된 코드는 서버가 사용자 인터페이스에 연결하는 후크이다. 모든 것은 익명 함수의 입력과 출력 매개 변수에서 참조된다. 입력에는 사용자 인터페이스의 모든 입력 구성 요소에 대한 참조가 포함되고, 출력에는 사용자 인터페이스의 모든 출력 구성 요소에 대한 참조가 포함된다.

달러 기호($)가 따라오는 input 개체와 input 개체의 입력 요소인 $bins의 inputID를 사용하여 입력 구성 요소를 참조한다. “bins”는 슬라이더 개체에 지정된 식별자였다는 것은 기억하는가? input$bins는 사용자가 선택한 현재 값을 반환한다.

여기서 output 개체는 위의 renderPlot 함수에 의해 생성된 모든 코드를 가져온다. 함수의 매개 변수 output$distPlot을 사용하여 유사한 방식으로 이 출력 구성 요소를 참조하는 것을 볼 수 있다. 사용자 입력이 어떻게 수집되고, renderPlot 함수에 포함된 코드 줄에 플롯이 어떻게 푯되는지 알 수 있다.

9.2.3 앱

Shiny가 웹 앱을 만들기 전에 해야 할 일이 하나 더 있다. ui와 서버 구성 요소를 연결한 다음 이 코드로 shinyApp(ui = ui, server = server)를 실행해야 한다.

이것은 상용구 코드로 포함되어 있으며 사용자 인터페이스 및 서버 개체의 이름을 변경하지 않는 한 이 코드를 전혀 건드리지 않아도 된다. 하지만 이 코드의 위치와 이 코드가 앱 인스턴스를 시작한다는 사실을 아는 것은 중요하다.