웹 프로그래밍
">
AWS 서버비용절감 계획 및 기록 (3) - AWS CLI 사용하기
AWS CLI가 필요해져서 설정 방법을 기록해두려한다. 1. 설치curl "https://awscli.amazonaws.com/AWSCLIV2.pkg" -o "AWSCLIV2.pkg"sudo installer -pkg AWSCLIV2.pkg -target /aws --version # 설치확인 2. AWS CLI 인증설정aws configure인증정보구성을 위한 명령이며, 4가지가 요구된다.Access Key ID: AWS 계정의 Access Key ID.Secret Access Key: AWS 계정의 Secret Key.Default region: AWS 리전 (나는 서울리전에 해당하는 ap-northeast-2을 이용했다)Default output format: 기본적으로 json 사용. 3. Acc..
">
AWS 서버비용절감 계획 및 기록 (2) - AWS S3, CloudFront
1. 구조 변화계속 EC2를 사용해왔기에 Lamda의 구조가 잘 그려지지 않는다. 원래의 구조와 비교하여 생각해보려한다. 1) 기존구조: React + DRF + Docker Swarm on EC2React: 앱을 정적파일로 빌드하고 Nginx 컨테이너로 제공함.DRF로 API 제공. /api 엔드포인트로 통일시켜둬서 이걸로 구분하고 Nginx를 이용해 서빙함.Docker Swarm: EC2에서 컨테이너 오케스트레이션 및 확장성을 관리함. 2) Lambda로 전환 이후: Lambda는 서버리스 기반이다.React는 정적파일로 빌드하고 S3와 CloudFront를 사용해서 배포한다. CloudFront는 CDN으로 사용자에게 빠르게 전달.DRF를 Lambda 함수로 분리해서 서버리스로 전환 2. Front..
AWS 서버비용절감 계획 및 기록 (1) - 구현계획
1. 현재 상황 40달러 안밖의 비용이 발생하고 있음. 이중 거의 절반을 차지하는 부분이 Amazon Elastic Compute Cloud - Compute 영역으로 보인다. 이 부분을 줄여보고자한다. 현재 나는 서버를 항상 켜두고 있기 때문에 인스턴스 사용시간이 비용을 증가시키는 가장 유효한 변수일 것으로 생각된다. 2. EC2 인스턴스를 사용자 요청에 따라 껐다 켜는 구조로 변경해본다.- SEO를 본격적으로 하지 않았기에, 유입이 크지 않은 상태이다. 사용자가 들어올때만 서버를 켜도 충분할 것이다.필요할 것 같은 몇가지 키워드를 찾아 공부해보고, 가능성을 조사해본다.* AWS Lightsail, Lambda 기반 서버리스 구조, CloudWatch Alarm 3. 구현흐름ChatGPT는 다음과 같..
Error: Too many re-renders. React limits the number of renders to prevent an infinite loop.
리렌더링이 너무 많이 되고 있다는 내용이다. 리액트는 어떤 상황이서 렌더링 되는가? 1. state변경이 있을때 2. props가 들어올때 3. 부모컴포넌트가 렌더링 될때 4. 더있는데 아직 느껴본적 없어서 우선 위 세가지 에러를 만나기전 내 상황은 아래와 같다. 1. 로그인 확인을 위해서 리덕스 스토어에 저장한 isAuthenticated를 App.js에서 localstorage token유무에 따라 true, false를 dispatch를 통해 변경한다. 2. isAuthenticated를 필요한 컴포넌트들에 props로 보낸다. 깔끔하게 만들고 싶어서 App.js에서 필요한 곳에 props로 전송하자는 아이디어였는데 이게 문제였던것으로 보인다. 우선 props를 제거하고 필요한 컴포넌트에서 각각 리..
Django admin 로그인 시 Forbidden (403) CSRF verification failed.
superuser 생성 후 /admin에 접속하여 로그인을 시도하던 중 CSRF 문제로 보이는 에러가 발생하였다. 이는 Django 4.0 이후 바뀐 내용으로 settings.py에 CSRF_TRUSTED_ORIGINS 설정을 추가해주면 해결된다. https://stackoverflow.com/questions/70285834/forbidden-403-csrf-verification-failed-request-aborted-reason-given-for-fail Forbidden (403) CSRF verification failed. Request aborted. Reason given for failure: Origin checking failed does not match any t Help Rea..
![[JS] alert, prompt, confirm](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbNP2sR%2FbtrscOzAfvz%2FU6D2wUcOJnoDr7OoPTGTt0%2Fimg.png)
[JS] alert, prompt, confirm
alert alert('test'); 모달창을 띄운다. prompt let result=prompt('나이', 23); alert(`나이:${result}`); 나이: 사용자에게 보여줄 문자열, 23: 입력필드의 초깃값 confirm let a=confirm('이건 확인취소버튼있음'); 확인누르면 True, 취소누르면 False를 반환한다.
text-overflow: ellipsis가 적용되지 않는다면?
먼저 확인해보자. display: block인가? width가 명확히 지정되었는가? 글자가 width를 넘어간게 맞는가? 1. display: flex에서는 적용되지 않는다. 2. 아래를 세트로 같이 줘보자. overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; https://developer.mozilla.org/en-US/docs/Web/CSS/text-overflow text-overflow - CSS: Cascading Style Sheets | MDN The text-overflow CSS property sets how hidden overflow content is signaled to users. It..
flex안의 요소가 눌리는 현상
flex에서 아이템은 width값을 주어도, 화면이 줄어들면 width를 무시하고 줄어든다. 브라우저 가로 길이를 줄이면 박스가 알아서 줄어드는 것을 확인할 수 있다. 이는 flex-shink의 기본값이 '1' 줄어듦이기 때문이다. 크기를 유지하고 싶다면 0을 사용해야한다. flex-shrink: 0; 을 추가해주었더니 해결되었다. flex-shrink: 0;
사파리에서 발생하는 ajax와 XHR의 에러콜백
문제상황: 사파리브라우저에서 대회공모전 탭으로 이동시 XHR의 에러콜백이 발생하는 것을 확인하였다. 이는 대회공모전 신규생성시 붉은 점으로 표시되는 기능을 구현하기위해 만들어둔 manageNotification()에서 발생한 것이었다. 원인을 요약하자면 a tag에 ajax를 호출하는 것이 좋은 행동이 아니라고한다. 일부 브라우저는 이것을 막기도하는데 사파리 브라우저가 그 일부브라우저인것같다. 해결후 글을 추가하겠다. https://okky.kr/article/897149 OKKY | safari ajax요청의 문제 버튼 클릭 이벤트시 $.ajax 비동기 데이터요청을 할때 request가 되고 에러를 반환하지만 데이터는 제대로 저장됩니다 하지만 사파리브라우저에서만 success 콜백이나오지않고 error..
[Django] 단체메일 전송하기
홍보메일같은걸 보내고 싶어서 만들었다. 늘그렇듯 한번에 못하고 뻘짓을 좀했는데 여러개 거칠거없이 save()함수를 이용하면 된다는 깨달음을 얻었다. 제목과 메일내용을 담은 모델이 저장되면 저장되는 과정에서 모든 사용자에게 메일을 전송한다. models.py class AdvertiseMail(models.Model): date = models.DateTimeField(default=timezone.now) subject = models.CharField(max_length=100) mail = models.TextField(blank=False, null=True) send_it = models.BooleanField(default=False) def save(self): if self.send_it: ..