목록Javascript/React (3)
박철순
const { createProxyMiddleware } = require('http-proxy-middleware'); module.exports = function (app) { app.use( '/api', createProxyMiddleware({ target: 'http://localhost:5000', //호스트하는 서버 주소 changeOrigin: true, }), ); }; CRA 환경에서 위 코드를 통해 cors문제를 해결할 수 있었다. 그리고 해당 파일은 setupProxy.js로 이름을 작성 한 뒤, src 폴더 내에 넣어두어야 실행이 됨. * changeOrigin 설정은 http-proxy 모듈의 설명과 같이 대상 서버 구성에 따라 호스트 헤더가 변경되도록 설정하여 준다. 아래 ..
const autoResizeTextarea = () => { textAreaRef.current.style.height = 'auto'; textAreaRef.current.style.height = textAreaRef.current.scrollHeight + 'px'; }; return textarea { overflow-y : hidden; } scrollHeight로 해당 textArea의 높이값을 가져온다. 그 후 onChange로 입력값을 바꿔주면 된다. auto값을 준 이유는 - auto값은 안에 내용물이 없으면 기존에 값을 입력받아 생긴 높이값으로 textArea의 height값이 고정이 되기 때문이다. onKeyDown이 아닌 onChange로 한 이유는 - onKeyDown은 키를 눌..

SVG를 넣는 방법을 넣는 방법은 총 2가지이다. 1. import svgFileName from './test.svg 를 통해 이미지에 src로 넣는 방법과, 2. import { ReactComponent as SvgFileName 를 통해 컴포넌트로 넣는 방법이 있음. 개인적으로 컴포넌트로 넣는 방법을 사용하면, SVG값을 쉽게 변경이 가능함. 대신, svg 내에 변경하고자 하는 값에 ex) fill="current" 에 넣은 뒤 컴포넌트에 해당하는 값을 넣어주면 됨. 리액트 내에서 import를 통해 SVG 를 넣으면 타입 오류 ('Cannot find module 'path.svg' or its corresponding type declartions')가 뜹니다. 해당 오류가 발생 했을 때 sr..