こんばんは、21B SysAd班 mehm8128です。
部内ハッカソンに追われながらこの記事を書いています。
12/16(土)にサイボウズ株式会社さんの東京オフィスで開催された次世代Webカンファレンス2023に参加してきたので、その参加記です。
サイボウズさんの東京オフィスは実は前に一度行ったことがあるのですが、そのときはカンファレンスルームが開いていない状態だったので開いていてびっくりしました。あんな開き方できるんですね。
今回僕が参加させていただいたセッションは、CSS、A11y、Tooling、Frontend Architectureの4つです。フロントエンドエンジニアなので、そっち寄りになっています。
順に感想など書いていきます(ちゃんとメモらずに聞いていたのであんまり濃くないです&色々間違ってたらすみません)。
CSS
Kuma-UIやTailwindの話が聞けたのがよかったです。ユーティリティクラスどうなの？とかtailwind.config.jsどのくらいいじってる？とか。僕はCSS書くの得意な方ではないので、話に出ていたようにこういうCSSフレームワークとかでなるべく書かなくていいようになってほしいなーって思ってます。
Kuma-UIは実はコントリビュートしたことがあって、記事も出しています。
mehm8128
↑で内部のコード読んだことがあったこともあり、こういうツール開発している方がどのくらい最新のCSS追ってるのかみたいな話も面白かったです。それに伴って結構色々とCSSの技術的な話が出てきましたが、カスケードレイヤーとかみたいな序盤に出てきた話はあんまりキャッチアップできていなかったのでなんか難しそうだなーって思いながら聞いてました。逆に後半のView Transitions APIとかPopover APIとかは使ってみたこともあったので理解しながら聞けました。
AIの話もちょっと出てきて、TailwindはAIにいい感じに書いてもらいやすいよねって話があったのですが、僕もそれは思っていて、TailwindでAIにデザインを任せた過去があります↓。
ikura-hamu
CSSは勉強するなら今みたいな話もされていたので、改めてちゃんと勉強しようかなーって気持ちになりました。
A11y
これ、「えーいちいちわい」って読む人もいれば「えーいれぶんわい」って読む人もいるんですね。僕はアクセシビリティって読みます。
最近a11yに興味があるので、今回一番楽しみにしていたセッションでした。
a11yをちゃんと理解していて対応している人まだまだ少ないよねみたいな話で、ツールとかを使って解決すればいいのではと思うけど、機械的な処理だと「とりあえずテスト通ってるからOK」みたいな人が画像のaltを適当に指定して「alt属性がついてるからOK」みたいなことになったり、𝕏のaltで遊んだりしてるのはよくないよねみたいな話がかなり印象に残っています。そういう人たちにちゃんと対応してもらうようになるためにはこういうイベントなどでもっと広めていったりして理解していってもらう必要があると思うのですが、なかなか難しいですよね...。個人的に、今回のように実際の視覚障害者の方(に限らずWebアプリを使う上でなんらかの不自由がある人)などの話を聞けるような機会がもっとあればいいなーと思っています。スクリーンリーダーも僕はまだあんまり使えていなくて、実際にスクリーンリーダーを使う人がこう使うからこうマークアップするのがいいみたいなのをちゃんと理解していきたいなと思っています。
また、フロントエンドエンジニアは結構「テストがやりやすくなるから」「なんとなくroleとかaria-*みたいなのを見たこと・聞いたことがあるから」という理由でa11yに入門する人が多いイメージみたいな話が出ていましたが、僕も実際そうで、最初は「できるだけ色んな人がアクセスできるように」という気持ちよりは「技術記事で最近よく目にするから」というような気持ちで入門していました。もちろん上記のような理由で入門しても問題なくて、最終的にちゃんとa11yの意味とかを理解して対応していけるようになればよいと思います。
CSSのときと同様にここでもAIの話が出てきて、画像からalt属性の文字列を生成するとかといったことができるようになっているので多少対応の手間が減ったり対応されていないサイトでもAIによっていい感じにアクセシブルになるのではという話題に対して、AIが出力した文字列がサイトの制作者が意図していたものとは違うものの可能性があるのではという意見が出ていました。自分も同意見だけど全く対応していないのと少し違っていてもなんか文字列が入っているのではどっちがいいかと言われたらやっぱり後者なのかなという気持ちにはなりました(AIの精度にもよりそうですが)。
最後にVRの話で、結局色んな障害を持ってる人がいるから色んな人を想定しないといけないよねという話がありました。Webで言うとスクリーンリーダーを使う視覚障害者の方を想定しがちだけど、手が不自由でマウスやキーボードが上手く使えないとか、目は見えるけど色の違いがあまり分からないとか、障害を持っているわけではないけど一時的に怪我で片手が使えないとか、思っているよりも色々な人がいるので、サービスをアクセシブルにするにはできるだけ多くの人を想定して色々なケースに対応していかないといけないと改めて感じました。
思ったより真面目な話になっちゃったのでa11y関連で僕が書いたブログを見てください。
mehm8128
mehm8128
Tooling
traPの先輩のsapphi_red(traPではsappi_red)さんが登壇してました。sapphi_redさんの記事はこちらから↓。今回のセッションに関係ありそうな記事も出しています。
1
元々Design Technologyを見るつもりだったのですが、最近Biomeを使ってみてかなりよかったので気になってこっちを見に行きました。
普段この領域はほとんど触れていないので内容を理解できたかというとあんまり理解できていないのですが、今回話に出ていたformat・lint・bundle(？)系のツールはフロントエンドエンジニアなら全員が使うツールなので、パフォーマンスを追求したり色々な人の要望を取り入れながら機能入れたりするのが大変そうだなーって思いました。
あと、importやtailwindのclassのソートとかがformatとlintどっちの役割なんだって問題が最後にちょっと話されてたのが面白かったです。Prettierはsemanticsを変えなくてもASTを変えちゃうのはできるだけ入れないようにしてるんですね。
Rustなのでハードルはちょっと高そうですが、Biomeは将来有望そうな予感がしているので時間ができたらコントリビュートとかしていきたいなーって思いました。
Frontend Architecture
フロントエンドアーキテクチャと聞いたら、今回も登壇されていたよしこさんの以下の記事を思い出すのでディレクトリ構成の話とかするのかなーとか思っていたのですが、最初にSSRとかの話をした後アプリの分割の話から組織論などの話になり、想像してたのとはまた違った面白い話が聞けました(ただ、疲れていて集中力が切れかけていました)。
よしこ
SSRとかは結局するかどうかはプロダクトに依るので、メディアとかの場合はやった方がいいけど、最近多い(今回の会場だったサイボウズさんで開発しているkintoneなどの)ツール系のサービスでは、別にSSRしなくてもいいよねみたいな話をしていました。その上で、Next.jsみたいなSSRとか前提みたいなのじゃなくて、クライアントサイドレンダリング用のReactのフレームワークが出てくると面白そうだよねみたいな話でした。僕は普段あんまりパフォーマンスをちゃんと求めるようなアプリを作ることは多くないので、Next.jsを使うのはルーティング周りやその他諸々が生のReactより楽にできるから程度の理由で使っているのですが、それなら確かに、そこらへんだけNext.jsと同じような機能を持っていてクライアントサイドレンダリングに特化したフレームワークみたいなのが出てきてもいいよねと思いました。
組織論の方は...難しくてなんとなくしか分かりませんでした。まだあんまりちゃんとした開発組織に入ったことがないからというのはあると思うので、就職してから色々考えられるようになればいいなと思いました。コンウェイの法則はちょっと前に知ったのでなるほどねってなりました。
まとめ
1人で行ったのでちょっと寂しかったのですが、後から来た先輩(登壇した先輩とは別の人)を発見したり他にも知り合いの人に発見してもらえたりしたのでよかったです。
TestingとかPerformanceとかも興味あったのですが聞けなかったので、後で配信で聞きたいと思います。
今回色んな話が聞けて、すごいモチベが上がったので時間ができたら色々勉強したいなと思いました。ちなみに大量の課題によってそんな時間は今はないです。
運営の方々や登壇者の方々、ありがとうございました、お疲れ様でした。
