Ilustrasi: https://www.niagahoster.co.id/blog/apa-itu-framework/

Terakhir diperbarui: 2024-02-18

Penulis: Tim Pengajar

Apa itu framework ?

Framework secara bahasa dalam kamus Oxford memiliki beberapa pengertian, yaitu:

[1] the parts of a building or an object that support its weight and give it shape.

[2] a set of beliefs, ideas or rules that is used as the basis for making judgements, decisions, etc.

Dari pengertian nomor satu menjelaskan bahwa framework adalah bagian dari sebuah bangunan atau sebuah objek yang mendukung bobot dan memberikan suatu bentuk. Pengertian dari nomor dua menjelaskan bahwa framework adalah seperangkat panutan, ide atau aturan-aturan yang digunakan sebagai dasar untuk membuat hukum, keputusan, dsb.

Framework (kerangka kerja) adalah sebuah kerangka program yang digunakan untuk membantu developer dalam mengembangkan kode secara konsisten. Adanya framework developer bisa mengurangi jumlah bug pada aplikasi yang dibuat. Karena, fungsi dan variabel yang sudah tersedia di dalam komponen framework tersebut.

Sebelum belajar lebih jauh tentang framework, ada baiknya jika Anda memahami pengertian framework terlebih dahulu. Sesuai dengan namanya, framework adalah kerangka kerja yang digunakan untuk mengembangkan aplikasi berbasis desktop atau aplikasi berbasis website.

Framework sengaja diciptakan untuk membantu developer mengembangkan aplikasi lebih cepat serta tersusun dan terstruktur. Dengan menggunakan framework Anda akan lebih mudah untuk membuat aplikasi, karena Anda hanya perlu menyusun komponen-komponen pemrograman yang sudah jadi. Sehingga developer dan programmer tidak perlu melakukan koding program yang diulang-ulang.

Apa yang Anda akan pelajari

Di codelab ini Anda akan mempelajari tentang:

Apa yang Anda perlu persiapkan

Pengetahuan yang Anda harus dimiliki

Apa itu Modern JavaScript?

Modern JavaScript adalah istilah yang merujuk pada versi terbaru dan lebih canggih dari bahasa pemrograman JavaScript. Berikut beberapa konsep penting dalam JavaScript modern (ES6):

  1. Variabel let dan const:

Contoh penggunaan:

let greeting = "";
const newUser = true;
if (newUser) {
    greeting = "Senang bertemu denganmu";
} else {
    greeting = 'Selamat datang kembali';
}
// newUser tidak bisa di-reassign
console.log(greeting);

  1. Template Literals:

Contoh penggunaan:

const name = "Alice";
const message = `Halo, ${name}! Apa kabar?`;
console.log(message);

  1. Strict Mode:

Contoh penggunaan:

"use strict";
// Kode JavaScript ketat berada di sini

  1. Framework JavaScript Modern:

Contoh penggunaan:

// Contoh penggunaan React
import React from 'react';
// Komponen React berada di sini

Semakin baik kita memahami JavaScript, semakin baik kita memahami Framework JavaScript.

Instalasi Git

Jika Git belum terpasang pada komputer Anda, silakan unduh di web resminya: https://git-scm.com/ kemudian lakukan instalasi seperti biasa sesuai langkah-langkah pada proses install aplikasi.

Verifikasi Hasil Instalasi Git

Jika telah berhasil melakukan install Git, silakan verifikasi dengan membuka Command Prompt (CMD) atau Git Bash atau Terminal sesuai dengan sistem operasi Anda. Lalu ketikkan perintah berikut:

git --version

Konfigurasi Akun Git di Sistem Operasi

Jika telah berhasil melakukan instalasi Git, maka perlu diset akun secara global untuk mengidentifikasi bahwa akun yang ingin digunakan adalah milik Anda. Lakukan perintah berikut pada CMD, Git Bash atau Terminal.

  1. Ketik perintah git config --global user.name "username Anda" untuk menset username Anda secara global pada sistem.
  2. Lalu perintah git config --global user.email "email@email.com" isi sesuai email yang Anda gunakan di akun GitHub.

Instalasi Visual Studio Code (VS Code)

Silakan unduh Visual Studio Code jika belum terinstal di komputer Anda melalui tombol berikut. VS Code ini nanti akan digunakan setiap kali praktikum untuk mengembangkan aplikasi. Jika pada komputer Anda sudah terpasang VS Code, Anda dapat melewati langkah ini.

Unduh VS Code

Instalasi Node.js

Selanjutnya, Anda perlu memasang NodeJS sudah termasuk NPM (Node Package Manager). Tool ini akan selalu digunakan untuk praktikum dalam satu semester ke depan.

Unduh NodeJS (include npm)

Apa itu Node.js ?

Menurut tautan ini (https://nodejs.org/en/about) yaitu "As an asynchronous event-driven JavaScript runtime, Node.js is designed to build scalable network applications".

Dalam pemrograman komputer, pemrograman event-driven adalah paradigma pemrograman di mana aliran program ditentukan oleh peristiwa eksternal (external event). Event umumnya dapat berupa UI (user interface) seperti dari mouse, keyboard, touchpad, touchscreen, sensor, dan sebagainya.

Nodejs ini menggunakan bahasa pemrograman JavaScript yang bersifat event-driven asinkronus dan dirancang untuk membangun aplikasi berbasis jaringan yang bersifat scalable.

Apa itu NPM (Node Package Manager) ?

NPM (Node Package Manager) adalah pengelola package JavaScript yang merupakan bawaan dari Node.js. Dengan NPM, Anda dapat:

NPM memiliki dua fungsi utama:

  1. Sebagai Repository: NPM berfungsi sebagai platform tempat orang dapat berbagi package JavaScript buatan mereka di npmjs.org. Anda juga dapat berkontribusi dengan package buatan Anda sendiri. Dengan fungsi ini, Anda bisa mendownload package yang diperlukan untuk mendukung proyek Anda kapan saja, tanpa harus membangun fitur dari nol.
  2. Sebagai Command Line Interface (CLI): NPM menyediakan antarmuka baris perintah (mirip dengan Command Prompt di Windows atau Terminal di Linux) untuk mengelola, mengunduh, dan mengunggah package JavaScript.

Jadi, NPM memudahkan Anda dalam mengelola package dan mempercepat proses pembuatan aplikasi.

Apa saja yang perlu dipersiapkan?

Setiap mahasiswa selesai melaksanakan praktikum, wajib membuat laporan tertulis berupa file README.md (disertai bukti screenshoot hasil praktik) yang merupakan bagian dari project pada tiap pertemuan. Kemudian di push ke akun GitHub masing-masing dengan nama repository yang disepakati oleh dosen pengampu.

Selanjutnya, link repository tersebut dikumpulkan ke dosen sesuai media yang disepakati.

Anda dapat membuat repository baru melalui tautan ini: https://github.com/new

Perhatikan gambar di bawah ini untuk membuat repository baru.

Selamat Anda telah menyelesaikan Codelab ini sebagai langkah awal untuk pengetahuan tentang dasar-dasar bahasa pemrograman JavaScript.

Pada codelab berikutnya, Anda akan diperkenalkan dengan framework ReactJS. Dalam framework itu tentu menggunakan bahasa pemrograman JavaScript.

Apa selanjutnya?

Silakan cek beberapa sumber belajar lainnya...

Referensi