Belajar javascript dasar untuk pemula – Part 1

Share to

Belajar Javascript dasar untuk pemula

belajar javascript dasar untuk pemula – Aplikasi berbasis Web (Web-based application) menurut Janner Simarmata pada bukunya adalah apikasi yang dijalankan melalui browser. Aplikasi seperti ini pertama kali dibangun hanya dengan mengunakan bahasa yang disebut HTML (HyperText Markup Language) dan protokol yang digunakan dinamakan HTTP (HuperText Transfer Protocol) aplikasi web dapat berjalan di semua sistem operasi selama komputer terkoneksi dengan server.

Pada pertemuan pertama ini, kita akan mereview pengetahuan kalian tentang Pemrograman Berorientasi Objek Javascript yang ada pada MODUL-1 yaitu:

    • Aplikasi Web
    • Tahapan Persiapan
    • HTML
    • CSS
    • Javascript

Aplikasi Web
Berdasarkan pemrosesan, aplikasi web dapat dibagi menjadi dua bagian yaitu :

  • Pemrosesan d isisi server ( server side )
  • Pemrosesan di sisi server berarti kode yang Menyusun aplikasi web diproses di sisi server,
  • Pemrosesan di sisi client

Pemrosesan di sisi client berarti kode yang Menyusun aplikasi web diproses di sisi client ( oleh browser ).

belajar javascript dasar untuk pemula
Pemrosesan di sisi server

Penjelasan:

  1. Client meminta file PHP
  2. Web server mengambil file PHP
  3. File PHP dikirim ke mesin PHP
  4. File PHP diterjemahkan ke HTML atau format lain
  5. HTML dikirim ke Client
  6. Browser menterjemahkan HTML/format lain ke tampilan layer monitor user
lapisan web
Tiga lapisan pembentuk aplikasi web

Penjelasan :

  1. Lapisan konten digunaka untuk mengurusi isi halaman web. Tugas ini diserahkan ke HTML.
  2. Lapisan presentasi ditunjuk untuk menangani tampilan halaman web. Tugas ini diberikan kepada CSS.Sebagai konsekuensinya, semua perintah ada di HTML
  3. Lapisan perilaku dikhususkan untuk mengatur tindakan-tindakan yang dikenakan di halaman web. Hal ini diserahkan ke javascript. Melalui javascript inilah dimungkinakan menentukan aksi yang akan dilakukan, misalnya apabila suatu tombol di klik. Baca Juga Bahasa Pemrograman Terkini yang harus dipelajari

HTML

HTML5 adalah standar baru untuk HTML yang hadir setelah kemunculan HTML4. HTML adalah bahasa markup yang paling sering digunakan dalam pembuatan website.

  1. Cara Kerja HTML

Pada dasarnya, HTML digunakan untuk menunjukkan elemen-elemen yang terdapat pada suatu halaman website. Setiap elemen ditunjukkan dengan tag <> (pembuka) dan </> (penutup).

  1. Tag HTML

Tag adalah sebauh penanda awalan dan akhiran dari sebuah elemen di HTML. Tag dibuat dengan kurung siku (<…>), lalu di dalamnya berisi nama tag dan kadang juga ditambahkan dengan atribut.

Nama Tag Keterangan / Kegunaan
<!DOCTYPE> Tag untuk menentukan tipe dokumen
<html> Tag untuk membuat sebuah dokumen HTML
<title> Tag untuk membuat judul dari sebuah halaman
<body> Tag untuk membuat tubuh dari sebuah halaman
<h1> to <h6> Tag untuk membuat heading
<p> Tag untuk membuat paragraf
<br> Memasukan satu garis baru
<hr> Tag untuk membuat garis horizontal
<!–…–> Tag untuk membuat komentar

Contoh 1

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <p>......</p>
</body>
</html>

CSS

CSS adalah kode yang digunakan untuk mengatur tampilan halaman web. CSS adalah bahasa Cascading Style Sheet dan biasanya digunakan untuk mengatur tampilan elemen yang tertulis dalam bahasa markup, seperti HTML. CSS berfungsi untuk memisahkan konten dari tampilan visualnya di situs.

CSS menggunakan bahasa Inggris sederhana berbasis syntax yang dilengkapi dengan sekumpulan rule yang mengaturnya. Seperti yang telah kami sebutkan sebelumnya, HTML tidak dibuat untuk menerapkan elemen style, hanya markup halaman saja. HTML dirancang semata-mata untuk mendeskripsikan konten. Sebagai contoh: <p>This is a paragraph.</p>.

