Mengenal Dasar Html, Css, Dan Javascript

HTML | HyperText Markup Language

Pengertian: HTML (HyperText Markup Language) adalah bahasa pemrograman yang digunakan untuk membuat dan mengatur struktur serta tampilan halaman web. HTML berfungsi sebagai dasar dalam membangun halaman-halaman web dengan mendefinisikan elemen-elemen seperti teks, gambar, tautan, tabel, formulir, dan berbagai elemen lainnya. Dalam HTML, teks dan elemen-elemen lainnya diberi label atau “markup” untuk memberi petunjuk kepada browser tentang bagaimana cara menampilkan konten web tersebut kepada pengguna. HTML membentuk dasar dari seluruh situs web yang Anda jelajahi secara online dan memungkinkan konten web untuk diakses melalui berbagai perangkat dan platform.

Elemen Dasar

  • Tag Heading (<h1>, <h2>, <h3>, …, <h6>):  Elemen-elemen <h1> hingga <h6> pada HTML digunakan untuk membuat judul atau heading dengan tingkat kepentingan yang berbeda. Semakin besar angka heading, semakin kecil ukuran nya. Contohnya, <h1> digunakan untuk judul utama yang paling besar, sementara <h2> digunakan untuk judul yang sedikit lebih kecil dan seterusnya. Ini membantu mengatur tampilan dan struktur teks pada halaman web Anda.
  • Paragraph (<p>): Digunakan untuk membuat paragraf teks.
  • Hyperlink (<a>): Digunakan untuk membuat tautan (link) ke halaman lain atau URL eksternal. Contoh: <a href=”https://www.example.com”>Kunjungi Contoh</a>
  • Image (<img>): Digunakan untuk menampilkan gambar di halaman web. Contoh: <img src=”gambar.jpg” alt=”Gambar Contoh”>
  • List (<ul>, <ol>, <li>): Digunakan untuk membuat daftar, baik itu daftar tidak berurutan (<ul>) atau daftar berurutan (<ol>), dan elemen-elemen dalam daftar (<li>). Contoh:
  • Form (<form>, <input>, <button>, dll.): Digunakan untuk membuat formulir yang memungkinkan pengguna memasukkan data. Contoh:
  • Table (<table>, <tr>, <th>, <td>): Digunakan untuk membuat tabel yang mengatur data dalam baris dan kolom. Contoh:
  • Div (<div>): Digunakan sebagai wadah atau container untuk mengelompokkan dan mengatur elemen-elemen lain. Contoh:

Contoh Codingan Pada Html

CSS | Cascading Style Sheets

Pengertian
CSS (Cascading Style Sheets) adalah bahasa yang digunakan untuk mengatur tampilan dan gaya visual dari halaman web. Dengan CSS, Anda dapat mengontrol warna, ukuran font, tata letak, dan elemen visual lainnya dalam HTML.

Contoh Codingan:

Java Script

Pengertian

JavaScript adalah bahasa pemrograman yang sering digunakan untuk mengembangkan aplikasi web interaktif. Ia memungkinkan pengembang untuk menambahkan fungsi interaktif, perilaku, dan dinamika pada halaman web. JavaScript bukan bagian dari HTML atau CSS, tetapi ia bekerja bersama dengan keduanya untuk menciptakan pengalaman web yang lebih kaya dan dinamis.

Elemen Js

  • Variabel 

Digunakan untuk menyimpan nilai dan data.

  • Fungsi 

Blok kode yang dapat dipanggil untuk menjalankan tugas tertentu.

  • Perulangan 

Mengulangi kode berdasarkan kondisi tertentu.

  • Kondisi

Melakukan tindakan berdasarkan kondisi tertentu.

  • Array

Kumpulan nilai yang dapat diakses menggunakan indeks.

  • Objek

Kumpulan properti dan metode yang merepresentasikan objek nyata.

  • Event Listener

Menghubungkan kode untuk merespons peristiwa pada elemen HTML.

  • Manipulasi DOM

Mengubah elemen dan konten pada halaman web.

  • Fetch API

Mengambil data dari server menggunakan permintaan HTTP.

  • Async/Await

Menerapkan asinkronous programming untuk menangani permintaan data.

  • Local Storage

Menyimpan data secara lokal di browser.

Contoh codingan JavaScript yang mencakup konsep variabel, fungsi, perulangan, kondisi, array, dan objek:

1.Variabel

2.Fungsi

3.Perulangan dengan ‘for’ dan ‘while’ :

4. Kondisi dengan ‘if’ , ‘else if’ dan ‘else’:

5. Array

6. Objek

Subscribe

Related articles

Tips Kolaborasi Efektif antara UI/UX Desainer dan Pengembang

Kerja sama yang solid antara UI/UX desainer dan pengembang...

Aturan Penting yang Harus Dipatuhi oleh Seorang UI/UX Designer

Desain Antarmuka Pengguna (UI) dan Pengalaman Pengguna (UX) adalah...

Membangun Profil LinkedIn yang Mengesankan untuk UI/UX Designer

Dalam era digital yang semakin maju, LinkedIn telah menjadi...

Meningkatkan Karir Anda dengan Sertifikasi Google UX

Dalam dunia yang semakin terhubung secara digital, pengalaman pengguna...

Perjalanan Seorang Intern UI/UX Desainer di Udacoding

Sebagai seorang mahasiswa yang bersemangat dan bercita-cita tinggi di...

LEAVE A REPLY

Please enter your comment!
Please enter your name here