All Articles

フルスタックWeb開発 part0 内容

2019/10/13

2019 09 23 11 23 17

https://fullstackopen.com/en/part0

※“Full Stack Open 2019” by Matti Luukkainen, contributers,Houston inc,Ava Heinonen, Ilkka Kuisma, Harri Mehtälä and Jesper Pettersson is licensed under CC BY-NC-SA 3.0

General Info(一般的な情報)

このコースの導入的な内容で、コース自体についての説明と、大学の単位取得するための方法の説明など。
チュートリアルだけやりたい場合に、必要だと思った内容は以下

  • 必須ブラウザ: GoogleChrome
  • 推奨エディタ: VisualStudioCode
  • Nodeのversion: 8.0以上

Fundamentals of Web apps(Webアプリの基礎)

サンプルサイト:https://fullstack-exampleapp.herokuapp.com/

サンプルサイトをChromeで開いて DeveloperTool を見ながら、Webの基本的な仕組み(データのやり取り)の説明
ページ表示時と、投稿処理時の ブラウザ-サーバー間 のやりとりを、ChromeのNetworkタブで実際に見ながらの解説。
SPA以前のWebサイトの実装(Ajax利用)と、SPAのWebサイトの実装の違いを、解説。

SPAで書いたサンプルサイト: https://fullstack-exampleapp.herokuapp.com/spa

  • Web開発における、JavaScriptの流れ (PureJavaScript、JQuery、BackboneJS、AngularJS、React、Vue.js)
  • フルスタックWeb開発、というワードのこのコースでの意味は、以下

    フルスタックWeb開発とは、フロントエンド、バックエンド、データベースなど、アプリケーションのすべての部分に焦点を当てることを意味します。

  • JavaScript Fatigue(JavaScript疲れ)… JavaScript関連の絶え間ない変化に辟易すること。

やってみて

1時間30分ぐらいの内容。 ChormeのDeveloperTool開いて、指示されたボタンを押しながら、データがどうのこうのする説明をキャプチャ付きでしているので、特に問題なくさくさく消化した感じ。

part0をまとめると、

  • Webの基礎的な仕組み
  • ChormeのDeveloperToolの使い方
  • JavaScriptのフレームワークの移り変わり
  • SPA以前とSPAの対比、JavaScriptの日々の進化が早いよ

という内容でした。