Digital Leadership Intelligence through Coding

Topic outline

• General
  

  General

  • Dibawah ini adalah list File / Document yang Mahasiswa dapat Download sebagai Referensi Forum
  • Silabus Lengkap File

    Silabus lengkap dapat di download disini

• Sesi 1: Pengantar Mata Kuliah
  

  Sesi 1: Pengantar Mata Kuliah

  1. Overview Mata Kuliah;
  2. 7 Karakteristik yang wajib dimiliki oleh seorang Fresh Graduate untuk menjadi seorang Digital Professional;
  3. Perubahaan yang terjadi di perusahaan akibat teknologi;
  4. Personal branding;
  5. Cara mengasah Growth Mindset;
  6. Diskusi

  
  

  • Link Google Meet URL
  • Digital Mindset Presentation File
• Sesi 2: Perkenalan Design Thinking
  

  Sesi 2: Perkenalan Design Thinking

  ●        Design Thinking best practices;

  ●        Bagaimana digunakan dalam pekerjaan sehari-hari;

  ●        Cara menulis Business Problem Statement;

  ●        How Might We’s;

  ●        Penggunaan Google Jamboard;

  ●        Design Jam, sebuah aktifitas yang digunakan oleh perusahaan-perusahaan teknologi terbesar seperti Facebook dan Google. Mahasiswa bekerja dalam kelompok menggunakan Design Thinking dan Critical Thinking untuk mencari berbagai solusi dalam memecahkan sebuah tantangan bisnis.

  
  

  • Link Googlemeet URL
  • Intro to Design Thinking Lecture File
• Design Jam Team Project Briefing
  

  Design Jam Team Project Briefing

  Design Jam Team Project Briefing

  • Briefing peraturan kegiatan design jam
    

  Design Jam Team Project Exercise

  •       Kelas dibagi dalam tim maksimal 8 orang.

  •       Masing-masing team melakukan design jam di monitor oleh Dosen dan Tutor
  •       Review dan reflection
    

  • Link Googlemeet URL
  • Design Thinking Team Exercise File
• Sesi 4: Mengapa Critical Thinking dan Problem Solving adalah dua skill yang wajib dimiliki oleh setiap fresh graduate
  

  Sesi 4: Mengapa Critical Thinking dan Problem Solving adalah dua skill yang wajib dimiliki oleh setiap fresh graduate

  Perkenalan dan Overview Platform Progate, tata tertib, dsbnya

  Memulai Path Pengembangan Web (Node.js) dengan membaca tiga topik pendahulu:

  ●        Apa itu Path Pengembangan Web?

  ●        Apa yang terjadi setelah menyelesaikan Path Pengembangan Web?

  ●        Bagaimana cara belajar secara efektif?

   

  Pengantar mengenai HTML & CSS

  • Team Dashboard Progate URL

    1. Pastikan computer/ laptop Anda tidak dalam keadaan menggunakan VPN / Proxy karena IP Address wajib Indonesia untuk menggunakan Progate versi Indonesia,
    2. Segera Daftar dan gabung di team dashboard Progate melalui link ini:  https://progate.com/companies/9003/invitation?auth_token=e41ab32092cd49fd3ef423239aeb674c
    3. Mohon untuk tunggu kelas dimulai sebelum mulai belajar agar tidak bingung.
  • Grup Telegram Q&A URL
  • Link Googlemeet URL
  • UBakrie KMMI Lecture - 12 August 2021 File
