#17 Tutorial ReactJS Mengecek Resolusi Layar

Pada tutorial kali ini KonsepKoding akan berbagi tutorial mengenai bagaimana caranya mengetahui apakah web app yang kita buat di screen tablet, screen mobile, retina dan bahkan mengetahui resolusi layar, dengan kita mengetahui ukuran atau resolusi layar kita bisa memberikan perlakuan yang berbeda pada setiap screen seperti UI atau animasi pada layar yang berbeda-beda tanpa menggunakan media query lebih simple pada ReactJS. 

Apa Yang Akan Kita Pelajari

1. Membuat Project ReactJS
2. Menginstall Library

3. Memulai Coding

Membuat Project React Baru

npx create-react-app my-app

cd my-app

Menginstall Library

Setelah itu buka terminal anda dan silahkan install library di bawah ini

npm i react-responsive

Memulai Coding

Silahkan buka File App.js anda dan ubah kodingannya menjadi seprti di bawah ini :

Setelah itu Run dan hasilnya akan seperti di bawah ini :

Web Screen

Layar Screen

Sekian semoga tutorial ReactJS Bahasa Indonesia ini dapat membantu dan bermanfaat bagi kamu yang sedang mempelajari ReactJS.

Baca Juga Tutorial ReactJS lainnya :

#1 Pengenalan ReactJS, Kekurangan Dan Kelebihan

#2 Tutorial ReactJS Memahami State Dan Props Serta Contoh

#3 Tutorial ReactJS Lifecycle/Siklus Hidup Class Component

#4 Tutorial ReactJS Kondisional Rendering Class & Hooks

#5 Tutorial ReactJS Formting Tanggal Dan Waktu

#6 Tutorial ReactJS Membuat Form Login

#7 Tutorial ReactJS Membuat Countdown Timer Simpel

#8 Tutorial React Hooks Countdown Timer Advanced

#9 ReactJS Fetch API, Handling Loading Dan Error Lengkap

#10 Tutoria ReactJS Fetch API React Hooks

#11 Tutorial Consume API Axios ReactJS

#12 Tutorial Consume API Array ReactJS

#13 Tutorial  Navigasi React Router ReactJS 

#14 Tutorial React Router Passing Data Props Parameter

#15 Tutorial Meta Title Helmet React JS

#16 Tutorial React Styling Styled-Components Card Cakep