2015年8月16日日曜日

Web系についてあれこれ FlaskとかBoostrapとか

がっつり自分用のメモ

HTML
<>で表現するやつ。ぐらいの認識しかなかった。
リンクや文字を装飾するとか。
<>の中に入るのは要素(Elements)という。さらに引数のような形で属性(Attribute)がつくこともある。
https://en.wikipedia.org/wiki/HTML_attribute

HTMLをWebブラウザに読み込ませれば、レンダリングしていつも見ているものになる。
これが静的なコンテンツとかいうものらしい。

CSS(Cascading Style Sheets)
https://en.wikipedia.org/wiki/Cascading_Style_Sheets

CSSは見た目を定義するためのもの。
HTMLはあくまでも内容を書くものとして、見た目を書かない。
HTMLに見た目を書くこともできるけど、そこは分離しておいたほうが都合がいい。

<h1>はあくまでも章を示していて、それをどのように表示するかは未定義。
デフォルトだと大きく表示されるけど、これはブラウザ側がデフォルトで持っている挙動。

Bootstrap

MITライセンス
http://getbootstrap.com/
https://en.wikipedia.org/wiki/Bootstrap_%28front-end_framework%29
Web関係とは関係ない知り合いのエンジニアがみんな使っている。
イマドキっぽいデザインを提供してくれるCSSやアイコンなどを提供してくれる。
mobile firstと書いてあってレスポンシブデザインなコンテンツを作成できる。
例えばブラウザの幅を小さくしていくと、いい感じに見た目が切り替わる機能とか。
コードとしてはグリッドシステムというのがあって、12等分をどう分配するか記述するだけで良い。
Webド素人としては、ドキュメントが充実しているところが大変嬉しい。
このように書くとこうゆうことができる。というのがまとまっている。
なので、こんなページ作りたいなぁと思ったら逆引きするように調べれば、どんなコードを書けばいいか分かっちゃう。


CGI(Common Gateway Interface)

https://ja.wikipedia.org/wiki/Common_Gateway_Interface
Webサーバはリクエストに応じてHTML等のファイルを配信するのがお仕事。
しかし、あるものを配信するだけでは動的なページは作成できない。つまり、外部プログラムと連携できる仕組みが必要になる。
それがCGI。
中の実装まで踏み込まないけど、標準入出力が取り扱えれば良いらしい。
CGI=PHP,Perlというイメージがあったけど、それは全く正しくなかったです。

Flask

http://flask.pocoo.org/
BSDライセンス
Pythonで書かれているWebアプリケーションフレームワーク。
次の2つを叩くフレームワーク。
  • Werkzeug
  • The Python WSGI Utility Library
  • Jinja 2
  • Jinja2 is a full featured template engine for Python.

データの流れはこんな感じ?
Flask - Werkzeug - WSGI - CGI(WebServer)

テンプレートエンジンってなんぞや?はコードを見たらどうゆうものか一発で分かりました。
http://jinja.pocoo.org/

本当はお盆中にもっと勉強する予定でしたが、さすがに詰め込みすぎて無理でした…。
明日からお仕事がんばります。

0 件のコメント:

コメントを投稿