2018-12-21に更新

公共機関の公式HP見れるサイトを作った(作ってる)

読了目安:16分

Crieitアドベントカレンダー20日目の記事です。

昨日はPorinさんの160日以上書き続けられた作業記録を支える技術でした。
すごいですね。僕、仕事で強制されなきゃ作業記録なんて書けないです。
あ、あと、お風呂代理店面白いですよね。出始めのころ、暇があれば代行しまくってました。
湯冷めしたとか言ってるおっさんへのヘイトときたら……。

どうしよう

さて、勢いで登録してしまって、何を書こうかと困っている今日この頃です。
こういう記事を書いたこともないのでどうしたものかと困っています。
Markdownすら不慣れで困りながら打っております。
せっかくなので今作っているサービスの紹介でもしましょうか。

PUBLN-s - 公共HP検索

本当は年末に実家に帰省して引き篭って完成させようと思っていたんですが。
なんか、アドベントカレンダーに登録してしまったし、一応動くのでα版として公開しちゃおうかと。
(昨日も東京23区の郵便番号でエラーになる致命的なバグと戦ってましたけどね!)  
(あと、タイトルにαって入れたらスマホでデザイン崩れた)

で、何、これ?

住んでいる家の郵便番号を入力すると都道府県とか市町村とか鉄道会社とか公共性のある機関の公式HPへのリンク一覧が見られます。
だけ。それだけ。

何でこんなもん作ったの?

ググったけど出てこなかったから。

いや、そうじゃなくて

えっと、きっかけは9月の地震(北海道胆振東部地震)なんですけど。
僕、出身は北海道で、今は関東に住んでいるんですけど、両親や妹は北海道に住んでいるんですね。
で、当日の朝、LINEがやたらうるさくて目が覚めたわけです。
北海道から上京している友達や北海道に残っている友達、色々いますけど、みんなみんなで連絡取り合ってるわけです。
「大丈夫か?」「大丈夫」「電気がつかない」「水道は出てる」
テレビを点けます。そこで少し状況が掴めます。「ああ、ヤバそうだ」と。
もちろん実家のことが気になります。ただ、どういう状況かわかりません。
電話して良いのか。繋がるのか。こういうときって回線がパンクするからあまり不用意に電話しない方が良いんだっけ? どうだっけ???
とりあえず、LINEしました。「大丈夫?」と。
しばらくして返信がありました。
「大丈夫。食器が少し割れただけ。電気は点かない。水道、ガスは生きてる」
まあ、怪我はないようです。ほっと胸を撫で下ろします。
そんな時、別のLINEグループからメッセージがありました。
「姉の旦那の消防士からの連絡!」

お察し

危険と言われていた「ロウソク」
やっていなかった「役所での充電」
これらのワードが入っていたので、デマである可能性があります。

(LINEというよりツイッターで顕著ですが)そもそも自分に回ってきた時点で、「誰の姉だよ」って話です。
「友達の友達の、同僚の奥さんの、本名も知らないフォロワーの、そのまたフォロワーの姉の旦那」かもしれません。
知る術はありません。
こういうのは無暗に拡散しちゃいけません(たぶん)

しかし、人ってこうも(自分の事でないにも関わらず)冷静になれなくなるんですね。
それに気づいたのは半日以上経ってから見た、あるツイートでした。
「何でデマってわからないかなあ」

情報が拡散する

何かあるとデマがついてまわります。
(先日の札幌の爆発でもデマ動画が流れたらしいですね)
とにかく、そうなると「公式情報を確認してください」ってなるわけですが。
冷静な今なら「○○市のホームページを見よう」とか「JRのホームページ見よう」となりますけど、
いざとなると「公式ってなんだよ」ってなるような気がします。いえ、「公式を見よう」すら思い浮かばないかもしれません。
そうなると「こうしてください。ああしてください」って具体的な内容(のデマ)を信じたくなるのかなと。

なので、「公式? それならここで一通り見れるよ。ほら」ってここのURL渡せばそれで解決じゃん、と。

「防災アプリ」とかで自ら情報発信も良かったけど、とにかく、拡散・分散する情報を公式に集中させたかった。
(世にある防災アプリを批判するわけではなくて、単なる方針の違い)

スコープとデザイン

普段はITリテラシーが高いけどテンパっちゃってる人もこれを見ればどうすればいいか一目瞭然だし、
僕の母みたいに「ギリギリ、スマホやパソコンが触れる人」でも操作しやすいように、できることを絞りました。

  1. 郵便番号を入れる
  2. 検索を押す
  3. リンクを押す

