SlideShare una empresa de Scribd logo
1 de 11
アジャイル道場
はじめてのRails(View編)
      2012/10/16@ConnectStar
Railsって



RubyのMVCフレームワーク
 類似:CakePHP / Catalystとか
 フルスタックフレームワーク
Rails特徴

一定品質以上のアプリケーションをス
ピーディーに開発できる
オブジェクト指向言語で、根本的に変
化に強くアジャイルとの親和性が高い
技術スキルが高く、サービス思考の高
いエンジニアが集まりやすい
MVC?

Webアプリケーションを構成する基本概念
Model / View / Controllerの略




        View     Controller   Model
役割的に

役割を定義しないのがアジャイルで
すが、とはいえ、得意分野としてい
じるところ
 エンジニア → Model, Controller
 UIデザイナ・全員 → View
View周り技術キーワード

View(Template)エンジン
Assets Pipeline
  SCSS
  CoffeeScript
i18n
Templateエンジン

ERBを採用してます。
apps/views/[bar]/[hoge].html.erb
   URLに対応してます。
   例:
      URL:http://example.com/bar/hoge.html
      対応ファイル:apps/views/[bar]/[hoge].html.erb
書式
   <% %> こういうのでくくられたところが、Ruby出力部分
詳細は別途ERBで調べてみて下さい。
AssetsPipeline
Rails3.1から採用された技術
SCSSで定義されたCSS、CoffeeScriptで定義されたJSを、それ
ぞれブラウザ解釈可能な形にし(=コンパイルという処理)、最
適化して出力する機構
SCSSはCSSのネストと変数が使える機構
CoffeeScriptはJS記法の再定義
stylesheet(SCSS)をいじる
   app/assets/stylesheets/*.css.scss
JavaScript(CoffeeScript)をいじる
   app/assets/javascripts/*.js.coffee
i18n

国際多言語対応の機構です。
単語をTemplateに書かないでconfig/locale/[locale].ymlに書いて、ユーザの
環境によって切り替えます。
定義方法は
   yml側
      ja: > [templateディレクトリ名] > [templateファイル名] > 任意定義
   Template側
      <%= t( .hoge ) %> ← 実は省略形
      正式には<%= t( dir.file.hoge ) %>って書きます
Templateファイルの拡張子で指定する方法もある → hoge.en.html.er
   全体を切り替える規約ページとかは上記で良い(と思う)
簡単Railsアプリを作ってみる

 掲示板アプリ
  $ gem install rails
  $ rails new hogehoge
  $ rails g scaffold board
  $ rails s
  ブラウザで見る
 View/SCSS/JSをいじってみる
【アジャイル道場】Rails勉強会(view編)

Más contenido relacionado

La actualidad más candente

Web アプリケーション パターンと .NET - CLR/H 88 回 ~雪まつりデイ!~ バージョン
Web アプリケーション パターンと .NET - CLR/H 88 回 ~雪まつりデイ!~ バージョンWeb アプリケーション パターンと .NET - CLR/H 88 回 ~雪まつりデイ!~ バージョン
Web アプリケーション パターンと .NET - CLR/H 88 回 ~雪まつりデイ!~ バージョン
Akira Inoue
 
~ アプリ開発に新たな息吹を ~ クラウドが当たり前の今こそ知っておきたい Azure & Visual Studio コラボレーション
~ アプリ開発に新たな息吹を ~ クラウドが当たり前の今こそ知っておきたい Azure & Visual Studio コラボレーション~ アプリ開発に新たな息吹を ~ クラウドが当たり前の今こそ知っておきたい Azure & Visual Studio コラボレーション
~ アプリ開発に新たな息吹を ~ クラウドが当たり前の今こそ知っておきたい Azure & Visual Studio コラボレーション
Akira Inoue
 

La actualidad más candente (11)

Android Architecture
Android ArchitectureAndroid Architecture
Android Architecture
 
ASP.NET vNext / Visual Studio "14" に見る .NET の未来像
ASP.NET vNext / Visual Studio "14" に見る .NET の未来像ASP.NET vNext / Visual Studio "14" に見る .NET の未来像
ASP.NET vNext / Visual Studio "14" に見る .NET の未来像
 
Web App Framework at SwapSkills vol28
Web App Framework at SwapSkills vol28Web App Framework at SwapSkills vol28
Web App Framework at SwapSkills vol28
 
Web アプリケーション パターンと .NET - CLR/H 88 回 ~雪まつりデイ!~ バージョン
Web アプリケーション パターンと .NET - CLR/H 88 回 ~雪まつりデイ!~ バージョンWeb アプリケーション パターンと .NET - CLR/H 88 回 ~雪まつりデイ!~ バージョン
Web アプリケーション パターンと .NET - CLR/H 88 回 ~雪まつりデイ!~ バージョン
 
Sf素人が2週間でアプリケーションビルダーに挑戦してみた
Sf素人が2週間でアプリケーションビルダーに挑戦してみたSf素人が2週間でアプリケーションビルダーに挑戦してみた
Sf素人が2週間でアプリケーションビルダーに挑戦してみた
 
jQuery/Html5/ASP.NET MVC 対応コンポーネントを用いたデバイス対応業務アプリケーション開発
jQuery/Html5/ASP.NET MVC 対応コンポーネントを用いたデバイス対応業務アプリケーション開発jQuery/Html5/ASP.NET MVC 対応コンポーネントを用いたデバイス対応業務アプリケーション開発
jQuery/Html5/ASP.NET MVC 対応コンポーネントを用いたデバイス対応業務アプリケーション開発
 
ASP.NET Core 概要(2017年3月時点)
ASP.NET Core 概要(2017年3月時点)ASP.NET Core 概要(2017年3月時点)
ASP.NET Core 概要(2017年3月時点)
 
building HTML hybrid app
 with ionic
building HTML hybrid app
 with ionicbuilding HTML hybrid app
 with ionic
building HTML hybrid app
 with ionic
 
~ アプリ開発に新たな息吹を ~ クラウドが当たり前の今こそ知っておきたい Azure & Visual Studio コラボレーション
~ アプリ開発に新たな息吹を ~ クラウドが当たり前の今こそ知っておきたい Azure & Visual Studio コラボレーション~ アプリ開発に新たな息吹を ~ クラウドが当たり前の今こそ知っておきたい Azure & Visual Studio コラボレーション
~ アプリ開発に新たな息吹を ~ クラウドが当たり前の今こそ知っておきたい Azure & Visual Studio コラボレーション
 
Salesforce Lightning をやってみてあれこれ
Salesforce Lightning をやってみてあれこれSalesforce Lightning をやってみてあれこれ
Salesforce Lightning をやってみてあれこれ
 
Model View Presenter for Android
Model View Presenter for AndroidModel View Presenter for Android
Model View Presenter for Android
 

Destacado

アート・オブ・アジャイル・デベロップメント読書会#1
アート・オブ・アジャイル・デベロップメント読書会#1アート・オブ・アジャイル・デベロップメント読書会#1
アート・オブ・アジャイル・デベロップメント読書会#1
Sosuke Kimura
 

Destacado (12)

Twitterbootstrapでモック開発
Twitterbootstrapでモック開発Twitterbootstrapでモック開発
Twitterbootstrapでモック開発
 
Members innovationlab#2
Members innovationlab#2Members innovationlab#2
Members innovationlab#2
 
Members innovationlab#1
Members innovationlab#1Members innovationlab#1
Members innovationlab#1
 
サービス開発者の読書会#5
サービス開発者の読書会#5サービス開発者の読書会#5
サービス開発者の読書会#5
 
アート・オブ・アジャイル・デベロップメント読書会#1
アート・オブ・アジャイル・デベロップメント読書会#1アート・オブ・アジャイル・デベロップメント読書会#1
アート・オブ・アジャイル・デベロップメント読書会#1
 
リーンスタートアップ第3部まとめ
リーンスタートアップ第3部まとめリーンスタートアップ第3部まとめ
リーンスタートアップ第3部まとめ
 
Git運用
Git運用Git運用
Git運用
 
サービス開発者の読書会#4
サービス開発者の読書会#4サービス開発者の読書会#4
サービス開発者の読書会#4
 
Chapter 3,
Chapter 3,Chapter 3,
Chapter 3,
 
ピクト図解 Bmキャンバス なぞり書きシート_v2.2
ピクト図解 Bmキャンバス なぞり書きシート_v2.2ピクト図解 Bmキャンバス なぞり書きシート_v2.2
ピクト図解 Bmキャンバス なぞり書きシート_v2.2
 
【アジャイル道場】Git運用勉強会
【アジャイル道場】Git運用勉強会【アジャイル道場】Git運用勉強会
【アジャイル道場】Git運用勉強会
 
ビジネスモデル・ジェネレーション「Patterns」
ビジネスモデル・ジェネレーション「Patterns」ビジネスモデル・ジェネレーション「Patterns」
ビジネスモデル・ジェネレーション「Patterns」
 

Similar a 【アジャイル道場】Rails勉強会(view編)

090821 Ruby Sapporo Night Ruby Cocoa
090821 Ruby Sapporo Night Ruby Cocoa090821 Ruby Sapporo Night Ruby Cocoa
090821 Ruby Sapporo Night Ruby Cocoa
Tomoki Maeda
 
HTML5 クロスプラットフォームアプリ開発の現実解
HTML5 クロスプラットフォームアプリ開発の現実解HTML5 クロスプラットフォームアプリ開発の現実解
HTML5 クロスプラットフォームアプリ開発の現実解
Monaca
 
最新 ASP.NET Web 開発オーバービュー
最新 ASP.NET Web 開発オーバービュー最新 ASP.NET Web 開発オーバービュー
最新 ASP.NET Web 開発オーバービュー
Akira Inoue
 
マイクロソフトWeb開発の今と今後
マイクロソフトWeb開発の今と今後マイクロソフトWeb開発の今と今後
マイクロソフトWeb開発の今と今後
Akira Inoue
 
[公開用]Netラボ2012年2月勉強会 asp.netmvc4 beta新機能の紹介
[公開用]Netラボ2012年2月勉強会 asp.netmvc4 beta新機能の紹介[公開用]Netラボ2012年2月勉強会 asp.netmvc4 beta新機能の紹介
[公開用]Netラボ2012年2月勉強会 asp.netmvc4 beta新機能の紹介
david9142
 

Similar a 【アジャイル道場】Rails勉強会(view編) (20)

Rails×React×TS で作るwebアプリ入門【weseek tech conf #10】
Rails×React×TS で作るwebアプリ入門【weseek tech conf #10】Rails×React×TS で作るwebアプリ入門【weseek tech conf #10】
Rails×React×TS で作るwebアプリ入門【weseek tech conf #10】
 
Mvc conf session_1_osada
Mvc conf session_1_osadaMvc conf session_1_osada
Mvc conf session_1_osada
 
企業システムで使えるマイクロサービスの特長と実践 (Oracle Cloudウェビナーシリーズ: 2021年4月15日)
企業システムで使えるマイクロサービスの特長と実践 (Oracle Cloudウェビナーシリーズ: 2021年4月15日)企業システムで使えるマイクロサービスの特長と実践 (Oracle Cloudウェビナーシリーズ: 2021年4月15日)
企業システムで使えるマイクロサービスの特長と実践 (Oracle Cloudウェビナーシリーズ: 2021年4月15日)
 
そのRails Engine、 本当に必要ですか?
そのRails Engine、 本当に必要ですか?そのRails Engine、 本当に必要ですか?
そのRails Engine、 本当に必要ですか?
 
090821 Ruby Sapporo Night Ruby Cocoa
090821 Ruby Sapporo Night Ruby Cocoa090821 Ruby Sapporo Night Ruby Cocoa
090821 Ruby Sapporo Night Ruby Cocoa
 
ASP.NET MVC と jQuery で実践する標準志向 Web 開発
ASP.NET MVC と jQuery で実践する標準志向 Web 開発ASP.NET MVC と jQuery で実践する標準志向 Web 開発
ASP.NET MVC と jQuery で実践する標準志向 Web 開発
 
About rails 3
About rails 3About rails 3
About rails 3
 
Oracle APEX概要
Oracle APEX概要Oracle APEX概要
Oracle APEX概要
 
HTML5 クロスプラットフォームアプリ開発の現実解
HTML5 クロスプラットフォームアプリ開発の現実解HTML5 クロスプラットフォームアプリ開発の現実解
HTML5 クロスプラットフォームアプリ開発の現実解
 
T35 ASP.NET MVCを使ったTDD入門
T35 ASP.NET MVCを使ったTDD入門T35 ASP.NET MVCを使ったTDD入門
T35 ASP.NET MVCを使ったTDD入門
 
Rails講座1
Rails講座1Rails講座1
Rails講座1
 
最新 ASP.NET Web 開発オーバービュー
最新 ASP.NET Web 開発オーバービュー最新 ASP.NET Web 開発オーバービュー
最新 ASP.NET Web 開発オーバービュー
 
マイクロソフトWeb開発の今と今後
マイクロソフトWeb開発の今と今後マイクロソフトWeb開発の今と今後
マイクロソフトWeb開発の今と今後
 
やってみよう!ASP.NET MVC #2
やってみよう!ASP.NET MVC #2やってみよう!ASP.NET MVC #2
やってみよう!ASP.NET MVC #2
 
Oracle Container Engine for Kubernetes (OKE) ご紹介 [2021年5月版]
Oracle Container Engine for Kubernetes (OKE) ご紹介 [2021年5月版]Oracle Container Engine for Kubernetes (OKE) ご紹介 [2021年5月版]
Oracle Container Engine for Kubernetes (OKE) ご紹介 [2021年5月版]
 
Ecsとlambdaのバッチ処理
Ecsとlambdaのバッチ処理Ecsとlambdaのバッチ処理
Ecsとlambdaのバッチ処理
 
May the FaaS be with us!!
May the FaaS be with us!!May the FaaS be with us!!
May the FaaS be with us!!
 
Backbone.js入門
Backbone.js入門Backbone.js入門
Backbone.js入門
 
[公開用]Netラボ2012年2月勉強会 asp.netmvc4 beta新機能の紹介
[公開用]Netラボ2012年2月勉強会 asp.netmvc4 beta新機能の紹介[公開用]Netラボ2012年2月勉強会 asp.netmvc4 beta新機能の紹介
[公開用]Netラボ2012年2月勉強会 asp.netmvc4 beta新機能の紹介
 
A 1-2 One ASP.NET - ASP.NET Web Stack
A 1-2 One ASP.NET - ASP.NET Web StackA 1-2 One ASP.NET - ASP.NET Web Stack
A 1-2 One ASP.NET - ASP.NET Web Stack
 

【アジャイル道場】Rails勉強会(view編)

Notas del editor

  1. \n
  2. \n
  3. \n
  4. \n
  5. \n
  6. \n
  7. \n
  8. \n
  9. \n
  10. \n
  11. \n