いろんなWebフレームワークの「Hello World」をやってみた その１

はじめに

HALアドベントカレンダー1日目を担当する、HAL東京IT学部4年のおりばーです。
去年のHALアドベントカレンダーからもう1年が経ってしまい、懐かしく感じます。

HAL Advent Calendar 2017 - Qiita

去年まではIT学部とゲーム学部が主体となって記事を書いていたのですが、今年は映像学科なども参戦しています。
また、後輩も積極的に参加してくれているので、とても楽しみです。頑張っていきましょう！

この記事の目的

いろんな言語で実装されている様々なWebフレームワークを体験してみようと思い、記事にしました。

有名なWebフレームワークは RubyのRuby on Rails、PHPのLaravel、PythonのDjangoなどがありますが、まだフレームワークを使っとことがない人に向けた、「こんな言語のこんなフレームワークがあるよ〜」って意味を込めた記事になっています。

注意：開発環境はMac OSで行なっていきます。Dockerは使いません。DBはMySql5.7でやっていきます。
また、フレームワークを利用するために必要な言語の導入は省きます。

「Hello World」を定義する

今回、様々なWebフレームワークを試していくのですが、ゴール地点を定めたいと思います。

myapp_developmentデータベースの特定のテーブルに格納されている「Hello World!」という文字列をWebブラウザからアクセスしたら表示する

をゴールにしたいと思います。

各フレームワークで実装してみる

Ruby on Rails

概要

Ruby on Rails（ルビーオンレイルズ）は、オープンソースのWebアプリケーションフレームワークである。RoRまたは単にRailsと呼ばれる。その名にも示されているようにRubyで書かれている。またModel View Controller（MVC）アーキテクチャに基づいて構築されている。

実アプリケーションの開発を他のフレームワークより少ないコードで簡単に開発できるよう考慮し設計されている。Railsの公式なパッケージはRubyのライブラリやアプリケーションの流通ルートであるRubyGemsにより配布されている。

出典: フリー百科事典『ウィキペディア（Wikipedia）』

HP: https://rubyonrails.org/
GitHub スター数: 41000 over

準備

① Railsをインストール

$ gem install rails

② Railsアプリケーションを作成する

$ rails new myapp --database=mysql

③ サーバを起動する

$ cd myapp
$ rails server
$ open http://localhost:3000

Hello Worldを実装

① MySqLを起動

$ mysql.server start

② database.yml を編集

config/database.yml

...
 default: &default
    adapter: mysql2
    encoding: utf8
    pool: <%= ENV.fetch("RAILS_MAX_THREADS") { 5 } %>
    username: root
    password: <DBのrootパスワード>
    socket: /tmp/mysql.sock
...

③ データベースセットアップ

$ rails db:create

④ モデル作成

$ rails generate model HelloWorld text:string
$ rails db:migrate

⑤ データ挿入

db/seeds.rb

HelloWorld.create(text: 'Hello World!')

$ rails db:seed

⑥ コントローラを作成

$ rails g controller hello index

app/controllers/hello_controller.rb

class HelloController < ApplicationController
  def index
    @hello_world = HelloWorld.first
  end
end

⑦ routeを追加

config/routes.rb

Rails.application.routes.draw do
   root 'hello#index'
end

⑧ ビューを編集

app/views/hello/index.html.erb

<%=@hello_world.text %>

⑨ Webブラウザでアクセスする
http://localhost:3000 にアクセス

Laravel

概要

Laravel は、MVCのWebアプリケーション開発用の無料・オープンソースのPHPで書かれたWebアプリケーションフレームワークである。LaravelはMITライセンスの下でリリースされており、そのソースコードはGitHubにホスティングされている。マイクロソフトの.NETの開発に関わっていたTaylor Otwell が開発した。

GitHubでのスター獲得数がPHPフレームワークの中で最も多いなど、人気のフレームワークの1つとなっている。

2018年9月現在、最新の5.7系の対応PHPはバージョン 7.1.3以上となっている。

出典: フリー百科事典『ウィキペディア（Wikipedia）』

HP: https://laravel.com/
GitHub スター数: 47000 over

準備

① composerのインストール

$ brew install composer

② Laravelのインストール

$ composer global require "laravel/installer"

③ 環境変数の設定

~/.bash_profile

...
export PATH="$PATH:$HOME/.config/composer/vendor/bin"

④ Laravelアプリケーションを作成する

$ laravel new myapp

⑤ サーバを起動する

$ cd myapp
$ php artisan serve
$ open http://localhost:8000

Hello Worldを実装

① .envの編集

...
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=myapp_development
DB_USERNAME=root
DB_PASSWORD=<DBのrootパスワード>
...

② データベースの作成

$ mysql -uroot -p
mysql> CREATE DATABASE `myapp_development` DEFAULT CHARACTER SET = `utf8mb4`;

③ モデルの作成

$ php artisan make:model HelloWorld --migration

database/migrations/20xx_xx_xx_xxxxxx_create_hello_worlds_table.php

...
    public function up()
    {
        Schema::create('flights', function (Blueprint $table) {
            $table->increments('id');
            $table->string('text');
            $table->timestamps();
        });
    }
...

$ php artisan migrate

④ データ挿入

$ php artisan make:seeder HelloWorldsTableSeeder

