From babe8096a7366d0a0f0ad8dc4f98eb4f863ba50a Mon Sep 17 00:00:00 2001 From: Goh Matsumoto Date: Mon, 17 Jul 2023 13:43:07 +0900 Subject: [PATCH 1/4] Format the code --- _pages/sinatra-app-tutorial.md | 72 ++++++++-------------------------- 1 file changed, 17 insertions(+), 55 deletions(-) diff --git a/_pages/sinatra-app-tutorial.md b/_pages/sinatra-app-tutorial.md index 7d88be07..c0b661fa 100644 --- a/_pages/sinatra-app-tutorial.md +++ b/_pages/sinatra-app-tutorial.md @@ -36,27 +36,19 @@ get '/' do end {% endhighlight %} - You can actually call your Ruby file whatever you'd like. `vote.rb` for instance would totally work as well, when used consistently. But [suffragist](https://www.vocabulary.com/dictionary/suffragist) actually references to a super important event in the women's rights movement, so let's just go with that for now! - ### Run your app -Go to the directory where you put your app and run `ruby suffragist.rb`. -Now you can visit localhost:4567. You should -see a ‘Hello, voter!’ page, which means that the generation of your new -app worked correctly. Hit Ctrl+C in the terminal to shut down the server. If Ctrl+C does not work for you it means you are probably Windows user and Ctrl+Z/ Ctrl+Pause / Ctrl+Break will fix the issue) +Go to the directory where you put your app and run `ruby suffragist.rb`. Now you can visit localhost:4567. You should see a ‘Hello, voter!’ page, which means that the generation of your new app worked correctly. Hit Ctrl+C in the terminal to shut down the server. If Ctrl+C does not work for you it means you are probably Windows user and Ctrl+Z / Ctrl+Pause / Ctrl+Break will fix the issue) {% coach %} Explain POST and GET methods, and how to communicate with the browser. {% endcoach %} - - ### Add the index view -To keep everything in order let’s make -a directory for our views (and name it `views`). +To keep everything in order let’s make a directory for our views (and name it `views`). Put this code into an `index.erb` file in the `views` directory: @@ -111,20 +103,15 @@ get '/' do end {% endhighlight %} -Run `ruby suffragist.rb`, check your -results and shut down the server with Ctrl+C. +Run `ruby suffragist.rb`, check your results and shut down the server with Ctrl+C. {% coach %} -Talk a little about HTML and erb. Explain -templates. Explain what global constants are. +Talk a little about HTML and erb. Explain templates. Explain what global constants are. {% endcoach %} - - ### Templates -Adjust the `index.erb` file in the `views` -directory and add the `

…

` line: +Adjust the `index.erb` file in the `views` directory and add the `

…

