728x90 반응형 React14 WEB 만들기 24 - Antd CSS Framwork 리액트를 위한 CSS 프레임 워크 종류 는 Material UI React Bootstrap Semantic UI Ant Design Materialize 이렇게 등이 있습니다. Ant Design 여기서는 이것을 사용할것이고 중국에서 만들어졌고, 단점은 사이즈가 크다는 점이 있다. 장점은 깔끔하고 엔터프라이즈 환경에서도 어울리는 디자인을 만들 수 있는 점이 있다. 가장큰 장점으로 생각되어지는것은 쓰기가 편하다. Material UI도 좋긴하지만 배우기 어렵다고 해서 일단 이걸루 ant.design/components/overview/ Components Overview - Ant Design antd provides plenty of UI components to enrich your web appli.. 2021. 1. 22. WEB 만들기 23 - Concurrently 지금까지 서버를 켰을 때 두개를 하나씩 켰는데 한번에 켜는 법에 대해서 알아보겠습니다 . npm install concurrently --save 이런식으로 우선 설치를 해줍니다. 우선 설치를 제일 상위 폴더에 해주시면 됩니다. 그리고 나서는 사용 방법은 위와 같습니다. 상위 폴더의 package.json 부분의 scripts 에서 "dev": "concurrently \"npm run backend\" \"npm run start --prefix client\"" 이렇게 추가를 해주시면 됩니다. --prefix cleint " 이렇게 하는것은 client 쪽에 start를 실행을 해줘야하기 때문입니다. npm run dev를 해주면 한번에 켜집니다. 2021. 1. 22. WEB 만들기 22 - Proxy Server 프록시 서버란 무엇인가? 클라이언트에서 REQUEST 하고 서버에서 RESPONSE 를 하는데 이 안에 Proxy Server라는게 들어가 있을 수 있는데 만약에 유저가 있고 인터넷이 있다고 한다면 유저가 무엇인가를 보냈을 때 프록시 서버에서 여러가지 할 수 있는데 1. 주소가 123.123.123.123 이라고 한다면 임의로 받는 사람한테는 ip를 임의로 바꿔서 모르게 할 수 있다. 2.아이피 주소 뿐만 아니라 데이터 역시도 바꿀 수 있다. 그리고 방화벽 기능과 웹 필터 기능 캐쉬 데이터, 공유 데이터 제공 기능을 한다. 어떤 사이트에 들어갔을때 static한 이미지나 그런 것들을 프록시 서버에 저장 할 수 있다. 그래서 무엇인가를 보고 싶을때 인터넷 까지 않아도 프록시서버에 담아져 있는걸을 볼 수가 .. 2021. 1. 22. WEB 만들기 21 - CORS 이슈, Proxy 설정 저번 시간에 데이터를 전송했는데 오류가 생겼습니다. 그 이유는 일단 포트가 다르고 어떤 설정을 안 하면 cors 정책에 의해서 막혀버린다. cors란 Cross-Origin Resource Sharing 의 약자로 보안을 위해서 사용된다. 여러가지 방법이 있다. 개발자 도구를 이용하는 방법 그리고 프론트 엔드 부분만 고칠 수 있는 상황이면 jsonp 방식을 이용하여 모듈 request를 get request로 바꿔서 보냄으로 인해서 해결할 수 있는 방법이 있습니다. 그것도 제한적이기 때문에 우리가 백엔드 , 프론트 다 컨트롤 할 수 있으면 서로 오는것은 받거나 허용 할수 있게 전달해서 보내면 가능하고 proxy라는 방법이 있습니다. create-react-app.dev/docs/proxying-api-r.. 2021. 1. 21. 이전 1 2 3 4 다음 728x90 반응형