[React]현재 브라우저 정보 확인하기

React에서 Browser 정보를 확인할 수 있는 Package를 소개합니다.

---

React-browser-detection 사용

브라우저를 체크 하기 위한 용도는 아니며, 현재 실행되고 있는 브라우저에 따라서 값을 return 합니다.

IE 버전별로 처리해야 하는 경우에는 사용 불가능합니다.

 

공식 사이트 : https://www.npmjs.com/package/react-browser-detection

 

설치

npm install --save react-browser-detection

 

Import

import BrowserDetection from 'react-browser-detection';

 

코드

See the Pen React-browser-detection_EX by JaeSung2386 (@jaesung2386) on CodePen.ddd

 

 

 

안드로이드 크롬에서 실행 결과

반응형

---

detect-browser 사용

브라우저를 감지하여 브라우저의 정보를 확인할 수 있습니다.

 

공식 사이트 : https://www.npmjs.com/package/detect-browser

 

설치

npm install --save detect-browser

 

Import

import { detect } from 'detect-browser';

 

코드

See the Pen detect-browser_EX by JaeSung2386 (@jaesung2386) on CodePen.

 

 

---

browser-detect

사용 방법은 detect-browser Package와 유사합니다.

 

공식 사이트 : https://www.npmjs.com/package/browser-detect

 

설치

npm install browser-detect

 

Import

import browser from 'browser-detect';

 

코드

See the Pen browser-detect_EX by JaeSung2386 (@jaesung2386) on CodePen.

 

 

---

마무리

npm 사이트에 설명이 정리되어있으며, 제일 다운로드 수가 많은 detect-browser Package를 사용하는것을 추천합니다.