database/seeds/HelloWorldsTableSeeder.php

...
    public function run()
    {
        DB::table('hello_worlds')->insert([
            'text' => 'Hello World!'
        ]);
    }
...

$ php artisan db:seed --class=HelloWorldsTableSeeder

⑤ コントローラの作成

$ php artisan make:controller HelloController

app/Http/Controllers/HelloController.php

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class HelloController extends Controller
{
  public function index()
  {
    $hello_world = \App\HelloWorld::first();
    return view('hello')->with('hello_world',$hello_world);
  }
}

⑥ routeの追加

routes/web.php

Route::get('/', 'HelloController@index');

⑦ ビューの追加

resources/views/hello.blade.php

<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="UTF-8">
    <title>Hello World!</title>
  </head>
  <body>
    {{$hello_world->text}}
  </body>
</html>

⑧ Webブラウザでアクセスする
サーバを再起動して、 http://localhost:8000 にアクセス

Django

概要

Django（ジャンゴ）は、Pythonで実装されたWebアプリケーションフレームワーク。 model-view-controller デザインパターンに緩やかに従う。 もともとはローレンス (カンザス州)にある World Company のために、ニュース系のサイトを管理する目的で開発され、2005年7月に BSD License で公式にリリースされた。フレームワークはジプシー・スウィングのギタリストであるジャンゴ・ラインハルトにちなんで命名された。

Django の第一の目的は、複雑なデータベース主体の Web サイトの構築を簡単にすることである。Django はコンポーネントの再利用性と'pluggability'、素早い開発、DRY (Don't Repeat Yourself)の原則に力点を置いている。ファイルやデータのモデルにいたるまで、Python が一貫して用いられている。

Django はまた、動的に生成され、データモデルの定義を通じて完全に構成することができる、データベース管理 CRUD インターフェイスをオプションで提供する。

出典: フリー百科事典『ウィキペディア（Wikipedia）』

HP: https://www.djangoproject.com/
GitHub スター数: 37000 over

準備

① Djangoのインストール

$ pip install django

② Djangoプロジェクトを作成する

$ django-admin startproject mysite

③ サーバを起動する

$ cd mysite
$ python manage.py runserver
$ open http://localhost:8000

④ Fjangoアプリケーションを作成する

$ python manage.py startapp myapp

Hello Worldを実装

① データベースの作成

$ mysql -uroot -p
mysql> CREATE DATABASE `myapp_development` DEFAULT CHARACTER SET = `utf8mb4`;

② データベースの設定

PythonでMySQLを利用する為のモジュールをpipでインストール

$ pip install PyMySQL

settings.py を編集

mysite/settings.py

...
DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.mysql',
        'NAME': 'myapp_development',
        'USER': 'root',
        'PASSWORD': '<DBのrootパスワード>',
        'HOST': '',
        'PORT': '',
    }
}
...

モジュールをインポートする

manage.py

...
import pymysql
pymysql.install_as_MySQLdb()
...

③ モデルの作成

myapp/models.py

...
class HelloWorld(models.Model):
   text = models.CharField(max_length=200)

mysite/settings.py

...
INSTALLED_APPS = [
     'myapp.apps.MyappConfig',
     'django.contrib.admin',
     'django.contrib.auth',
     'django.contrib.contenttypes',
     'django.contrib.sessions',
     'django.contrib.messages',
     'django.contrib.staticfiles',
]
...

マイグレーションを実行する

$ python manage.py makemigrations myapp
$ python manage.py migrate

④ 初期データの挿入

$ mkdir myapp/fixtures

myapp/fixtures/fixture.json

[
  {
    "model": "myapp.HelloWorld",
    "pk": 1,
    "fields": {
      "text": "Hello World!"
    }
  }
]

$ python manage.py loaddata myapp/fixtures/fixture.json

⑤ ルーティングの設定

プロジェクトのルーティングに追加

mysite/urls.py

from django.conf.urls import include, url
from django.contrib import admin

urlpatterns = [
   url(r'^admin/', admin.site.urls),
   url(r'', include('myapp.urls')),
]

myappのルーティングに追加

myapp/urls.py

from django.conf.urls import url
from . import views

urlpatterns = [
    url(r'^$', views.index),
]

⑥ ビューの作成

myapp/views.py

# -*- coding: utf-8 -*-
from __future__ import unicode_literals

from django.shortcuts import render
from myapp.models import HelloWorld

def index(request):
     hello_world = HelloWorld.objects.first()
     return render(request, 'index.html', {'hello_world':hello_world})

⑦ テンプレートの作成

$ mkdir myapp/templates

myapp/templates/index.html

<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="UTF-8">
    <title>Hello World!</title>
  </head>
  <body>
    {{ hello_world.text }}
  </body>
</html>

⑧ Webブラウザでアクセスする
サーバを再起動して、 http://localhost:8000 にアクセス

おわりに

次回は JavaやScalaで実装できるPlayFrameworkやGoのフレームワークであるecho、JavascriptのフレームワークであるKoaなどを紹介していこうと思います。

また、今回の内容で、もっと簡単に Hello World できるよ！って教えてくれる方がいらっしゃいましたら、コメントか編集リクエストしていただけると幸いです。

ありがとうございました。