25/12/09 CodeUnion 活動報告

日誌担当者:久保 拓也
【今日の活動内容】

・問題の追加

・操作・運用マニュアル作成

・アニメーションの追加

【投稿担当者の作業内容】

・操作・運用マニュアル作成

・アニメーションの追加

【残タスク、次回の作業内容】

・問題と用語の追加

・アニメーションの追加

HTML5

日誌担当:鈴木祥護

プロジェクト名:MiraBa

本日の作業内容

  1. React プロジェクト構成の整理

    • src フォルダ内の構成を見直し、Firebase 関連のファイルを src/firebase/ ディレクトリに移動。

    • 不要だった opp.jsx を削除し、プロジェクト全体の可読性を改善。

  2. public フォルダの確認と整理

    • 初期状態で public フォルダが存在しない/消失した問題を確認。

    • 復元手順の説明(フォルダ作成、index.html 生成、構成の修復)。

  3. index.html の正しい構成確認

    • Vite + React の標準形式に沿った index.html の構造を再提示。

  4. 今後の作業に向けた準備

    • public フォルダ復元の確認を行いつつ、明日の作業にスムーズに入れるよう状況を整理。

明日の作業予定

  1. 復元した public フォルダと src のリンク確認

  2. App.jsx / main.jsx などの起動ポイントの整合性確認

  3. 画面が “何も表示されない” 問題の本格的な原因調査

  4. Firebase 読み込み・表示機能の再チェック

25/12/9 めがね2/3 活動報告

日誌担当者: 藤原創太


チームの活動内容

  • UIづくり
  • ゲームロジックづくり
  • データベースのスキーマづくり
  • タイピングのスコア計算について話し合った

投稿担当者の作業内容

  • ゴーストリザルト画面のUIづくり
  • データベースのスキーマづくり

残タスク・次回の作業内容

  • UI、背景、ゲームロジックづくり

HTML 5

日誌担当:鈴木祥護
プロジェクト名:MiraBa

[本日の目標]

React を用いたアプリ構造への全面移行の準備として、既存コードの問題点の洗い出しと、
React 化に向けたフォルダ構成・コンポーネント化計画を明確化すること。

[活動内容] [担当者の作業]

現行プロジェクト構造の調査と問題点の特定

  • HTML / JS / CSS を直接読み込む旧構造と
    React コンポーネント構造が混在している点を確認。

  • opp.js を React で呼び出せない問題や、静的 DOM と React DOM の衝突を整理。

  • public フォルダ内のファイル構成(IMG, CSS, JS, JSX)が React 標準と異なっていたため、
    今後の移行に向けた再構成案を作成。

投稿フィード(Voices)処理の React 化準備

  • 現行 opp.js の DOM 操作では React で動作しないため、
    投稿レンダリングを Voices.jsx に統合する方針を決定。

  • 投稿画像 TK1〜4 の読み込みパス仕様を統一。

  • public/IMG 内の画像が正常に認識されない問題を確認し、原因が “import 方式の不一致” であることを特定。

React プロジェクト(Vite)の構築計画策定

  • React でアプリを安定稼働させるため、
    Vite を用いて新規プロジェクトを作成する。

  • index.html から React を呼び出す方式(root 要素+ index.jsx)で再構築する設計を作成。

  • App.jsx 以下のコンポーネント分割案も作成し、ファイル配置の標準化方針を固めた。

[課題と解決の方向性]

1.静的 JS(opp.js)と React の競合

  • 静的に DOM を生成する方式が React と衝突し表示されない。

  • React 内部の state に投稿機能を完全移行することで解決予定。

2.画像パス・動画パスの認識不一致

  • React 環境では IMG/xxxx の読み込み方法が通常の HTML と異なるため、
    public/IMG/... への統一と、Vite の参照ルールを採用することで解消する。

3.フォルダ階層の混在

  • JSX と JS が同階層に混ざり、アプリの依存関係が複雑化していた。

  • src / public に明確に分離し整理する工程を明日実行する。

 

[次回の作業]

1.Vite(React)環境の正式構築

  • 新規 React プロジェクトを作成し、
    App.jsx / index.jsx / components フォルダを設置。

  • 既存デザインを React へ移植する作業を開始。

2.投稿機能の React 完全移行

  • Voices.jsx 内で map 処理を用いた投稿表示を実装。

  • 写真付き投稿の画像パスを修正し、表示されない問題を解決する。

3.UI セクションの React 再構成

  • HeroVideo(動画)

  • CatchCopy(キャッチコピー1 & 2)

  • Sidebar

  • Header
    をコンポーネントとして再構築し、レイアウトの安定化を図る。

4.Firebase(Firestore)との接続準備

  • 投稿データを Firestore に保存するため、
    fire.js の設定を React 構造へ移行する下準備を行う。

25/12/8 めがね2/3 活動報告

チームの活動内容
UI、グラフィックの作成
バックエンドの作成
DBの環境構築
DBの構築

投稿担当者の作業内容
UI、グラフィックの作成
TailWindについて学習

残タスク、次回の作業内容
UI、グラフィックの作成
バックエンドの作成
DBの構築

ずっと謎のエラーと格闘してました。鎌田君に聞いてもわからないといわれたでもう無理です。

ジャンケンが弱いものは何も得られない。

25/12/5 めがね2/3 活動報告

日誌担当者: 藤原創太


チームの活動内容

  • UIづくり
  • ゲームロジックづくり

投稿担当者の作業内容

  • タイピングで遊ぶ画面のUIづくり

残タスク・次回の作業内容

  • UI、背景、ゲームロジックづくり

 

久しぶりに日報じゃんけん負けてしまいました

For Fujie Lab Members