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..
HTTP란? HyperText(하이퍼링크를 통해 독자가 한 문서에서 다른 문서로 접근할 수 있는 텍스트) Transfer(교환) Protocol(규칙)의 줄임말이다. 인터넷 상에서 클라이언트와 서버가 자원을 주고 받을 때 쓰는 통신규약이라는 의미이다. 웹브라우저(client)와 웹서버(server)즉, 서로 다른 컴퓨터 간에 컨텐츠를 교환하기 위한 규칙과 그 메세지가 HTTP이다. 여기서 Transfer Protocol이라는 말은 "웹 간에 어떠한 것에대해 요청하고, 그 응답을 받아야하는데 그 과정에서 어떤 방식으로 주고 받을지에 대한 규칙이 적힌 메세지"이다. HTTP 기반 시스템의 구성요소 HTTP 각각의 개별적인 요청들은 서버로 보내지며, 서버는 요청을 처리하고 response라고 불리는 응답을 제..
HTTP 헤더와 본문으로 구성되어 있다. HTTP헤더는 HTTP 메시지(요청/응답)와 본문에 대한 정보를 말해주고 있다. 이에 대해서 이해하는 것이 실제로 중요하다. 해당 메세지가 제공하는 기능에 대한 최소한의 정보가 정리된 요약본이라고 할 수 있기 때문이다.헤더에 그 프로토콜에 불필요한 내용을 담으면 네트워크로 전송되는 데이터의 크기가 커져서 빠른전송이 불가능하기 때문에 그 프로토콜을 설계할 때부터 꼭 필요한 내용만 담아야 하고, 모든 기능이 표현되어야 한다. 이에 대해 HTTP헤더는 크게 세가지로 구성되어 있다. 1) General Header 전송되는 컨텐츠에 대한 정보보다는, 요청/응답이 이루어지는 날짜 및 시간 등에 대한 일반적인 정보가 포함된다. Date : 현재시간 (Sat, 23 Mat 2..
데이터의 흐름을 쉽게 하기 위해 vuex라는 외부라이브러리가 있고, 메소드들을 서로 호출할 수 있도록 도와주는 eventBus라는 방법이 있다. 이중 eventBus의 사용방법에 대해 알아보자. 이벤트를 사용하는 이유 일반적으로 메소드, 변수를 정의할 때 한오브젝트나 컴포넌트 단위로 묶어서 사용되기 때문에 이벤트를 사용할 필요가 없이 현재위치에 포함된 메소드/변수를 호출하여 사용할 수 있다. 하지만 각각 분리되어 있는 개체에 전송하거나 알려줘야한다면 어떻게 해야할까? 이럴 때 공통으로 데이터들을 주고 받을 수 있는 공간을 만들고, 이를 통해서 서로 규격에 맞춰 데이터들을 주고 받으면 될 것이다. 이벤트를 등록하고 받을 준비가 끝났다면 언제 어디서든지 데이터들을 주고 받고, 각 이벤트요청 상황에 따라 원하..
📌자바스크립트의 비동기 (1)SetTimeout Web API의 한 종류인 setTimeout() 함수를 통해 비동기 처리를 적용해보자. HTML 삽입 미리보기할 수 없는 소스 코드를 살펴보면 동기적으로 코드가 진행되면서 콘솔창에 보이는 1,2,3 이라는 결과를 얻게 된다. 이제 중간의 2를 비동기적으로 처리하면 아래와 같다. HTML 삽입 미리보기할 수 없는 소스 아까와 같이 순차적으로 1,2,3 이라는 결과가 나오지 않고 1,3,2라는 결과를 얻게 되었는데, 이는 바로 setTimeout()이라는 비동기 함수를 통해 2를 2초 뒤에 출력하게 하는 명령을 주어서 2가 출력될 때까지 3이 기다리지 않고 먼저 출력된 후에 2초가 지나서 2가 출력되었기 때문이다. (2)콜백함수 콜백함수란 다른 코드의 인수로..
- Total
- Today
- Yesterday
- Http통신
- eventListner
- 이벤트리스너
- Vuex
- 항해솔직후기
- JWT토큰
- 빅오표기법
- React18v
- focus와blur
- 레포지토리패턴
- store.js
- 더미데이터
- 항해플러스프론트엔드
- 웹훅
- vue.js3
- 디바운싱
- useState
- react
- props
- Vue.js
- 로그인 인증
- 알고리즘
- 항해플러스후기
- loadbalancer
- reactnative
- 이벤트버스
- vue3
- http
- event종류
- Repository pattern
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |