본문 바로가기

전체 글93

(NPM) dependencies && devDependencies dependencies 그리고 devDependencies 차이점이 무엇일까 ? dependencies 애플리케이션의 로직과 연관이 있는 것들. (화면) - 배포용 npm i react npm i chart npm i vue devDependencies 개발을 할때 개발을 위한 보조 라이브러리 - 개발용 -D === --save-dev npm i typescript -D npm i webpack -D npm i js-compression -D 나중에 최종적으로 서버에 빌드가 될경우 devDependncies는 배포가 되지 않는다. npm 커스텀 명령어 npm run bulid === tsc 2021. 10. 9.
CORS. CORS,SOP 웹브라우저의 내장된 보안정책이다 . 쉽게 한번 풀어보려고한다. cors 를 알기전에 Origin(출처)를 알고가자 Origin(출처)? http://localhost:3000/ http : 프로토콜. localhost : 호스트. 3000 : 포트번호. SOP(Same-Origin Policy) 웹브라우저의 보안 정책으로 말 그대로 “같은 출처에서만 리소스를 서로 공유할 수 있다”라는 규칙을 가진 정책이다. 쉽게말해서, 같은 도메인이어야 통신을 할 수 있다 라는 내용이다. 그럼 cors는 c=cross 다른 출처 리소스 아니겠는가? 그렇다는건 도메인이 다르면 CORS 정책 위반으로 인해 에러가 발생한다. ex) 민수는 백엔드개발자이고, 민수의 집주소는 http://localhost:500.. 2021. 9. 8.
node.js? node.js 가 뭘까 ? 노드는 서버가아니다. 자바스크립트 실행환경. --> JS 만 이해 할 수 있음. 자바스크립트 실행기이다. 런타임이 뭘까 ? js코드를 웹브라우저 밖에 터미널에서 실행 할 수 있게 도와주는 애 npm ? (패키지 매니저)라이브러리를 간편하게 설치,삭제,업뎃 가능 node js 설치하면 자동으로 npm 패키지매니저가 따라온다 그럼 js 로 서버를 어떻게 돌리냐? node는 http 라는 모듈을 제공한다. http ? 인터넷에서 데이터를 주고받을 수 있는 프로토콜 프로토콜? 규칙 노드가 위의 코드를 실행한다. -> http서버 실행 package.json 을 만들자 node app.js 2021. 8. 20.
CORS 에러내용 : CORS정책에 의해서 3060 -> 3065 차단됌 브라우저 포트번호 3060 백엔드 서버 포트번호 3065 브라우저가 다른 도메인(3060 -> 3080) 으로 요청을 보내면 브라우저가 차단된다 프론트서버-> 백엔드서버 로 요청할땐 생기지 않는다. 브라우저가 3060 에서 3080으로 요청을 보낼 수 있게 허용을 해줘야한다. 해결법 1. 브라우저 -> 프론트서버로 요청 도메인이 같으면 CORS 정책위반 아님 해결법 2. 프록시 방식 -> 요청을 허용/거부하는 역할 브라우저 -> 프론트 서버 -> 백엔드 서버 허용은 서버에서. 2021. 8. 19.
react port 번호 변경하는법 2021. 8. 10.
Custom hook 무언가 중복되는 훅s 들의 세트들이 보인다면 커스텀 훅으로 만들자! hook은 컴포넌트 안에서만 작성이 가능하다 custom 훅은 예외다 id 기준으로 보겠다. 1. 처음 useInput('') 호출 한다. return 값 받음 [value,handler] 2. onChange 될때마다 handler( ) 함수 호출 3.handler호출 될때마다 id의 상태변경 --->해당 컴포넌트(Signup) 리렌더. --> useInput 다시호출 바뀐 value [value, handler] 리턴 4.useInput 의 return 값 받음 [value,handler] const [value , 콜백함수] = useInput(''); 콜백함수에서는 value 를 업데이트 해야한다!! 2021. 8. 8.

티스토리툴바