-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathday3.html
55 lines (55 loc) · 4.87 KB
/
day3.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="Content-Type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1., maximum-scale=2., user-scalable=yes"/>
<title>Ngoding Day 3 HTML & CSS</title>
<link href="https://fonts.googleapis.com/css2?family=Comic+Neue:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style-css/day3.css"/>
</head>
<body>
<h3 id="titleWeb">Macam-macam ekstensi google chrome store untuk pengembang web, ini penting banget!!!</h3>
<p>kalian udah tau dong apa itu ekstensi google chrome? nah ekstensi google chrome sendiri adalah program tambahan kecil yang dapat Anda instal pada peramban web Google Chrome untuk menambahkan fungsi tambahan atau memodifikasi cara peramban beroperasi.
back to topik, Apa sih yang membuat ekstensi google chrome itu sangat penting bagi pengembang web atau Web Developer? karena mereka menyediakan berbagai alat dan fitur yang membantu dalam pengembangan, pengujian, dan debugging situs web. Berikut adalah beberapa alasan mengapa ekstensi Chrome sangat penting bagi pengembang web:</p>
<ol class="impo-extension">
<li> Alat Pengembangan: Ekstensi seperti Web Developer Tools menyediakan berbagai alat yang berguna untuk menginspeksi, mengedit, dan menguji kode HTML, CSS, dan JavaScript. Ini termasuk alat untuk mengukur elemen, menganalisis CSS, memeriksa responsivitas, dan banyak lagi.</li>
<li> Pengelolaan Proyek: Ekstensi seperti Toby atau OneTab memungkinkan pengembang untuk mengatur dan mengelola tab-tab yang terbuka dengan lebih baik. Ini membantu dalam menjaga keteraturan dan fokus saat bekerja pada proyek web yang kompleks.</li>
<li> Optimisasi Kinerja: Ekstensi seperti Lighthouse menyediakan alat untuk mengukur kinerja situs web, aksesibilitas, praktik SEO, dan kualitas umum situs web. Ini membantu pengembang untuk mengidentifikasi area-area yang perlu ditingkatkan untuk meningkatkan kinerja dan pengalaman pengguna.</li>
<li> Pengujian Lintas Browser: Ekstensi seperti User-Agent Switcher memungkinkan pengembang untuk mengubah user agent browser mereka, memungkinkan mereka untuk menguji bagaimana situs web merespons pada berbagai browser dan perangkat.</li>
<li> Manajemen Data: Ekstensi seperti EditThisCookie memungkinkan pengembang untuk mengelola cookie pada situs web yang mereka kunjungi, termasuk menambah, mengedit, dan menghapus cookie. Ini membantu dalam pengujian fungsionalitas situs web yang melibatkan pengelolaan sesi pengguna.</li>
<li> Pemantauan Perubahan: Ekstensi seperti Page Monitor memungkinkan pengembang untuk memantau perubahan pada halaman web tertentu dan menerima pemberitahuan saat perubahan terjadi. Ini berguna dalam memonitor situs web yang dikelola atau dikembangkan.</li>
<li> Pengelolaan Proyek Sumber Terbuka: Ekstensi seperti Octotree menyediakan navigasi pohon yang lebih mudah dan cepat untuk repositori GitHub. Ini membantu pengembang untuk menjelajahi dan berkontribusi pada proyek-proyek sumber terbuka dengan lebih efisien.</li>
</ol>
<p>Contoh Ekstensi google chrome buat pengembang web apa saja min?, menurut versiku banyak tergantung apa saja keperluannya, untuk lebih lanjut kamu bisa check out tabel berikut di bawah beserta linknya!</p>
<table class="chrome-extension">
<tr>
<th>Ekstensi</th>
<th>Fitur</th>
</tr>
<tr>
<td><a href="https://chromewebstore.google.com/detail/web-developer/bfbameneiokkgbdmiekhjnmfkcnldhhm"target="_blank">Web Developers</a></td>
<td>seperti Disable, Cookies, CSS, Form, Images, Miscellaneous, Outline, Resize, Tools dan Options</td>
</tr>
<tr>
<td><a href="https://chromewebstore.google.com/detail/page-ruler/jcbmcnpepaddcedmjdcmhbekjhbfnlff"target="_blank">Page Rules</a></td>
<td>Mengukur halaman web biasanya pada box model</td>
</tr>
<tr>
<td><a href="https://chromewebstore.google.com/detail/wappalyzer-technology-pro/gppongmhjkpfnbhagpmjfkannfbllamg"target="_blank">Wappalyzer</a></td>
<td>mendeteksi teknologi apa yang di pakai web tersebut</td>
</tr>
<tr>
<td><a href="https://chromewebstore.google.com/detail/mobile-simulator-responsi/ckejmhbmlajgoklhgbapkiccekfoccmk"target="_blank">Mobile Simulator</a></td>
<td>Menguji coba responsive halaman web ke mobile tanpa harus mengecek kembali menggunakan handphone asli </td>
</tr>
<tr>
<td><a href="https://chromewebstore.google.com/detail/stylebot/oiaejidbmkiecgbjeifoejpgmdaleoha"target="_blank">StyleBot</a></td>
<td>Menguji dan mengedit langsung halaman website tanpa tapi tidak permanen hanya saja ini mempermudah halaman web kita</td>
</tr>
<tr>
<td><a href="https://webaim.org/resources/contrastchecker/"target="_blank">WebAIM</a></td>
<td>Mengecek contrast web itu bagus atau tidak</td>
</tr>
</table>
</body>
</html>