Satu yang menjadi pertanyaannya sekarang, bagaimana caranya style paragraf? Struktur syntax CSS cukup sederhana. Struktur ini memiliki selector dan declaration block. Pilih elemen yang diinginkan, kemudian deklarasi (declare) yang harus Anda lakukan terhadap elemen tersebut.

<style>
p {
 color: blue;
 font-weight: bold;
}
</style>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style >
        p {
         color: blue;
         font-weight: bold;
        }
        </style>
   </head>
<body>
    <p>Belajar HTML</p>
</body>
</html>

JavaScript

Javascript adalah Bahasa skrip yang bisa diletakkan besama kode HTML untuk menentukan suatu aksi. Saat ini JavaScript merupakan bahasa pemrograman yang paling banyak digunakan dalam pengembangan website, aplikasi, game, dan lainnya. Bahkan, produk dari perusahaan besar seperti Google, Facebook, dan LinkedIn juga telah menggunakan JavaScript.

  1. Cara Kerja JavaScript di sisi Client

Sebelumnya, kode JavaScript dapat dibuat dalam satu halaman HTML Jadi, ketika halaman dibuka, kode akan berjalan secara otomatis. Selain itu, kode bahasa pemrograman ini juga dapat dibuat pada file terpisah dengan ekstensi .js. Kemudian file tersebut disisipkan pada kode HTML. Kode akan ditulis dengan menggunakan tag <script> dan teks atribut JavaScript. Berikut contohnya:

<script type = “text/javascript”>
Masukkan kode JavaScript
</script>
  1. Cara Kerja JavaScript di sisi Server

Di sisi server, bahasa pemrograman ini lebih banyak diimplementasikan untuk kebutuhan database. Cara kerjanya pun hampir sama dengan bahasa pemrograman sisi server lainnya, seperti C# atau Java. Namun, hal yang membedakan adalah JavaScript bekerja secara non-blocking. Artinya. Ketika program berjalan, program tersebut tak akan berhenti pada satu proses saja. Sistem akan mulai menyiapkan perintah berikutnya.

Jika proses selanjutnya ternyata diketahui tidak memiliki output, proses tersebut bisa langsung dijalankan bersamaan dengan proses yang masih berjalan. Jadi, proses pengolahan data bisa dilakukan jauh lebih efektif.

MENGECEK PEMAHAMAN

Jawablah latihan ini secara singkat dan jelas yang telah dilampirkan pada kuliah hari ini sesuai dengan disiplin ilmu kita.

  1. Apa yang dimaksud dengan Web Browser
  2. Apa yang dimaksud dengan Web Server
  3. Apakah Aplikasi Web bisa support di semua platform
  4. Praktikan semua kode diatas dan tampilkan hasilnya

Download Modul : Dowload Modul

Sumber :w3school

Related Posts

Fakta Menarik tentang Gerhana Matahari Hibrida

Share to

Share toPengertian Gerhana Matahari Hibrida. Fakta Menarik Gerhana Matahari Hibrida – Gerhana matahari hibrida adalah fenomena alam di mana bulan tampak lebih kecil dari matahari dan hanya…

Tips Excel! Cara Membuat Pivot Table dengan Mudah Beserta Contohnya

Share to

Share toPengertian Pivot table Cara Membuat Pivot Table dengan Mudah adalah salah satu fitur di program spreadsheet seperti Microsoft Excel, yang memungkinkan pengguna untuk mengolah dan menganalisis…

Cara Menggunakan Conditional Formating Dalam Excel

Share to

Share toCara Menggunakan Conditional Formating Dalam Excel Conditional formatting Dalam Excel adalah fitur di Excel yang memungkinkan Anda mengubah format sel berdasarkan nilai atau kondisi tertentu. Berikut…

Mengenal fungsi Statistik dalam Ms Excel

Share to

Share toMengenal fungsi Statistik dalam Ms Excel Mengenal fungsi Statistik dalam Ms Excel – Fungsi statistik dalam Excel adalah sekumpulan formula atau fungsi matematis yang dirancang khusus…

Cara Membuat Mail Marge di Word Terbaru

Share to

Share toCara membuat mail marge di Word Mail merge (penggabungan surat) adalah fitur dalam Microsoft Word yang memungkinkan pengguna untuk menggabungkan informasi dari sumber data, seperti spreadsheet…

Contoh VLOOKUP dan HLOOKUP

Share to

Share toContoh VLOOKUP dan HLOOKUP VLOOKUP dan HLOOKUP adalah dua fungsi dalam program spreadsheet yang digunakan untuk mencari nilai dalam sebuah tabel. Perbedaan utama antara kedua fungsi…