• Sesi 5: HTML & CSS I dan HTML & CSS II
  

  Sesi 5: HTML & CSS I dan HTML & CSS II

  HTML & CSS I:

  Chapter 1 - Memulai dengan HTML

  1. Memulai dengan HTML
  2. Judul dan Paragraf
  3. Tautan
  4. Gambar
  5. Daftar

   Chapter 2 - Memulai dengan CSS

  6. Warna
  7. Ukuran font dan jenis font
  8. Lebar, tinggi, dan warna latar belakang
  9. Class

   Chapter 3 - Layout (tata letak) dasar

  10. Struktur HTML (1)
  11. Struktur HTML (2)
  12. Layout dasar

   Chapter 4 - Header

  13. Struktur header
  14. Layout header
  15. Padding

   Chapter 5 - Footer

  16. Struktur Footer
  17. Layout Footer

   Chapter 6 - Konten

  18. Layout bagian utama
  19. Struktur konten
  20. Batas
  21. Padding dan Margin

   Chapter 7 - Formulir

  22. Layout formulir (1)
  23. Layout formulir (2)

   HTML & CSS II:

  Chapter 1 - Layout dasar

  1. Persiapan
  2. Layout dasar

   Chapter 2 - Bagian atas halaman

  3. Layout bagian atas
  4. Transparansi dan spasi antar-huruf
  5. Membuat tombol
  6. Menyesuaikan layout
  7. Menggunakan ikon

   Chapter 3 - Header

  8. Layout header
  9. Membuat tautan log in
  10. Menyempurnakan log in

   Chapter 4 - Daftar pelajaran

  11. Layout daftar pelajaran
  12. Menyejajarkan bagian pelajaran
  13. Menyesuaikan Layout

   Chapter 5 - Bagian pesan

  14. Layout bagian pesan
  15. Membuat tombol 3D
  16. Menerapkan CSS berdasarkan Klik

   Chapter 6 - Footer

  17. Footer

   Chapter 7 - Memperbaiki Header

  18. Memperbaiki header

  • Group Telegram Q&A URL
  • Link Zoom untuk presensi URL
  • Reading Material - Intro to Web Development URL
  • HTML & CSS Study I Slides URL
  • HTML & CSS Study II Slides URL
  • Materi Lecture Pengantar HTML & CSS URL
• Sesi 6: HTML & CSS Dojo I (Latihan tanpa instruksi):
  

  Sesi 6: HTML & CSS Dojo I (Latihan tanpa instruksi):

  Chapter 1 - Membuat halaman web dari awal

  1. Header
  2. Bagian atas halaman
  3. Bagian konten atau isi
  4. Bagian formulir
  5. Footer

  
  

  • Group Telegram Q&A URL
  • Link Zoom untuk Presensi dan Office Hour URL
• Sesi 7: HTML & CSS Dojo II (Latihan tanpa instruksi):
  

  Sesi 7: HTML & CSS Dojo II (Latihan tanpa instruksi):

  Chapter 1 - Membuat halaman web modern dari awal

  1. Bagian atas
  2. Header
  3. Daftar pelajaran
  4. Bagian pesan
  5. Footer

  
  

  • Group Telegram Q&A URL
  • Link Zoom untuk Presensi dan Office Hour URL
• Sesi 8: HTML & CSS III:
  

  Sesi 8: HTML & CSS III:

  Chapter 1 - Design Web yang Responsive

  1. Persiapan

   Chapter 2 - Media Queries

  2. Menggunakan media queries
  3. Layout dengan media queries
  4. Box-sizing

   Chapter 3 - Menjadikan halaman Anda responsive

  5. Persiapan desain yang responsive
  6. Layout tablet
  7. Memperbaiki layout yang responsive
  8. Layout smartphone (1)
  9. Layout smartphone (2)
  10. Membuat font-size responsive
  11. Max-width
  12. Menjadikan Header responsive

  
  

  • Group Telegram Q&A URL
  • Link Zoom untuk Presensi dan Office Hour URL
  • HTML & CSS Study III Slides URL
• Sesi 9: HTML & CSS Dojo III (Latihan tanpa instruksi) dan CSS IV (Flexbox)
  

  Sesi 9: HTML & CSS Dojo III (Latihan tanpa instruksi) dan CSS IV (Flexbox)

  HTML & CSS Dojo III (Latihan tanpa instruksi):

  Chapter 1 - Menguasai desain web yang responsive

  1. Menjadikan header responsive
  2. Menjadikan bagian atas responsive
  3. Menjadikan daftar pelajaran responsive
  4. Menjadikan footer responsive

  HTML & CSS IV (Flexbox)

  Chapter 1 - Apa itu Flexbox?

  1. Persiapan

   Chapter 2 - Mengimplementasikan flexbox

  1. Display: flex
  2. Flex: auto

   Chapter 3 - Desain responsive

  1. Flex-wrap: wrap
  2. Media queries
  3. Flex-direction

  • Group Telegram Q&A URL
  • Link Zoom untuk Presensi dan Office Hour URL
  • HTML & CSS Flexbox Slides URL
  • Cara Mempublikasikan Web dengan GitHub URL
  • Materi Lecture Pengantar Git URL
