Part4

Additional_exercises/exercise1/exercise1_solution_app.py

@@ -54,7 +54,7 @@ def check_guess(guess, solution):
 )
 
 
-def server(input, ouput, session):
+def server(input, output, session):
     solution = random.choices(colours, k=4)
     log = reactive.value("--- Welcome to the Mastermind Game! ---")
 

PART_1_UI/README.md

@@ -11,7 +11,7 @@ from shiny import App, ui, reactive, render
 app_ui = ui.page_fluid(
 )
 
-def server(input, ouput, session):
+def server(input, output, session):
     pass
 
 app = App(app_ui, server)

PART_1_UI/exercise1/README.md

@@ -21,6 +21,8 @@ _Note: If this is too basic for you, skip to exercise 2_
 
 ![screenshot](exercise1_screenshot.png)
 
+## Shinylive Link
+https://pieterjanvc.github.io/RShiny2Python/shinylive/?part1_ex1
 
 ## References
 

PART_1_UI/exercise1/exercise1_app.py

@@ -7,7 +7,7 @@
 
 
 # You can ignore the sever function for this exercise
-def server(input, ouput, session):
+def server(input, output, session):
     pass
 
 

PART_1_UI/exercise1/exercise1_solution_app.py

@@ -6,14 +6,17 @@
 app_ui = ui.page_fluid(
     ui.panel_title("Shiny Q&A"),
     ui.input_text("name", "Your Name"),
-    ui.input_select("category", "Category", choices=["General", "Development", "Deployment"]),
+    ui.input_select(
+        "category", "Category", choices=["General", "Development", "Deployment"]
+    ),
     ui.input_text_area("question", "Question"),
     ui.input_action_button("send", "Send"),
 )
 
 
 # You can ignore the sever function for this exercise
-def server(input, ouput, session):
+def server(input, output, session):
     pass
 
+
 app = App(app_ui, server)

PART_1_UI/exercise2/README.md

@@ -16,6 +16,8 @@ You will create a UI with a multiple inputs and outputs, organised in 2 columns.
 
 ![screenshot](exercise2_screenshot.png)
 
+## Shinylive Link
+https://pieterjanvc.github.io/RShiny2Python/shinylive/?part1_ex2
 
 ## References
 

PART_1_UI/exercise2/exercise2_app.py

@@ -7,7 +7,7 @@
 
 
 # You can ignore the sever function for this exercise
-def server(input, ouput, session):
+def server(input, output, session):
     pass
 
 

PART_1_UI/exercise2/exercise2_solution_app.py

@@ -31,7 +31,7 @@
 
 
 # You can ignore the sever function for this exercise
-def server(input, ouput, session):
+def server(input, output, session):
     pass
 
 

PART_1_UI/exercise3/README.md

@@ -11,19 +11,15 @@ Create an app with two tabs
   - In the main panel: Card with header "Info" and content paragraph "... some
     info ..."
 - TAB 2:
-  - Shows the [image](www/image.png) located in the `www` folder (_scroll down
-    to see what to do if you are using shinylive_)
+  - Shows the [image](www/image.jpg) located in the `www` folder
 
 ## Expected output
 
 ![screenshot](exercise2_screenshot.png)
 
+## Shinylive Link
+https://pieterjanvc.github.io/RShiny2Python/shinylive/?part1_ex3
+
 ## References
 
 - [layouts](https://shiny.posit.co/py/layouts/)
-
-#### _if you are using Shinylive_
-
-You cant access images from your local machine in Shinylive, so use the
-following URL instead:
-https://pieterjanvc.github.io/RShiny2Python/assets/image.png

PART_1_UI/exercise3/exercise3_app.py

@@ -7,7 +7,7 @@
 
 
 # Ignore for now
-def server(input, ouput, session):
+def server(input, output, session):
     pass
 
 

PART_1_UI/exercise3/exercise3_solution_app.py

@@ -16,13 +16,13 @@
                 ui.card(ui.card_header("Info"), ui.p("... some info ...")),
             ),
         ),
-        ui.nav_panel("Tab 2", ui.img(src="image.png")),
+        ui.nav_panel("Tab 2", ui.img(src="image.jpg")),
     )
 )
 
 
 # Ignore for now
-def server(input, ouput, session):
+def server(input, output, session):
     pass
 
 

PART_2_reactivity/README.md

@@ -109,3 +109,15 @@ def sum():
 
 _Note: there is no equivalent to R's `reactiveValues()`, as this can all be
 achieved with the same `reactive.value()` function using a list or dictionary_
+
+### Caution when updating reactive variables
+
+Whenever you want to assign the content of a reactive variable to a local 
+variable, you must copy it to avoid unexpected behaviour.
+
+Example
+```python
+x = myval().copy()
+_ = x.pop()
+myval.set(x)
+```

PART_2_reactivity/exercise1/README.md

@@ -24,6 +24,9 @@ pandas data frames for this app as this is not the focus of this workshop_
 
 ![screenshot](exercise1_screenshot.png)
 
