Front-end: Pengertian dan Contohnya

 

 Apa Itu Front-End?

Front-end, atau yang sering disebut sebagai "sisi klien" (client-side), adalah bagian dari pengembangan web yang berfokus pada antarmuka pengguna (user interface) dan pengalaman pengguna (user experience). Dengan kata lain, front-end adalah apa yang Anda lihat dan interaksikan di layar browser—mulai dari tata letak halaman, warna, tombol, hingga animasi dan responsivitas situs.

Front-end developer bertugas membuat situs web atau aplikasi terlihat menarik, mudah digunakan, dan berfungsi dengan baik di berbagai perangkat seperti desktop, tablet, atau ponsel. Teknologi utama yang digunakan adalah HTML, CSS, dan JavaScript. Tanpa front-end, situs web hanyalah kode belakang (back-end) yang tidak bisa diakses pengguna.

Contoh Front-End

     1.  HTML  

     HTML atau HayperText Markup Language adalah bahasa markup standar yang digunakan untuk membuat dan menstrukturkan konten halaman web. Bahasa ini menjadi dasar dari hampir semua situs web, memberi tahu peramban (browser) cara menampilkan teks, gambar, tautan, dan elemen multimedia lainnya di layar pengguna. HTML digunakan untuk menentukan struktur dan makna dari konten web, sementara teknologi lain seperti CSS dan JavaScript digunakan untuk gaya (presentasi) dan fungsionalitasnya.  

 



1.            2. CSS

CSS adalah singkatan dari Cascading Style Sheets, sebuah bahasa yang digunakan untuk mendeskripsikan tampilan dan tata letak dokumen yang ditulis dalam bahasa markup seperti HTML atau XML. Fungsinya adalah untuk memisahkan konten dari tampilan, sehingga pengembang dapat dengan mudah mengatur warna, font, tata letak, dan elemen visual lainnya agar website terlihat menarik dan konsisten. 

 

 

 3.  JavaScrip 

JavaScript (JS) adalah bahasa pemrograman yang sangat penting untuk web, digunakan untuk membuat halaman web menjadi dinamis dan interaktif, bersama dengan HTML dan CSS. Fungsinya mencakup penambahan elemen interaktif, validasi formulir, pengambilan data dari server, dan pembuatan aplikasi web, aplikasi seluler, atau game berbasis web. 

 


 4. FrameWork

Framework adalah kerangka kerja yang menyediakan struktur dan komponen kode siap pakai untuk mempercepat dan menyederhanakan proses pengembangan aplikasi atau perangkat lunak. Fungsinya adalah sebagai fondasi yang tidak mengharuskan pengembang untuk membangun segalanya dari nol, serta membantu dalam hal keamanan, efisiensi, dan keteraturan kode. Framework hadir dalam berbagai jenis, seperti framework untuk pemrograman (misalnya Bootstrap, Laravel) dan framework untuk bisnis atau marketing. 

Untuk proyek besar, developer sering menggunakan framework seperti:

·         React: Dibuat oleh Facebook, cocok untuk aplikasi dinamis. Contoh: Instagram atau Facebook.

·         Angular: Dari Google, bagus untuk aplikasi enterprise. Contoh: Google Analytics.

·         Vue.js: Ringan dan fleksibel. Contoh: banyak situs e-commerce.

Referensi

1.     Mozilla Developer Network (MDN). HTML: HyperText Markup Language. Diakses dari:

2.     Mozilla Developer Network (MDN). CSS: Cascading Style Sheets.

3.     Mozilla Developer Network (MDN). JavaScript

4.       https://www.freecodecamp.org/learn/responsive-web-design/


Komentar

Posting Komentar

Postingan populer dari blog ini

Pengertian/Definisi Crypto Currency

Gambar
  APA ITU CRYPTOCURRENCY? Cryptocurrency  adalah sebutan untuk mata uang digital yang dapat digunakan untuk transaksi antarpengguna tanpa perlu melewati pihak ketiga. Jika dalam transaksi pada umumnya bank berperan sebagai pihak ketiga, dalam  cryptocurrency , tidak ada yang berperan sebagai perantara. Transaksi  cryptocurrency  berasal dari jaringan komputer yang menggunakan algoritma perhitungan tertentu. Perhitungan matematis ini disebut  cryptography  yang menggunakan teknologi blockchain. Bitcoin adalah jenis  cryptocurrency  pertama dan terbesar. PRINSIP CRYPTOCURRENCY Untuk lebih memahami  cryptocurrency , simak penjelasannya dalam setiap karakteristik berikut: Digital :  Cryptocurrency  adalah uang digital atau virtual, sehingga tidak memiliki wujud nyata layaknya uang koin atau uang kertas. Peer-to-peer :  Cryptocurrency  diteruskan dari pengirim kepada penerima secara online. Global :  Cryptocurrency ...
Baca selengkapnya

Keunggulan dan Kelemahan Cloud Computing

Gambar
Halo, teman-teman! Selamat datang di blog saya yang membahas dunia teknologi. Hari ini, kita akan membahas topik yang sedang hangat: cloud computing. Alih-alih mengandalkan server lokal, bisnis bisa mengakses sumber daya ini via internet. Cloud computing telah merevolusi cara kita bekerja, terutama di era digital ini. Namun, seperti halnya teknologi lainnya, cloud computing punya keunggulan dan kelemahannya sendiri. Mari kita bahas satu per satu agar Anda bisa memutuskan apakah ini cocok untuk bisnis atau proyek Anda. Saya akan jabarkan dengan jelas, berdasarkan fakta dan pengalaman umum.   Pengertian Cloud Computing Cloud computing adalah suatu perangkat teknologi komputer yang dapat mengubah internet menjadi data center. Sederhananya adalah suatu cara perangkat teknologi komputer yang bekerja sama dengan internet untuk melakukan aktifitas yang berhubungan dengan data, di mana data-data dari komputer akan disimpan kedalam Internet. Adanya layanan komputasi awan ini ...
Baca selengkapnya

Back-End : Definisi dan Contoh

Gambar
  APA ITU BACK-END? Di era digital ini, penggunaan  software  dan  website  terus berkembang. Untuk membangun sistem  software  dan  website  yang efektif dan dapat memenuhi kebutuhan pengguna, diperlukan  backend . Backend  adalah sistem yang menjadi bagian dari  server  sehingga tidak terlihat dan tidak dapat diakses oleh pengguna seperti halnya front-end.  Sebagian besar data atau sintaks  website  atau  software  disimpan di dalam sistem  backend   komputer, dan pengelolaan  backend  dilakukan oleh seorang  backend developer .  CONTOH BACK-END Bahasa pemrograman: Python Java PHP Ruby C# JavaScript (sering digunakan bersama  framework  Node.js) Framework : Django:  Berbasis Python untuk pengembangan web yang cepat dan efisien. Laravel:   Framework  berbasis PHP yang populer. S...
Baca selengkapnya