- Coding Methodology
- 第6回 コーディングパーツアーカイブ
第6回 コーディングパーツアーカイブ
グローバルナビゲーションやメールフォームの表組、タブによる表示/非表示の切り替えなど、まったく異なるデザインでも、コーディングの観点から見ると、パーツとしては意外に共通しているものが多いことに気づきます。コーディングファクトリーでは、クオリティの確保と、コーディングスピードの向上のため、コーディングパーツを全コーダーが共有する仕組みを作っています。
記憶力やルーティンワークはツールに任せ、新しい技術の習得に頭を使う
何年もコーディングをしているコーダーでも、複雑な組み方をするCSSの場合、「これってどう組めばいいんだっけ？」と覚えていないことはよくあります。
以前のコーディングファクトリーでは、「確か○○のサイトでも、同じコーディングをしたな」という記憶だけがあっても、それを探して引っ張り出すのに一苦労だったり、メンバーによって組み方のクセが違っていて、違うメンバーが案件を引き継いだときに、組み方を解読するのに時間がかかってしまったりすることがありました。
また、コーディングで発生した問題を解決するために、さんざん調べた後に、隣に座っているコーダーが、同じことを先週解決済みだったことを知るという、ムダな時間もありました。
そんなムダをなくし、一定レベル以上のクオリティを確保したまま、スピードアップするために作った仕組みが、パーツアーカイブです。
チームメンバーの一人が習得した技術は、チーム全体の財産に
コーディングパーツアーカイブ
パーツアーカイブは、案件で制作したコーディングのうち、パーツとして今後も流用してコーディングをすることがあると思われる部分や、他のサイトで見つけた面白い組み方の部分を真似て作ったパーツなどを、1箇所で参照できるようにしたサイトです。
一人が得た技術をチーム全体の知識として共有することで、それぞれが個別に勉強する何倍もの技術が得られます。また、習熟度の高くないコーダーでも一定品質のコーディングができるようになるので、特定のコーダーに仕事が集中してしまうことも防げます。
たとえば、セルと背景色の間に1ピクセルのマージンがある表組（例）や、タブ形式で表示・非表示を変えるCSS、ライトボックスやアコーデオンメニューなどのJavaScript（ajax）など、「よく見るコーディング」ではあるけれど、ゼロから毎回作るのは、けっこう手間がかかるソースコードについて、案件ごとの制作時に作成したものを、案件終了時にミーティングして流用の可能性があると判断したものについて、アーカイブしています。
アーカイブデータは、画像ファイルや幅などのピクセル数を変えるだけで、そのまま流用できるよう、案件で制作したままではなく汎用的なソースコードにしてからアップするようにしています。
コーディングパーツアーカイブ
パーツを共有するための社内用サイトを作っています。
技術的なことだけでなく、コーディングに役立つサイトの情報や、新技術に関する自慢話も。
コーディングパーツ共有化フロー
各コーダーが作成したコーディングパーツをミーティングで共有し、より良いコーディングにならないか、問題がないかを精査します。その上で、再利用しやすいように名前や変更領域を標準化し、サイトにアップします。
コーディングスタンダートとして発信
今はまだ、パーツの数も多くなく、社内での使い勝手を第一の目的にして収集していますが、崩れない、かつ、文法的にも正確という自信のソースコードばかりです。いずれは社外にも公開し、コーディングのスタンダート発信源として使っていただけるようなサイトにしていきたいと考えています。
