はじめに：Web制作の課題
Webサイトを作る現場では、サイトの構造が複雑になるにつれて、コードの変更が思わぬところに影響を与えてしまう「メンテナンスの複雑化」という問題がよく発生します。特に、たくさんの人が関わる大きなサイト開発では、
-
デザインを変えると他の部分まで変わってしまう
-
新しく開発に参加した人がコードを理解するのに時間がかかる
といった非効率な状況が、開発の大きな負担になっていました。
新しいWeb制作の考え方「DI-CODING®」とは？
この課題を解決するために、ICT株式会社が提唱するのが「DI-CODING®（ディーアイコーディング）」です。これは「デザイン注入（Design Injection）」という考え方に基づいています。従来の「デザインに合わせてコードを書く」方法とは逆のアプローチを取るのが特徴です。
- 骨格（HTML）の再利用: まず、共通して使えるWebページの骨格（HTML）を部品（コンポーネント）としてあらかじめ用意します。これを必要な場所で繰り返し使います。
- デザインの注入: 次に、その用意したHTMLの骨格に対して、柔軟に見た目（CSSデザイン）を後から「注入」します。
この方法によって、同じコードを何度も使えるようになり、見た目の変更が他の部品に影響しにくくなります。これにより、Webサイトの保守や管理がずっと楽になり、コードが読みやすくなるメリットが期待されます。
「DI-CODING®」を実践できるツール「DI-KIT v2」の魅力
この「DI-CODING®」の考え方を、実際のWeb制作現場ですぐに使えるようにしたのが、最新のWebスターターキット「DI-KIT v2」です。このキットを使うことで、Web制作にかかる時間を最大で50%減らせるとされています。
開発効率と拡張性の向上
-
最新の技術を採用: 「Nuxt 3」という新しい技術を土台にしており、HTML、CSS、JavaScriptをひとつのファイルでまとめて管理できる「Vue.js」の単一ファイルコンポーネントに対応しています。
-
Webサイトの表示を速くする: 画像の読み込みを遅らせる「UnLazyImage」という機能が最初から含まれていて、Webサイトを見る人の体験を良くするのに役立ちます。
-
将来的な拡張性: Webサイトを高速に表示し、検索エンジンに強くする「静的サイトジェネレーター」としての良さに加えて、将来的に動きのあるWebアプリ（SPA）への拡張も簡単にできます。
品質管理と実用性の強化
-
品質の確保: スタイルを記述する「Sass/SCSS」の利用や、「ESLint」「Markuplint」といったコードの品質をチェックするツールの設定があらかじめ組み込まれており、高いコーディング品質を保てます。
-
実用的なサンプル: 問い合わせフォームのサンプルが用意されており、入力内容のチェック（バリデーション）やファイルのアップロード、迷惑メール対策（reCAPTCHA v3）にも対応しているため、すぐに実務で使えます。
-
簡単な導入: Windows用のバッチファイルやnpmスクリプトが用意されており、いくつかの手順で簡単にインストールして開発を始められます。
オープンソースで商用利用も自由
「DI-KIT v2」は、インターネット上の開発者向けサイト「GitHub」から無料でダウンロードして利用でき、ビジネス目的のプロジェクトでも制限なく使うことができます。
Web制作者・管理者にとってのメリット
「DI-KIT v2」は、Web制作チームやビジネスに次のような良い影響をもたらします。
-
チーム開発の効率化: デザイナーとエンジニアがスムーズに協力しやすくなり、チーム全体の生産性が向上します。
-
保守・運用コストの削減: 部品を再利用できるため、過去に作ったプロジェクトの資産を活かして、新しいサイトを作ったり更新したりする手間を大きく減らせます。
-
低い学習コスト: 「Vue.js」に慣れていない人でも扱いやすく、Webサイトの管理者も、従来のHTMLやCSS（Sass）の知識があれば運用や保守が可能です。
「DI-KIT v2」の入手方法
「DI-KIT v2」は、以下の場所から無料で手に入れることができます。
-
GitHubリポジトリ（ダウンロード・利用方法）: https://github.com/ICTinc3773/DI-KIT
-
DI-CODING®公式サイト（詳細情報）: https://www.DI-CODING.com/
ICT株式会社について
ICT株式会社は、中小企業のデジタル化（DX）を支援するパートナーとして、AI、クラウド、セキュリティなどの最新技術を使ったITソリューションを提供しています。顧客と同じ目線で課題に向き合い、計画作りから運用まで一貫してサポートする伴走スタイルが特徴です。
ISMS認証を取得した安全な運用体制のもと、東京、大阪、兵庫を中心に、実際の業務改善と長期的な成長に貢献するITサービスを提供しています。
ICT株式会社のウェブサイト: http://www.ictinc.co.jp/
