お品書き
前菜
技術
頑張ったこと
反省
最後に
イイモノできたんじゃない??
(若干回想)
突然だが、今まで我々はHTML/CSS/JSのシンプルな環境で開発してきた。Git環境なんかも無し!アニメーションは勿論jQwery!!メンバーは部分部分のコーディングをしてこれらをPMが合体してまとめる。ちょっとしたバグ修正なんかはXserverで直接編集したりしていた。
個人開発でReactやらNext.jsやらを使っている僕やQwertは正直不満だったが、開発はほぼ問題なく回っていたのでぶっちゃけこのままでえーねん状態が続いていた。というかメンバーが望んでいないのに無理やり推し進めるのが面倒くさかったし、本当に必要なのか疑問だったし、独りよがりになりそうで恐かった
しかし今回は思い切ってAstroとGitでのチーム開発に挑戦してみた。理由はいろいろあるけど、
PMじぞうが皆のHTMLをまとめるのがしんどい
メンバーもコードが激長すぎてよく分かんなくなっちゃった
メンバーの進捗度が把握しずらい
モダン環境で開発したい!!(だって僕たち3年がメインで担当するのは今回がラストやもん!!)
他にはjQweryを禁止なんかもやってみた。バニラJSに慣れていないメンバーは結構焦っていたwごめんよ🙏
高専祭のHP後すぐにプロジェクトが始まってドタバタだった中、僕とQwert、同級生と後輩は今できる最高の仕事をしてくれたと思う!ありがとう&お疲れ👏
使用技術&サービス
✨Astro
少し前に別のHP製作で使った
ほとんどのメンバーは初めて触った
✨Git&GitHub
全体で使ったのはこれまた初めて
自分にとっても10人以上でのチーム開発は初めて
スプレッドシート
CMSとして大活躍
お知らせ、遅延情報、トーナメントなどで使用
実は去年も使っていたけどお知らせと順位くらいしか使えていなかったから、今年は幅が広がった
Figma
メインはQwert
デザインの調整を担当
弊部でデザインツールとしてようやく浸透してきた感じ
Slack
基本この子
GitHubの通知や質問部屋の設置など
LINE
ちょいちょい
明らかにLINEのほうが反応良いので悩みどころ
実はDiscordに移動しようか検討中。。
Teams
Web会議用
頑張ったこと
デザイン
秋をイメージした配色やデザインをこころがけた。そこまでデザイン面では凝ってない分、統一感が出たり見やすさが向上したんじゃないかな
デザイン初期段階では木の葉を降らすアニメーションは考えていなかった。後々追加した。これ良かった
PM
Node.js&Git環境構築
Qwertと講習会を開いた
部員の集まりが悪かったためスライドを作ったりSlackやMS Teamsを使って全員に布教した
メンバーは初めてが多すぎて大変だったろうけど、開発体験は良かったみたいでホッとした
シフト決め
LINEで投票。あとは微調整
メンバーのサポート
Git質問部屋とAstro質問部屋をSlackで用意した
意外と質問が多かったので安心した
Git関連はエラー原因を文面で把握するのが大変だったのでTeams会議開いていた
新しい技術をメンバーに強いているのにサポート手薄はありえへんやろ!!精神で臨んでいた
1コーダーとして
ぶっちゃけ前半はコードを一切書いていなかったけど、これは他メンバーの育成のためであって。。
トーナメントのCMS連携
いちばん頑張った
スプレッドシートの勝敗情報からトーナメントSVGを変更するっていう実装
情報を取ってきてSVGに反映させるのは意外と普通だったが、コード構造がぐちゃぐちゃになりそうだったので、これを工夫した
バグ修正
主に当日
これはなんやかんや多かった感
反省
Astro&Gitの必要性を伝えきれなかった
ほとんどのメンバーは理解してくれたけど「???」な人も居たのでもうちょい説明の準備をするべきだった
具体的にはAstroのslotやコンポーネントが理解しにくかった感じ
たとえ話が効果的だったので、たとえ話力をアップさせる
デザインもうちょい凝れよ
これは1人の人間に言われたことだけど、Web研ならもっとあっと驚くHPを制作できたのではないか
いや、これは視認性を上げるためにシンプルに。。こっちはこっちで話し合って決めてるねん。。ちょっと高専祭直後で時間なくて。。
こんな言葉を並べて真摯に受け止められなかった。伝えたいことをもっと自信もって伝えられるように精進します
Astroの勉強不足
ビルド時のフェッチデータを使ってSSGしていると知らなかったので部分的に変更の度ビルドする必要が出てしまった
Reactを使うか迷ったけどバニラで統一したかったので使わなかった
今度からは使おうかな
その他細かい仕様については曖昧な理解であったため、今後の個人製作で使い理解度を上げたいかな
SVG直書きしんどすぎ問題
マップなどでSVGにJSアニメーションを追加する必要があったため、SVGをastroの中身に直書きした結果、該当ファイルを開いている間にVScodeの拡張機能が1分に1回落ちてしまう
自分の担当部分では回避策を使って乗り越えた。別記事で紹介しようかな
最後に
チームにGitを導入するのが一番大変だろうなあと思っていたが、案の定そうやった
ブランチルールは設定したんやけど、コミットルールは今回なしにした。ちょっと息苦しかっただろうし、コミットメッセージにほどよい抜けがあると少し雰囲気が和らいでいた印象
Astroは個人的に使うの2回目くらいやったけど、体験はかなり良かった
ふと思ったのが、Astroのバグ解決記事やテクニック紹介記事が以上に少なかったこと。ブロガーやメディアはみんな紹介記事ばかり書いていて、「技術記事なのか、これは??」唖然とした
英語圏の記事はたくさん発掘したので、日本のAstro技術記事を増やしたいな~と思った。ちょいと知見も溜まったので書き書きしまーす
さて、高専祭・スポーツ大会のHP製作が終わり、Web研の活動は来年5月の文化発表会までほぼお休み
これから何を作ろうかな?