はじめに
弊社はWeb制作会社で、開発にはgulpを使用しています。
自分は入社2年目ですが、gulpに触れたのは入社してからでした。
制作時はいつも会社の開発環境（テンプレート）を使用していたので、gulpに関しては
- 便利なツール！仕組みは…gulpfile.jsに書いてい( ˘ω˘ )ｽﾔｧ…
- 初回実行時にエラーが出ないようにとりあえずお祈り。
- 「gulpfile.js」は軽い気持ちで触るとやばそうだな。ヨシ、そっとしておこう。
という感じで、苦手意識を持っていました。
今回はgulpの勉強を毎日10分程度行なった結果、この苦手意識がどう変わったのかを書いていこうと思います。
始めるに至った経緯
2020年の年末、冬休み中に2021年の抱負（四字熟語）を考えてくることになり、Google先生に頼った結果「水滴石穿」という四字熟語を見つけました。
水滴石穿
小さい力でも積み重なれば強大な力になることのたとえ。
「水滴」は一滴の水、「石穿」は石に穴をあけること。
水滴も同じ位置に落ち続ければ、いずれ石に穴をあけることができるという意味から。
「水滴石を穿（うが）つ」とも読む。
引用：四字熟語辞典オンライン
「水滴石穿」の意味から、毎日10分程何かしらの勉強をしようと考えました。
勉強時間を10分にした理由は主に以下の点からです。
- 勉強が好きではないので勉強に対するハードルを下げたかった。
- 1日10分であればどこかで時間が作れそうだと思ったから。
- 「ちりつも」は勉強にも通用するのか好奇心が湧いた。
結果的に勉強時間を10分に設定したのは自分に合っていたと思います。
なぜgulp?
勉強内容をgulpにした理由は先輩の
「開発環境の構築したことないならやってみては？？」
という言葉がきっかけです。
「やばい。gulpキタ。」と思いました。
しかしながらいつまでも苦手意識を持っていると、それはそれで将来良くないことになる気がしたのでやってみることにしました。
この時点でgulpに関する知識はほぼゼロだったので、これ10分で大丈夫か？という不安しかなかったのを覚えています。
とりあえずやってみよ
まずはリポジトリを用意。
ローカルに作業ディレクトリも用意。
…ココカラドウスレバ？
さっそく詰まり、初日はここで終わりました。10分なんてこんなもんです。
翌日もまず何をすれば良いのかを調べるだけで終わった気がします。
調べていくと、まずはpackage.jsonを作成しgulpをインストール、gulpfile.jsを作成することが必要だとわかりました。
gulp公式を見ればすぐに解決したことだったのですが、こんなに最初の方で出てくるとは思わなかったので時間がかかってしまいました。
package.jsonとgulpfile.jsがあると急にそれっぽくなりますよね。
ちょっとここで楽しくなってまいりました。
パッケージ追加祭り（エラー祭り）
基本のファイルが用意できたら、ここからが本番です。
gulpに働いてもらうためにパッケージを追加していくのですが、これがすごく大変でした。
ちょっと楽しくなってきたぐらいでは太刀打ちできないしんどさでした。
ほんと1日10分でよかった。。
gulpにやってもらいたいことを考える。→どんなパッケージがあるのかをネットで調べ、npmで詳細を確認。
という感じでパッケージを追加していたのですが、似たようなパッケージがいくつもありどれが良いのかかなり悩みました。
選ぶ基準としては
- 有名なもの
- 現在もメンテナンスされているもの
を軸に考えていたのですが、当てはまらないことも勿論あります。
そんな時は先輩へ相談したり、会社のテンプレートをカンニングして乗り越えました。
また、gulp.jsへの記述方法に慣れるまでにかなり時間を要し、パッケージの追加時は必ずと言っていいほどエラーを出していました。
1つの処理（たとえばbabelでJSをトランスパイル）をするのに複数のパッケージが必要なことがありますが、「このパッケージが足りない！追加しろ！」と怒られたり、追加したのに「見つかんねーぞ！」となったり。。記述を間違えて動かない、などなど。
このエラー祭りを経験したことにより、エラーが出ないのに処理が動いていないことがあると、「エラー出してよ！」という精神状態にまで成長（？）することができました。
もはやあの赤い文章は味方のように感じられます。
始める前から変わった点
1年近くパッケージの追加とエラー対応を繰り返しているとやはり変化はありました。
まずはじめに書いた、
- 便利なツール！仕組みは…gulpfile.jsに書いてい( ˘ω˘ )ｽﾔｧ…
- 初回実行時にエラーが出ないようにとりあえずお祈り。
- 「gulpfile.js」は軽い気持ちで触るとやばそうだな。ヨシ、そっとしておこう。
これらの苦手意識に関しては全くなくなりました。
gulpfile.jsの内容がよく分かっていなかったことが原因だったので、自分で作ることでどんな処理が書いてあるのかやエラーへの理解が深まったことが大きいと思います。
また、案件によっては追加したい処理（または使わない処理）もありますし、build先のディレクトリ構造を変えたいときがあります。
そんな時は会社のテンプレートをカスタマイズする必要がありますが、追加・修正・削除する場所がわかるようになったので色々と自分で試せるようになりました。
これはgulpの勉強をして1番良かったなと思えることでした。
おわりに
1年間を通してgulpについて学習し、開発環境を一から作っていく大変さを体験することができました。（割とシンプルな環境なのに…）
タイトルに毎日10分と書きましたが、仕事が休みの日はやっていませんし、忙しかったり他のことに興味が湧いてやらなかった日もあります。
逆に10分のつもりが30分やってしまうなんて日もあり、わりとゆるめに進めていました。
もし何か新しいことをやりたいと思っているけど勉強が嫌い！という方は、「1日10分だけ」と考えてとりあえずやってみてはいかがでしょうか？
来年は何をしようかなー。