diff --git a/app.rb b/app.rb index abbd1c7..68c7ce7 100644 --- a/app.rb +++ b/app.rb @@ -2,8 +2,23 @@ require "sinatra/reloader" get("/") do - " -
Define some routes in app.rb
- " + erb(:home_page) +end + +get("/red") do + mood_words = ["urgent", "angry", "important", "mcdonalds", "emergency", "danger"] + @mood_word = mood_words.sample + erb(:red) +end + +get("/yellow") do + mood_words = ["easy", "happy", "golden", "banana", "minion", "star"] + @mood_word = mood_words.sample + erb(:yellow) +end + +get("/blue") do + mood_words = ["sad", "glad", "blue", "sky", "sea", "calm"] + @mood_word = mood_words.sample + erb(:blue) end diff --git a/notes/process.md b/notes/process.md new file mode 100644 index 0000000..8787ffe --- /dev/null +++ b/notes/process.md @@ -0,0 +1,28 @@ +# Mood Ring Project + +### Requirements: +- There should be a homepage + - Should have a title (i.e."Mood Ring") and description +- There should be a way to navigate to pages representing different colors (minium of the three primary colors) +- Color Pages + - Should have a title that corresponds to the color + - Should have a background that matches the color + - Should feature a description with a "mood word" that matches the mood of the color (i.e. yellow -> happy) + - The mood word should cycle on page reload + +### Check your Comprehension: + +We'll use **Ruby with Sinatra** to build this project. + +Core Concepts to practice: +- **Routes:** Creating paths like `/`, `/red`, `/blue` that trigger different pages +- **Views:** Using `.erb` files to show each page visually +- **Dynamic content:** Using Ruby logic to randomly choose mood words +- **Instance variables:** Passing data from the route to the view +- **Layout file:** Using a layout file for shared headers and navigation. + +Stretch Concepts to practice: +- **Dynamic Routes:** Add an input form that lets users select a color +- **Forms:** Add an input form that lets users select a color +- **Query parameters:** Add query params like `/mood?color=yellow` +- **Service Objects:** Create a service object to handle selecting a random mood word diff --git a/views/blue.erb b/views/blue.erb new file mode 100644 index 0000000..9913049 --- /dev/null +++ b/views/blue.erb @@ -0,0 +1,8 @@ + + +<%= @mood_word %>
diff --git a/views/home_page.erb b/views/home_page.erb new file mode 100644 index 0000000..7cfb330 --- /dev/null +++ b/views/home_page.erb @@ -0,0 +1,2 @@ +Description here.
diff --git a/views/layout.erb b/views/layout.erb index d0e831e..3c9d004 100644 --- a/views/layout.erb +++ b/views/layout.erb @@ -1,12 +1,18 @@ -<%= @mood_word %>
diff --git a/views/yellow.erb b/views/yellow.erb new file mode 100644 index 0000000..cfc3045 --- /dev/null +++ b/views/yellow.erb @@ -0,0 +1,8 @@ + + +<%= @mood_word %>