社内で使うWebツールを簡単に公開する方法|サーバー不要で今日から使える3段階

開発者
開発者

「ツールは作れたけど、みんなに使ってもらうにはどうすればいい?」

と悩んでいませんか。

HTMLとJavaScriptで計算ツールを作った、Pythonでデータ処理スクリプトを作った——でも自分のPCだけで動いていて、共有する方法がわからないまま止まっている。そういう状況、意外と多いんですよね。

私自身、最初は計算ツールを作っても「自分のローカルファイルを人に渡す」という原始的な方法で共有していました。当然、更新するたびに全員に再配布しなければならないし、古いバージョンを使い続ける人が出てきて混乱しました。

この記事では、社内で使うWebツールをサーバー不要・無料で公開する方法を3段階に分けて解説します。

「今日作ったものを今日から全員に使ってもらう」状態を目指します。


結論:「URLを送るだけ」で使ってもらえる状態を作る

Webツールの公開は、GitHub Pages・Netlify・Vercel のいずれかで無料で完結します。

いわゆるホスティングサービスです。
サーバーの契約も、ドメインの取得も、インフラの知識も不要です。

GitHubにファイルを置くだけで、URLが発行されて、そのURLを送れば全員が同じツールを使えます。

私が filmtools.jp を作った一番の理由は「URLを全員に送るだけで済む」ことでした。Excelを配布し続ける運用に限界を感じたからです。公開後は「URLを社内チャットに貼るだけ」になりました。更新してもURLは変わらないので、再配布も不要です。


公開方法を「誰が使うか」で選ぶ

社内ツールの公開方法は、使う人数と用途によって選ぶのが一番得策です。

公開方法は3段階です。

  • ① 少人数・社内限定:共有フォルダにHTMLファイルを置く
  • ② 社内外問わずブラウザで使いたい:GitHub Pages / Netlify / Vercel
  • ③ 認証が必要・継続運用したい:社内サーバー or クラウド

それぞれ詳しくみていきましょう。


第1段階:共有フォルダにHTMLファイルを置く(最速5分)

特徴と向いているケース

インストール不要・設定不要。今すぐ使える最速の方法です。

Windowsの共有フォルダにHTMLファイルを置けば、社内のメンバーがそのファイルをブラウザで開くだけで使えます。JavaScriptで動く計算ツールなら、これで十分動きます。

向いているケース:

  • 社内の少人数(5〜10人以下)で使う
  • インターネットに出したくない情報を扱う
  • とにかく今日中に共有したい

やり方

\\社内サーバー\共有フォルダ\ツール\計算ツール.html

このパスをチャットで送るだけです。受け取った人はブラウザにパスを貼り付けるか、エクスプローラーからダブルクリックで開けます。

デメリット

ファイルを更新したとき、ユーザーがキャッシュを持っていると古い版を見続けます。

また、社外や在宅からはアクセスできません。「今日作ったものをとりあえず試してほしい」場面向けの方法です。


第2段階:GitHub Pages で無料公開(サーバー不要・URL発行)

無料です。
GitHubはプログラマー全員が知っているレベルのサービスなので安心です。

特徴と向いているケース

GitHubにファイルを置くだけでURLが発行される、最もバランスの良い方法です。

GitHub Pagesは、GitHubのリポジトリに置いたHTMLファイルをそのままWebサイトとして公開する機能です。費用は0円。独自ドメインも無料で設定できます。

私が filmtools.jp を最初に公開したときはGitHub Pagesを使いました。

filmtools.github.io` というURLが発行されて、それを社内チャットに貼るだけで全員が同じツールを使えるようになりました。

向いているケース:

  • HTMLファイル一枚で動くツール
  • 社内外問わずURLで共有したい
  • 無料で続けたい

手順

① GitHubアカウントを作成

github.com にアクセスしてアカウントを作ります。無料プランで問題ありません。

② リポジトリを作成してHTMLをアップロード

ローカルPCで作業します。index.htmlを作成してそれをアップします。

# ローカルでGitを初期化
git init
git add index.html
git commit -m "最初のツール公開"
git remote add origin https://github.com/あなたのGitHubID/ツール名.git
git push -u origin main

③ GitHub Pagesを有効化

GitHubにアップされたことを確認したら、

リポジトリの「Settings」→「Pages」→「Branch: main」を選択して「Save」。

数分後に `https://あなたのID.github.io/ツール名/` でアクセスできます。

