Pengembangan Perangkat Lunak dan Gim🎮

Kalau dilihat-lihat, sepertinya semua murid sudah bisa bikin website simpel dengan struktur seperti contohnya ada header, sidebar buat nampilin menu di kiri dan kalo sidebar di kanan buat iklan/advertisement, terus ada bagian konten di tengah-tengah serta dibawahnya ada footer. 

Penasaran bagaimana hasil dari beberapa murid di kelas PPLG-2?

>>>Nih coba liat deh hasil temen-temen kita👺...

 Widihh, keren-keren kan buat selevel anak kelas 10 yang baru mengenal dunia pemrograman bisa bikin dan hampir menyerupai website-website berita lainnya. Tapi... omong-omong kenapa pada bisa bikin website kayak gini ya? Penasaran kah??? 👀👀 Aku bakal review singkat materi materi selama 1 bulan ini ya.. CEKIDOTT!!!💢💢💢

Nah, aku bakal mulai dari yang paling awal dan mendasar dari hari pertama kita yaitu tentang "Website". Eitsss tapi jangan pada salah nangkap ya, ini materi dasar jadi kita ga langsung dikasih cara buat ngoding nya gitu kok, kan kalo belajar tuh enaknya santai dan jangan terburu-buru banget😢.

1. Website🎫

Karena review itu harusnya singkat, jadi gw pun juga bakal bikin singkat tapiii harus on point juga, nah website itu seperti gambaran yang tiap hari kita liat, website tuh kayak halaman tapi online buat beberapa situs yang biasanya kita lihat di chrome kita nih kids😻. Aku kasih contoh deh biar habis ini engga bingung karna kurang gambarannya.

Tuhh, yang paling biasa & umum ya website nya youtube. Nah balik ke poin penting nya, Website itu isinya ada Situs, Konten, Domain, Link(url), Landing Pages, Database, Blog, Hosting, Extension, serta beberapa bahasa pemrograman lainnya.

 Semua yang ada di papan tulis itu berhubungan semua sebagai penghubung & struktur sebuah website loh teman-teman, ok berikutnya akan aku beritahu lebih mendalam selepas ini🙆.

2. HTML🎨

Sebelum lanjut bahas HTML, ada funfact yang mesti diketahui dulu nih kids, hmmm... nungguin ya?? haha sorry sorry gais kelamaan, pokoknye HTML itu bukan bahasa pemrograman loh, dia itu sama sekali bukan bahasa pemrograman meskipun bentukan-nya mirip kayak coding, karena HTML itu cuman markup language atau bahasa penandaan yang terdiri dari kumpulan tag.

Mau lihat "Tag" di html itu kayak bagaimana? Nih CEKIDOT LG❗❗

↓

Diatas itu contoh kumpulan Tag biasa di HTML dan dibawah ini nih contoh materi colspan dan rowspan dengan sedikit sentuhan tangan kreatifitas dengan tema "FAKE FRIEND"💔.

Liat kann, ya gitu deh bedanya jadi semoga kalian-kalian yang baca ini ga salah ya pemahaman nya tentang HTML itu apa, nah singkatnya HTML itu bukan bahasa pemrograman melainkan cuman kumpulan tag untuk membuat sebuah website😎.

3. Bahasa Pemrograman✨

Bahasa pemrograman adalah sebuah instruksi untuk memerintah komputer, himpunan dari aturan sintaks dan semantik yang dipakai untuk mendefinisikan program komputer.

Programming Language itu ada banyak tapi aku akan kasih tau bahasa pemrograman paling umum serta fungsinya😄

• Javascript

Javascript ini itu bahasa yang paling populer di kalangan developer game/software. Sebenarnya, tidak mengherankan sih. Selain dipakai untuk mengubah tampilan website atau aplikasi, JavaScript juga bisa dipakai untuk menjalankan hal yang lebih canggih😳.

Kode Editor/Software: Visual Studio Code, Visual Studio, Sublime Text. Notepad++, Vim, Atom

Dapat digunakan untuk membuat aplikasi desktop & web app (aplikasi berbasis web).

• C#

Bujeed kita dah sampai ke bahasa pemrograman yang sering dipake banget nih coy😫, funfact di SMKN 1 saat ini bahasa C# dipelajarin pas pelajaran DPK serta ekskul SIOT buat bikin program nyalain LED serta bikin robot. Asik sampai sini bayangin nya aja dah keren banget kan fungsi dari C# nya😎😎.  
Di sisi lain, C# juga enggak butuh waktu lama untuk pemula memahami bahasa satu ini. Yuk kita mengenal bahasa ini lebih dalam serta liat hasil apa aja yang sudah aku buat pake bahasa ini.

👉Struktur dari program C# itu ada 3, yaitu:

1. Bagian Deklarasi Pustaka🙈

Ini adalah bagian paling atas dari program C#. Pada bagian ini, kita menuliskan pustaka (library) yang dibutuhkan dalam program.

2. Bagian Class🙉

Bahasa pemrograman C# adalah bahasa pemrograman yang menggunakan paradigma OOP (Object Oriented Programming) atau pemrograman berorientasikan objek.

Setiap kita membuat program C#, kita harus membungkus fungsi dan variabel di dalam class.

3. Bagian Fungsi🙊

Di bagian ini ya kids, kita bisa menuliskan fungsi-fungsi dari program.

Fungsi yang harus ada di dalam setiap program adalah fungsi Main().

Penulisan Statement dan Ekspresi💥

Penulisan statemen dan ekspresi dalam C# harus diakhiri dengan titik koma (;).

Penulisan Blok Kode💬

Blok kode di dalam C# dibungkus menggunakan kurung kurawal { ... }.

