03 May 2014, 09:53

[Coursera]Web Application Archtecturesを受講しました

CourseraでWeb Application Archtecturesを受講しました。

Motivation

ちょうど仕事でもRubyを使い始めたときだった。

Rubyのキラーアプリ。Railsに触れる、”チャンス”と思ってやってみた。

Course

Lecture

<div class="outline-text-3" id="text-2-1">
  <p>
    Railsをあつかいながら、ウェブアーキテクャチャを学ぶ講義。
  </p>

  <p>
    スライドでいろいろと概念が説明されたあとに、 コンソール画面で実際にコーディングする進め方。 毎週少しずつ、ブログサービスを作成する。(イテレーション)
  </p>

  <p>
    内容もそうだが、動画がおもしろい。画面を先生がいろいろと飛び回る!
  </p>

  <p>
    上から下からGreg先生がスライドインしてきたり、先生が巨人になったり小人になったり・・・ (一度だけ、2人に分身して表示された!)。この人は動画編集で遊んでるなと思った。
  </p></p>
</div></p>

Assignment

<div class="outline-text-3" id="text-2-2">
  <p>
    4つのAssignmentがだされる。 講義の内容を自分でも手を動かして真似するだけなので、とても簡単。だれでもできる。
  </p>

  <p>
    完成したら、git commit してbitbucketにpushする。 そうすると、それをトリガとしてRSpecで自動採点されるという仕組み。
  </p>

  <p>
    自分の宿題repositoryは以下。
  </p>

  <ul class="org-ul">
    <li>
      <a href="https://bitbucket.org/tsu-nera/coursera-webapplications-assignment">https://bitbucket.org/tsu-nera/coursera-webapplications-assignment</a>
    </li>
  </ul>
</div></p>

Contents

<div class="outline-text-3" id="text-2-3">
  <p>
    期間が6weekということで、広く浅くという内容だ。
  </p>

  <p>
    Railsというのは、ウェブを学ぶための手段だった。 実際は、Railsをつかってインターネットやウェブの歴史と技術が紹介された。
  </p>

  <p>
    git, Agileに関わる開発手法、Rubyもあわせて学べる。 また、言語もRubyだけではなくて、HTMLやCSS, JQueryなどなど。幅広い。
  </p>

  <p>
    Web開発に関わるいろんな知識がたくさんでてくる。
  </p></p>
</div>

<div id="outline-container-sec-2-3-1" class="outline-4">
  <h4 id="sec-2-3-1">
    Webの発展
  </h4>

  <div class="outline-text-4" id="text-2-3-1">
    <p>
      まずは、Webの歴史が紹介される。
    </p>

    <ul class="org-ul">
      <li>
        Web1.0 ・・・クライアントは静的ページをWebサーバから取得する。ウェブページ。ウェブを読む。
      </li>
      <li>
        Web2.0 ・・・クライアント/サーバ側で動的にページを作成する。ウェブサービス。ウェブを使う。
      </li>
      <li>
        Web3.0 ・・・クライアントごとがつながりあう。データの上のメタデータをあつかう。 <ul class="org-ul">
          <li>
            クラウドコンピューティング ・・・あらゆるデバイスがネットにつながる。
          </li>
          <li>
            セマンティックウェブ ・・・ビックデータの統計解析から価値を生み出す。 <p>
              <a href="http://dmtc.jp/magazine/archives/=1461">迫り来るWeb3.0時代を生き抜くエンジニアが持たなければいけない3つの視点 | DMTC Magazine</a>
            </p>
          </li>
        </ul>
      </li>
    </ul>
  </div></p>
</div>

<div id="outline-container-sec-2-3-2" class="outline-4">
  <h4 id="sec-2-3-2">
    Web Archtecture
  </h4>

  <div class="outline-text-4" id="text-2-3-2">
    <p>
      概ね、以下のようなアーキテクチャの各部分を、各週に分けて説明される。
    </p>

    <div class="org-src-container">
      <pre class="src src-language">  Web Client
  |

(NetWork) | Web Server | Script/Service | (Connector) | DataBase

    <p>
      Railsということで、MVCアーキも随所随所で強調される。
    </p>

    <ul class="org-ul">
      <li>
        <a href="http://ja.wikipedia.org/wiki/Model_View_Controller">Model View Controller &#8211; Wikipedia</a>
      </li>
    </ul>
  </div></p>
