Submit Search
【勉強会】 はじめてのRuby on Rails 4入門
Download as PPTX, PDF
2 likes
626 views
Yuta Nakamura
【勉強会】 はじめてのRuby on Rails 4入門 の資料です。
Software
Read more
1 of 34
Download now
Download to read offline
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
More Related Content
PDF
僕の Serverless web application
祐樹 夏目
PDF
コミュニティと自分
祐樹 夏目
PDF
古き良きRailsプロジェクトに wepbackとvue.jsを導入した話
Yuya Taki
PDF
最近の気になるニュース
Yasuhiro Nozue
PDF
Cmsdou oosaka
onagatani
PDF
How do you like knockout?
Narami Kiyokura
PDF
ASP.NET "NOW" and "NEXT"
Narami Kiyokura
PDF
どうなる?Visual Studioの クライアントサイド web開発の今後
Narami Kiyokura
僕の Serverless web application
祐樹 夏目
コミュニティと自分
祐樹 夏目
古き良きRailsプロジェクトに wepbackとvue.jsを導入した話
Yuya Taki
最近の気になるニュース
Yasuhiro Nozue
Cmsdou oosaka
onagatani
How do you like knockout?
Narami Kiyokura
ASP.NET "NOW" and "NEXT"
Narami Kiyokura
どうなる?Visual Studioの クライアントサイド web開発の今後
Narami Kiyokura
What's hot
(19)
PPTX
Rails5クイックスタート
Hirata Tomoko
PDF
テクニカルクリエイターの憂鬱
Keisuke Imura
PDF
20141202 jaws ug
Shinya Yamada
PDF
知っておきたいWordPress開発環境 2016年10月編
株式会社ガリレオ(開発グループ)
PDF
Yapc asia 2011
onagatani
PPTX
JAWS-UG横浜紹介『我らが横浜!』
宗 大栗
PDF
.NET CoreアプリでWindowsの外に出発
Developer Solutions事業部 メシウス株式会社 (旧グレープシティ株式会社)
PDF
oEmbedで、色んなコンテンツをWordPressに組み込もう!
Kanako Kobayashi
PDF
軽量ASP.NETフレームワークNancy
Narami Kiyokura
PDF
軽量フレームワークNancy
Narami Kiyokura
PDF
BootstrapとRailsで、 高速にWebサイトを作ってみた
BeMarble
PDF
MySQL+Docker
佐久本正太
PDF
About SnapKit - Open source lab -
Daisuke Yamashita
PDF
COD2013 Windows Azure Mobile Service を用いたiOS/Android開発
Masaki Yamamoto
PDF
Web制作者が知っておきたいアクセシビリティ最新動向
Mitsue-Links Co.,Ltd. Accessibility Department
PPTX
Web Assembly in action
t-kihira
PDF
Sinatra軽量Web開発 - LOUPE Study #1
Takuya Mukohira
PDF
VagrantでSymfony開発
Yosuke Karasawa
PDF
20190917 bydstudy#1 teraoka
beyond Co., Ltd.
Rails5クイックスタート
Hirata Tomoko
テクニカルクリエイターの憂鬱
Keisuke Imura
20141202 jaws ug
Shinya Yamada
知っておきたいWordPress開発環境 2016年10月編
株式会社ガリレオ(開発グループ)
Yapc asia 2011
onagatani
JAWS-UG横浜紹介『我らが横浜!』
宗 大栗
.NET CoreアプリでWindowsの外に出発
Developer Solutions事業部 メシウス株式会社 (旧グレープシティ株式会社)
oEmbedで、色んなコンテンツをWordPressに組み込もう!
Kanako Kobayashi
軽量ASP.NETフレームワークNancy
Narami Kiyokura
軽量フレームワークNancy
Narami Kiyokura
BootstrapとRailsで、 高速にWebサイトを作ってみた
BeMarble
MySQL+Docker
佐久本正太
About SnapKit - Open source lab -
Daisuke Yamashita
COD2013 Windows Azure Mobile Service を用いたiOS/Android開発
Masaki Yamamoto
Web制作者が知っておきたいアクセシビリティ最新動向
Mitsue-Links Co.,Ltd. Accessibility Department
Web Assembly in action
t-kihira
Sinatra軽量Web開発 - LOUPE Study #1
Takuya Mukohira
VagrantでSymfony開発
Yosuke Karasawa
20190917 bydstudy#1 teraoka
beyond Co., Ltd.
Ad
Similar to 【勉強会】 はじめてのRuby on Rails 4入門
(20)
PPTX
【テックリンク】平日の夜1時間で学ぶ!RubyonRails初心者ハンズオン
linkbal
PDF
2014年を振り返る 今年の技術トレンドとDockerについて
Masahito Zembutsu
PPTX
20180928 monaca UG #6
ssuseraa32c9
PDF
ヒカラボ「自社サービス開発会社で活躍し続けるために必要な○○とは?」開発エンジニア
leverages_event
PDF
ヒカラボ「自社サービス開発会社で活躍し続けるために必要な○○とは?」開発エンジニア
Isamu Suzuki
PPTX
AITCシニア技術者勉強会 「今さら聞けないWebサイト開発」 vol1
近藤 繁延
PDF
Rancher で Docker 利用!
Tetsurou Yano
PDF
Nodeにしましょう
Yuzo Hebishima
PPTX
Rancher meetuptokyo #4 Vagrant でつくる Rancher HA構成
Tetsurou Yano
PPTX
Aws発表資料(dac) 20160721
Norikazu Yura
PPTX
Monacaハンズオン(三島ハッカソン用)
Hiroyuki Ichikawa
PDF
サーバサイドエンジニアから見た MT構築のレガシーなノウハウ (入門編)
Osamu Nagatani
PDF
DeNAのゲーム開発を支える Game Backend as a Service
Makoto Haruyama
PPTX
PhoneGapユーザー会@大阪 講演資料
Monaca
PPTX
まだまだ戦えるweb!mithril.js最初の1歩
Keisuke Mori
PDF
Ruby実践
Kenichi Kawaguchi
KEY
20120413 nestakabaneworkshop
Yoichiro Sakurai
PDF
HTML5ハイブリッド アプリ開発実践編
Monaca
PDF
今から始めよう!WordPressで作る女子ウケ★スマホサイト
rie05
PDF
JavaScript使いならきっととっつきやすいNode-REDについて
Seigo Tanaka
【テックリンク】平日の夜1時間で学ぶ!RubyonRails初心者ハンズオン
linkbal
2014年を振り返る 今年の技術トレンドとDockerについて
Masahito Zembutsu
20180928 monaca UG #6
ssuseraa32c9
ヒカラボ「自社サービス開発会社で活躍し続けるために必要な○○とは?」開発エンジニア
leverages_event
ヒカラボ「自社サービス開発会社で活躍し続けるために必要な○○とは?」開発エンジニア
Isamu Suzuki
AITCシニア技術者勉強会 「今さら聞けないWebサイト開発」 vol1
近藤 繁延
Rancher で Docker 利用!
Tetsurou Yano
Nodeにしましょう
Yuzo Hebishima
Rancher meetuptokyo #4 Vagrant でつくる Rancher HA構成
Tetsurou Yano
Aws発表資料(dac) 20160721
Norikazu Yura
Monacaハンズオン(三島ハッカソン用)
Hiroyuki Ichikawa
サーバサイドエンジニアから見た MT構築のレガシーなノウハウ (入門編)
Osamu Nagatani
DeNAのゲーム開発を支える Game Backend as a Service
Makoto Haruyama
PhoneGapユーザー会@大阪 講演資料
Monaca
まだまだ戦えるweb!mithril.js最初の1歩
Keisuke Mori
Ruby実践
Kenichi Kawaguchi
20120413 nestakabaneworkshop
Yoichiro Sakurai
HTML5ハイブリッド アプリ開発実践編
Monaca
今から始めよう!WordPressで作る女子ウケ★スマホサイト
rie05
JavaScript使いならきっととっつきやすいNode-REDについて
Seigo Tanaka
Ad
【勉強会】 はじめてのRuby on Rails 4入門
1.
©2016 Y.Nakamura 【勉強会】 はじめての Ruby
on rails 4 入門 2016/11 中村祐太
2.
©2016 Y.Nakamura アジェンダ 1. 自己紹介 2.
はじめに 3. Ruby on Railsについて 4. 開発環境セットアップ(クラウドIDE) 5. HelloWorld! 6. はじめてのToDoアプリ開発!
3.
©2016 Y.Nakamura 自己紹介 • 中村
祐太 (なかむら ゆうた) • 経歴:受託開発会社、インターネット広 告事業会社、イベントEC事業会社の新規 サービス開発等。 • 趣味:旅行、ドライブ、勉強会参加・開 催。 • Twitter: @ynakayu • FB: https://www.facebook.com/yuta.naka mura.599
4.
©2016 Y.Nakamura はじめに • ハンズオンの想定ターゲット –
PHP等のMVC frameworkの開発経験がある。 – Ruby on Rails を初めて勉強する。 • ハンズオンの進め方 – プロジェクタに講師PCの操作を投影しながら、 各自PCを操作して学習を進めます。 – スライドと完成版ソースコードは共有します。
5.
©2016 Y.Nakamura Ruby on
Rails について 1/2 • 少ないコード量で効率的に開発ができる 人気のフレームワーク。 • 2011年以降に創業しているスタートアッ プ企業の使用言語はPHPとRubyがほぼ半 分。※1 出典: ※1 日本のスタートアップはRubyがお好き? PHPと人気ほぼ互角に | TechCrunch http://jp.techcrunch.com/2014/08/25/jp20140825wantedly/
6.
©2016 Y.Nakamura Ruby on
Rails について 2/2 出典: ※2 プログラマー年収ランキング2016! | みんなのスタンバイ https://jp.stanby.com/media/programming _ranking/ 3位
7.
©2016 Y.Nakamura 開発環境構築 • 時間削減のため、クラウドIDE codeanywhere
の無料プランを使用。 • https://codeanywhere.com 参考(同様のサービス) • Cloud9 : フリープランでもクレジット カード必須のため、今回は選択肢から外 しました。
8.
©2016 Y.Nakamura Codeanywhere トップ https://codeanywhere.com
9.
©2016 Y.Nakamura Codeanywhere 価格
10.
©2016 Y.Nakamura Codeanywhere ユーザー登録 入力: Email パスワード クリック チェック
11.
©2016 Y.Nakamura Codeanywhere アカウント作成完了 エディタへ
12.
©2016 Y.Nakamura コンテナの作成 ① ② ③ ④ ※ ③・・・
Ruby / Centos 6.5を選択
13.
©2016 Y.Nakamura セットアップ完了
14.
©2016 Y.Nakamura HelloWorld! • Hello
World! とブラウザに表示するアプ リを開発します。
15.
©2016 Y.Nakamura Hello World
PJの作成 • PJ helloを新規作成 $ rails new hello • hello ディレクトリに移動 $ cd hello
16.
©2016 Y.Nakamura 動作確認 • rails
サーバを起動する $ rails s –b 0.0.0.0 • ブラウザで下記URLを開く • http://xxxxx.codeanyapp.com:3000 • ※ xxxxx の部分は各自異なる。 – IEDのProject名を右クリック > info から確認。 • ※ port 3000を指定。 (:3000)。
17.
©2016 Y.Nakamura この画面が出ればPJの作成成功.
18.
©2016 Y.Nakamura フォルダ構成 • <IDEを見ながらフォルダ構成を説明> •
参考URL 「Railsの基礎知識 | Rails ドキュメント」 http://railsdoc.com/rails_base ※フォルダ構造の項を参照。
19.
©2016 Y.Nakamura HelloWorld! 手順 1.
コントローラにHelloWord!と出力するメ ソッドを記載 2. ルーティングを記載 3. (Railsサーバ起動) 4. ブラウザで動作確認
20.
©2016 Y.Nakamura HelloWord コントローラー編集 ファイル: app/controllers/application_controller.rb class
ApplicationController < ActionController::Base # Prevent CSRF attacks by raising an exception. # For APIs, you may want to use :null_session instead. protect_from_forgery with: :exception def hello render text: "Hello World!" end end
21.
©2016 Y.Nakamura Hello World
ルーティング設定 URLと実行するべきアクションを設定する 仕組み。 編集ファイル:app/config/routes.rb Rails.application.routes.draw do root 'application#hello’ 〜略〜
22.
©2016 Y.Nakamura Hello World
動作確認 • rails サーバを起動する $ rails s –b 0.0.0.0 • ブラウザで下記URLを開く • http://xxxxx.codeanyapp.com:3000 • ※ xxxxx の部分は各自異なる。 – Project名を右クリック > info から確認。 • ※ port 3000を指定。 (:3000)。
23.
©2016 Y.Nakamura HelloWorld • Hello
World! とブラウザに表示されれば OK! あなたもrailsエンジニアの仲間入り です!
24.
©2016 Y.Nakamura ToDo管理アプリ • ToDoを管理するアプリを作成します。 Rails入門する上の、エッセンスがつまってい ます。 –
ToDo 一覧 – 新規追加 – 編集 – 削除 – 完了 / 未完了設定 (Ajax) – DBにはsqliteを使用
25.
©2016 Y.Nakamura ToDo管理アプリ開発について • <プロジェクターにPCの操作画面を写し ながら、開発手順を説明します> •
必要になるコマンドは、次ページ以降に、 資料として記載。 • 完成版ソースコード共有します。 https://github.com/ynakayu/todoapp
26.
©2016 Y.Nakamura 資料: PJ作成 ■
workspace ディレクトリへ移動 $ cd ~/workspace/ ■ PJを新規作成 $ rails new todoapp ■ 作成されたディレクトリ移動 $ cd todoapp/ ■ therubyracer有効にする。 ※ 参考: http://d.hatena.ne.jp/suu-g/20121222/1356189597 Gemfile 編集 # gem 'therubyracer', platforms: :ruby ↓ gem 'therubyracer', platforms: :ruby // 必要なGemをインストール $ bundle install
27.
©2016 Y.Nakamura 資料:動作確認 • rails
サーバを起動する $ rails s –b 0.0.0.0 • ブラウザで下記URLを開く • http://xxxxx.codeanyapp.com:3000 • ※ xxxxx の部分は各自異なる。 – Project名を右クリック > info から確認。 • ※ port 3000を指定。 (:3000)。
28.
©2016 Y.Nakamura 資料:Taskコントローラー作成 コマンド //
コントローラー作成 $ rails g controller Tasks // モデル作成 $ rails g model Task title:string done:boolean
29.
©2016 Y.Nakamura 資料:マイグレーションファイル編集 migrations.doneのデフォルト値、default falseを追加。 編集ファイル等
app/db/migrate/xxxx_create_tasks.rb class CreateTasks < ActiveRecord::Migration def change create_table :tasks do |t| t.string :title t.boolean :done, default: false t.timestamps end end end
30.
©2016 Y.Nakamura 資料:DB マイグレーション実行 $
rake db:migrate ■参考文献 マイグレーション | Railsドキュメント http://railsdoc.com/migration
31.
©2016 Y.Nakamura 資料:DBスキーマ確認 $ rails
db sqlite> .schema ■rails dbを終 了 sqlite> .exit
32.
©2016 Y.Nakamura 資料:DB 初期データ追加 $
rails console 2.1.2 :001 > Task.create(title: “task1") 2.1.2 :002 > Task.create(title: ”task2") ■ 確認 2.1.2 :002 > Task.all ■rails console終了
33.
©2016 Y.Nakamura 資料:ルーティングの確認 $ rake
routes Prefix Verb URI Pattern Controller#Action tasks GET /tasks(.:format) tasks#index POST /tasks(.:format) tasks#create new_task GET /tasks/new(.:format) tasks#new edit_task GET /tasks/:id/edit(.:format) tasks#edit task GET /tasks/:id(.:format) tasks#show PATCH /tasks/:id(.:format) tasks#update PUT /tasks/:id(.:format) tasks#update DELETE /tasks/:id(.:format) tasks#destroy root GET / tasks#index POST /tasks/:id/toggle(.:format) tasks#toggle
34.
©2016 Y.Nakamura 資料 :
学習の参考サイト等 • Railsドキュメント – http://railsdoc.com/ • Railsガイド – http://railsguides.jp/ • Ruby on Rails チュートリアル – http://railstutorial.jp/ • Ruby on Rails 4 アプリケーションプログ ラミング 山田 祥寛 (著)
Download