How to check if a client's device is a tablet, using typescript or javascript?

Question

i want to display a button only on mobile and desktop devices. if user is using application on tablet device i dont want to display the button using react and typescript.

below is my code,

function Parent() {
    return(
        <button>hide me </button>
    );
}

I am new to programming. could someone help me with this. thanks.

Does this answer your question? [hide div tag on mobile view only?](https://stackoverflow.com/questions/16550485/hide-div-tag-on-mobile-view-only) — Emile Bergeron, Oct 20 '20 at 15:59
If you'd like to _try_ to detect device, go down that rabbit hole: [What is the best way to detect a mobile device?](https://stackoverflow.com/q/3514784/1218980) — Emile Bergeron, Oct 20 '20 at 16:00

score -1 · Answer 1 · answered Oct 20 '20 at 14:07

-1

Typically this is done using CSS media queries, I recommend going that route. If that isn't useful you can also checkout this answer on a similar question Detect if device is tablet.

answered Oct 20 '20 at 14:07

BeFoRE

38
4

score -1 · Answer 2 · answered Oct 20 '20 at 14:21

-1

There are already libraries to do that for you, you could check this one:

https://www.npmjs.com/package/react-device-detect

answered Oct 20 '20 at 14:21

Joshue

27
1
6

score -2 · Answer 3 · answered Oct 20 '20 at 14:00

I don't think it is quite possible to do this especially as a beginner.

I'm barely an amateur in coding and I know you can check for the screen width or whether it is a device with a touchscreen, but recognizing if the user is using a tablet is not possible to do it with some simple codes.

How to check if a client's device is a tablet, using typescript or javascript?

3 Answers3