2019.5.12
プログラミング動画の下準備【HTML編#2-アジェンダ-】
ほぼメモですけど、HTML編の全体構造をまずざっと列挙してみます。
SDカードに残そうと思ってたんですけど家から職場に持っていくの忘れると萎えそうなのでこの場をメモ代わりにしようとね
1章:タグ編
HTMLの基礎的なタグですね。骨組みからタグとは?みたいな話をします。
もう2~3回で終わると思います。浅い話なんで。
ページを作るのが目的なので、具体的な内容としては必須だと思われるテーブル、インラインフレームぐらいに留める予定です。以降もそうですが、とりあえず
「ググればわかるようになる」ってレベルにまで持っていくのが役目なんで。
1-1:基本タグとページの表示
htmlファイルを作ることが目的ですね。とりあえずページを表示するのに最低限必要なものの解説です。
1-2:リンク
aタグでリンクをつなげることを考えます。
1-3:img,table,flameタグ
その他のタグで大体どんなことができるのか、っていうのを軽く触ります。
2章:CSS編
このままだとプレーンなHTMLしか書けないので、装飾を施します。
まずはタグに直書き、んで、CSS、そして任意でSaasですね。
2-1:style属性
まずはhtmlに直書きでデザインします。
2-2:CSS(class,id)
そうなると問題が出てくるので、CSSってのを導入しよう!ってなるわけです。
3章:javascript編(プレーン)
ページに動きをつけるには、っていうお話です。具体的にどんな言語を使われてるのかっていう軽い紹介だけに留めておくつもりです。
というのも
僕があまりjavascriptを理解していないので・・・・・・。プロトタイプってなに・・・・・・。
この段階で触れるかどうかわかりませんが、jQueryやBootstrap等に代表されるCSSフレームワークの話に触れられたらなあって思ってます。reactとかね。僕使ったことないけど(なんとなく使い方が想像できてきたので、改めてリベンジする予定)
3-1:ページに「動き」をつけるための手段
javascriptってなんなん?っていう話です。
初心者がjavascriptに手を出すとまじでどツボにハマるので、「そういうのがあるよ」程度に留めておく方がいいかと思ってます。
とりあえずこのへんが理解できれば、PHPを用いた本格的なWebアプリケーションを作る下地が整ったことになります。それと同時に、僕が作るべきページもなんか知らんけどついでに完成されていることになりますね。(笑)
で、Advancedとして・・・・・・
4章:Advanced(発展)
現時点で必要ないが、実際にやるとしたら「こういう手抜き」ができるよ、という話をします。
このへんは僕のおべんきょも兼ねてます。Saasの紹介だったり、テンプレートやLaravelを使ってどんなふうにラクしたの?っていう話ですね。
で、ここで話すかもなーって話の大半は
これ書いてる現時点では使ったことない技術が大半を占めてるんで、もしかしたら動画にするのはもっと先かもしれません(笑)
ただ、日記には書くと思うので、それを焼き直せば動画にはなる、という寸法です。
4-1:デザインテンプレート
1からデザイン考えて作る必要なんてどこにもないので、おしゃれなテンプレートをダウンロードして手を加えちゃえ、っていうお話ですね。
サンプルサイトも実は1から作ってなくて、人の作ったものに手を加えて作りました。
こだわりがないなら、こういうテンプレートを活用するのもひとつの手です。
4-2:レスポンシブデザイン
スマホ対応の話です。ファイルを分ける方法もあるんですが、やっぱり単一ファイルで切り替えられるようにしたほうが便利だと思います。
4-3:Saas
プレーンCSSはどう考えても非現実的です。もっと見やすく書きやすいものを使いましょう。
これは僕が学習しないといけないんですが、どう考えても将来的に必要になるので導入します。
4-4:Bladeテンプレートエンジン
ここで取り上げるべきかわからんのですが、まぁ予告動画みたいな立ち位置ですかね。
PHP編の中盤以降は完全に僕が唯一使えるフレームワークという理由でLaravelを用いた開発にシフトするんですが、テンプレートエンジンのおかげでHTML書くのがちょっとラクになってるんですよね、っていう話をしよっかなーと思ってます。
ただ、PHPの話がちょっと混じるし、現時点でこのサイトをLaravelに移植する必要性はないのでもしかしたらやんないかも。っていうかやらない方に傾き始めている。
とりあえず、ここまでの内容をざっと雰囲気だけでも掴んでおけば、ググればモノは書けるレベルになるんじゃないかなって僕は思って動画にしようと思ってます。うまくいかなかったらSeason2とか言ってまた新シリーズを撮り直せば済む話ではありますしね。(笑)