728x90 WEB/React2 [React] 반응형 웹 사이트(홈페이지) 만드는 법 React, 반응형 웹, react-media, 반응형 모바일, 반응형 사이트 반응형 웹페이지(홈페이지)란 사용자의 화면 크기에 반응(Response) 한다고 해서 반응형 홈페이지라고 합니다. 즉 홈페이지 요소들의 사이즈가 사용자의 화면 크기에 따라 줄었다가 늘었다가 하는 것입니다. React에서 반응형 웹 페이지를 구성하는 방법은 다음과 같습니다. 우선 react-media를 import 해줍니다. react-media에서 Media를 사용할 것입니다. import Media from 'react-media' 그 다음 MEDIA_QUERIES를 작성해준다. 필자는 pc와 mobile로 나누었다. const MEDIA_QUERIES = { pc: '(min-width: 1200px)', mobile: '.. 2020. 12. 13. React 폰트 적용 하는 방법 react 폰트 적용 React Project에서 웹 폰트를 적용하는 방법을 알려드리려고 합니다. 우선 Style 적용을 위한 material-ui 라이브러리를 설치합니다. npm install @material-ui/core index.css에 웹 폰트를 import 해줍니다. @import url(//spoqa.github.io/spoqa-han-sans/css/SpoqaHanSans-kr.css); @import url(//spoqa.github.io/spoqa-han-sans/css/SpoqaHanSans-jp.css); index.js에서 wrapping 작업을 해줍니다. import React from 'react'; import ReactDOM from 'react-dom'; import '.. 2020. 9. 19. 이전 1 다음 728x90