개발자를 향해...

[노드 리액트 기초 강의]#23 Proxy Server ? ~ #25 Antd CSS Framwork 본문

웹 자바스크립트 공부/ReactJS + node.js

[노드 리액트 기초 강의]#23 Proxy Server ? ~ #25 Antd CSS Framwork

eugeneHwang1124 2021. 2. 18. 12:28
728x90
반응형

본 글은 John Ahn 님의 [노드 리액트 기초 강의]를 수강하며 작성하였습니다.

 

#23 Proxy Server ?

 

proxy 서버를 통해 유저가 뭔가 보내면 여기서 여러 활동을 할 수 있다. 예를 들어 ip나 중요한 데이터들을 서버가 알아볼 수 없게 바꾸거나 방화벽 기능을 할 수 도 있고 필터 기능을 할 수도 있다. 또한 static한 이미지를 프록시에 저장해 굳이 인터넷까지 가지 않아도 proxy에서 데이터를 가져올 수 있다. 그리고 원하지 않는 유저의 접근을 막을 수 있다. 

 

#24 Concurrently

 

Concurrently를 이용해 백서버와 프론트 서버를 한번에 켜보자. 우선 라이브러리를 다운받기 위해 npm i concurrently 를 터미널에 실행해주자. 그리고 루트 디렉토리의 package.json으로 가서

"dev": "concurrently \"npm run backend\" \"npm run start --prefix client\""

를 디펜던시에 넣어주자. 이제 npm run dev를 통해 백과 프론트 서버를 동시에 켤 수 있다.

 

#25 Antd CSS Framwork

 

css는 antd에서 사용할 것이다. antd의 장점은 스타일이 깔끔하고 엔터프라이즈 환경에서도 잘 만들 수 있다.(ant.design/components/overview/)

제공되는 것들을 쓰기위해서는 우선 터미널에 client 폴더에서 npm install antd를 실행시켜 라이브러리를 다운받는다. 그리고 사용할 때

import { DatePicker } from 'antd';

ReactDOM.render(<DatePicker />, mountNode);

이런 식으로 import해서 사용하면 된다.

 

반응형