` line: {% highlight erb %} @@ -143,12 +130,9 @@ end {% endhighlight %} {% coach %} -Explain what instance variables are and -how Sinatra makes them visible in the views. +Explain what instance variables are and how Sinatra makes them visible in the views. {% endcoach %} - - ### Add the ability to POST results Put this into `suffragist.rb`: @@ -161,8 +145,7 @@ post '/cast' do end {% endhighlight %} -Create a new file in the `views` directory, `cast.erb`, -and put there some HTML with embedded Ruby code: +Create a new file in the `views` directory, `cast.erb`, and put there some HTML with embedded Ruby code: {% highlight erb %} @@ -184,16 +167,12 @@ and put there some HTML with embedded Ruby code: {% endhighlight %} {% coach %} -Explain how POST works. How to catch what -was sent in the form? Where do `params` come from? +Explain how POST works. How to catch what was sent in the form? Where do `params` come from? {% endcoach %} - - ### Factor out a common layout -Create a `layout.erb` file in the `views` -directory. Put the following in there: +Create a `layout.erb` file in the `views` directory. Put the following in there: {% highlight erb %} @@ -214,16 +193,12 @@ directory. Put the following in there: {% endhighlight %} -Remove the above part from the other two templates -(`index.erb` and `cast.erb` in the `views` directory). +Remove the above part from the other two templates (`index.erb` and `cast.erb` in the `views` directory). {% coach %} -Talk about the structure of HTML documents and how factoring -out common code work in general. Explain what `yield` does. +Talk about the structure of HTML documents and how factoring out common code work in general. Explain what `yield` does. {% endcoach %} - - ### Add the results route and the results view Paste the following code into `suffragist.rb`: @@ -250,16 +225,12 @@ Create a new file in the `views` directory, called `results.erb`.

Cast more votes!

{% endhighlight %} -Run `ruby suffragist.rb`, check -your results and shut down the server with Ctrl+C. +Run `ruby suffragist.rb`, check your results and shut down the server with Ctrl+C. {% coach %} -Explain HTML tables and how the -missing values from the hash default to zero. +Explain HTML tables and how the missing values from the hash default to zero. {% endcoach %} - - ### Persist the results using YAML::Store Time for something new! Let’s store our choices. @@ -270,17 +241,14 @@ Add the following to the top of `suffragist.rb`: require 'yaml/store' {% endhighlight %} -Add some more code into `suffragist.rb` – replace -`post '/cast'` and `get '/results'` with the following: +Add some more code into `suffragist.rb` – replace `post '/cast'` and `get '/results'` with the following: {% highlight ruby %} @@ -308,24 +276,18 @@ end Explain what YAML is. {% endcoach %} - ### See how the YAML file changes when votes are cast Let’s open `votes.yaml`. And vote. And check again. {% coach %} -There will be situations when one or more students will -forget to shut down the server before running it again. It’s a good -opportunity to search the Internet for a solution. They don’t -have to know everything about killing processes to find a solution. +There will be situations when one or more students will forget to shut down the server before running it again. It’s a good opportunity to search the Internet for a solution. They don’t have to know everything about killing processes to find a solution. {% endcoach %} {% coach %} In the end explain shortly the differences between Sinatra and Rails. {% endcoach %} - - ## Play with the app Try to change things in the app in any way you see fit: From e9dc147e5112cb83a0234dbf7db89d87afe61787 Mon Sep 17 00:00:00 2001 From: Goh Matsumoto Date: Mon, 17 Jul 2023 13:49:11 +0900 Subject: [PATCH 2/4] Use ASCII characters --- _pages/sinatra-app-tutorial.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/_pages/sinatra-app-tutorial.md b/_pages/sinatra-app-tutorial.md index c0b661fa..61c3d1d0 100644 --- a/_pages/sinatra-app-tutorial.md +++ b/_pages/sinatra-app-tutorial.md @@ -40,7 +40,7 @@ You can actually call your Ruby file whatever you'd like. `vote.rb` for instance ### Run your app -Go to the directory where you put your app and run `ruby suffragist.rb`. Now you can visit localhost:4567. You should see a ‘Hello, voter!’ page, which means that the generation of your new app worked correctly. Hit Ctrl+C in the terminal to shut down the server. If Ctrl+C does not work for you it means you are probably Windows user and Ctrl+Z / Ctrl+Pause / Ctrl+Break will fix the issue) +Go to the directory where you put your app and run `ruby suffragist.rb`. Now you can visit localhost:4567. You should see a 'Hello, voter!' page, which means that the generation of your new app worked correctly. Hit Ctrl+C in the terminal to shut down the server. If Ctrl+C does not work for you it means you are probably Windows user and Ctrl+Z / Ctrl+Pause / Ctrl+Break will fix the issue) {% coach %} Explain POST and GET methods, and how to communicate with the browser. @@ -48,7 +48,7 @@ Explain POST and GET methods, and how to communicate with the browser. ### Add the index view -To keep everything in order let’s make a directory for our views (and name it `views`). +To keep everything in order let's make a directory for our views (and name it `views`). Put this code into an `index.erb` file in the `views` directory: @@ -233,7 +233,7 @@ Explain HTML tables and how the missing values from the hash default to zero. ### Persist the results using YAML::Store -Time for something new! Let’s store our choices. +Time for something new! Let's store our choices. Add the following to the top of `suffragist.rb`: @@ -278,10 +278,10 @@ Explain what YAML is. ### See how the YAML file changes when votes are cast -Let’s open `votes.yaml`. And vote. And check again. +Let's open `votes.yaml`. And vote. And check again. {% coach %} -There will be situations when one or more students will forget to shut down the server before running it again. It’s a good opportunity to search the Internet for a solution. They don’t have to know everything about killing processes to find a solution. +There will be situations when one or more students will forget to shut down the server before running it again. It's a good opportunity to search the Internet for a solution. They don't have to know everything about killing processes to find a solution. {% endcoach %} {% coach %} From 6dbf74deb76c7294820d291d13b062737bb90f64 Mon Sep 17 00:00:00 2001 From: Goh Matsumoto Date: Mon, 17 Jul 2023 13:50:38 +0900 Subject: [PATCH 3/4] Fix the typo --- _pages/sinatra-app-tutorial.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/_pages/sinatra-app-tutorial.md b/_pages/sinatra-app-tutorial.md index 61c3d1d0..f6573913 100644 --- a/_pages/sinatra-app-tutorial.md +++ b/_pages/sinatra-app-tutorial.md @@ -40,7 +40,7 @@ You can actually call your Ruby file whatever you'd like. `vote.rb` for instance ### Run your app -Go to the directory where you put your app and run `ruby suffragist.rb`. Now you can visit localhost:4567. You should see a 'Hello, voter!' page, which means that the generation of your new app worked correctly. Hit Ctrl+C in the terminal to shut down the server. If Ctrl+C does not work for you it means you are probably Windows user and Ctrl+Z / Ctrl+Pause / Ctrl+Break will fix the issue) +Go to the directory where you put your app and run `ruby suffragist.rb`. Now you can visit localhost:4567. You should see a 'Hello, voter!' page, which means that the generation of your new app worked correctly. Hit Ctrl+C in the terminal to shut down the server. If Ctrl+C does not work for you it means you are probably Windows user and Ctrl+Z / Ctrl+Pause / Ctrl+Break will fix the issue. {% coach %} Explain POST and GET methods, and how to communicate with the browser. From f9d838250c16168a9082369ed13b89a26789c3cb Mon Sep 17 00:00:00 2001 From: Goh Matsumoto Date: Mon, 17 Jul 2023 13:58:27 +0900 Subject: [PATCH 4/4] Fix the style --- _pages/sinatra-app-tutorial.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/_pages/sinatra-app-tutorial.md b/_pages/sinatra-app-tutorial.md index f6573913..1b81d2bc 100644 --- a/_pages/sinatra-app-tutorial.md +++ b/_pages/sinatra-app-tutorial.md @@ -22,7 +22,9 @@ Explain shortly what [Sinatra](https://sinatrarb.com) is. Remember how we needed to install Ruby on Rails? Similarly we need to install Sinatra: -`gem install sinatra webrick` +{% highlight sh %} +gem install sinatra webrick +{% endhighlight%} ### Create your first Sinatra app