403 Simple shiny module
Instructions
Create a simple shiny module to insert ui.card()
with a title and body. Follow the four-part instructions in app.py
to get the module working.
#| standalone: true
#| components: [viewer]
#| layout: horizontal
#| viewerHeight: 800
from shiny.express import ui, render, module
@module
def insert_card(input, output, session, title, body):
with ui.card():
ui.card_header(title)
body
with ui.card():
ui.card_header("Made by hand")
"Card 1 is a basic card"
insert_card(
"card2", # id
"Made by module", # title
"This is the body of card 2",
)
insert_card(
"card3", # id
"Also made by module", # title
"This is the body of card 3",
)
#| standalone: true
#| components: [editor, viewer]
#| layout: horizontal
#| viewerHeight: 800
# Part 1: modify to also import the module function
from shiny.express import ui, render
# Part 2: fix this module:
# 1. Use the `@module` decorator to define a module function.
# 2. The module function should take the following arguments:
# - `input``
# - `output`
# - `session`
# - `title`
# - `body`
@___
def insert_card(___):
with ui.card():
ui.card_header(title)
body
# Leave this code as is.
# It generates a basic card.
with ui.card():
ui.card_header("Made by hand")
"Card 1 is a basic card"
# Part 3: Insert a card using the module function.
insert_card(
---, # unique id
---, # title
---, # body
)
# Part 4: bonus points for inserting another card
#| standalone: true
#| components: [editor, viewer]
#| layout: horizontal
#| viewerHeight: 800
from shiny.express import ui, render, module
@module
def insert_card(input, output, session, title, body):
with ui.card():
ui.card_header(title)
body
with ui.card():
ui.card_header("Made by hand")
"Card 1 is a basic card"
insert_card(
"card2", # id
"Made by module", # title
"This is the body of card 2",
)
insert_card(
"card3", # id
"Also made by module", # title
"This is the body of card 3",
)
The source code for this exercise is at https://github.com/posit-conf-2024/intro-to-shiny-for-python/tree/main/docs/exercises/403-simple-module.