기본 콘텐츠로 건너뛰기

[aws] deploy Angular app with s3 | AWS S3로 angular 앱 배포하기

[aws] deploy Angular app with s3 | AWS S3로 angular 앱 배포하기

angular project를 빌드한다

ng build --prod

그러면 dist 폴더가 생긴다. dist 폴더 안에 있는 아이들을 사용한다.

아마존 s3 콘솔로 이동

https://s3.console.aws.amazon.com/s3/home?region=ap-northeast-2

새로운 Bucket 을 생성한다(Create bucket). 버킷 이름은 고유하게 짓는다.

버킷 생성후 properties tab > static website hosting을 클릭한다. index document는 index.html은 쓴다.

properties > static website hosting

Permission tab 에서 권한을 수정한다.

overview tab 에서 필요한 파일 업로드

dist 폴더 안에 있는 파일들을 업로드 한다.

bucket policy 설정

properties > static website hosting > endpoint 클릭하면 서버에 올라간 앱을 확인 할 수 있다

일단 angular 앱을 올리긴 했는데.. 이걸로는 아무것도 할 수 었다. django로 만든 서버를 올리고 database를 연결하고

그것을 지금 이 angular 앱과 연결해야한다.

아직 어떻게 해야 할지는 모르겠음 계속 삽질 중.

그래도 angular app 하나 올라갔는데 재밌네

from http://paigeblog.tistory.com/18 by ccl(A) rewrite - 2020-03-25 16:20:22

댓글

이 블로그의 인기 게시물

Push Notification using Ionic 4 and Firebase Cloud Messaging

Push Notification using Ionic 4 and Firebase Cloud Messaginghttps://www.djamware.com/post/5c6ccd1f80aca754f7a9d1ec/push-notification-using-ionic-4-and-firebase-cloud-messaging#setup-google-fcmThe comprehensive step by step tutorial on receiving a push notification on Mobile App using Ionic 4 and Firebase Cloud Messaging (FCM)The comprehensive step by step tutorial on receiving a push notification on Mobile App using Ionic 4 and Firebase Cloud Messaging (FCM). We will use Ionic 4 Cordova native FCM plugin for receiving a push notification and using Firebase API for sending push notification from the Postman. A few years back, we have created a tutorial on receiving push notification using Firebase Cloud Messaging with Ionic 2.Shortcut to the steps:Google said that notification is a message that pops up on the user's device. Notifications can be triggered locally by an open application, or they can be "pushed" from the server to the user even when the app is not running. T…

개발자를 위한 React.js 툴 및 리소스

개발자를 위한 React.js 툴 및 리소스개발자를 위한 React.js 툴 및 리소스페이스 북이 2013 년에 라이브러리를 처음 공개 한 이후 React.js의 인기는 빠르게 증가하고 있습니다.이 프로젝트는 Github에서 다섯 번째로 가장 많이 출연 한 오픈 소스 프로젝트이며 React 개발자를위한 구인 광고도 크게 증가하고 있습니다. React는 사용자 인터페이스를 구축하기위한 간단한 JavaScript 프레임 워크입니다. 가장 두드러진 예로는 Facebook 및 Instagram이 있습니다.React는보다 간단한 구조와 성능 최적화에 중점을 둔 Angular 또는 Backbone과 같은 MVC 프레임 워크에 대한 대안을 제공합니다. React가 앞으로 몇 년 동안 웹 개발 환경을 확실히 정의 할 것이기 때문에이 기사에서는 React 개발 영역에 발을 딛는 데 도움이되는 개발자 툴킷을 제공하고자합니다.공식 React.js 문서Facebook은 개발자에게 React의 주요 개념에 대한 자세한 문서를 제공합니다. 문서 외에도 React를 사용하여 대화 형 틱택 토 게임을 구축하는 방법에 대한 훌륭한 자습서와 React 개발자를위한 토론 포럼을 찾을 수 있습니다. 문서는 오픈 소스이므로 원하는 경우 편집 할 수도 있습니다.공식 페이스 북 문서React.js Github RepoReact Github Repo에서 필요할 때마다 React의 소스 코드를 확인할 수 있습니다. 현재 개발 상태에 대한 정보를 유지하려면 문제, 중요 시점 및 최신 풀 요청을 살펴볼 수도 있습니다. 문제가 발생하면 문제 해결 가이드를 약간 연구하는 것이 좋습니다.React.js Github Repo안녕하세요 월드 스타터 코드빠른 반응을 원한다면 Codepen에서이 "Hello World"대화식 데모로 시작할 수 있습니다. 필요한 모든 자산과 시작 코드도 포함되어 있습니다. Babel도 켜져 있으므로 ECMAScript 6과 JSX 구문을 모두 사용할 수 있습니다. 이 …

유니티 | 파티클 모델링

유니티 | 파티클 모델링Particle SystemsDuration : 파티클 시스템이 파티클을 방사하는 기간Looping : 시스템이 반복하는지의 여부Start LifeTime : 화면에 존재하는 시간Random Between TwoConstants : 2개의 값 사이에서 랜덤Start Speed : 파티클 생성 시 방출 속력값Start Size : 파티클 생성 시 상대적 크기Start Rotation : 파티클 생성 시 각도Start Color : 파티클 생성 시 색Emission (방사모듈) : 방사되는 파티클의 속도를 제어Rate : 시간의 경과에 따라 방사되는 파티클의 양이나 거리Burst : 용출. 특정 양의 파티클이 방사되어야 하는 시간을 명시Shape (형태모듈)Radius : 생성범위Sphere : 구의 반경Hemisphere : 반 구의 반경Cone : 원뿔Box :Mesh : 파티클은 꼭지점, 가장자리 혹은 삼각형 중 하나에서 방출Velocity over Lifetime (수명기간 동안 속도 모듈)Limit Velocity over LifetimeInherit VelocityForce over LifetimeColor over Lifetimecolor : alpha값 0 -> 검은색 -> 투명Color by SpeedSize over LifetimeSize : 점점 커지게Size by SpeedRotation by LifetimeAngular Velocity : 뱅글뱅글 회전Rotation by SpeedExternal ForcesCollision (충돌모듈)Sub EmittersTexture Sheet AnimationRendererRender Mode⊢ Horizontal Billboard : 바닥에 깔림, XY평면에 평행한 빌보드 렌더링∟ Vertical Billboard : XZ 평면에 평행한 빌보드 렌더링Material : 원본 소스 변경ShaderAddictive(가산 혼합) : 뒷배경이 보색일 경우 흰색에 가까운 색…