Penulisan Komentar💫

Komentar adalah teks yang tidak akan dieksekusi. Biasanya digunakan untuk menuliskan keterangan dan menon-aktifkan sebuah kode.

Komentar dalam C# ditulis dengan garis miring ganda dan garis miring bintang.

📃Input Tipe Data

• Int (Integer) nilai yang diinputkan merupakan angka 
• String nilai yang diinputkan merupakan charachter
   

Fungsi ReadLine() akan membaca teks yang kita ketik dalam satu baris (teks).

Well, pengenalan struktur dan lainnya dah cukup lengkap dan singkat kan guys? Mari kita ke bagian seru nya yaitu bikin 2 program C# 

Ini Input nya

↓

namespace ProjekSiapa

{

    public class Biodata

    {

        public static void Main(string[] args)

        {

            Console.WriteLine(" `````Biodata Diri`````");

            Console.WriteLine("Nama:Justin Aurelius Dani");

            Console.Write("Umur: ");

            Console.WriteLine(5*3);

            Console.WriteLine("Kelas: PPLG X 2");

            Console.WriteLine("Username IG: @shinjuku_jpn");

            Console.Write("Tanggal Lahir: ");

            Console.Write(117/9);

            Console.Write("/");

            Console.Write(6*6/3-6);

            Console.Write("/");

            Console.Write(2022 - 15);

        }

    }

}

Ini Output nya

↓

Next program yang beneran jalan nih kids (kita pake software .NET Fiddle)👊

Okeiii, sampai sini dah lihat kan gimana

gambaran dari hasil program yang bisa dibuat

oleh bahasa pemrograman C# (C Sharp)

tentunya kece abiss🤑🤑, kita lanjut ya ke

bahasa pemrograman ketiga🐳.

• CSS

✅Yoi kita dah nyampe bahasa pemrograman

yang ketiga yaitu CSS(Cascading Style Sheet).

Well basically CSS itu berhubungan erat dengan

HTML serta Javascript sebagai pembuat atau

pilar suatu website, HTML yang menyusun struktur

web,CSS yang mendesign dan memperindah

suatu website, dan Java-script yang membuat

website menjadi lebih interaktif dan bergerak😝.

"Think of a website as a human body, HTML

is the skeleton, CSS is the skin, Javascript

is the muscles and organs that makes the

whole thing operate"-Josh Cafolla

Kenapa bisa sepert itu? ya simpel karna css memang dirancang sedemikian itu, semua web pastinya ada ketiga hal tersebut, tampilan yang memanja mata, tidak membuat website yang kosong melompong, menambah warna, sarana kita untuk mengatur seluruh komponen di html sesuai dengan keinginan kita😏.

Ya ya ya kita langsung aja coba liat css itu kayak bagaimana ya, dari materi inti sampai hasil nya, stay tuned terus yaa!🙀

📝 Konsep layout halaman web

Dengan CSS kita dapat memodifikasi layout website (front-end)/halaman depan dengan mudah, orang yang membuat/mendesain layout disebut Layouter dan kegiatan tersebut dinamakan proses Layouting. Dalam proses layouting dalam CSS kita dapat menggunakan Flexbox dan Grid dalam mengatur posisi/tata letak elemen pada web. Flexbox dan Grid sama-sama berfungsi untuk mengatur tampilan sebuah halaman web menjadi lebih terstruktur dan rapi.

⚙️ Jenis-jenis layout halaman web

       ✔️ Fixed Layout 

Dalam penggunaan Fixed Layout lebar tampilan web menjadi tetap (fixed), mungkin terlihat seperti tidak responsive jika dibuka dalam tampilan mobile.

       ✔️ Fluid Layout

Layout ini adalah yang paling banyak disukai oleh para pembuat website, karena dalam mendesain tampilan ini, persentase lebar yang dirancang untuk elemen web diatur sedemikian rupa agar bekerja dengan baik pada berbagai ukuran layar.

       ✔️ Responsive Layout

Jenis layout ini, merupakan penggabungan dari Fixed Layout dan  Fluid Layout, dimana seluruh elemen dalam web seperti, teks, gambar, grid, margin, dan padding, dapat menyesuaikan sendiri pada resolusi layar pengunjung.

Nah 3 hal tadi singkatnya itu adalah beberapa jenis layout yang membuat status website menjadi seperti (statis) atau ya kaku dan tidak bisa dirubah, terus layout fluid yang bisa membantu para pembuat website untuk merancang omponen berjalan sedemikian rupa secara otomatis dan membuat website menjadi dinamis🎲.

Kita lanjut ke cara menulis program css, ada 3 yaitu:

✍️ Metode stylesheet

• Inline Style

  Inline Style adalah cara untuk memberi style pada tag html yang di seleksi, tidak secara umum. Pokoknya nulis nya di dalam tag(<>) jadi ga ampe keluar dari tag nya.
  

• Internal Style

Internal Style adalah cara kita memberi style pada tag-tag html yang di awali sintaks.

 

• External Style

          External Style adalah menkoneksikan file satu dengan file lainnya. Seperti contoh terdapat dua file, yaitu

Kalo udah pada bisa identifikasi jenis-jenis Layout nya, dan macam-macam gaya penulisan CSS. Kita langsung kasih liat ajalah kali ya CSS itu kalo dipakai secara maksimal oleh kita bisa sampai mana nih🤗.

Xixixi, bagaimana kids dengan review kali ini? cukup menarik dan bermanfaat bukan🥳, woiya jelas pasti dong. Nahh karena review nya akan berakhir disini, saya ucapkan terimakasih banyak telah datang ke blog ini. Nikmati dan tunggu Blog selanjutnya, Bye-Bye👋👋