いつの間にかJSが怖くなくなっていた件
こんにちは。webエンジニアとwebデザイナーになりたいロシータです。ロシータはとあるマーマレード色の猫の名前を貸してもらいました。
ここ1か月の間、大きなコーディング案件がありなかなかnoteを書く時間もとれませんでした。一時的に勉強もストップしていたけれど、この案件を通して得るものがたくさんありました。大きく分けるなら3つ。さっそく紹介します。
----------
JSに向き合える日がやってきた
嬉しいこと順に。まずはJS（JQuery）が怖くなくなっていた！
これまでは、実装したい動きをGoogle検索して、だれかが載せてくれた記事をありがたや～とまるっとコピペしてあてはめる。動かなければ別の記事を探してまた試す…ということを繰り返していた。
しかしながら3月からMENTAとprogateでJS（jQuery）に取り組んだ結果、検索の前に「どういう方法で実現できるのか」が想像できるようになり、またコピペのコードであっても自分でアレンジして構築しているサイトにフィットさせられるようになった。「ここはJSだな」という場面でいやだなあ…とかできるかわからない…という負の感情は浮かばなくなっていた。代わりに「できた！」「うごいた！」「天才！」といった内なるよろこびの声が聴こえてきた。（むしろ口から出ていた。）
JS（JQuery）から目をそらさずに、向き合える日がやってくるなんてな…！
PRECSSの使用
第二に、CSSのPRECSSという手法を取り入れたことだ。当然のことだが、少ないページやLPの案件ならまだしも、20～30ページ以上の中規模サイトからは、CSS設計をしないと非効率でカオスないばらの道を辿ることになる。わかっていながらどのように設計したらよいものか俯瞰的に考えることのできなかった私にとってPRECSSは革命的であった。ちなみにこれまでのCSSは独自ルールか、ちょこっとBEM。BEMは使ってはみたけれどうまく長所を利用できず、最終的にこれじゃなくてもよくない…？となってしまっていた。
PRECSSの場合、使いまわすモジュールや共通レイアウトをわかりやすく設定していくことができ、対してページ固有のスタイルはもちろん、「共通のテーブル要素だけどここだけmargin-bottom多く取りたい…！」みたいなことにも小回りが利くスタイルを設定できる。
このPRECSSは札幌のWeb星に住んでいる半田さん考案の手法。アホっぽい感想だけど、こんなエキスパートな方が同じ札幌にいるんだ～と思うと素直にうれしい。
SASSの導入
第三にいまさら、SASSを導入した……わたしが勤めている会社は、構築段階で社内にあるサーバを使用するため、ローカル構築の必要がない。
一度、その社内サーバを通してSASSを試みたときにはエラーが出てうまくいかず、調べたところサーバ×SASSの環境を整えるにははなんだかいろいろ必要なんだ…ということがわかったのでそっとフタを閉じて早3年の月日が経とうとしていた。
ところが、今回社外のパートナーさんに、「SASSはぜひ使っておいたほうがいい…！」と推されたため、重い腰を上げ再度セッティングしてみた。
すると、サーバでもなくコンパイルツールでもなく、エディタのPHPのセッティングが整備されてなかっただけということがわかった。（基本的にHTMLではなくPHPファイルで作ることが多い）ここに書くのも恥ずかしい話なのだが、つまり、そういうことだった。
…こうして無事にSASSを導入することもできて、PRECSSの効果が倍増したし、SASSを使ってこそ「コーダーです」といえるような気持ちにさえなってきた。はたして今までは何だったのだろうかというむなしい気持ちはこのさい石狩川に流すとしよう。
というわけで、この1か月とある案件に集中した結果、さまざまなことが身についた。やはり案件を通して学んでいくのが一番血肉になる気がする。もちろんじっくり腰を据えての座学もだいじだけどね。
なんにせよ、わたしは今パワーアップした気分で満ちている！
※写真の解説：夏はビール