+## Shinylive Link
+https://pieterjanvc.github.io/RShiny2Python/shinylive/?part2_ex1
+
 ## References
 
 - [render outputs](https://shiny.posit.co/py/components/#outputs)

PART_2_reactivity/exercise1/exercise1_app.py

@@ -40,7 +40,7 @@
 
 
 # SERVER
-def server(input, ouput, session):
+def server(input, output, session):
     # Get the image URL from the data frame
     data[data["title"] == "Alien"]["url_poster"].values[0]
 

PART_2_reactivity/exercise1/exercise1_solution_app.py

@@ -38,7 +38,7 @@
 
 
 # SERVER
-def server(input, ouput, session):
+def server(input, output, session):
     @render.ui
     def img():
         return ui.img(src=data[data["title"] == input.movie()]["url_poster"].values[0])

PART_2_reactivity/exercise2/README.md

@@ -29,6 +29,9 @@ _This image shows the output somewhere in the middle of the game_
 
 ![screenshot](exercise2_screenshot.png)
 
+## Shinylive Link
+https://pieterjanvc.github.io/RShiny2Python/shinylive/?part2_ex2
+
 ## References
 
 - [reactivity](https://shiny.posit.co/py/docs/reactive-foundations.html)

PART_2_reactivity/exercise2/exercise2_app.py

@@ -19,17 +19,17 @@
     ui.input_action_button("guess", "Guess"),
 )
 
+
 # SERVER
-def server(input, ouput, session):
-
-    # None-reactive Hangman game code 
+def server(input, output, session):
+    # None-reactive Hangman game code
     word = random.choice(words)
     guesses = ["m"]
     guess = "e"
-    guesses.append(guess)    
+    guesses.append(guess)
     remaining = [l for l in list(string.ascii_lowercase) if l not in guesses]
     result = " ".join([letter if letter in guesses else " - " for letter in list(word)])
-    ui.h1(result, style = "font-family: monospace; color: #BF408B;")
+    ui.h1(result, style="font-family: monospace; color: #BF408B;")
 
 
 app = App(app_ui, server)

PART_2_reactivity/exercise2/exercise2_solution_app.py

@@ -21,8 +21,7 @@
 
 
 # SERVER
-def server(input, ouput, session):
-
+def server(input, output, session):
     # Select a random word every time the app reloads
     word = random.choice(words)
     guesses = reactive.value([])
@@ -44,7 +43,8 @@ def result():
         return " ".join([letter if letter in x else " - " for letter in list(word)])
 
     @render.ui
-    def progress():        
-        return ui.h1(result(), style = "font-family: monospace; color: #BF408B;")
+    def progress():
+        return ui.h1(result(), style="font-family: monospace; color: #BF408B;")
+
 
 app = App(app_ui, server)

PART_3_express/exercise1/README.md

@@ -36,16 +36,10 @@ _Note that the 3rd tab should only be there for PART 2_
 
 ![screenshot](exercise1_screenshot.png)
 
+## Shinylive Link
+https://pieterjanvc.github.io/RShiny2Python/shinylive/?part3_ex1
+
 ## References
 
 - [layouts](https://shiny.posit.co/py/layouts/)
 - [expressify](https://shiny.posit.co/py/api/express/express.expressify.html)
-
-#### _if you are using Shinylive_
-
-You cant access images from your local machine in Shinylive, so use the
-following URLs instead:
-
-- Young: https://pieterjanvc.github.io/RShiny2Python/assets/young.png
-- Adult: https://pieterjanvc.github.io/RShiny2Python/assets/adult.png
-- Old: https://pieterjanvc.github.io/RShiny2Python/assets/old.png

PART_3_express/exercise1/exercise1_app.py

@@ -5,14 +5,14 @@
 from shiny.express import input, render, ui, app_opts, expressify
 
 # Tab 1 - YOUNG
-# Image: "young.png"
+# Image: "young.jpg"
 # Content: "How it all began ..."
 
 # Tab 2 - ADULT
-# Image: "adult.png"
+# Image: "adult.jpg"
 # Content: " ... what I aspired to ..."
 
 #  --- ONLY NEEDED FOR PART 2 ---
 # Tab 3 - OLD
-# Image: "old.png"
+# Image: "old.jpg"
 # Content: "... what I have become"

PART_3_express/exercise1/exercise1_solution_app.py

@@ -26,19 +26,19 @@ def myTab(tab, image, text):
     with ui.nav_panel("YOUNG"):
         with ui.layout_columns(col_widths=[3, 9]):
             with ui.card():
-                ui.img(src="young.png")
+                ui.img(src="young.jpg")
             with ui.card():
                 ui.p("How it all began ...")
     # Tab 2
     with ui.nav_panel("ADULT"):
         with ui.layout_columns(col_widths=[3, 9]):
             with ui.card():
-                ui.img(src="adult.png")
+                ui.img(src="adult.jpg")
             with ui.card():
                 ui.p("How it all began ...")
     # ---
 
     # PART 2 ...
     # Tab 3
-    myTab("OLD", "old.png", "... what I have become")
+    myTab("OLD", "old.jpg", "... what I have become")
     # ---

PART_3_express/exercise2/README.md

@@ -44,6 +44,9 @@ and max values_
 
 ![screenshot](exercise2_screenshot.png)
 
+## Shinylive Link
+https://pieterjanvc.github.io/RShiny2Python/shinylive/?part3_ex2
+
 ## References
 
 - [dataset](https://catalog.data.gov/dataset/extra-vehicular-activity-eva-us-and-russia)

PART_3_express/exercise2/exercise2_app.py

@@ -21,15 +21,15 @@
 
 
 # Get a simplified list of vehicle types
-vehicleType = list(data["Vehicle"].str.extract(r"([^\s-]+)")[0].unique())
+vehicleTypes = list(data["Vehicle"].str.extract(r"([^\s-]+)")[0].unique())
 vehicleTypes.sort()
 
 # Minimum duration in minutes
 minDuration = 60
 
 # Filter based on vehicleType and minimum duration
 subset = data[
-    (data["Duration"] >= minDuration) & data["Vehicle"].str.contains(vehicleType[0])
+    (data["Duration"] >= minDuration) & data["Vehicle"].str.contains(vehicleTypes[0])
 ]
 
 # Check the subset