~交流会などで使える!!~ オンラインですぐに名刺が作れるアプリケーションを作ってみた

アプリケーションのコンセプト

エンジニア交流会や勉強会のような場面で、
「名刺を渡すほどではないんだよな...」
「でも、参加者同士で簡単にプロフィールは共有したい..」
という時って結構ありませんか？
そのようなニーズに応えるために開発した名刺管理アプリです。

一時的かつ気軽に、必要最低限の情報を交換できる仕組みを目指しました。

技術スタック

以下の技術を用いて開発しました

フロントエンド

• React（UI構築）
• TypeScript（型安全な開発）
• React Router（画面遷移）
• React Hook Form（フォーム管理）
• Chakra UI（UIコンポーネント）

バックエンド／運用

• Firebase（認証・DB）
• GitHub Actions（自動ジョブ）

👉 GitHub リポジトリはこちら

👉 アプリケーションはこちら

実装機能

📝 自分のプロフィールを登録する

• 自己紹介文や好きな技術スタック、各種snsアカウントの登録ができます。

• 入力後は検索画面へ遷移

🔍 ユーザ検索

• 他の人のプロフィールをユーザ名で検索し閲覧できます。

工夫点

✅ ユーザ登録のバリデーション

React Hook Form を用いたバリデーションをしています。
基本的にはDBと整合性が取れるように入力値に制限を書けています。

🔄 データの自動削除（GitHub Actionsによる定時実行）

• GitHub Actions による Cron ジョブを用い、毎日定刻にDBのデータを削除する運用を導入しています。

• このアプリは「一時的な用途での利用」を前提としているため

  

今後の改善ポイント

• 🔐 セキュリティの強化

  • ユーザ認証や管理者権限の細分化などを追加予定です。

• 🎨 UI/UX の改善

  • Chakra UI をベースに、さらに使いやすく直感的なインターフェースを模索中です。

気づき・学び

• 自身の成長

  • これぐらいのアプリケーションであれば、ざっくりと「何をすべきか」を頭の中で組み立てられるようになれました。
  • もともとフロントエンド未経験だった自分にとって、大きな成長を感じています。

• 本当に使ってもらえるのは難しい

  • このアプリケーションでも確かに使える特場面はあるかもしれないが、セキュリティ、UI/UX、認知拡大など、多くのユーザーに価値を届けるにはまだまだ課題が多いと感じました。
  • ただ、そういった視点を持てるようになったこと自体は良い成長だったと思いました。

🚀 最後に軽く宣伝！

🎯 JISOUメンバー募集中！

• 実はこちらのアプリ、僕が参加しているモダン技術を学べるスクールの課題の一環として作成したものになります。
• 経験者向け専門ではありますが、未経験者でもガッツとコツコツ継続できれば、これぐらいのアプリケーションはスッと作れる実力が身につく環境です。
• プログラミングコーチング「JISOU」では、現在新たなメンバーを募集中です！

👉 公式サイトはこちら！