Frontend 상식4 CORS (Cross-Origin Resource Sharing) CORS 정책은 보안을 위한 정책이다. 브라우저와 서버가 있다고 한다면 브라우저가 서버에게 요청을 하고나서 서버에게 응답을 받을 때, 무언가 다르다고 생각되면 CORS를 위반했다고 생각해서 막아버린다. 그 무언가가 출처(Origin) 이다. 브라우저의 Origin과 서버의 Access-Control-Allow-Origin이 맞아야 한다. 브라우저에서 막는 것이기 때문에, back 서버에서 브라우저에게 안전한 것이라며 오류가 나지 않도록 조치를 해줘야 한다. 또한 민감한 정보를 그냥 주지않기 때문에, 다른 정보까지 담고 싶다면 옵션을 설정해줘야한다. 여태 본 방법은 이렇다. 1) Proxy를 이용해서 클라이언트가 front서버와 동일한 주소를 갖도록 해준다. http-proxy-middleware 라는 라.. 2021. 1. 4. 객체지향 프로그래밍이란? 객체지향 프로그래밍 프로그래밍 방식에는 객체지향과 절차지향이 있다. 객체지향 프로그래밍은 추상화를 이용해서 프로그래밍을 하는 방식이다. 추상화라는 것은 어떤 객체들의 특성을 묶어서 클래스로 만드는 것을 말한다. 객체지향 프로그래밍의 특성 이런 객체지향 프로그래밍 언어는 여러가지가 있다. 추상화를 제외하고, 객체지향에는 3가지의 대표적인 특성이 있다. 1. 상속 상속이란, 부모클래스의 속성을 물려받아 확장해서 쓸 수 있는 것을 말한다. javascript의 예로는 extends 키워드를 이용해서, 특성을 물려받아 새로운 확장된 클래스를 만들 수 있다. 2. 캡슐화 캡슐화는, 정보를 숨기는 것을 말한다. 제일 큰 의미는 간단하게 "정보를 숨기는 것"이지만 실제로 프로그래밍을 할 때는 더 많은 의미가 있다고 .. 2021. 1. 3. 꼭 알아야하는 babel과 webpack 프로젝트를 만들고, 배포할 때는 babel과 webpack을 이용해야 한다. 사실 리액트를 처음 공부할 때는 creat-react-app을 사용했기 때문에 babel과 webpack을 잘 몰랐지만, 나중에는 이런 빌드 도구를 직접 다뤄야 한다고 한다. 그래서 채용공고에도 배포해본 경험이 있는사람을 좋아하나 보다. Babel ? 프로젝트로 만들어진 결과물은 띡 배포한다고해서 모든 브라우저에서 실행이 되는 것이 아니다. 언어와 라이브러리들은 계속해서 새로운 버전으로 바뀌고, 우리는 그렇게 새롭게 나온것을 이용하기 때문에 브라우저에는 호환이 되지 않을 수도 있다. 그래서 코드를 변환해주는 babel이 필요하다. Weback ? 또한 한 프로젝트에는 많은 js파일들과 그외 다양한 파일들이 있게 되는데, 그냥 만.. 2021. 1. 2. RESTful API 왜 REST API를 알아야 하는가 ? 프론트 - 백엔드가 소통하기 위해 알아야 한다. 비동기 통신을 할 때, 읽어오기나 정보를 보내야 할 때 GET, POST 와 같은 HTTP 메서드를 이용하는데, REST API를 알아야 정상적으로(보편적으로) 통신을 하게 할 수 있기 때문이다. 1. RESTful API REST를 잘 지켜서 API를 설계한 것 2. REST ? 서버와 클라이언트가 통신할 때, 주고받는 것들을 어떻게하면 명확하게 표현할 수 있을지에 대한, 가이드 라인을 제시한 것 3. 그래서 REST란게 뭐지 ? REST는 로이필딩이라는 사람이 논문에 게시한 아키텍쳐이다. 명확하게 표현하기 위한 권고사항 인 것인데, 실제로 완벽하게 지켜지기는 불가능하다. 4. REST는 어떻게 표현을 하는 걸까? .. 2021. 1. 1. 이전 1 다음