カテゴリー: 4

  • 2re fun はHPやシステムを公開します。

    2re funは、Claude Codeなどを使いながら人気のある開発構成をリサーチし、HP(ホームページ)やWebシステムのテーマを決めて実際に作り、デプロイしたものを公開していく個人開発ポートフォリオです。企画から設計・実装、インフラ構築、本番運用まで、すべて一人で手がけています。https://2re.fun/

    まだたくさん作ったのですが、サーバーのリソースと手間が間に合っていないため、公開するペースは時間とお金の相談になりそうです。この記事では、2re funがどんなコンセプトで動いているのか、どんな技術スタックでプロジェクトを作っているのか、実際にどんなHP・システムを公開しているのかを詳しくまとめておきます。

    2re funとは

    2re funは、「個人開発者として、企画から本番運用まで一人で作り切るシステム開発」をコンセプトにしたポートフォリオサイトです。フロントエンドからバックエンド、データベース設計、Dockerによるインフラ構築、VPSでの本番公開まで一貫して手がけ、実際に稼働しているシステムをサイト内の「Projects」で紹介しています。

    単なる制作実績の紹介にとどまらず、「実際に本番で動いているかどうか」にこだわっているのが2re funの特徴です。デザインカンプだけで終わらせず、ドメインを取得し、Dockerでインフラを組み、実際にユーザーが触れる状態までデプロイしてはじめて1つのプロジェクトとして公開しています。

    一人で企画から本番運用までを担う開発スタイル

    2re funの開発では、要件定義やテーマ決めの段階からClaude CodeのようなAIコーディングツールを活用しています。まず世の中で人気のある開発構成やアーキテクチャをリサーチし、作るHP・システムのテーマや技術選定を決めます。その後、実装・インフラ構築・デプロイまでを一人称で進め、実際に動くサービスとして公開する、という流れです。

    一人で担当する分、企画の意図とコードの実装がぶれにくいというメリットがある一方、サーバーのリソースや運用の手間には限界があります。そのため、どのプロジェクトをどこまで本番運用として維持するかは、常に時間とお金のバランスを見ながら判断しています。

    2re funで採用している技術スタック

    2re fun自体、そして公開している各プロジェクトも、次のような技術スタックで構築しています。人気の高い構成を意識しつつ、プロジェクトの性質に応じてバックエンドの言語やフレームワークを使い分けているのがポイントです。

    フロントエンド

    • Next.js
    • TypeScript
    • React
    • Tailwind CSS

    バックエンド

    • Go(REST API)
    • Node.js
    • プロジェクトによってはPHP・Spring Boot・Ruby on Railsなども採用

    データ・インフラ

    • MySQL(database/sql)
    • Docker / Docker Compose
    • Caddy
    • VPS運用

    このブログ(2re blog)自体もWordPress+Docker Composeで構築しており、技術構成の詳細は「2re blogの技術構成|WordPress・Docker・MySQLで作る個人ブログ基盤」で紹介しています。

    2re funで公開しているプロジェクト

    2026年8月時点で、2re funでは次のようなHP・Webシステムを実際に本番環境で公開しています。それぞれ業種やユースケースを変えながら、技術構成も意図的に変えて作っているのが特徴です。

    • とびうお:立ち食い鮨店向けの注文・会員管理システム。スマホから注文でき、購入履歴に応じたスタンプ特典を自動計算します。Node.js / TypeScript / MySQL / Dockerで構築。(tobiuo.2re.fun)
    • ボナンザ株式会社:清掃会社向けの企業サイト。Next.js製のフロントエンドとPHP製のAPIサーバーで構築。
    • Order System:厳選した商品を会員限定で販売するオンラインストア。会員登録することで注文・購入履歴の管理ができます。Next.js / TypeScript / Spring Boot / Docker。(order.2re.fun)
    • SoraStore:コーヒー・紅茶・雑貨など、産地や製法にこだわった商品を届けるオンラインショップ。会員登録した上で注文でき、マイページから注文状況を確認できます。Next.js / TypeScript / Rails / Docker。(rail-order.2re.fun)
    • 青葉葬儀社:葬儀社向けの企業サイト(サンプル)。プラン・料金の紹介や電話でのお問い合わせ導線を備えています。(aosy.top)
    • 2reブログ:システム開発の成長記録を発信する個人ブログ。学習の過程や進捗を記事として公開しています。WordPressで構築。(blo.2re.fun)

    2re.fun自体のお問い合わせフォームも、Go製のAPIサーバー経由でMySQLに保存する構成になっており、ポートフォリオサイト自体がフルスタック開発の実例になっています。

    Claude Codeを活用した開発の進め方

    2re funの各プロジェクトは、Claude Codeを開発パートナーとして使いながら進めています。具体的には、以下のような流れです。

    1. 作りたいHP・システムの業種やユースケースを決める
    2. その領域で人気のある開発構成・技術スタックをリサーチする
    3. Claude Codeと一緒にフロントエンド・バックエンド・データベースの設計を進める
    4. Docker Composeでインフラをまとめ、VPS上に本番環境として構築する
    5. 実際に動く状態までデプロイし、2re funやこのブログで公開する

    単に「作って終わり」ではなく、実際にドメインを取得し、独自のサブドメイン(tobiuo.2re.fun、order.2re.funなど)で公開するところまで含めて1つのプロジェクトと考えているのが、2re funのこだわりです。

    現在の課題:サーバーリソースと時間・費用のバランス

    2026年8月時点で、公開・検証待ちのプロジェクトはすでにいくつも溜まっています。ただし、すべてを同時に本番運用するにはサーバーのリソースが足りず、監視や運用の手間も追いついていないのが正直なところです。

    そのため、今後どのプロジェクトを優先的に公開・維持していくかは、サーバー費用と自分の作業時間を天秤にかけながら決めていくことになりそうです。無理に全部を本番公開するのではなく、記事として構成やコードを紹介するだけにとどめるプロジェクトも出てくる可能性があります。

    今後の展望

    2re funでは今後も、実務でよく使われる技術構成を試しながら、業種の異なるHP・Webシステムを作り、実際にデプロイして公開していく予定です。開発の過程や技術的な意思決定については、この2re blogで随時アウトプットしていきます。

    2re funの最新の公開プロジェクトはhttps://2re.fun/から、開発の裏側やアップデートは2re blogから確認できますので、あわせてチェックしてみてください。