feat/실제 웹 배포 #112
feat/실제 웹 배포 #112
Conversation
web 배포를 위한 main branch merge
…에러 나던 현상 해결하기 위해 404.html추가하는 로직 구현
Walkthrough이 변경 사항은 Flutter 웹 애플리케이션의 GitHub Pages 자동 배포 워크플로우와 관련된 파일 추가 및 설정, 그리고 웹 애셋 관리와 경로 정정, Firebase 옵션 파일 추가, 그리고 관련된 .gitignore 및 pubspec.yaml 파일 업데이트를 포함합니다. 코드 및 기능적 로직에는 변화가 없습니다. Changes
Sequence Diagram(s)sequenceDiagram
participant Developer
participant GitHub
participant GitHub Actions
participant Flutter Build
participant GitHub Pages
Developer->>GitHub: main 브랜치에 push
GitHub->>GitHub Actions: 워크플로우 트리거
GitHub Actions->>Flutter Build: Flutter 환경 설정 및 빌드, 테스트 수행
Flutter Build-->>GitHub Actions: 빌드 산출물(web 디렉토리)
GitHub Actions->>GitHub Pages: 빌드 결과물 배포
Suggested reviewers
Poem
Note ⚡️ AI Code Reviews for VS Code, Cursor, WindsurfCodeRabbit now has a plugin for VS Code, Cursor and Windsurf. This brings AI code reviews directly in the code editor. Each commit is reviewed immediately, finding bugs before the PR is raised. Seamless context handoff to your AI code agent ensures that you can easily incorporate review feedback. Note ⚡️ Faster reviews with cachingCodeRabbit now supports caching for code and dependencies, helping speed up reviews. This means quicker feedback, reduced wait times, and a smoother review experience overall. Cached data is encrypted and stored securely. This feature will be automatically enabled for all accounts on May 16th. To opt out, configure Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (2)
web/index.html (1)
1-38: 웹 배포를 위한 index.html 구조가 적절합니다.Flutter 웹 애플리케이션 배포를 위한 기본 HTML 구조가 올바르게 설정되어 있습니다. 다음 요소들이 적절히 포함되어 있습니다:
- 동적 base href 설정 ($FLUTTER_BASE_HREF)
- 메타 태그 및 모바일 웹 호환성 설정
- 파비콘 및 매니페스트 참조
- Flutter 부트스트랩 스크립트
한 가지 고려할 점은 애플리케이션 설명 부분입니다:
- <meta name="description" content="A new Flutter project."> + <meta name="description" content="Mongo AI - 데이터 분석 및 시각화 플랫폼">.github/workflows/web-deploy.yml (1)
1-59: GitHub Pages 배포 워크플로우가 잘 구성되어 있습니다.웹 애플리케이션 배포를 위한 GitHub Actions 워크플로우가 체계적으로 구성되어 있습니다:
- Flutter 환경 설정
- 환경 변수 구성
- 의존성 설치 및 코드 생성
- 테스트 실행으로 품질 검증
- 웹 빌드 및 클라이언트 라우팅 처리
- GitHub Pages 배포
다음 몇 가지 사소한 개선 사항이 있습니다:
# 48줄의 후행 공백 제거 - run: flutter build web --base-href "/${{ github.event.repository.name }}/" + run: flutter build web --base-href "/${{ github.event.repository.name }}/" # 59줄의 파일 끝에 개행 문자 추가 publish_dir: ./build/web +또한 다음 문제를 확인해 주세요:
현재 GitHub Pages 배포에 사용 중인
peaceiris/actions-gh-pages@v3액션이 최신 버전인지 확인해주세요. 정적 분석 도구에서 이 액션의 러너가 오래되었을 수 있다고 표시했습니다.🧰 Tools
🪛 actionlint (1.7.7)
56-56: the runner of "peaceiris/actions-gh-pages@v3" action is too old to run on GitHub Actions. update the action's version to fix this issue
(action)
🪛 YAMLlint (1.37.1)
[error] 48-48: trailing spaces
(trailing-spaces)
[error] 59-59: no new line character at the end of file
(new-line-at-end-of-file)
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (5)
web/favicon.pngis excluded by!**/*.pngweb/icons/Icon-192.pngis excluded by!**/*.pngweb/icons/Icon-512.pngis excluded by!**/*.pngweb/icons/Icon-maskable-192.pngis excluded by!**/*.pngweb/icons/Icon-maskable-512.pngis excluded by!**/*.png
📒 Files selected for processing (9)
.github/workflows/web-deploy.yml(1 hunks).gitignore(2 hunks)lib/auth/presentation/components/auth_header_widget.dart(1 hunks)lib/auth/presentation/sign_in/screen/sign_in_screen.dart(5 hunks)lib/dashboard/presentation/dashboard_screen.dart(5 hunks)lib/firebase_options.dart(1 hunks)pubspec.yaml(1 hunks)web/index.html(1 hunks)web/manifest.json(1 hunks)
🧰 Additional context used
🪛 Gitleaks (8.26.0)
lib/firebase_options.dart
56-56: Uncovered a GCP API key, which could lead to unauthorized access to Google Cloud services and data breaches.
(gcp-api-key)
🪛 actionlint (1.7.7)
.github/workflows/web-deploy.yml
56-56: the runner of "peaceiris/actions-gh-pages@v3" action is too old to run on GitHub Actions. update the action's version to fix this issue
(action)
🪛 YAMLlint (1.37.1)
.github/workflows/web-deploy.yml
[error] 48-48: trailing spaces
(trailing-spaces)
[error] 59-59: no new line character at the end of file
(new-line-at-end-of-file)
🔇 Additional comments (13)
pubspec.yaml (1)
108-108: assets/images 디렉토리 등록 확인
pubspec.yaml의 assets 섹션에assets/images/디렉토리가 올바르게 추가되어 Flutter 빌드 시스템이 이미지를 번들링합니다..gitignore (2)
17-24: 웹 자산 트래킹 활성화
웹 배포를 위해/web폴더 내 주요 파일(favicon, icons, manifest 등)에 대한 ignore 설정을 주석 처리하여 Git에 포함시켰습니다. 적절하며, 배포 파이프라인에서 누락 없이 파일이 반영됩니다.
159-159: Firebase 옵션 파일 포함 확인
lib/firebase_options.dart에 대한 ignore를 해제하여 Firebase 구성 파일을 버전 관리에 추가했습니다. CI/CD 및 로컬 환경에서 올바르게 참조되는지 확인하세요.lib/auth/presentation/components/auth_header_widget.dart (1)
23-23: 로고 에셋 경로 수정 검토
Image.asset경로를'assets/images/mongo_ai_logo.png'로 업데이트하여 pubspec.yaml과 일치시켰습니다. 로고가 올바르게 로드되는지 확인하세요.lib/auth/presentation/sign_in/screen/sign_in_screen.dart (3)
144-146: InputDecoration multi-line 포맷 적용
focusedBorder속성을 멀티라인으로 분리하여 가독성을 높였습니다. 변경된 형식이 Flutter 스타일 가이드에 부합하는지 확인해주세요.
294-297: Google 로그인 버튼 UI 및 에셋 경로 업데이트
SignInAction.onTapGoogleSingIn()호출 및 이미지 경로를'assets/images/google_logo.png'로 수정하여 에셋 로딩을 표준화했습니다. 버튼 표시와 클릭 이벤트가 의도대로 동작하는지 확인 바랍니다.Also applies to: 309-319, 323-330
351-353: 회원가입 링크 콜백 일관성 검토
onTap콜백에서SignInAction.onTapSignUp()을 호출하도록 표현과 인덴트를 정리했습니다. 기존 동작에 영향이 없는지 확인하세요.web/manifest.json (1)
1-35: PWA manifest 구성 확인
name,start_url,display,icons등 PWA 설정이 올바르게 작성되었습니다.web/icons/폴더에 아이콘 파일이 모두 존재하는지, 그리고index.html에서 이 manifest가 정상 참조되는지 확인해 주세요.lib/dashboard/presentation/dashboard_screen.dart (5)
39-41: 코드 정리가 잘 되어 있습니다.비동기 함수 호출에 대한
unawaited사용 패턴이 잘 적용되었습니다.
56-56: 조건문 서식이 개선되었습니다.조건문에 추가된 공백이 코드 가독성을 향상시켰습니다.
79-107: 버튼 구현이 잘 정렬되어 있습니다.ElevatedButton 위젯의 서식이 개선되어 코드 구조가 명확해졌습니다.
171-171: 조건문 서식이 개선되었습니다.if 문에 추가된 공백이 코드 가독성을 향상시켰습니다.
240-240: 자산 경로가 올바르게 수정되었습니다.이미지 경로가
'images/mongo_ai_logo.png'에서'assets/images/mongo_ai_logo.png'로 수정되어 pubspec.yaml의 자산 디렉토리 구성과 일치하게 되었습니다. 이는 웹 배포 시 자산이 올바르게 로드되도록 보장합니다.
| // File generated by FlutterFire CLI. | ||
| // ignore_for_file: type=lint | ||
| import 'package:firebase_core/firebase_core.dart' show FirebaseOptions; | ||
| import 'package:flutter/foundation.dart' | ||
| show defaultTargetPlatform, kIsWeb, TargetPlatform; | ||
|
|
||
| /// Default [FirebaseOptions] for use with your Firebase apps. | ||
| /// | ||
| /// Example: | ||
| /// ```dart | ||
| /// import 'firebase_options.dart'; | ||
| /// // ... | ||
| /// await Firebase.initializeApp( | ||
| /// options: DefaultFirebaseOptions.currentPlatform, | ||
| /// ); | ||
| /// ``` | ||
| class DefaultFirebaseOptions { | ||
| static FirebaseOptions get currentPlatform { | ||
| if (kIsWeb) { | ||
| return web; | ||
| } | ||
| switch (defaultTargetPlatform) { | ||
| case TargetPlatform.android: | ||
| throw UnsupportedError( | ||
| 'DefaultFirebaseOptions have not been configured for android - ' | ||
| 'you can reconfigure this by running the FlutterFire CLI again.', | ||
| ); | ||
| case TargetPlatform.iOS: | ||
| throw UnsupportedError( | ||
| 'DefaultFirebaseOptions have not been configured for ios - ' | ||
| 'you can reconfigure this by running the FlutterFire CLI again.', | ||
| ); | ||
| case TargetPlatform.macOS: | ||
| throw UnsupportedError( | ||
| 'DefaultFirebaseOptions have not been configured for macos - ' | ||
| 'you can reconfigure this by running the FlutterFire CLI again.', | ||
| ); | ||
| case TargetPlatform.windows: | ||
| throw UnsupportedError( | ||
| 'DefaultFirebaseOptions have not been configured for windows - ' | ||
| 'you can reconfigure this by running the FlutterFire CLI again.', | ||
| ); | ||
| case TargetPlatform.linux: | ||
| throw UnsupportedError( | ||
| 'DefaultFirebaseOptions have not been configured for linux - ' | ||
| 'you can reconfigure this by running the FlutterFire CLI again.', | ||
| ); | ||
| default: | ||
| throw UnsupportedError( | ||
| 'DefaultFirebaseOptions are not supported for this platform.', | ||
| ); | ||
| } | ||
| } | ||
|
|
||
| static const FirebaseOptions web = FirebaseOptions( | ||
| apiKey: 'AIzaSyDv6taLhWiRmfLBY7v7h2iZRHABowiB4UU', | ||
| appId: '1:108515543625:web:3a816c4fb36a9baaa74d98', | ||
| messagingSenderId: '108515543625', | ||
| projectId: 'mongo-ai-9d6ac', | ||
| authDomain: 'mongo-ai-9d6ac.firebaseapp.com', | ||
| storageBucket: 'mongo-ai-9d6ac.firebasestorage.app', | ||
| measurementId: 'G-ZB5G231MQH', | ||
| ); | ||
| } |
There was a problem hiding this comment.
Firebase 웹 구성이 완료되었습니다.
FlutterFire CLI로 생성된 Firebase 구성 파일이 적절하게 추가되었습니다. 이 파일은 웹 플랫폼에 대한 Firebase 설정을 올바르게 제공합니다.
하지만 다음 보안 문제에 대해 주의가 필요합니다:
코드에 Firebase API 키가 노출되어 있습니다. 이는 Flutter 웹 애플리케이션에서는 일반적인 패턴이지만, GitHub의 공개 저장소에 API 키가 그대로 노출되는 것은 보안 위험을 초래할 수 있습니다.
Firebase의 웹 API 키는 기본적으로 제한된 권한을 가지고 있으며, Firebase 콘솔에서 앱 제한사항을 설정하여 추가 보호 조치를 취하는 것이 좋습니다:
- Firebase 콘솔에서 API 키 제한 설정 (허용된 도메인, IP 주소 등)
- 올바른 Firebase 보안 규칙 구성
- OAuth 클라이언트 ID 제한 설정
PR 설명에 언급된 Google 로그인 기능이 작동하지 않는 문제는 이 API 키 설정 및 OAuth 클라이언트 구성과 관련이 있을 수 있습니다.
🧰 Tools
🪛 Gitleaks (8.26.0)
56-56: Uncovered a GCP API key, which could lead to unauthorized access to Google Cloud services and data breaches.
(gcp-api-key)
🤖 Prompt for AI Agents
In lib/firebase_options.dart lines 1 to 64, the Firebase API key is exposed in
the code, which poses a security risk if pushed to a public repository. To fix
this, do not hardcode the API key directly in the source file; instead, move
sensitive configuration like the API key to environment variables or secure
storage. Additionally, configure API key restrictions in the Firebase console by
limiting allowed domains and IPs, and ensure proper Firebase security rules and
OAuth client ID restrictions are set up to protect your app and enable Google
login functionality.
🔍 변경사항 요약
=> 해당 branch는 건들면 안됩니다.
=> Firebase Authentication에서 허용된 도메인에서만 OAuth 콜백을 받도록 추가 설정을 해야한다고합니다.
📌 리뷰사항
✅ 체크리스트
📝 추가 참고사항 (선택)
https://gitflow-exercise.github.io/MongoAI-web/
웹사이트 주소입니다.
Summary by CodeRabbit
신규 기능
버그 수정
문서화
스타일
기타