꿈꾸는쪼꼬미개발자 꿈꾸는쪼꼬미개발자

Express란? node.js를 위한 간결한 웹 프레임워크이다. node.js는 자바스크립트를 브라우저 외부에서 사용할 수 있게 해주는 프로그램이다. Express 는 node.js 를 사용해 서버를 개발하고자 할때 쉽게 구성하고 만들 수 있게 해주는 프레임워크다. Express로 구현한 서버가 Node.js HTTP 모듈로 작성한 서버와 다른 점 미들웨어를 추가할 수 있다. 라우터를 제공한다. Express 시작하기 먼저 설치를 위해 터미널 창에 npm install express //응답으로 'Hello World!' 를 보내는 Express 서버 코드 const express = require('express') const app = express() const port = 3000 app.get..

웹 개발 시 겪는 에러 중 CORS에러!! CORS가 필요하게 된 배경인 SOP 먼저 알아보자 SOP(Same-Origin Policy) = 동일 출처 정책 ‘같은 출처의 리소스만 공유가 가능하다’ 👇🏻 MDN에서의 정의 동일 출처 정책(same-origin policy)는 어떤 출처에서 불러온 문서나 스크립트가 다른 출처에서 가져온 리소스와 상호작용하는 것을 제한하는 중요한 보안 방식이다. 출처는 프로토콜, 호스트, 포트의 조합으로 되어있다. 이 중 하나라도 다르면 동일한 출처로 보지 않는다. https://jjjjin-young2.tistory.com vs http://jjjjin-young2.tistory.com -> 두 URL은 프로토콜이 다르기 때문에 동일 출처가 아니다.( https vs ht..

REST API(Representational State Transfer) 웹에서 사용되는 데이터나 자원(Resource)을 HTTP URI로 표현하고, HTTP 프로토콜을 통해 요청과 응답을 정의하는 방식 💡 리차드슨의 REST 성숙도 모델 레오나르드 리차드슨(Leonard Richardson)은 REST API 를 잘 적용하기 위한 4단계 모델을 만들었다. 모든 단계를 충족해야 REST API 라고 부를 수 있다. 실제로 엄밀하게 3단계까지 지키기 어렵기 때문에 2단계까지만 적용해도 좋은 API 디자인이라고 볼 수 있고, 이런 경우를 HTTP API라고 부른다. ✅ REST 성숙도 모델 - 0단계 HTTP 프로토콜을 사용하기만 해도 된다. → REST API의 출발 (기본단계) 모든 요청에서 엔드포인..

1. AJAX(Asynchronous JavaScript And XMLHttpRequest)란? JavaScript, DOM, Fetch, XMLHttpRequest, HTML 등의 다양한 기술을 사용하는 웹 개발 기법 AJAX의 가장 큰 특징은, 웹 페이지에 필요한 부분에 필요한 데이터만 비동기적으로 받아와 화면에 그려낼 수 있다는 것 검색창에 한 글자를 입력할 때마다, 해당 글자로 시작하는 단어들을 서버로부터 받아와, 아래 추천검색어로 보여주게 됩니다. 다시 말해, 검색창에서는 필요한 데이터만 비동기적으로 받아와 렌더링 되며, 여기에 AJAX가 사용 2. AJAX 의 두가지 핵심 기술 JavaScript와 DOM, 그리고 Fetch Fetch를 사용하면, 페이지를 이동하지 않아도 서버로부터 필요한 데..

URL과 URI URL은 Uniform Resource Locator의 줄임말로, 네트워크 상에서 웹 페이지, 이미지, 동영상 등의 파일이 위치한 정보를 나타낸다. URI의 구성요소는 scheme, hosts, url-path, query, bookmark이고 URL의 구성요소는 scheme, hosts, url-path로 URI가 URL을 포함하는 상위개념입니다. 브라우저의 검색창을 클릭하면 나타나는 주소가 URI 이다. URI 는 URL 을 포함하는 상위개념이다. 부분 명칭 설명 file:// , http:// , https:// scheme 통신 프로토콜 127.0.0.1 , www.google.com hosts 웹 페이지, 이미지, 동영상 등의 파일이 위치한 웹 서버, 도메인 또는 IP :80 ,..

웹 애플리케이션 아키텍처 HTTP에서 사용하는 클라이언트 - 서버 아키텍처와 클라이언트와 서버가 통신하는 방법인 API에 대해 학습 클라이언트-서버 아키텍처 = 2티어 아키텍처 사이트 오픈 시 인터넷 연결이 없을 시 연결 불가능하다. 사이트 정보를 서버로부터 받아오기 때문이다. 서버 = 제공(Serve)하는 주체 어플의 경우 서버 없이 동작하도록 만들 경우, 신상품 업데이트마다 새로운 버전 업데이트 필요, 또한 결제 불가능(금전정보를 주고받는 은행 서버와의 연결이 필요하기 때문) ⇒ 상품정보 같은 리소스가 존재하는 곳과 리소스를 사용하는 앱을 분리시킨 것 리소스를 사용하는 앱 = “클라이언트” 요청하는사람 리소스를 제공(serve)하는 곳 = “서버” 요청에 대한 응답하는사람 요청이 선행되고 그 후에 응..