Apa itu TypeScript?

TypeScript adalah bahasa pemrograman yang bersifat statically-typed, yang berarti Kita harus mendeklarasikan tipe data dari suatu variabel sebelum menggunakannya. Hal ini memungkinkan Kita untuk menangkap kesalahan kode pada tahap kompilasi, sebelum aplikasi Kita dijalankan. TypeScript juga memungkinkan Kita untuk menggunakan fitur-fitur modern JavaScript, seperti module, async/await, dan lainnya.

Instalasi TypeScript

Langkah pertama adalah menginstal TypeScript. Kita dapat melakukannya dengan Node Package Manager (NPM). Pastikan Kita telah menginstal Node.js sebelum melanjutkan.

Buka terminal Kita dan ketik perintah berikut untuk menginstal Typescript secara global di komputer kita:

npm install -g typescript

Menulis Kode TypeScript

Sekarang, Kita siap untuk menulis kode TypeScript. Buat berkas TypeScript baru dengan ekstensi .ts. Misalnya, main.ts.

// main.ts
function greeting(name: string) {
    return `Hello, ${name}!`;
}
const person = "John";
console.log(greeting(person));

Mengkompilasi Kode TypeScript

Untuk mengkompilasi kode TypeScript ke JavaScript, gunakan perintah tsc (TypeScript Compiler). Buka terminal dan ketik:

tsc main.ts

Ini akan menghasilkan berkas JavaScript yang di kompilasi dari file ts kita tadi menjadi javascript dengan nama main.js.

Menjalankan Kode

Sekarang, Kita dapat menjalankan berkas JavaScript yang telah dihasilkan. Gunakan perintah:

node main.js

Setelah kita menjalankan main.js maka akan menghasilkan output. fungsi greeeting tadi

Typescrip mempunyai beberapa fitur yang memudahkan kita dalam mengelola sebuah project.

Type

Salah satu fitur paling kuat dari TypeScript adalah kemampuan untuk mendefinisikan tipe data. Misalnya, Kita dapat mendefinisikan tipe data objek seperti ini:

type Person = {
    name: string;
    age: number;
};

const john: Person = {
    name: "John",
    age: 30,
};

Interface

Kita juga dapat menggunakan interface untuk mendefinisikan tipe data objek:

interface Person {
    name: string;
    age: number;
}

const john: Person = {
    name: "John",
    age: 30,
};

Fungsi

Dalam TypeScript, Kita dapat mendefinisikan tipe data parameter dan nilai kembalian dari suatu fungsi:

function add(a: number, b: number): number {
    return a + b;
}

Class

TypeScript mendukung pembuatan kelas dengan tipe data yang jelas:

class Person {
    constructor(public name: string, public age: number) {}
}

const john = new Person("John", 30);

Module

Kita dapat menggunakan modul untuk memecah kode Kita menjadi berkas-berkas yang lebih kecil:

// di berkas util.ts
export function double(number: number): number {
    return number * 2;
}

// di berkas main.ts
import { double } from "./util";

console.log(double(5));

Inisiasi dan config Sebuah Project Typescript

Kita akan membuat sebuah project dan konfigurasi Typescript. Jalankan perintah berikut untuk inisialisasi projek

mkdir typescript-project
cd typescript-project
npm init -y

Instal TypeScript

Instal TypeScript sebagai dependensi pengembangan di proyek Kita:

npm install typescript --save-dev

Buat Berkas Konfigurasi TypeScript

Buat berkas konfigurasi TypeScript dengan nama tsconfig.json. Ini adalah berkas konfigurasi yang akan digunakan oleh TypeScript compiler.

npx tsc --init

Isi tsconfig.json kira-kira seperti dibawah:

{
  "compilerOptions": {
    "target": "ES6",
    "module": "CommonJS",
    "outDir": "./dist",
    "rootDir": "./src"
  },
  "include": ["src/**/*.ts"],
  "exclude": ["node_modules"]
}

Buat Direktori src

Buat direktori src di dalam proyek Anda untuk menyimpan berkas TypeScript.

mkdir src

Buat Berkas TypeScript Pertama

Buat berkas TypeScript pertama dalam direktori src. Contoh:

// src/main.ts
function greeting(name: string) {
  return `Hello, ${name}!`;
}

const person = "John";
console.log(greeting(person));

Jalankan TypeScript Compiler

Jalankan TypeScript compiler untuk mengompilasi berkas TypeScript ke JavaScript. Maka otomatis akan dibuatkan sebuah folder dist untuk menampung hasil kompilasi kode typescript kita:

npx tsc

Menjalankan Kode

Kita dapat menjalankan berkas JavaScript hasil kompilasi dengan perintah:

node dist/main.js

Dalam tutorial ini, Kita telah belajar pemrograman TypeScript dari dasar. Kita telah memahami cara menginstal TypeScript, menulis kode, mendefinisikan tipe data, menggunakan interface, bekerja dengan fungsi dan kelas, serta mengatur modul.

TypeScript adalah alat yang kuat untuk pengembangan aplikasi web yang aman dan skalabel. Selamat belajar lebih lanjut!