전체 글

CORS란? Cross Origin Resource Sharing 요청이 Same Origin, 즉 동일한 출처가 아닌 공유에 대한 접근을 막는 보안 정책이다. 요청을 한 도메인의 주소, 포트번호, 프로토콜이 모두 같아야지 해당 응답을 반응하는 정책이다. 예를 들어, API서버의 도메인이 server.com이고, 요청한는 사이트의 도메인이 page.com이라면 요청을 하는 page.com의 도메인이 server.com의 도메인과 다르기 때문에 응답 요청을 막는 이유이다. CORS 정책의 이유 만약, 다른 도메인의 응답을 처리할 수 있게 된다면, 다른 사이트를 접속했을 때, 해당 브라우저에서 다른 도메인의 요청을 받아 사용자의 인증 토큰을 받을 수 있기 때문이다. 예를 들어, 사용자가 example.com..

HTML up_sensor는 바텀시트를 올리기 위한 동작을 감지하기 위한 센서이다. 실제 바텀 시트 위에 감싸고 있는 투명한 벽으로, 바텀시트가 올라가면 사라진다. 센서를 두지 않으면 바텀 시트를 올리는 과정에서 스크롤 되면서 안의 내용이 스크롤 되는 것을 방지해서 만들었다. bottom_sheet_handle은 사용자에게 바텀시트를 올리고 내릴 수 있는 hint를 제공한다. CSS .bottom_sheet { display: flex; position: fixed; bottom: 0; width: 100%; height: 10%; border-top-left-radius: 30px; border-top-right-radius: 30px; background-color: #FFFFFF; overflow-..

HTML 0% 간단하게 slider bar 위에 button을 놓았다. img는 button 안에 위치한다. span 요소는 눌렀을 때 몇 퍼센트인지 나타내기 위함이다. CSS .slider_bar { display: flex; position: fixed; right: 5%; top: 35%; bottom: 20%; width: 2%; height: 40%; background: linear-gradient(to bottom, rgba(176, 196, 238, 1) 20%, rgba(176, 196, 238, 0.75) 35%, rgba(176, 196, 238, 0.5) 60%, rgba(176, 196, 238, 0.25) 85%, rgba(176, 196, 238, 0) 100%); border..

*M1 Mac환경 MongoDB 설치 $ brew tap mongodb/brew $ brew install mongodb-community MongoDB 실행 및 정지 서버 시작 $ brew services start mongodb-community 서버 종료 $ brew services stop mongodb-community _서버를 시작하면 MongoDB의 기본 포트인 *_27017** 포트로 열린다. 다음과 같이 뜨면 서버 구동에 성공한것 이다. MongoDB 터미널 활용하기 $ mongo mongo서버를 구동하고, 터미널에서 mongo를 입력하면 터미널에서 서버에 접속할 수 있다. *zsh: command not found: mongo와 같은 오류가 발생해서, $ brew install mong..

이제는 Docker를 통해서 서버를 쉽게 배포할 수 있지만,Docker가 무서워 건드릴 엄두도 안났을 때, 서버를 직접 배포했던 힘들었던 과정을 기록하려고 한다. 그래도 나름 일련의 과정들을 스킵하지 않고 직접 일일이 겪어보아서 여러모로 도움이 많이 됐던 것 같다.🥹  1. AWS EC2 환경 구축 1.1 인스턴스 만들기aws에서 인스턴스 항목에서 인스턴스 시작을 누르자.다른 항목은 다 건너 뛰고, 인스턴스 유형을 프리 티어 사용 가능한 t2.micro로 설정'새 키 페어 생성'을 눌러서 새로운 키 페어를 생성해주었다.원하는 이름을 설정하고 다운로드 받아지는 키이름.pem 을 절대로 유출하지 말고, 삭제도 하지 말고 잘 갖고있자.PuTTY접속용이라면 ppk로 만들자.  나머지는 그대로 기본 설정을 따라..

Redis란? Redis는 오픈 소스, 인 메모리 데이터 구조 스토어이며, 다양한 데이터 구조를 지원한다. 주요 용도로는 캐싱, 메시징, 세션 관리 등이 있다. Redis는 기본적으로 디스크가 아닌 메모리에 데이터를 저장하므로 매우 빠른 속도로 데이터를 처리할 수 있다. 또한 Redis는 영속성을 지원하여 디스크에 데이터를 저장할 수도 있다. Redis는 다양한 프로그래밍 언어로 작성된 클라이언트 라이브러리를 지원하며, 클러스터링 및 마스터-슬레이브 복제와 같은 고급 기능도 제공한다. Redis는 많은 어플리케이션에서 사용되고 있으며, 속도와 성능이 중요한 시스템에서 특히 유용하다. Redis의 장단점 장점 빠른 데이터 액세스 Redis는 메모리에 데이터를 저장하기 때문에, 디스크에서 데이터를 읽어오는데..