Web Application Devlopment     Webアプリ開発勉強会 #1          05.09.12
Presented by U-moa
Agenda   1. 自己紹介タイム      2. ワークショップSinatraではじめるWebアプリ開発     3. LT(あれば)     4. ふりかえり
自己紹介タイムSelf-Introduction
Self-Introduction• 名前• 所属• 好きなこと、最近やっていること  などなど・・・
ワークショップWorkshop
WorkShop      今日の目標Webアプリの全体像をざっくり掴む
SinatraではじめるWebアプリ開発Sinatra is a DSL for quickly creatingweb application in Ruby with minimaleffort:
その前にWebアプリのしくみ
Web           ApplicationBrowserDatabase   3     つの要素
サーバーに   Web       リクエストを送る Browser html, css    Javascriptを読み込んで        を実行する画面に描画する
ブラウザからの リクエストを  受け付ける        Application データベース                 html,css, からデータを             javascriptを生成し取得するor書き込む     ...
アプリケーションが使うデータを保       だけ 存しておく            データを検索して              取り出す Database
2. DBの読み書き               Application(Server)      Database 1. リクエストを送る                 3. レスポンスを返すWeb Browser
Sinatra    ...Web Application Framework (WAF)         と呼ばれるもの    リクエストを受けとり、   レスポンスを返すことが仕事
トップページを作ろう
URLを変えてみよう
URLを追加してみよう
HTMLを返してみよう
データを送信してみよう
データを受け取ってみよう
リクエストの種類GET – サーバーからデータを取得するた        めのリクエストPOST – サーバーへデータを送信するた         めのリクエスト
データを格納してみよう
データを埋め込んでみよう
完成
ふりかえりRetrospectives
KeepProblem  Try
Keep = 良かったところProblem = 悪かったところ Try = 次回の取り組み
5/16 (水)
Próximos SlideShares
Carregando em…5
×

WebAppDev勉強会 #1 at cafe? IKAGAWA DO

462 visualizações

Publicada em

Publicada em: Tecnologia
  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

WebAppDev勉強会 #1 at cafe? IKAGAWA DO

  1. 1. Web Application Devlopment Webアプリ開発勉強会 #1 05.09.12
  2. 2. Presented by U-moa
  3. 3. Agenda 1. 自己紹介タイム 2. ワークショップSinatraではじめるWebアプリ開発 3. LT(あれば) 4. ふりかえり
  4. 4. 自己紹介タイムSelf-Introduction
  5. 5. Self-Introduction• 名前• 所属• 好きなこと、最近やっていること などなど・・・
  6. 6. ワークショップWorkshop
  7. 7. WorkShop 今日の目標Webアプリの全体像をざっくり掴む
  8. 8. SinatraではじめるWebアプリ開発Sinatra is a DSL for quickly creatingweb application in Ruby with minimaleffort:
  9. 9. その前にWebアプリのしくみ
  10. 10. Web ApplicationBrowserDatabase 3 つの要素
  11. 11. サーバーに Web リクエストを送る Browser html, css Javascriptを読み込んで を実行する画面に描画する
  12. 12. ブラウザからの リクエストを 受け付ける Application データベース html,css, からデータを javascriptを生成し取得するor書き込む レスポンスとして 返す
  13. 13. アプリケーションが使うデータを保 だけ 存しておく データを検索して 取り出す Database
  14. 14. 2. DBの読み書き Application(Server) Database 1. リクエストを送る 3. レスポンスを返すWeb Browser
  15. 15. Sinatra ...Web Application Framework (WAF) と呼ばれるもの リクエストを受けとり、 レスポンスを返すことが仕事
  16. 16. トップページを作ろう
  17. 17. URLを変えてみよう
  18. 18. URLを追加してみよう
  19. 19. HTMLを返してみよう
  20. 20. データを送信してみよう
  21. 21. データを受け取ってみよう
  22. 22. リクエストの種類GET – サーバーからデータを取得するた めのリクエストPOST – サーバーへデータを送信するた めのリクエスト
  23. 23. データを格納してみよう
  24. 24. データを埋め込んでみよう
  25. 25. 完成
  26. 26. ふりかえりRetrospectives
  27. 27. KeepProblem Try
  28. 28. Keep = 良かったところProblem = 悪かったところ Try = 次回の取り組み
  29. 29. 5/16 (水)

×