myalbum

내 앨범

Google 지도 위치와 앨범 및 사진을 공유하는 웹사이트

상태

서포터?

웹사이트

• URL :
  1. https://my-album.azurewebsites.net/(Angular 8.0)
  2. https://my-album-react.azurewebsites.net/(반응 16.12)
• 이메일 : [email protected] (사진, 앨범, 댓글, 답글 추가/수정용)
• 비밀번호 : 2u)TAa
• ID API : https://my-album.azurewebsites.net/swagger/index.html
• 앨범 API : https://my-album-album-api.azurewebsites.net/swagger/index.html
• 사진 API : https://my-album-photo-api.azurewebsites.net/swagger/index.html
• 댓글 API : https://my-album-comment-api.azurewebsites.net/swagger/index.html

Microsoft Visual Studio Community 2019에서 실행

1. " src/WebSPA/sql "에서 3개의 스크립트를 실행하여 DB를 설정합니다.
2. " src/MyAlbum.sln "을 엽니다.
3. 다음 중 하나에서 기본 연결 문자열을 변경합니다.
   1. 다음으로 반응하세요 : " src/WebSPA.React.Identity/appsettings.Development.json "
   2. 각도 : " src/WebSPA.Identity/appsettings.Development.json "
4. 다음 중 하나에서 디버깅을 위해 " 디버그->시작 프로젝트 설정... " 메뉴를 사용하여 시작 프로젝트를 설정합니다.
   1. 프로젝트와 반응 : Web Apps/WebSPA.React.Identity 및 Services 폴더의 3개 프로젝트
   2. 프로젝트가 포함된 Angular : Web Apps/WebSPA.Identity 및 Services 폴더의 3개 프로젝트
5. 디버깅하려면 F5를 누르세요.

도커에서 실행

0. 도커를 설치합니다.
1. " src/Docker " 폴더를 열고 다음을 실행합니다.

 docker-compose down
docker-compose build
docker-compose up

2. " src/Docker " 폴더를 열고 이 SSL 인증서를 로컬 컴퓨터의 " 신뢰할 수 있는 루트 인증 기관 " 폴더에 설치합니다.

 File name: my-album.pfx
Password: 2u)TAa

3. https://localhost:5002/swagger/를 성공적으로 탐색하여 확인하세요.
4. http://localhost:5000/에서 웹사이트를 찾아보세요.

Azure에 배포

1. Azure App Service 1개와 Azure SQL 데이터베이스 1개 생성
2. Azure App Service에 2개의 앱 설정인 " ASPNETCORE_ENVIRONMENT " 및 " ConnectionStrings:Default "를 추가합니다.
3. Azure에 배포

스크린샷

1. [사진] 탐색
   

2. [사진] 세계지도
   

3. [앨범] 탐색
   

4. [앨범] 보기
   

5. [사진] 추가
   

6. [사진] 편집
   

7. [사진] 보기
   

8. [사진] 보기 >> 물체 감지 (사진 클릭)
   

9. [사진] 보기 >> 댓글 추가

10. [사진] 보기 >> 댓글 알림(실시간)
    

11. [사진] 보기 >> 답글 댓글