はじめに：若手の努力の結晶（HTML）を守りたい
はじめまして。関東地方の老舗金属加工メーカーで、1人部署の生産管理を担当しています。この春に派遣から正社員になり、QC検定3級も取得して意気込んでいるところですが、社内にはIT専任の担当者がいません。
本来、システムの運用などは総務部の管轄なのですが、ITの知識不足ゆえに、少し知識がある私へたまに「お鉢が回ってくる」という立ち位置で働いています。

事の発端は、営業部長の主導で「高卒向けの求人ページ作成」を皮切りに、自社ホームページをリニューアルするプロジェクトが立ち上がったことでした。
優秀な若手社員が、一生懸命に現代的で綺麗なホームページ（HTML/CSS）を作り上げてくれたのですが、総務部だけでは技術的なフォローやインフラ周りの対応が難しかったため、いつものごとく私にお鉢が回り、若手のフォロー役として参画することになりました。

そこで「運用どうするの問題」が勃発します。
ニュース更新を担当する社員は、WordをPDFにすることはできても、HTMLを直接編集することはできません。タグを一つ消せば、若手が作ってくれた美しいレイアウトが崩壊してしまいます。

そこで、「担当者はPDFを上げてスプレッドシートに記入するだけ」という、生産管理の視点で極限までポカヨケ（エラー防止）を徹底した自動更新システムを構築しました。

システムの全体像（超ローテク・ハイリターン）
構成は非常にシンプルです。

運用担当者の作業

作成したニュースのPDFを、サーバーの所定フォルダにアップロード。

Googleスプレッドシートを開き、新しい行に「日付」「カテゴリ（プルダウン選択）」「URL」を入力する。

※URLは「上の行をコピペして、末尾のPDFファイル名だけ書き換える」運用ルールにし、入力ミスを防止。

バックエンド（GAS）

スプレッドシートのデータをGoogle Apps Script（GAS）でJSON形式の簡易APIとして出力。

フロントエンド（JavaScript）

若手が作ったHTML側でJavaScript（Fetch API）を動かし、GASからデータを非同期で取得して一覧を自動生成。

▼GAS側のサンプルコード（概要）

JavaScript
function doGet() {
  const sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
  const data = sheet.getDataRange().getValues();
  
  let newsList = [];
  // 1行目（ヘッダー）を飛ばして2行目からループ
  for (let i = 1; i < data.length; i++) {
    newsList.push({
      date: data[i][0],      // 日付
      category: data[i][1],  // カテゴリ
      url: data[i][2]        // PDFのURL
    });
  }
  
  return ContentService.createTextOutput(JSON.stringify(newsList))
    .setMimeType(ContentService.MimeType.JSON);
}

▼HTML側の読み込み処理（概要）

JavaScript
const gasUrl = "デプロイしたGASのURL";

fetch(gasUrl)
  .then(response => response.json())
  .then(data => {
    const listElement = document.getElementById('news-list');
    data.forEach(item => {
      listElement.innerHTML += `<li><span class="date">${item.date}</span><span class="category">${item.category}</span><a href="${item.url}" target="_blank">PDFを開く</a></li>`;
    });
  });

最大の壁：XREAサーバーの罠と、深夜のチャットサポート
システム自体はすんなり出来たのですが、最大の障壁は今回利用したサーバー（XREA）の「常時SSL化（https）」設定でした。

コントロールパネルの「無料SSL」のラジオボタンを押しても一向に反映されません。
設定画面を彷徨った結果、XREA特有の「メインドメインとサブドメインの仕様」にぶち当たりました。「先にサブドメインに『同期化設定』を入れてからでないと、SSLのラジオボタンが機能しない」という初見殺しのトラップだったのです。

自力で解決する前に公式のチャットサポートにも問い合わせていたのですが、実際のレスポンスはメール並みのスピード。ようやく返ってきたと思ったら、見事なまでの定型文でした。文章の語尾が「〜設定が必要で」など、明らかに途中でぶった切れているコピペ返信を見たとき、「あ、これは現場の人間（自分）が汗をかいてなんとかするしかないやつだ」と腹を括ったのも、今となっては良い思い出です。

応用編：生産管理の基本「水平展開（ヨコテン）」
生産管理や品質管理の世界には「水平展開（通称：ヨコテン）」という言葉があります。今回構築した「スプレッドシート × GAS」のアーキテクチャは非常に汎用性が高く、現在、社内の他の課題解決にもこの仕組みをヨコテンしています。

① 新人向け安全教育アプリ（〇×ゲーム）
うちの部署の部長が社内の「安全担当トップ」でもあるため、今期の改善活動のテーマとしてプロトタイプを開発し、係長まで報告を通しました。
社員番号・氏名・部署をプルダウンで選び、10問の〇×クイズに回答。回答後にJavaScriptで5項目のレーダーチャートを表示し、自身の弱点を可視化します。同時に、回答日時と結果がGAS経由でスプレッドシートに蓄積されます。

② 現場の出来高（日報）吸い上げシステム
自分自身の業務を簡略化するため、現場の作業実績を直接吸い上げる仕組みも構築中です。ライン作業には対応できそうですが、製造業特有の「小ロット（多品種少量）」になると途端に入力UIが使いづらくなるため、現場がストレスなく入力できる画面を絶賛改善中です。

おわりに：技術は「共に働く仲間」のために
ついでに若手が作ってくれた問い合わせフォームのHTMLもPHPに改造し、総務の運用担当者のメールアドレスに直接届くように設定して、新ホームページは無事に稼働を開始しました。

営業部長の号令で始まり、若手社員の頑張りで作られた今回のリニューアル。私はお鉢が回ってきてその裏側を少し手伝ったに過ぎません。まだシステムを完全に総務部へ引き継げたわけではなく、運用に乗せている過渡期であり、今後も1人部署からのサポートは続いていくでしょう。

高度なアーキテクチャを導入するのではなく、「現場のITリテラシーに合わせて、一番壊れにくい仕組みをそっと提供する」こと。まだまだ手探りですが、これこそが非IT企業における身の丈に合ったDXへの第一歩ではないかと、生産管理マンは思うのです。