ホーム自己紹介ブログ
NO.168
DATE2025. 11. 16

9年前の学生の自分が作ったWebアプリを懐かしむ

久々に Google Drive のフォルダを整理していたところ、学生時代に作った Web アプリの資料が見つかりました。
開発したのは 2016年、今から9年前 。
当時の自分の技術スタックや開発の進め方を思い出しながら、ちょっと懐かしく振り返ってみます。

当時作っていた Web アプリ

私が作っていたのは、 動画をアップロードしてコマ画像を抽出し、好きなコマを選んで並び替え Gif 画像に変換するアプリ です。
生成した Gif は掲示板に投稿でき、コメントもつけられるという、シンプルながら機能が詰まったサービスでした。

トップページ
Gif画像掲示板

Gif 作成まわりのフローはこんな感じでした。

Gif作成 - 動画アップロード中
Gif作成 - 動画から画像を抽出
Gif作成 - 画像を並び替えてGifに変換

当時はもちろん Figma も触っておらず、Web デザインはすべて手書きの HTML と CSS。
インタラクティブな部分は jQuery、ビューは EJS を使っていました。

使用していた技術

  • サーバサイド: Node.js + Express v3.5.1
  • ビュー: EJS
  • フロント: jQuery
  • データベース: MongoDB
  • ストレージ: Dropbox
  • 動画 → Gif 変換: ffmpeg
  • 一時ファイル削除: cron

S3 を使う発想はなく、Dropbox に動画や分割した画像を保存していました。 抽出した画像を ffmpeg で Gif に変換するフローは、いま思えばよく組めていたなと感じます。

学生時代の開発環境

当時の開発環境もなかなか味わい深いものでした。

  • サーバー: さくらのレンタルサーバ
  • バージョン管理: Git なし(フォルダにそのまま保存)
  • コードアップロード: WinSCP
  • SSH 接続: たぶん TeraTerm
  • デプロイ: SSH 接続 → npm install → express start
  • アクセス: IP アドレス + Express のデフォルトポートに直アクセス

いまのように AWS や Vercel が当たり前の時代ではなかったので、この運用でも特に疑問を持たず使っていました。

資料(2016年当時の画面設計・構成図など)

画面構成やシステム構成は、Microsoft Visio を使って作成していました。
UI デザインツールを持っていなかったので、Visio の図形を組み合わせてポンチ絵を作っていた記憶があります。

画面構成
システム構成

当時読んでいた本

当時の私は、大学では C 言語や Java を学んでおり、Web 系の開発経験はほぼゼロでした。
友人に「今は Node.js が流行っているらしい」と聞き、手探りで買ったのがこの本でした。
なんとなく、やってみたい!という気持ちだけで購入した記憶があります。

  • はじめてのNode.js - サーバーサイドJavaScriptでWebアプリを開発する

当時の知識は IT パスポート程度で、

  • ターミナル操作は初めて
  • Node.js や Express のバージョンが書籍と手元で違うことを理解していない
  • HTML/CSS を写経したことがある程度
  • サーバ、データベース、ストレージの概念がほぼゼロ

という状態でした。

それでも本を何度も読み返し、エラーに何度もつまずきながら、少しずつ動く形に近づけていきました。
気づけば、表紙が擦り切れるほど読み込んでいた気がします。(たぶん1年以上)

終わりに

今では、AI に任せれば、それっぽい Web アプリが簡単に作れる時代です。
Git Push するだけで、自動的にデプロイまで完了させることもできます。

それでも、学生時代に身につけた 「エラーが起きたときに原因を探る洞察力」 や
「分からない領域を少しずつ自分の理解に置き換えていく地道な作業」 は、今の自分にとって確かな財産になっています。

雑談

-

読者になる

|

シェアする

|

silverbirders

silverbirder

Webソフトウェアエンジニア

ブログを応援する

この記事がよかったら、お布施という形で応援してもらえるとうれしいです。

おふせぼたん

※ ログイン不要で投稿できます。

※ 同じブラウザから投稿を削除できます。

0

読み込み中...

次の記事へ前の記事へ

関連する記事

タグ「雑談」の記事

散歩コース生成 へのアクセスが増えてた

昔作った、散歩コース生成 のWebアプリへのアクセスが増えていました。 散歩コース生成 https://my-walker.vercel.app 機能リクエスト https://fequest.vercel.app/4 アクセス履歴 Goo

2026年05月20日

雑談
金沢旅行:『路上、お邪魔ですか?』『中村佑介展』

金沢旅行2日目は、ホテルの朝食ビュッフェから始まります。 こういう朝食ビュッフェは食べすぎると、午後の活動がしんどくなるのでいつもぐらいの量を食べましょう。 朝食を頂くのは、ホテル1階のダイニングで2人掛けのソファに座って頂きました。 ホテ

2026年05月19日

雑談
滋賀竜王、世界の半分を下さい

金沢へ旅行へ行くので、旅行へ着る服を買いに "三井アウトレットパーク 滋賀竜王" に行ってきました。 滋賀県 竜王町にある三井アウトレットパーク、滋賀竜王。 世界の半分を貰えるような強そうな施設名ですね。 旅行に服 昔は服なんてなんでも良か

2026年05月16日

雑談
← ブログ一覧へ