• Sesi 10: Briefing Team Project Wajib
  

  Sesi 10: Briefing Team Project Wajib

  Menyiapkan Aplikasi Web di Environment local

  1. Command Line
  2. Git
  3. Membuat Akun GitHub dan simpan linknya melalui Google form
  4. Bahan bacaan tambahan

   

  Proyek Tim

  1. “Membuat halaman web statis bersama kelompok anda!” Tujuan dari proyek ini adalah untuk membuat suatu halaman web bersama rekan tim (satu tim maksimal 5 anggota).
  2. Proyek ini sifatnya wajib untuk menerapkan apa yang sudah di pelajari di bahasa HTML & CSS, sebagaimana seorang programmer asli membangun sebuah halaman web.
  3. Proyek ini akan melatih skill kerjasama, komunikasi, dan kemandirian mengatur waktu dalam membangun sebuah proyek berbasis web.

   

  Tim mengerjakan Proyek

  •        Pengumpulan link halaman web via googleform

  •        Deadline 21:00 WIB 10 September 2021

  
  

  • Group Telegram Q&A URL
  • Link Zoom untuk Briefing Proyek Team HTML & CSS URL
  • Dokumen Briefing Proyek Tim HTML & CSS URL
  • UBakrie KMMI - Proyek Tim HTML & CSS Submission Assignment
• Pengantar: Mengapa Bahasa Javascript sangat Populer; Dari aplikasi web sederhana hingga UI/UX layar komputer SpaceX
  

  Pengantar: Mengapa Bahasa Javascript sangat Populer; Dari aplikasi web sederhana hingga UI/UX layar komputer SpaceX

  JavaScript I:

  Chapter 1 - String & Integer

  1. Pengantar Javascript ES6
  2. console.log()
  3. Kalkulasi (1)
  4. Kalkulasi (2)
  5. Menggabungkan string

   Chapter 2 - Variable & Constant

  6. Variable
  7. Menggunakan variable
  8. Mengupdate variable (1)
  9. Mengupdate variable (2)
  10. Constant
  11. Template literal

   Chapter 3 - Statement Conditional

  12. Statement if
  13. Operator boolean & perbandingan (1)
  14. Operator boolean & perbandingan (2)
  15. Else
  16. Else if
  17. Beberapa kondisi
  18. Statement switch (1)
  19. Statement switch (2)

   JavaScript II:

  Chapter 1 - Iterasi

  1. Review variable
  2. Loop while
  3. Loop for
  4. Menerapkan iterasi

   Chapter 2 - Array

  5. Apa yang dimaksud dengan array
  6. Mendapatkan element array
  7. Mengupdate element array
  8. Iterasi dengan array (1)
  9. Iterasi dengan array (2)

   Chapter 3 - Object

  10. Apa yang dimaksud dengan Object
  11. Mengakses dan Memperbarui nilai
  12. Array dalam object (1)
  13. Array dalam object (2)

   Chapter 4 - Undefined (tidak didefinisikan)

  14. Apa yang dimaksud dengan “Undefined”
  15. Mencegah undefined

   Chapter 5 - Latihan Akhir

  16. Bagian 1
  17. Bagian 2

  
  

  • Group Telegram Q&A URL
  • Link Zoom Live Session URL
  • Javascript Study I Slides URL
  • Javascript Study II Slides URL
  • Mater Lecture Pengantar Javascript URL