④ 更新するたびにpushするだけ

git add index.html
git commit -m "計算式を修正"
git push

pushするとURLの内容が自動で更新されます。再配布は不要です。


第3段階:Netlify / Vercel でドラッグ&ドロップ公開

特徴と向いているケース

Gitコマンドを使わずにドラッグ&ドロップだけで公開できます。

NetlifyもVercelも、フォルダをブラウザにドロップするだけでWebサイトとして公開できます。GitHub Pagesより手順が少なく、UIが直感的です。

向いているケース:

  • GitのコマンドラインがまだURLわからない
  • Reactや Vue.js で作ったSPAを公開したい
  • フォームや動的な機能が必要

ちょっと専門用語がでてきましたが、もう少しお付き合いください。

Netlify の手順

① `app.netlify.com` にアクセスしてアカウント作成

② 「Add new site」→「Deploy manually」を選択

③ ツールのHTMLが入ったフォルダをドラッグ&ドロップ

これだけです。30秒で `https://ランダム名.netlify.app` というURLが発行されます。

④ URLを変更したい場合

「Site settings」→「Change site name」で好きな名前に変更できます。`https://あなたの名前.netlify.app` になります。


公開方法の比較

方法費用難易度向いている用途
共有フォルダ無料★☆☆少人数・社内限定・今すぐ試したい
GitHub Pages無料★★☆HTMLツール・継続運用・更新頻度が高い
Netlify / Vercel無料★★☆Vue/Reactアプリ・ドラッグ&ドロップで始めたい
社内サーバー費用あり★★★認証必須・機密情報・継続的な社内運用

社内ツールを公開するときに確認すること

セキュリティの確認

社外に公開するURLには、会社の機密情報を入れてはいけません。

GitHub PagesやNetlifyに公開したURLは、インターネット上の誰でもアクセスできます。計算式だけのツールなら問題ありませんが、個人情報・取引先情報・価格情報が含まれる場合は、社内サーバーや認証付きのサービスを使ってください。

私が filmtools.jp で公開しているのは「計算ロジックだけ」です。入力した数値はサーバーに送信されず、ブラウザだけで完結しています。機密情報を扱わないツールに絞ることで、外部公開でも問題なく運用できています。

社内のITポリシー確認

GitHub・Netlify・Vercelといった外部サービスの利用が社内ルールで制限されているケースがあります。情報システム部門や総務部門に確認してから使い始めるのが安全です。


実際にfilmtools.jpを公開するまでにやったこと

最初は共有フォルダ → GitHub Pages → 独自ドメインの順番で移行しました。

  1. 共有フォルダ時代:Excelを全員に配布。更新のたびに再配布が必要で、古いバージョンを使い続ける人が出た
  2. GitHub Pages移行:URLを一つ送るだけで全員が使えるようになった。更新後も自動で最新版が反映される
  3. サーバー運用:ドメイン`filmtools.jp` を取得してVPSで運用中

独自ドメインは年間1,500円程度です。`filmtools.github.io` より覚えやすいURLになるので、社内外で共有しやすくなります。@filmtools.jpのようにメールアドレスに使ったりできますし。


まとめ

  • 社内ツールの公開は「共有フォルダ→GitHub Pages→Netlify」の順番で難易度が上がる
  • 今日中に共有したいなら共有フォルダ、URLで継続運用するならGitHub PagesかNetlify
  • GitHub PagesはHTMLファイルをpushするだけで無料公開できる
  • Netlifyはドラッグ&ドロップで30秒で公開できる
  • 社外公開するURLには機密情報を含めないこと
  • 更新してもURLは変わらないので、再配布不要になる

ぜひ、参考にしてみてください

自作ツールが実際にどう公開されているか見てみたい方は、filmtools.jp をご覧ください。GitHub Pages → 独自ドメインの構成で運用しています。フィルムパッケージ向けの計算ツールを無料で使えます。


「ツールを作れる」だけでなく「公開して使ってもらえる」状態にできると、職場での存在価値が明確に変わります。製造業や総務部門でこのスキルを持っている人は、まだ少ないです。

転職を考えている方は、「自社内ツールを設計・公開した経験あり」は職務経歴書に書ける実績になります。スキルは積んだ分だけ資産になります。今のうちに1本公開する経験を積んでおくのがおすすめです。

製造業・非エンジニア向けWebツール作成・公開の始め方