collaborative-2023-g3 / pj-group3

コラボレイティブ開発G3

MIT License

1 stars 0 forks source link

Feature/6 frontend (フロントエンドのルーティング) #25

Closed sayzkkgw closed 8 months ago

sayzkkgw commented 8 months ago

issue(対応しているissueを貼る！)

【認証機能】アカウント登録 #6

概要

Reactを使ったフロントエンド開発(AuthRegister)を行うために、主にルーティング周りのいくつかの修正・追加を加えました。

変えたこと・実装内容

(前提条件)：・今回、Rails API + Reactの組み合わせで、react-railsは使用しない。・原則ルーティングはReact側に任せる。

フロント側のルーティングを実現するため、
- react-router-dom npm packageをインストール
- これだけではRailsがフロントエンド側のルーティングを認識できずRailsのNo routesエラーが出るため、任意のパスは全てリダイレクトするようroutes.rbを修正
- app/javascript/application.js (触らないようにと書かれているが)のRoot DOMノード上にreact-router-domの設定を追加
- ページ遷移してもHeaderコンポーネントは常に上部表示させるように、Routes対象から外して固定化。これに伴い、app/javascript/pages/Top/index.tsxも若干修正 (トップページからヘッダー内の「アカウント登録」へ遷移するとヘッダーが消えるため。)
アカウント登録のReactコンポーネントのTypoなど微修正 (SCSSファイル含む)

確認したこと

ローカル環境での確認 : ○　
- 何を確認した？　ローカルサーバーを立ち上げ、トップページ、アカウント登録ページ (/register)のレンダリング成功
開発環境での確認 : ○
ユニットテストの実装 : ×

変えたドキュメント(あれば)