• Sesi 12: JavaScript III dan JavaScript IV
  

  Sesi 12: JavaScript III dan JavaScript IV

  Chapter 1 - Mempelajari Function

  1. Apa yang dimaksud dengan Function (1)
  2. Apa yang dimaksud dengan Function (2)
  3. Arrow function
  4. Argument
  5. Menggunakan beberapa argument
  6. Nilai return
  7. Menggunakan nilai return
  8. Scope (cakupan)

  Latihan Akhir

   JavaScript IV:

  Chapter 1 - Dasar-dasar Class

  1. Review object
  2. Apa yang dimaksud dengan Class?
  3. Membuat instance
  4. Constructor (1)
  5. Constructor (2)
  6. Constructor (3)
  7. Method (1)
  8. Method (2)
  9. Memanggil method di dalam method

   Chapter 2 - Inheritance Class

  10. Apa yang dimaksud dengan inheritance?
  11. Menggunakan inheritance class
  12. Menambah method
  13. Overriding (1)
  14. Overriding (2)
      

  
  

  • Group Telegram Q&A URL
  • Link Zoom URL
  • Javascript Study III Slides URL
  • Javascript Study IV Slides URL
• Sesi 13: JavaScript V, JavaScript VI, JavaScript VII
  

  Sesi 13: JavaScript V, JavaScript VI, JavaScript VII

  JavaScript V:

  Chapter 1 - Memisahkan File

  1. Memisahkan file (1)
  2. Memisahkan file (2)
  3. Meng-export nilai
  4. Export bernama
  5. Jalur relatif

   Chapter 2 - Menggunakan Paket

  1. Paket (1)
  2. Paket (2)

   Javascript VI:

  Chapter 1 - Method untuk Array

  1. Push
  2. ForEach
  3. Find
  4. Filter Map

   Javascript VII:

  Chapter 1 - Mempelajari tentang Callback Function

  1. Tentang Callback Function
  2. Apa yang dimaksud dengan Callback Function?
  3. Mendeklarasikan callback function secara langsung
  4. Argument callback function

  
  

  • Group Telegram Q&A URL
  • Javascript Study V Slides URL
  • Javascript Study VI Slides URL
  • Javascript Study VII Slides URL
• Sesi 14: Presentasi: Mengapa SQL Penting Dalam Mengambil Keputusan Bisnis
  

  Sesi 14: Presentasi: Mengapa SQL Penting Dalam Mengambil Keputusan Bisnis

  SQL I:

  Mendapatkan Data:

  1. Apa itu database
  2. Apa itu kueri
  3. Memilih banyak kolom

   Mendapatkan Baris Tertentu:

  1. WHERE (1)
  2. WHERE (2)
  3. Operator perbandingan
  4. LIKE (1)
  5. LIKE (2)
  6. NOT
  7. IS NULL , IS NOT NULL
  8. AND, OR

   Mengolah Hasil Data:

  1. ORDER BY
  2. LIMIT

   Proyek Akhir Studi I:

  1. Mempraktikkan hal yang sudah Anda pelajari

   SQL II:

  Mengolah Hasil Pencarian

  1. DISTINCT
  2. Operator aritmetika

   Menggunakan Function Agregat

  1. SUM
  2. AVG
  3. COUNT
  4. MAX, MIN

   Mengelompokkan Data

  1. GROUP BY
  2. GROUP BY (lebih dari satu)
  3. GROUP BY (WHERE)
  4. HAVING

   Proyek Akhir Studi II

  Mempraktikkan hal yang sudah Anda Pelajari
  

  • Group Telegram Q&A URL
  • SQL - A Must Have Decision-Making Skill URL
  • SQL Study I Slides URL
  • SQL Study II Slides URL
  • Materi Bacaan - Memahami lebih dalam mengenai Aplikasi Web URL
  • Materi Lecture - Pengantar SQL URL
