NSNam Sena / Web Engineer
プロジェクト一覧へ

CASE STUDY / 協会公式Webサービス

KOSEA

会員・管理者機能から外部連携、デプロイ・運用までを担当。運用中のデータ増加による読み込みの課題を調査し、データ取得範囲とpublicationの処理構造を改善しました。

期間
2026.08 — 現在
担当
Full-Stack DevelopmentWeb Service Operation
担当範囲
ユーザーWeb・管理者システム / API・Storage / デプロイ・運用
サイトを見る

協会活動を支えるWebサービス

한국중소상공인협회(韓国の中小商工人を対象とする協会)の公式Webサービスです。一般ユーザー・会員向けのWebと、日々の情報更新や会員対応を担う管理者システムを開発・運用しています。

会員申請、情報発信、問い合わせ対応を扱い、公開画面と管理業務の両方を支えるサービスとして構築しました。

開発から、公開後の運用まで

フルスタック開発とWebサービス運用を担当。ユーザー向けWeb、管理者機能、MongoDBのデータ管理、外部API連携、画像アップロードを実装しました。

Cloudtypeへのデプロイ、Cloudflare DNS、テクニカルSEO、保守と障害対応も担当しています。

KEY FEATURES

ユーザーと運営者、両方の業務をつなぐ

  • 会員申請・審査

    5段階の会員登録ウィザード、申請、管理者による承認・却下、会員状態の管理、会員企業の公開ディレクトリ。

  • 掲示板・コンテンツ管理

    お知らせ、報道、会員企業、資料室の各コンテンツと管理者向けCRUD。

  • 非公開の問い合わせ

    非公開投稿、パスワードによる問い合わせ確認、管理者からの回答。

  • 変更を見据えた画像ストレージ

    Cloudflare R2への画像アップロードとStorage Adapter構造。R2・S3・Local・Azure Stubという構成で、保存先変更に備えました。

  • Newswire API連携

    HMAC SHA-256認証を用いた記事データの同期。

  • 検索・共有のための基盤

    動的robots.txt、sitemap.xml、canonical、Open Graph、Twitterメタデータ、JSON-LDを整備。Google Search Console、Naver Search Advisor、Daumにも対応しました。

TECH STACK

技術と実装の関係

Meteor 3 / React / JavaScript
ユーザー向けWeb / 管理者システム
MongoDB
会員・掲示板・コンテンツのデータ管理
Tailwind CSS
画面とUIの実装
Cloudflare / Cloudtype / Git
デプロイ・DNS・バージョン管理
Cloudflare R2
画像アップロード・保存
REST API
外部サービス連携

PERFORMANCE CASE STUDY

データ増加で見えた、読み込み構造の課題

公開後の掲示板で発生した遅延を、画面の表示だけでなくPublicationとデータ取得の範囲から調査しました。

  1. Problem — 遅延とGateway Error

    掲示板の記事データ増加後、ページへのアクセスが非常に遅くなり、502 / 524が発生しました。

  2. Investigation — 実際の取得範囲を確認

    Meteor publicationとデータ読み込みの構造を確認し、ページで要求・取得されるデータの範囲を調べました。

  3. Cause — 一括読み込みの構造

    1ページで約600件の記事データを一度に読み込む構造を確認しました。

  4. Improvement — 取得範囲を見直す

    Paginationとデータ取得範囲を改善し、Meteor publicationのobserve処理構造も点検・改善しました。

性能の問題を分析し、データ読み込み構造を改善した事例です。改善率や短縮時間は計測値がなく、502 / 524の完全解消を示すものではありません。

SERVICE STRUCTURE

サービスを構成する要素

実装した主な責務を整理した構成です。詳細な通信経路や内部インフラ構成を表すものではありません。

  • User Web / Admin

    React・Tailwind CSSによる会員向け画面と、審査・コンテンツ・問い合わせの管理画面。

  • Meteor 3 / MongoDB

    会員、掲示板、コンテンツのデータ管理と、publicationを含むデータ提供処理。

  • Storage / External API

    Cloudflare R2への画像保存と、Newswire APIによる記事データ同期。

  • Deployment / Operation

    Cloudtypeへのデプロイ、Cloudflare DNS、SEO、保守・障害対応。

AzureはStorage AdapterのStubであり、Azure Storageを本番運用したという意味ではありません。

実装だけでなく、運用から学ぶ

会員機能・管理者システム・外部連携・ストレージ・SEO・デプロイを、実際のサービス運用につなげる経験を得ました。

データ量の増加に伴う課題に対し、表示する画面だけでなく、取得範囲とpublicationの処理構造を確認する重要性を学びました。