</div>

<div id="outline-container-sec-2-3-3" class="outline-4">
  <h4 id="sec-2-3-3">
    Database Layer
  </h4>

  <div class="outline-text-4" id="text-2-3-3">
    <p>
      MVCのモデルに当たる部分。 データベースとそれをRailsからどうあつかうかを学ぶ。
    </p>

    <div class="org-src-container">
      <pre class="src src-language">Week Three – Module 3: Database Interactions

Lecture 1: Relational Databases Lecture 2: Databases in Rails Lecture 3: The Active Record Design Pattern

    <p>
      ブログの記事とコメントの関係をMySQLをつかって説明される。
    </p>

    <ul class="org-ul">
      <li>
        <a href="http://ja.wikipedia.org/wiki/%E9%96%A2%E4%BF%82%E3%83%87%E3%83%BC%E3%82%BF%E3%83%99%E3%83%BC%E3%82%B9">関係データベース &#8211; Wikipedia</a>
      </li>
    </ul>

    <p>
      モデル層で、データのValidateをチェックする役割も紹介される。
    </p></p>
  </div></p>
</div>

<div id="outline-container-sec-2-3-4" class="outline-4">
  <h4 id="sec-2-3-4">
    Middleware Layer
  </h4>

  <div class="outline-text-4" id="text-2-3-4">
    <p>
      MVCのコントローラに当たる部分。HTTPやそれをベースにした通信プロトコルの解説。
    </p>

    <div class="org-src-container">
      <pre class="src src-language">Week Five – Module 5: Middleware

Lecture 1: What is Middleware? Lecture 2: The Hypertext Transfer Protocol (HTTP) – Introduction Lecture 3: HTTP – Request Lecture 4: HTTP – Response Lecture 5: The Model-View-Controller (MVC) Design Pattern Lecture 6: Rails Controllers – Request Handling Lecture 7: Rails Controllers – Response Lecture 8: MVC Implementation in Rails

    <p>
      以下のような概念が紹介される。 はずかしながら、HTTPについてはじめてまともに勉強した気がした。
    </p>

    <ul class="org-ul">
      <li>
        HTTP, HTTPS(Request, Responce) <a href="http://ja.wikipedia.org/wiki/Hypertext_Transfer_Protocol">http://ja.wikipedia.org/wiki/Hypertext_Transfer_Protocol</a>
      </li>
    </ul>

    <p>
      REST, SOAPは未だにわからないな。。。
    </p>

    <ul class="org-ul">
      <li>
        REST-based, Restful, <a href="http://ja.wikipedia.org/wiki/REST">http://ja.wikipedia.org/wiki/REST</a>
      </li>
      <li>
        RPC-based, SOAP <a href="http://ja.wikipedia.org/wiki/SOAP_(%E3%83%97%E3%83%AD%E3%83%88%E3%82%B3%E3%83%AB)">SOAP (プロトコル) &#8211; Wikipedia</a>
      </li>
    </ul>
  </div></p>
</div>

<div id="outline-container-sec-2-3-5" class="outline-4">
  <h4 id="sec-2-3-5">
    Presentation Layer
  </h4>

  <div class="outline-text-4" id="text-2-3-5">
    <div class="org-src-container">
      <pre class="src src-language">Week Six – Module 6: Presentation/User Interface

Lecture 1: Introduction and Background Lecture 2: HTML – Basic Syntax Lecture 3: HTML – Document Structure Lecture 4: HTML – Forms Lecture 5: Dynamic Content Lecture 6: Cascading Style Sheets (CSS) Lecture 7: JavaScript and jQuery Lecture 8: Ajax

    <p>
      Presentation Layerの構成要素は以下。
    </p>

    <ul class="org-ul">
      <li>
        HTML(構造)
      </li>
      <li>
        CSS(表現)
      </li>
      <li>
        JavaScript(動作)
      </li>
    </ul>

    <p>
      これらは絶対に、絶対に、絶対に、分けなければいけないと強調される。
    </p></p>
  </div></p>
</div></p>

感想

今まで漠然と知っていたことを、改めて学び直した気がする。

このブログもWordPressでできており、 ブログの改造をすることでHTMLやCSS,JavaScriptをつかったこともあったが、 それらの役割や関わりを基礎からおさえられた気がした。

もっとウェブサービスを理解したいと思って、こんな本も購入してみた。