久々に Google Drive のフォルダを整理していたところ、学生時代に作った Web アプリの資料が見つかりました。
開発したのは 2016年、今から9年前 。
当時の自分の技術スタックや開発の進め方を思い出しながら、ちょっと懐かしく振り返ってみます。
私が作っていたのは、 動画をアップロードしてコマ画像を抽出し、好きなコマを選んで並び替え Gif 画像に変換するアプリ です。
生成した Gif は掲示板に投稿でき、コメントもつけられるという、シンプルながら機能が詰まったサービスでした。


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



当時はもちろん Figma も触っておらず、Web デザインはすべて手書きの HTML と CSS。
インタラクティブな部分は jQuery、ビューは EJS を使っていました。
S3 を使う発想はなく、Dropbox に動画や分割した画像を保存していました。 抽出した画像を ffmpeg で Gif に変換するフローは、いま思えばよく組めていたなと感じます。
当時の開発環境もなかなか味わい深いものでした。
npm install → express startいまのように AWS や Vercel が当たり前の時代ではなかったので、この運用でも特に疑問を持たず使っていました。
画面構成やシステム構成は、Microsoft Visio を使って作成していました。
UI デザインツールを持っていなかったので、Visio の図形を組み合わせてポンチ絵を作っていた記憶があります。


当時の私は、大学では C 言語や Java を学んでおり、Web 系の開発経験はほぼゼロでした。
友人に「今は Node.js が流行っているらしい」と聞き、手探りで買ったのがこの本でした。
なんとなく、やってみたい!という気持ちだけで購入した記憶があります。
当時の知識は IT パスポート程度で、
という状態でした。
それでも本を何度も読み返し、エラーに何度もつまずきながら、少しずつ動く形に近づけていきました。
気づけば、表紙が擦り切れるほど読み込んでいた気がします。(たぶん1年以上)
今では、AI に任せれば、それっぽい Web アプリが簡単に作れる時代です。
Git Push するだけで、自動的にデプロイまで完了させることもできます。
それでも、学生時代に身につけた 「エラーが起きたときに原因を探る洞察力」 や
「分からない領域を少しずつ自分の理解に置き換えていく地道な作業」 は、今の自分にとって確かな財産になっています。
-
0
読み込み中...
タグ「雑談」の記事
口が乾燥しているせいか、自分の口臭が気になります。 朝起きたときなんて、自分の口が臭いと強く思います。 そこで、近頃はマウスケアを丁寧にするように心がけています。 以下の手順で歯磨きするようにしています。 うがい 歯磨き 舌 歯間ブラシ・フ
スーパーやECサイトなどでその会社が開発したオリジナル商品、プライベートブラント商品(以下、PB商品)が好きです。 好きな理由はいくつかあります。 比較的、低価格 安かろう悪かろうではない、クオリティ そこでしか買えない、限定感 価格 自社
2026年02月15日
2019年の記事を読んでいました。 2019年の記事 2019年だと、私の当時の年齢は25歳です。 新卒3年目ぐらいでしょうか。 Slerとして新卒入社して、1年目か2年目ぐらいに炎上プロジェクトを経験してしまい、大変な思い出になりました。
2026年02月14日