Introduction

Present by Eduwork.id
Website

● Website adalah sebuah kumpulan halaman pada

suatu domain di internet yang menyajikan
informasi
● Jenis jenis website : company profile, toko online,
blog, web portal, search engine, forum, sosial
media, dll
● Manfaat website : memperluas jangkauan
promosi, media tanpa batas, wadah komunitas,
dll
Cara Kerja Website

Ada 2 bagian utama dalam aplikasi web, yaitu yang pertama adalah sisi client dan yang kedua ialah sisi server.

● Client dapat mengakses aplikasi web melalui web browser, seperti mozilla firefox, google chrome, internet explorer,
dan web browser lainnya.
● Server adalah perangkat komputer dengan spesifikasi yang bagus dan digunakan untuk menyimpan aplikasi web
beserta database server yang siap untuk diakses oleh client.
Perbedaan Localhost Dan Web Hosting

Localhost (Website offline)

● Localhost memiliki server yang disebut sebagai server offline.

● Kenapa disebut sebagai server offline? Hal ini dikarenakan setiap data website yang dimasukkan kedalam server ini
tidak bisa untuk diakses dari luar.

Web Hosting (Website Online)

● Web hosting atau bisa disebut sebagai server online merupakan server yang digunakan dalam menyimpan data-data
dari sebuah website yang telah dikembangkan pada server localhost.
● Website dapat diakses user manapun melalui internet.
File Manager Offline (Lokal) File Manager Online (Web Hosting)
Database

Database atau basis data adalah kumpulan data yang dikelola sedemikian rupa berdasarkan ketentuan tertentu yang saling
berhubungan sehingga mudah dalam pengelolaannya. Melalui pengelolaan tersebut pengguna dapat memperoleh
kemudahan dalam mencari informasi, menyimpan informasi dan membuang informasi.

Macam Macam Database

Server Database Offline / Local Server Database Online
Cara Kerja Database
Aplikasi yang dibutuhkan :

Web Server - Untuk running website Text Editor - Untuk membuat Website

(xampp) (wamp) (sublime) (visual studio code) (notepad++)

Pengertian Web Server

● Sebuah software yang memberikan layanan berupa data

● Perangkat yang menyimpan dan mengirimkan konten website
● Berfungsi untuk menerima permintaan HTTP atau HTTPS dari klien atau kita kenal dengan web browser
● Terdapat 2 jenis web server : online dan offline (lokal komputer)
Manfaat Web Server

● Menjalankan sebuah website

● Menampung file file project
● Menampung database
● Melakukan pemeriksaan terhadap sistem security
● Menyediakan data berdasarkan request
Pengertian Text Editor

Text Editor adalah suatu software aplikasi atau suatu program komputer yang memungkinkan user untuk membuat,
mengubah atau mengedit file teks yang ada berupa plain text.
Manfaat Text Editor
● Membantu kita untuk melihat stuktur folder file
● Mempermudah menghapal syntax karena dan source code
terdapat fitur autocomplete

● Mencari kata pada sebuah file ataupun folder

Cara menyusun project di localhost
Cara running project di localhost

Cara membuka database di localhost

HTML
Present by Eduwork.id
Latar Belakang

HTML merupakan sebuah dasar ataupun pondasi bahasa pemrograman sebuah web page, HTML muncul sebagai standar
baru dari kemajuan dan berkembangnya internet.

Deskripsi

HTML adalah singkatan dari Hypertext Markup Language, yaitu bahasa markup standar untuk membuat dan menyusun
halaman dan aplikasi web. Anda bisa menggunakan bahasa markup ini untuk bagian paragraf, heading, maupun link pada
suatu web page.

Manfaat

● Membuat halaman web.

● Menampilkan berbagai informasi di dalam sebuah browser Internet.
● Membuat link menuju halaman web lain dengan kode tertentu (hypertext).
CREATE FILE HTML
TUGAS

Silahkan buat beberapa file HTML dalam 1 folder

TAG HTML
MEMBUAT MENU
MEMBUAT FORM
TUGAS
CSS
Present by Eduwork.id
Latar Belakang

Cascading Style Sheet atau lebih sering disebut dengan istilah CSS merupakan salah satu dokumen website yang bertujuan
untuk mengatur gaya (style) tampilan website.

Deskripsi

CSS adalah kumpulan perintah yang digunakan untuk menjelaskan tampilan sebuah halaman situs web dalam mark-up
language. Salah satu contoh bahasa mark-up paling populer adalah HTML yang tergolong sebagai bahasa pemrograman
standar dan lazim digunakan dalam pembuatan halaman web.

Manfaat

CSS dipakai untuk mendesain halaman depan atau tampilan website (front end). CSS menangani tampilan dan ‘rasa’ dari
halaman website.
INLINE, INTERNAL,
EXTERNAL
ATRIBUT CSS
TUGAS

Silahkan buat file HTML seperti tampilan di bawah ini :

https://www.instagram.com/
BOOTSTRAP
Apa itu Bootstrap ?

Bootstrap adalah framework open-source khusus front end

yang awalnya dibuat oleh Mark Otto dan Jacob Thornton
untuk mempermudah dan mempercepat pengembangan
web di front end.

https://getbootstrap.com/
TUGAS

Memasukkan bootstrap pada tugas yang membuat halaman di materi HTML

MYSQL
Present by Eduwork.id
Deskripsi

