タイトル通り、始めました。
そもそもWebの知識に乏しい筆者が、勉強を始めました。
きっかけ
仕事で、Webアプリのサーバーサイドの開発は、一部やっています。記事に少し書いています。
フロントエンドは、若干やった程度で、こう書けばこうなるよ!というのをコピペして動かせる程度の知識です。
しかし、現状の技術動向を見ると、フロントエンドの知識が無いと、そもそも話についていけない場合が出てきています。
サイトの応答速度を上げるためにSPA
やPWA
を採用する場合、新たなJavaScript
のライブラリを採用する場合、JavaScript
の構造を含めシステム全体の設計を行う場合等々、フロントエンドの知識が無いと辛いです。
特に、PWA
には可能性を感じるものの、ギリギリ普及しきっていない(気がする)今の段階で学んでおかないと*1、追いつけなくなるという危機感を感じています。
というわけで、勉強を始めました。
目標
PWA
で、何らかのアプリを作り、公開する。
これを目標にします。
勉強方法
そもそも、HTML
、CSS
、JavaScript
をロクにやったことが無いです。
まずはそこの基礎知識をつけます。
その後、自分に欠けている知識を認識した後、その埋め合わせ等を行う、という計画にしました。
言語勉強
以下のサイトを利用しました。
paiza ラーニング
JavaScript
の勉強に使いました。
基本文法のみなので、さくっと終わらせました。
JavaScript
だけでなく、様々な言語の勉強ができます。
Progate
無料会員で登録しました。
言語のうち、
- HTML & CSS
- JavaScript
- jQuery
の3つを、解けるところまで*2解きました。
以降
ここまでは全く苦労しませんでした。
大して難しくもなく、基礎的な文法や、あいまいだった部分を明らかにすることができました。
問題は、この後どうやって勉強するか、です。
上のサイトの問題をすべてこなしましたが、PWA
等を使いこなせる実践レベルには遠く及ばない、ということがはっきりわかりました。
正直に言って、どうしたらいいのか分からない状況でした。
仕方ないので、PWA
のチュートリアルを流すことにしました。
PWAチュートリアル
Google公式です。
サイトから、ソース一式をダウンロードできます。
ソースを元に、以下の環境でチュートリアルを実施しました。
環境 | ツール名 | バージョン |
---|---|---|
OS | Windows10 64bit | 1803 |
ブラウザ | Google Chrome | 66.0.3359.181 |
サーバー | Python | 3.6.5 |
エディタ | Visual Studio Code | 1.23.1 |
チュートリアルでは、Web Server for Chrome
のインストール方法が書いてありますが、代わりにPython
を使ったので、今回は使用しませんでした。
感想
意味が分かりませんでした。
ハードルが高すぎたように思います。
いえ、解説はよく分かりますし、どういう仕組み(キャッシュ等の使い方等)で動いているのかは、だいたい理解できます。
実際、オフラインできちんと動作したときは、すごい!とも思いました。
しかし、ソースに書いてあるイベント等が、よく分かりません。
結果として、ああ、そういうものなんだなみたいな、何も理解できない状態となっています。
JavaScript
のイベント等について、もっと学ぶ必要があると実感しています。
Pythonで開発サーバーを起動する
Pythonで開発サーバーを起動する場合、
python -m http.server 8000
というコマンドを使います。
しかし、これだとmime
の判断が行われません*3。
そこで、GitHub
を参考に以下のようなソースを書き、
それを
python .\server.py
というコマンドで起動するようにしました。
同時並行
フロントエンドの勉強をするなら、JavaScript
の最新事情も知る必要があります。そこで、
を読んでいます。
また、以前途中だった
も、同時に読み進めています。
今後
まず、JavaScript
のイベントがさっぱり分からない、ということがわかりました。
とりあえずは、
JavaScript初級者から中級者になろう — uhyohyo.net
というサイトを見つけたので、こちらを読み進めようと考えています。
最初に読むべきだったような気がする
また、言語が型付きではない、というのは知っていましたが、想定以上に意味が分かりません。
TypeScript
についても学びたいところです。
おわりに
現状、私が学んだノウハウを紹介するのも難しいです。
なんとなく、こういうものかな?みたいな理解ですし、paiza
とProgate
の丸写しにしかなりません。
きちんと理解したうえでPWA
でアプリを作るまでは、茨の道であることがわかりました。
私にとって未知の領域です。
諦めず、学習を続けようと思っています。