Check your device when you have anything to change on your PC or mobile.

Overview

opgg-use-device-detector

Check your device when you have anything to change on your PC or mobile.

❤️ it? ⭐️ it on GitHub

opgg-use-device-detector basically provides physical device data and logical device data.

  • Physical device: Device information that was accessed when the site was first accessed.
  • Logical device: Device information that changes internally when changing the current state to an arbitrary device.

Requirement

To use opgg-use-device-detector, you must use [email protected] or greater which includes Hooks.

Installation

$ npm i opgg-use-device-detector

Usage

import useDeviceDetector from 'opgg-use-device-detector'

const deviceDetector = useDeviceDetector(initialState, deviceDetectorConfig)

Parameters

You pass useDeviceDetector an initialState and an optional deviceDetectorConfig object. The configuration object may contain the following keys.

Key Description
onChange [Comming Soon!]
storageKey A string that will be used by the storageProvider to persist the logical device data. If you specify a value of null, nothing will be persisted. Default=logicalDeviceData.
storageProvider A storage provider. Default = localStorage. You will generally never need to change this value.

This version does not provide local storage usage and onChange functions.

2022.03.13
[BugFix] - Fix the bug where the physical device data is initialized.

2022.03.10
[Update] - Contributor setting.
[Ongoing] - Add window.navigator.userAgent parser.
[Update] - Remove the defense and lighten the project.

2022.03.07
[Update] - Remove device model and brand (Fixing the bug.)
[Update] - Add function version.1 (use local storage)

Return object

A deviceDetector object is returned with the following properties.

Key Description
physicalDevice Device information on the first visit.
logicalDevice Logically changed device information.
isMobile Check current state. (true = 'smartphone' / false = 'desktop')
toggle() A function that allows you to toggle 'smartphone' or 'desktop'.

License

MIT Licensed

Contributors


JJoGeon
You might also like...

📈 AI powered web scraper that let's you scrape anything you want from the web including google search results

AI powered web scraper that let's you scrape anything you want from the web including google web search results from your terminal. And at the same ti

Dec 27, 2022

Boilerplate project to run MOBILE Test Automation with WebdriverIO v7, Mocha, Appium, Allure reporting and Momentum Suite cloud device farm support

Boilerplate project to run MOBILE Test Automation with WebdriverIO v7, Mocha, Appium, Allure reporting and Momentum Suite cloud device farm support

WebdriverIO Mocha Appium Momentumsuite WebdriverIO Integration with local or Momentum Suite real mobile farm devices Supports Native or Hybrid Android

Dec 5, 2022

Create a new project with Next.js, TypeScript, Eslint, Prettier in just 1 second and you don't need to setup anything.

Create a new project with Next.js, TypeScript, Eslint, Prettier in just 1 second and you don't need to setup anything.

Next + TypeScript + Eslint + Prettier Template 🔥 Create a new project with Next.js, TypeScript, Eslint, Prettier in just 1 second and you don't need

Oct 2, 2022

JSON Visio is data visualization tool for your json data which seamlessly illustrates your data on graphs without having to restructure anything, paste directly or import file.

JSON Visio is data visualization tool for your json data which seamlessly illustrates your data on graphs without having to restructure anything, paste directly or import file.

JSON Visio is data visualization tool for your json data which seamlessly illustrates your data on graphs without having to restructure anything, paste directly or import file.

Jan 4, 2023

In this project, you will restructure your Awesome books app code. The goal is to make it more organized by using modules. You will also practice the ES6 syntax that you have learned.

Awesome books: with ES6 In this project, you will restructure your Awesome books app code. The goal is to make it more organized by using modules. You

Oct 10, 2022

Annotation tools for the web. Select text, images, or (nearly) anything else, and add your notes.

Annotator Annotator is a JavaScript library for building annotation applications in browsers. It provides a set of interoperable tools for annotating

Dec 23, 2022

Want to preserve your loved one's voices for eternity? Narrate anything using the a voice imprint that can be made in as little as 10 minutes of audio samples. Easy as pie.

Want to preserve your loved one's voices for eternity? Narrate anything using the a voice imprint that can be made in as little as 10 minutes of audio samples. Easy as pie.

Want to preserve your loved one's voices for eternity? Narrate anything using the a voice imprint that can be made in as little as 10 minutes of audio samples. Easy as pie.

Nov 29, 2022

Blog-webapp - A simple webapp prototype that serves tech news, blogs, and anything else a developer might want to learn or get help with

Blog-webapp - A simple webapp prototype that serves tech news, blogs, and anything else a developer might want to learn or get help with

Blog Web app A simple webapp prototype that serves tech news, blogs, and anythin

Nov 3, 2022
Owner
ChoGeonHo
ChoGeonHo
HackFest is a 36-hour long hackathon wherein you have to put on your hacker hats and build anything that falls in either or both the domain of full-stack web development

HackFest is a 36-hour long hackathon wherein you have to put on your hacker hats and build anything that falls in either or both the domain of full-stack web development (the stack we learn in full-stack web developer roadmap on codedamn).

Shivam Kumar 2 Jun 6, 2022
Check in, check the weather, Check out.

☀️ Just-Weather ??️ Hi, Welcome! Just Weather is a Web App designed for Fast Real-Time Weather queries in combination with well Thought Out Visual Des

Miguel Ángel 6 Aug 7, 2022
A mobile web application to check the data on the total covid19 confirmed cases and deaths, check data for all countries with recorded cases.

This is a mobile web application to check the data on the total covid19 confirmed cases and deaths, check data for all countries with recorded cases. It also has a details page to check for the statistics for each region/state if available.

Solomon Hagan 7 Jul 30, 2022
zieeco 12 Jul 8, 2022
Change the color of an image to a specific color you have in mind.

image-recolor Run it: https://image-recolor.vercel.app/ image.recolor.mov Acknowledgments Daniel Büchele for the algorithm: https://twitter.com/daniel

Christopher Chedeau 21 Oct 25, 2022
Keep a track of all the tasks you need to do and Check off ones you have completed - Created using HTML, SCSS, JavaScript and Webpack.

To Do List Keep a track of tasks you need to do. An Application where you can keep a track of the tasks you need to do and checkout the ones that have

Awais Amjed 19 Jul 28, 2022
Allows the public to easily report and track the geolocation of anyone or anything they spot outside, using a mobile app or web frontend.

LIVE DEMO: https://armytracker.com/ (tracking the invading Russian army in Ukraine) Attention: - If you'd like to help the project either as a program

Michal Certicky 9 Mar 27, 2022
Device.js is a JavaScript library to detect device, viewport, and browser information using plain JavaScript.

Device.js Device.js is a JavaScript library to detect device, viewport, and browser information using plain JavaScript. Compatibility Works with all m

Emanuel R. Vásquez 5 Dec 16, 2022
Have you always wanted to check if someone has checked out your story or not?

InstaStoryChecker - Search in your story viewers Have you always wanted to check if a certain person has checked out your story or not and you had to

Mohammad Saleh 4 Jul 7, 2022