MySQL adalah sebuah DBMS (Database Management System) menggunakan perintah SQL (Structured Query Language)
yang banyak digunakan saat ini dalam pembuatan aplikasi berbasis website. MySQL dibagi menjadi dua lisensi, pertama
adalah Free Software dimana perangkat lunak dapat diakses oleh siapa saja. Dan kedua adalah Shareware dimana
perangkat lunak berpemilik memiliki batasan dalam penggunaannya.

Manfaat

Secara garis besar, fungsi dari MySQL adalah untuk membuat dan mengelola database pada sisi server yang memuat
berbagai informasi dengan menggunakan bahasa SQL. Fungsi lain yang dimiliki adalah memudahkan pengguna dalam
mengakses data berisi informasi dalam bentuk String (teks), yang dapat diakses secara personal maupun publik dalam web.

Aplikasi yang dibutuhkan

TYPE DATA DAN
PRIMARY
Pengertian Primary Key
Primary key adalah suatu nilai dalam basis data
yang digunakan untuk mengidentifikasi suatu baris
dalam tabel. Nilai dari primary key adalah unik.

sedangkan secara sederhananya, primary key dapat

diartikan sebagai kolom yang berisi nilai unik,
berfungsi sebagai identitas untuk membedakan
setiap record yang ada pada tabel.
TUGAS

Silahkan buat beberapa table dalam 1 database.

RELASI
TUGAS

Deskripsikan relasi relasi yang ada pada database yang sudah dibuat sebelumnya.
FOREIGN KEY
Add Foreign Key
TUGAS

Buatlah foreign key pada database yang sudah dibuat.

QUERY CRUD
Query Insert
Query Update
Query Delete
TUGAS

Buatlah query untuk create, update dan delete. Masing masing 5 buah query.
QUERY
MENAMPILKAN DATA
TUGAS

Buatlah 15-20 macam macam query untuk menampilkan data.

MACAM MACAM
JOIN
TUGAS

Buatlah 5 macam macam query join untuk menampilkan data.

PHP
Present by Eduwork.id
Latar Belakang

PHP diciptakan oleh Rasmus Lerdorf seorang pemrogram C, dan digunakan untuk mencatat jumlah pengunjung pada
homepage-nya. Pada awal tahun 1995 dirilis PHP/FI (Form Interpreter) yang memiliki kemampuan dasar membangun
aplikasi web, memproses form dan mendukung data mySQL

Deskripsi

PHP adalah singkatan dari "PHP: Hypertext Prepocessor", yaitu bahasa pemrograman yang digunakan secara luas untuk
penanganan pembuatan dan pengembangan sebuah situs web dan bisa digunakan bersamaan dengan HTML.

Manfaat

Fungsi PHP secara umum ialah untuk mengakses layanan Web dan mengubah halaman HTML statis menjadi halaman
dinamis. Memanfaatkan fungsi PHP dengan baik akan otomatis bisa mengembangkan situs web statis atau situs web.
Sebagai bahasa pemrograman yang biasanya diterapkan untuk membuat website.
SINTAKS DASAR
TUGAS

Buat sebuah informasi text yang diberi desain pada halaman html, dimana informasi text tersebut adalah variable dari php
OPERATOR
TUGAS

Buatlah file php untuk menghitung 5 macam jenis bangun datar dan 3 macam jenis bangun ruang.
KONDISI
TUGAS

Buat kondisi tanggal lahir yang akan memberikan output zodiak

SWITCH CASE
TUGAS

Buat kondisi tahun lahir yang akan memberikan output shio

LOOPING
TUGAS

Mencetak data tanggal berurutan menggunakan looping

ARRAY
TUGAS

Tampilkan data dari array, menggunakan looping.

FUNCTION
TUGAS

Membuat 5 function untuk menghitung rumus rumus bangun ruang dan bangun datar.
Javascript
Present by Eduwork.id
Latar Belakang

Javascript diciptakan selama 10 hari saat bulan Mei 1995 oleh Brendan Erich, yang bekerja di Netscape (sekarang Mozilla) .
Sebelum bernama Javascript, ia terlebih dahulu dinamai Mocha dan selanjutnya pada September 1995 namanya diubah
kembali menjadi Livescript. Hingga pada Desember 1995 dinamai menjadi Javascript sejak lisensinya di miliki Sun

Deskripsi

JavaScript adalah bahasa pemrograman yang digunakan dalam pengembangan website agar lebih dinamis dan interaktif.
Kalau sebelumnya kamu hanya mengenal HTML dan CSS, nah sekarang kamu jadi tahu bahwa JavaScript dapat
meningkatkan fungsionalitas pada halaman web.
PENGENALAN
TUGAS

Menampilkan macam macam function di javascript menggunakan parameter.

LOOPING
TUGAS

Explore macam macam looping lainnya

JQeury
Present by Eduwork.id
ELEMEN HTML
TUGAS

Buatlah sebuah form html, dimana si button akan tetap disable ketika form inputan dari html belum diisi / masih kosong.
CONTOH PLUGIN
https://datatables.net/manual/installation
TUGAS

Buat 2 datatable
WEB Dinamis Simple
Present by Eduwork.id
CONNECT
TUGAS

Silhakan coba buatlah file connection dan script query untuk menampilkan data.
- INDEX
- CREATE
- UPDATE
- DELETE
TUGAS

Buatlah WEB CRUD pada database yang telah dibuat.

Tugas Besar
Present by Eduwork.id
TUGAS : Membuat web dinamis katalog sederhana, lengkap dengan bagian CRUD nya.