先日11月14日にオンラインで開催された「WCAN 2020 Frontend Special」に参加してきました。
今回はWCAN 2020 Frontend Specialに参加した際の感想を記事にしました。
1.フロントエンドエンジニアのロードマップと学習法
HTML+CSS、JavaScript、GitやNPMの他にトランスパイルやVue.jsなどの解説と勉強方法、おすすめの本などを教えていただきました。
途中で聞いたことのない単語や知らない技術が出てきて、自分は勉強不足だと痛感しました。なので今回教えていただいた勉強方法を実践して、もっと勉強しようと思います。（英語も頑張って勉強しようと思います。）
2.マークアップを進化させるWAI-ARIAの基本
この回まで一度も「WAI-ARIA」という単語を聞いたことがありませんでした。HTMLにこんな便利な機能があるとは…。ちょうど学校の授業でSMACSSやOOCSSなどのコーディングルールを勉強しているので、それらと一緒に勉強していこうと思います。
LT1.Adobe XD for Visual Studio Code試用レポート
以前からAdobe XDのデザインデータを簡単にVisual Studio Codeでコーディング出来たら…と考えていたのですが、本当に出来るようになるとは思ってもみませんでした。
デザイントークンを簡単にインポート出来るようになったのはかなり大きいのではないでしょうか。私も試してみようと思います。この機能をマスター出来たら作業効率がとても良くなりそう。
LT2.CSS in JSで変わること変わらないこと
CSS in JSもここで初めて聞きました。
（JavaScriptでCSSを記述する技術という認識で大丈夫でしょうか？間違えていたらすみません。）
CSS in JSというものがよく分からずTwitterで検索してみたところ「便利！」という声が多く、使えるようになったほうがいいと思ったのでJavaScriptと平行して勉強しようと思います。
LT3.jQueryコードばかりだった私が Vue.js で単一ファイルコンポーネントにチャレンジした話
JQueryは知っていますし書いたこともあるのですが、Vue.jsはまったく知りませんでした。イベント後調べてみたのですが、JavaScriptのフレームワークの一種なのですね。これも勉強しておきます。
3.モダンなCSS設計 – Vue.js/React時代のCSSの書き方とこれから –
・「予測可能性」、「再利用性」、「保守性」、「拡張性」の4つを満たすことの重要性
・上記を満たすためのCSSの設計手法「BEM」、「FLOCSS」
とても重要なことですね。
私もこのサイトを作る過程で、CSSが重複して想像通りにCSSが反映されないということが何度もあり苦戦しました。しかし、BEMやFLOCSSなどに則ってCSSを書けばそのようなことは起こらないので今後はこれに気をつけてCSSを書いていきたいと思います。
4.VueもReactも使わないJamstack入門
Jamstackも初めて聞きました。
この回では、「Jamstackとは何か」、「Jamstackの利点」を教えていただきました。CDN/ADNで配信されているため高速であるというお話の際に「4000ページを読み込むのにかかる時間はたったの22秒」と聞き、「Jamstackすご！」と思いました。早すぎないですか？
おすすめのライブラリも教えていただけたので、冬休み中に少し触ってみようと思います。
WCANに参加して
私自身の知識不足を痛感しました。
冬休みと春休みは、今回のWCANで学んだことを活かして、分からなかったものや触れたことのないものを勉強しようと思います。