Let's make Rails-like (View)

Introduction

It is often said that application development using rails is black-boxed.

Therefore, I will dissect it little by little. As a means of doing so, we will create Rails-like.

This time, as a view edition, we aim to set up a server and display the homepage using WEBRick, which is a ruby library.

The target directory structure is as follows.

directory
  |- app
      |- views
           |- basic_pages
               |- home.html.erb
  |- srv.rb

environment

・ Ruby 2.7.1 -Ubuntu 20.04.1 LTS

Target readers

・ Those who are interested in this article ・ Those who have used Rails and want to think about how it works

point

    1. Set up a server ① Create a script file (srv.rb) to set up a server ② Execute srv.rb

  2. Display home page ① Create a homepage view file (app / views / basic_pages / home.html) ② Set the root path on the homepage ③ Correspond to erb file

1. 1. Set up a server

First, let's set up a server. In other words, let's make it accessible to http: // localhost: 3000 (hereafter root path). If you are not doing anything, you should not be able to access this address.

Therefore, in order to set up a server, you need to do the following two things.

① Create a script file (srv.rb) to set up a server ② Execute srv.rb

① Create a script file to set up a server

The meaning of this file is to set up a server.

src.rb


require 'webrick' 

op = { BindAddress:  "127.0.0.1", Port: 3000, DocumentRoot: "." }

s = WEBrick::HTTPServer.new(op)
s.start

Reference ↓ ↓ ↓ https://techacademy.jp/magazine/19901

② Execute srv.rb

Type the following command in the terminal.

Terminal


ruby srv.rb

Then you should see the following log.

[2020-11-05 19:36:40] INFO  WEBrick 1.6.0
[2020-11-05 19:36:40] INFO  ruby 2.7.1 (2020-03-31) [x86_64-linux]
[2020-11-05 19:36:40] INFO  WEBrick::HTTPServer#start: pid=15542 port=3000
::1 - - [05/Nov/2020:19:36:43 JST] "GET / HTTP/1.1" 200 1022
- -> /

When you access the root path, Screenshot from 2020-11-05 19-37-22.png The screen should look like this. The server is now up.

If you want to stop the server, press Ctrl </ em> + C </ em>.

2. Display home page

Next, let's create a home page and make it accessible. We will do it in the following order.

① Create a homepage view file (app / views / basic_pages / home.html) ② Set the root path on the homepage ③ Correspond to erb file

① Create a homepage view file (app / views / basic_pages / home.html)

app/views/basic_pages/home.html


<html>
　<head>
    <meta charset="utf-8">
  </head>
  <body>
    <h1>home page</h1>
    <p>Hello, World</p>
  </body>
</html>

When you set up the server and access it, it should look like the one below. Screenshot from 2020-11-05 20-12-18.png From here, click "app /" → "views /" → "basic_pages /" → "home.html" or go to http: //localhost: 3000/app/views/basic_pages/home.html You can display the home page by accessing it directly. Screenshot from 2020-11-05 20-25-38.png

② Set the root path on the homepage

Let's set the URL of the home page to http: // localhost: 3000.

srv.rb


require 'webrick'

op = {
    BindAdress: "127.0.1",
    Port: 3000,
    DocumentRoot: "app/views/basic_pages/home.html"
    #Change root path(From now on, changing the root path means changing the description here.) 
}

s = WEBrick::HTTPServer.new(op)
s.start

Now when you access the root path, you will see the home page.

③ Correspond to erb file

Try changing the extension of the homepage file name from .html to .html.erb. Along with that, the contents of the root path and homepage files are as follows.

srv.rb


require 'webrick'

op = {
    BindAdress: "127.0.1",
    Port: 3000,
    DocumentRoot: "app/views/basic_pages/home.html.erb"
    #Change root path
}

s = WEBrick::HTTPServer.new(op)
s.start

erb:app/views/basic_pages/home.html.erb


<html>
  <head>
    <meta charset="utf-8">
  </head>
  <body>
    <h1>home page</h1>
    <p>Hello, World</p>
    <%= 1 + 4 %> <!--add to-->
  </body>
</html>

If the erb file is reflected, it should be "5" under "Hello, World". However, it becomes "<% = 1 + 4%>".

In other words, the erb file is treated as an html file.

To reflect the extension erb, you need to change the setting (srv.rb).

srv.rb


require 'webrick'

op = {
    BindAdress: "127.0.1",
    Port: 3000,
    DocumentRoot: "app/views/basic_pages/home.html.erb"
}

#Supports extension erb
WEBrick::HTTPServlet::FileHandler.add_handler("erb", WEBrick::HTTPServlet::ERBHandler)

s = WEBrick::HTTPServer.new(op)
s.start

This should reflect the extension erb. Let's rebuild the server and access the root path.

It should be "5" instead of "<% = 1 + 4%>".

Reference ↓ ↓ ↓ https://www.kkaneko.jp/pro/rubydb/webrick.html

Summary

This time, because it is a view edition, we implemented server construction using WEBRick and homepage display.

In the future, I will also do the controller edition and the model edition.

Recommended Posts