• Sesi 15: SQL III, SQL DOJO dan SQL IV, Menganalisis Database Situs Fashion e-commerce (WAJIB)
  

  Sesi 15: SQL III, SQL DOJO dan SQL IV, Menganalisis Database Situs Fashion e-commerce (WAJIB)

  SQL III:

  Menggunakan Subkueri

  1. Tabel players
  2. Subkueri
  3. AS

   Beberapa Tabel

  1. Tabel countries
  2. Menggabungkan tabel
  3. JOIN (1)
  4. JOIN (2)
  5. Tabel teams
  6. LEFT JOIN
  7. Menggabungkan 3 tabel

   Tantangan Terakhir

  1. Mempraktikkan keahlian SQL Anda

   SQL DOJO:

  Latihan tanpa Instruksi - Menganalisis Database Situs Fashion

  1. Menganalisis dengan SQL
  2. Pengguna
  3. Produk (1)
  4. Produk (2)
  5. Produk (3)
  6. Riwayat penjualan
  7. Penjualan dan laba
  8. Analisis Harian
  9. Data Pengguna yang kompleks
  10. Data Produk yang kompleks

   SQL IV:

  Menambahkan, Memperbarui, dan Menghapus Data

  1. INSERT
  2. UPDATE
  3. DELETE

   Memantapkan Keahlian Anda

  1. Mempraktikkan hal yang sudah Anda pelajari
  
  

  Menganalisis Database Situs Fashion e-commerce (WAJIB)

  • Deadline 21:00 WIB, 29 September 2021

  
  

  • Group Telegram Q&A URL
  • Zoom link - SQL Project URL
  • SQL Study III Slides URL
  • SQL Study IV Slides URL
  • Tugas SQL - Analisa Data E-commerce Briefing Doc File
  • Tugas SQL - Analisa data E-commerce Submission Assignment
• Sesi 16: Node.js
  

  Sesi 16: Node.js

  Menggabungkan semua. Membuat aplikasi “shopping list”

   

  Node.js I:

  Memulai Penggunaan Node.js

  1. Persiapan

   Mengkonfigurasi Express

  1. Menginstal Express

        2. Menjalankan Server

  
  

  Menampilkan Halaman

  1. Cara halaman ditampilkan
  2. Menerapkan CSS dan menampilkan gambar
  3. Membuat Halaman daftar

   

  Menggunakan EJS

  1. Menggunakan EJS untuk menampilkan nilai
  2. Menampilkan HTML menggunakan for Each

   

  Menambah Tautan

  1. Menautkan antar halaman

  
  

  • Group Telegram Q&A URL
  • Link Zoom Sesi 15 - Pengantar Node.js URL
  • Node.js Study I Slides URL
• Sesi 17: Node.js II
  

  Sesi 17: Node.js II

  Node.js II:

  Menggunakan Database

  1. Persiapan

   Menyiapkan Database

  1. Mengintegrasikan database

   Menampilkan Nilai Database

  1. Menggunakan database
  2. Menampilkan nilai yang dipilih

   Fitur Penambahan Item

  1. Menciptakan halaman penambahan item
  2. Meminta menggunakan Formulir
  3. Menambahkan item ke database
  4. Menggunakan Redirect (pengalihan)

  
  

  • Group Telegram Q&A URL
  • Node.js Study II Slides URL
• Sesi 18: Node.js III:
  

  Sesi 18: Node.js III:

  Node.js III:

  Fitur Hapus dan Edit

  1. Persiapan

  Menghapus item Daftar

  1. Menyiapkan tombol hapus
  2. Mengirim ID item
  3. Menjalankan kueri DELETE

   Mengedit item Daftar

  1. Persiapan
  2. Menampilkan item yang dipilih
  3. Rute untuk memperbarui data
  4. Memperbarui item yang dipilih

  
  

  • Group Telegram Q&A URL
  • Node.js Study III Slides URL
• Sesi 19: Memulai Pengembangan Node.js di environment lokal
  

  Sesi 19: Memulai Pengembangan Node.js di environment lokal

  Memulai Pengembangan Node.js di environment lokal

  ●        Persiapan Local Environment Node.js

  ●        Membuat Aplikasi Node.js Baru

  ●        Persiapan Local Environment MySQL

  ●        Membuat Database dengan MySQL

  ●        Menghubungkan Aplikasi Node.js ke MySQL

  •       Menuntaskan Pengembangan Aplikasi Web Lokal

  • Group Telegram Q&A URL
  • Tutorial Mempersiapkan Environment Local Node.js URL
  • Tutorial membuat Aplikasi Express Baru di Local Environment URL
  • Tutorial Setup Environment Local MySQL URL
  • Tutorial membuat Database dengan MySQL URL
  • Tutorial Menghubungkan MySQL dengan Node.js URL
  • Menuntaskan pengembangan aplikasi node.js di environment local URL
  • Penyelesaian Path Pengembangan Web Node.js Submission Assignment