Ruby on Rails入門 ~nitrous.io を用いた開発環境構築~€¦ · Ruby on Rails入門...

Ruby on Rails入門 ~nitrous.io を用いた開発環境構築~

2

1. nitrous.ioとは？ 2. nitrous.ioの使用準備 3. Ruby on Rails で webアプリを作成する

もくじ

nitrous.ioとは？

4

WebIDEを統合したPaaS

•WebブラウザだけでWeb開発から公開まで出来てしまう •無料で使える •RubyやPHP、Go等様々な言語に対応 ※ 無料の場合、使用していないとサーバーが止まる ※ 上記情報は 2015/02/23 現在

nitrous.ioとは？

5

エディタ

コンソール (Linuxサーバーへの操作画面)

nitrous.ioの使用準備

7

http://nitrous.io でアカウント登録

アカウント登録

8

メール認証後 http://nitrous.io へ再アクセス

クリック

9

Ruby on Rails のBox(開発環境)を作る

Ruby on Rails をクリック

Create Box をクリック

10

Ruby on Rails のBox(開発環境)を作る

Next をクリック

11

Ruby on Rails のBox(開発環境)を作る

スクロールで最下部へ

Okay, Take Me to my Box! をクリック

12

Ruby on Rails のBox(開発環境)が出来た

IDE (統合開発環境) の画面が表示される

13

IDEを再度開く場合 (http://nitrous.io より)

クリック

14

IDEを再度開く場合 (http://nitrous.io より)

クリック

15

IDEを再度開く場合 (http://nitrous.io より)

赤灯(停止中)の場合 Start をクリック

16

IDEを再度開く場合 (http://nitrous.io より)

IDEをクリック

Ruby on Rails で webアプリを作成する

18

実践を通じて…

1. nitrous.io の使い方がわかるようになる 2. Ruby on Rails を使うと簡単に機能作成ができることを体験してみる

簡単な投稿機能を作ろう

先ずはIDEの画面を表示

コンソールにコマンドを打って作業していく

① rubyのバージョンを確認してみるruby -v

② Railsのバージョンを確認してみるrails -v

③ 『my_app』という名前でアプリ作成rails new my_app

④ 作成した『my_app』ディレクトリに移動cd my_app

⑤ サーバーを起動rails server

Preview > Port 3000 をクリックして ブラウザで確認

ブラウザで確認する

Railsのアプリができている事が確認出来る

キーボード 『Cntrol + C』を押して サーバーを停止する

サーバーの停止方法

⑥ 投稿機能を自動生成する ※改行なし↓rails generate scaffold entry name:string body:text

⑦ 投稿機能のデータベースを作成するrake db:migrate

⑧ サーバーを起動rails server

Preview > Port 3000 をクリックして ブラウザで確認

ブラウザで確認する

http://貴方の環境のURL/entries

Listing entries ができている事を確認できる

28

開発環境の構築は難しいけれど、 nitrous.io など PaaSサービス等を使うと簡単に出来ます。

まとめ

https://schoo.jp/course/137Ruby on Rails 入門 ~ミニブログの制作~（全5回）

Ruby on Railsのオススメ授業