以上
だいぶシンプルです。デザインもシンプル(ダサい)です。(BootStrap臭が漂ってますね!)

さすがに、父みたいに「メールを受信したら、同僚に見てもらって、その後で、『メールの使い方わからないからメールしてくるな!』って電話してくるくらいのスキルレベルの人」はスコープに入れられませんでした。ごめんね、父さん。  

技術的な話

をしようと思っても特にないんですよね。
(なのでこっちに書かなかった)
ワードを挙げるとしても
・PHP
・Apache
・sqlite
・GCP
・Bootstrap
くらいしか出てこないです。PHPフレームワークもなし。
無料枠でやりたかったんで、できるだけ負荷のない方法が良いなと。

最初は未経験ながらも勉強も兼ねてReact + reduxを使おうかなと。で、いろんなAPI叩きまくって静的サイトだけでホスティングしようと思って作り始めたんですが、なかなかマッチするAPIがなかったのと、クロスドメインが面倒臭いのと、「郵便番号APIで住所をとってきてその住所で行政のホームページを探すAPIを叩く」とかやると普通に遅いので、諦めて自分でデータ持つことにしました。

自前でデータ持ってAPI化してSPAとかも考えたんですけど、なんか無駄だなあと。そもそも、このデータ、半年に一回変われば良い方だし。
もう、データ更新は月1とかにして、ページも静的ページ作ってそれ返せば良いや。って感じになった。
なのでURLは「.html」です。PHPは中でお仕事してます。

余談ですけど、最近よく聞く静的サイトジェネレータってどんなやつなんですかね。たぶん、こういうのとは違う気がしますけど。

なんかよくわからない葛藤

なんか、作ってると頭をよぎるわけですよ。

環境構築はDockerでやって、
フロントエンドはReactかVue。functionとかもう書かないよね。
バックエンドはモダンなフレームワーク。え、ていうかPHPerなの?
VMインスタンス? Herokuとか使わないの? ていうか、今時サーバーレスだよねー。
RDBMS? ……ふーん、そっか。NoSQLとか使わないんだ?
あれ、ていうか、GitHubにPushしたら自動でデプロイするんだよね、もちろん?

こんな感じのが。

もちろん、最終的にはキャッチアップしなきゃいけないとは思うけど、今これやると延々終わらない。んで、終わったと思った成果物がこのレベルのサイトだったら、「もういいや」って個人開発辞めるかもしれない。  
こういうことを思うたびにこれを見て気持ちを落ち着かせた。  
とりあえず動くものを作ろう、と。  

URL見て「うわー、こいつMVCのフレームワークも使ってないのかよ」っていうのはエンジニアぐらいだし、
「うわー、すげーBootStrap臭がする」っていうのはデザイナーぐらいだし。
大多数のユーザーはMVCフレームワークもBootStrapも知らない。サイトを見て思うのは「使いやすいか」「便利か」だけ。
って言い聞かせてる。

んで、できた

まだできてない。

ただの感想

いんたーねっとこわい
どこのどなたか存じませんが、ここにはphpmyadminはないですよ?

イントラの業務アプリ作ってるのとはまた違う緊張感がありますね。

あ、あと、xyzドメインて2年目以降高いんですね。買ってから気づいたよ……。

もはやWebアプリでもWebサービスでもなく、Webページって感じですけど。
それでも初めて世に出すプロダクトです。もっと良くしていきたいなあと。
(まず完成させろ)

別に災害時じゃなくても使って下さい。
例えば、引っ越したばかりで環境がよくわからないとか。
え、不動産屋からちゃんと案内が来る? ですよねえ……。

最初は(最後まで?)大してアクセスないとは思うけど、
逆にアクセス来てしまったら、無料枠だし、サーバー負荷とか大丈夫かなとか(気が早すぎる)心配してみたり。

(存在意義否定しますけど)使われる場面がないことの方が幸せなこの子ですが、
デマがまわるくらいならこの子のURLがまわってくれることを願ってみたり。

明日はaocoryさんです!


hammhiko

恥を晒して生きていきます。

Crieitはβバージョンで開発中です。進捗は公式Twitterアカウントをフォローして確認してください。 興味がある方は是非記事の投稿もお願いします! どんな軽い内容でも嬉しいです。
なぜCrieitを作ろうと思ったか

また、「こんな記事が読みたいけど見つからない!」という方は是非記事投稿リクエストボードへ!

関連記事

コメント