{"id":25606975,"url":"https://github.com/panntod/learn-typescript","last_synced_at":"2026-03-15T20:51:40.537Z","repository":{"id":221509456,"uuid":"754589787","full_name":"panntod/Learn-Typescript","owner":"panntod","description":"repository contains the typescript implementation of the sales-ticket school module","archived":false,"fork":false,"pushed_at":"2024-04-04T12:32:00.000Z","size":90,"stargazers_count":4,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-27T03:01:31.253Z","etag":null,"topics":["express","mysql","rest-api","sequelize","ts-node","typescript"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/panntod.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2024-02-08T11:30:10.000Z","updated_at":"2024-04-30T07:42:19.000Z","dependencies_parsed_at":"2024-04-04T07:25:36.903Z","dependency_job_id":"35cacc70-d9de-4924-8b1c-e85f68cdd49e","html_url":"https://github.com/panntod/Learn-Typescript","commit_stats":null,"previous_names":["panntod/sales-ticket","panntod/belajar-typescript","panntod/learn-typescript"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/panntod%2FLearn-Typescript","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/panntod%2FLearn-Typescript/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/panntod%2FLearn-Typescript/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/panntod%2FLearn-Typescript/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/panntod","download_url":"https://codeload.github.com/panntod/Learn-Typescript/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248710438,"owners_count":21149188,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["express","mysql","rest-api","sequelize","ts-node","typescript"],"created_at":"2025-02-21T19:17:53.865Z","updated_at":"2026-03-15T20:51:35.469Z","avatar_url":"https://github.com/panntod.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Express Typescript 🚀\n\n## Deskripsi\n\nSelamat datang di dokumentasi perjalanan saya dalam belajar TypeScript dengan Express! 👩‍💻 Dalam repo ini, saya mencatat pengalaman belajar TypeScript dari level zero (day 1). Meski belum pernah mencoba TypeScript sebelumnya, saya telah memahami bahasa pemrograman mirip seperti Golang dan Java, serta memiliki keahlian dalam JavaScript.\n\nUntuk memaksimalkan pemahaman TypeScript, pastikan sudah memiliki basic skills berikut:\n- Pemahaman Dasar JavaScript 🚀\n- Node.js dan NPM 📦\n- HTML dan CSS 💻\n- Pemahaman Dasar Tentang REST API 🌐\n- Penggunaan Terminal/Command Line 🛠️\n- Pemahaman Tentang TDD (Test-Driven Development) 🧪\n\n### Perbedaan JavaScript vs TypeScript\n\n#### Tipe Data\n\n**JavaScript:** Bersifat dinamis, tipe data ditentukan saat runtime.\n\n**TypeScript:** Superset dari JavaScript dengan sistem tipe opsional.\n\n#### Penggunaan Tipe\n\n**JavaScript:** Tidak memiliki sistem tipe yang ketat.\n\n**TypeScript:** Memiliki sistem tipe kuat untuk mencegah kesalahan.\n\n#### Kompilasi\n\n**JavaScript:** Dieksekusi langsung oleh mesin JavaScript di runtime.\n\n**TypeScript:** Perlu dikompilasi menjadi JavaScript sebelum dijalankan.\n\n#### Alat Bantu (Tooling)\n\n**JavaScript:** Bergantung pada lingkungan pengembangan.\n\n**TypeScript:** Dukungan lebih lanjut untuk alat bantu pengembangan.\n\n#### Ekosistem\n\n**JavaScript:** Ekosistem besar dan mapan dengan berbagai pustaka dan framework.\n\n**TypeScript:** Kompatibel dengan ekosistem JavaScript, banyak proyek besar menggunakan TypeScript.\n\n#### Pemrograman Berorientasi Objek\n\n**JavaScript:** Mendukung paradigma pemrograman berorientasi objek.\n\n**TypeScript:** Dukungan yang lebih baik untuk pemrograman berorientasi objek.\n\n#### Penggunaan Default dan Opsional\n\n**JavaScript:** Variabel dan parameter fungsi bersifat opsional.\n\n**TypeScript:** Mendukung nilai default dan parameter opsional.\n\n#### Komunitas dan Dukungan\n\n**JavaScript:** Komunitas besar dan aktif.\n\n**TypeScript:** Komunitas yang terus berkembang dengan dukungan dari Microsoft.\n\n*Penting: TypeScript memberikan keleluasaan kepada pengembang dan dapat diintegrasikan bertahap ke dalam proyek JavaScript.*\n\n### Fitur\n\nAplikasi ini akan menawarkan beberapa fitur menarik:\n- Sistem CRUD 🗃️\n- Koneksi dengan database (MySql) 🔄\n- Endpoint 🌐\n- Rest API 🚀\n- Sequelize (versi js, untuk versi ts akan berada di repository lain) 🔍\n\n## Konfigurasi project\n\n1. lakukan konfigurasi dengan menginisialisasi npm:\n\n```cmd\nnpm init -y\n``` \n( fungsi `-y` adalah untuk automasi enter )\n\n2. instal beberapa dependensi yang dibutuhkan seprti express body-parser dan lain nya:\n\n```cmd\nnpm install express typescript @types/node @types/express ts-node mysql2\n```\n\n3. buatlah file baru bernama `tsconfig.json`, lalu isi dengan:\n\n```json\ntsconfig.json\n{\n  \"compilerOptions\": {\n    \"target\": \"es6\",\n    \"module\": \"commonjs\",\n    \"outDir\": \"./dist\",\n    \"rootDir\": \"./src\",\n    \"strict\": true,\n    \"esModuleInterop\": true\n  }\n}\n```\n\n4. langkah ini opsional, namun saya rekomendasikan menginstal `ts-node-dev`:\n\nopsional:\n```\nnpm install ts-node-dev --save-dev\n```\n\njika anda menginstal maka ubah script di `package.json` anda menjadi:\n```json\n\"scripts\": {\n  \"start\": \"ts-node-dev src/index.ts\",\n  \"build\": \"tsc\"\n},\n```\n\n5. instal dependensi untuk meng-hash password (md5 / bcrypt), disini saya menggunakan `bcrypt`:\n\n```\nnpm i --save-dev @types/bcrypt\n``` \n( pastikan menginstal yang versi typescript)\n\n6. buka file `tsconfig.json` dan tambahkan `allow js`:\n\n```json\n\"allowJs\": true\n```\n\nKita sudah selesai setup untuk aplikasi kita, sekarang buat folder bernama `src` dan mulai meng-koding!!!\n\njalankan perintah:\n\n```\ncd src\n```\n\nJalankan perintah untuk menginisiaisasi sequelize:\n```\nnpx sequelize-cli init \n```\n\nlalu lakukan perintah:\n```\nnpx sequelize-cli model:generate --name user --attributes firstname:string,lastname:string,email:string,  password:string,role:string \n```\nuntuk membuat models dari user\n\nlalu jalankan perintah:\n```\nnpx sequelize-cli db:migrate\n```\nuntuk migrate sebuah tabel didata base\n\n## Reminder\n\nIngat dalam setiap pembuatran variabel harus memiliki tipe data seperti `string`, `integer`, atau lain nya. jika dirasa tidak mengetahui pasti apa tipe data dari sebuah variabel maka gunakan `any`\n\ncontoh: \n\n```ts \nimport { Request, Response } from \"express\"; // lakukan import untuk dijadikan tipe data\n\nexport const getAllUser = async (req: Request, res: Response) =\u003e { // setelah penulisan req maka harus di ikuti dengan Request dari express  itu sendiri\n  // code TODO here\n}\n```\n\nLain kondisi jika anda ingin menggunakan sebuaah `interface` \n\nDalam TypeScript, interface adalah cara untuk mendefinisikan kontrak atau bentuk suatu objek. Interface digunakan untuk mendeklarasikan struktur tipe data dengan menyatakan nama, tipe, dan properti yang diharapkan dari suatu objek. Interfaces membantu dalam mencapai tingkat abstraksi dan memastikan bahwa objek yang diharapkan mematuhi struktur yang telah ditentukan.\n\ncontoh: \n```ts \ninterface DataUser {\n  firstname: string;\n  lastname: string;\n  email: string;\n  role: string;\n  password?: string;\n}\n```\n\nmendeklarasikan interface dari data user, digunakan untuk mengirim data bisa jadi `POST`, `PATCH` atau `PUT`, jadi saya tidak perlu mendeklarasikan dua kali ketika menggunakan interface ini. untuk interface ini bersifat wajib harus dipenuhi, jika salah satu data tidak terisi maka akan muncul pesan error, namun bisa menambahkan `?` untuk menjadikan suatu data itu opsional\n\ncontoh:  \n\n```ts  \nlet newUser: DataUser = {\n    firstname: req.body.firstname,\n    lastname: req.body.lastname,\n    email: req.body.email,\n    role: req.body.role,\n    password: bcrypt.hashSync(req.body.password, 10),\n};\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpanntod%2Flearn-typescript","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpanntod%2Flearn-typescript","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpanntod%2Flearn-typescript/lists"}