
📌 개요 웹사이트에 트래픽이 갑자기 많이 발생하게 된다면 어떻게 해결해야 할까? 서비스의 규모가 커지고, 이용자 수가 늘어나게 되면 기존의 서버만으로는 원활한 서비스 동작이 불가능하게 되고, 이에 대처할 수 있는 방법은 크게 두가지 이다. 1. 기존의 서버 성능을 확장하는 scale-up 방식 2. 기존의 서버와 동일하거나 낮은 성능의 서버를 증설하는 scale-out 방식 하드웨어 향상 비용이 더욱 비싸기도 하고, 서버가 여러대면 무중단 서비스를 제공하는 환경 구성이 용이하므로 Scale-out이 효과적이다. scale-out 방식을 통해 증가한 트래픽에 대처하기로 했다면, 여러 대의 서버로 트래픽을 균등하게 분산해주는 로드밸런싱이 반드시 필요하다. 📌개념 둘 이상의 CPU or 저장장치와 같은 컴퓨터..

📌 개요프론트엔드와 백엔드가 협업하면서 cors를 해결하는 현명한 방법📌cors의 정의cors란 (Cross-Origin Resource Sharing)의 약자로 직역하면 교차출처 리소스 공유이다. 좀 더 쉽게 말하면 동일한 출처가 아닌 다른 출처에서 데이터를 주고받는 것을 허용하는 정책이다.추가 http헤더를 사용하여, 한 출처에서 실행중인 웹 애플리케이션을 다른 출처의 선택한 자원에 접근할 수 있는 권한을 부여하도록 브라우저에 알려주는 체제이다. 그렇다면 이러한 정책이 왜 필요한것인가? 라는 것에 이유를 알기위해선 sop 즉 "동일 출처 정책"에 대해서 알아야한다.📌SOP(Same Origin Policy) - 동일 출처 정책동일 출처 정책은 웹 브라우저에서 보안을 강화하기 위해 동일한 출처에서..

📌개요 전자서명을 하는 과정에서 웹훅 통신이 필요해서 테스트가 필요했다. 웹훅이라는 것이 외부 서비스에서 우리 서비스로 HTTP요청을 보낼수 있는 것인데 어떻게 테스트를 하는지 알아보자. 📌requestbin 으로 웹훅 테스트해보기 1. requestbin 사이트 접속 https://pipedream.com/ Connect APIs, Remarkably Fast - Pipedream Pipedream is a low code integration platform for developers that allows you to connect APIs remarkably fast. Stop writing boilerplate code, struggling with authentication and managin..

(1) 작업의 수행 상태를 알려주는 HTTP 상태 코드 클라이언트가 서버에게 작업을 요청하면 서버는 요청받은 작업을수행한 후 작업의 수행 결과를 응답으로 보내주는데, 이때 HTTP상태 코드를 사용하여 작업의 성공/실패 여부와 작업이 실패했다면 어떤이유로 실패했는지도 알려주게된다, HTTP 응답 바디에 작업의 실패 여부를 담아서 응답해주는 경우도 있지만, 더 좋은 방법은 바로 올바른 HTTP상태코드를 사용하는 것이다. HTTP 상태 코드는 200 = 성공,400 = 클라이언트가 요청 잘못함,500 = 서버가 잘못함 과 같이 각 상황에 맞는 코드가 표준으로 정해져 있으며,웹 상에서 돌아가는 기본적인 프로그램의 동작이나 프론트엔드, 백엔드 프레임워크들의 설계 또한 이 표준을 기준으로 만들어져 있기 때문에 되도..

Web이란? 즉 Web = 인터넷이 아니라, 인터넷의 범위에 web은 한 종류인 것이다. 웹서버란? 웹서버란 두가지 의미를 모두 지닌다.그러나 우리가 사용할 웹 서버의 개념은 소프트웨어 측면이 더 강하다. 1)하드웨어 측면 Web server는 website의 컴포넌트 파일들을 저장하는 컴퓨터이다. (컴포넌트 파일에는 HTML 문서, images, CSS stylesheet, 그리고 js files가 있을 것이다.)그리고 이 파일들을 최종 소비자의 디바이스에 전달한다. 2)소프트웨어 측면 web server는 기본적으로 웹 사용자가 어떻게 호스트 파일들에 접근하는지를 관리한다. 이 문서에는 web server 는 HTTP서버로 국한한다. HTTP서버는 URL(web addresses)과 HTTP(본인 브..

해당 작업을 수행하기 전 http 구조에 대해 이해하기 도움 request body와 request header에 대해 알았다면 각각에 다른 데이터를 넘겨주는 연습을 해보자. 예를 들어 request header에는 client-type 을 , request body에는 loginId를 url에 담아보도록 한다. const sendData = async() => { try const res = await axios.post(1,2,3); catch(error) error } 1의 인자, 2의 인자,3의 인자에 어떤 것을 넣어주느냐에 따라 각각 원하는 데이터를 전달할 수 있다. 1번 인자에는 주소를, 2번인자에는 body 정보를, 3번째 인자에는 header에 넣어줄 정보를 각각 넣어주면 된다. const..
- Total
- Today
- Yesterday
- vue3
- 결제기능
- React18v
- 로그인 인증
- 항해솔직후기
- 레포지토리패턴
- 회고
- 구름톤
- store.js
- 그림으로 이해하는 시스템 설계
- event종류
- 프로덕트설계
- 항해플러스후기
- 더미데이터
- JWT토큰
- vite
- 이벤트리스너
- 시스템설계
- 항해플러스프론트엔드
- eventListner
- 디자인시스템
- Vue.js
- vue.js3
- 개발자
- react
- focus와blur
- Repository pattern
- 알고리즘
- http
- props
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |