Belajar Dasar Pemrograman Web
Topik:
Full Stack Front EndLevel: Dasar
Siswa Terdaftar
Topik:
Full Stack Front EndLevel: Dasar
Siswa Terdaftar
Kelas ini merupakan langkah ke-satu Anda untuk menjadi React Developer.
Kelas ini merupakan langkah ke-satu Anda untuk menjadi Front-End Web Developer.
Website di era sekarang sudah menjadi kebutuhan utama yang tidak bisa diabaikan. Seluruh sektor bisnis atau edukasi dapat memanfaatkan website sebagai alat untuk promosi, tukar informasi, dan lainnya. Berdasarkan data dari World Wide Web Technology Surveys, dari seluruh website yang aktif, 88.2% menggunakan HTML dan 95.6% menggunakan CSS. Kelas ini membahas tuntas mengenai HTML dan CSS sebagai fondasi dalam pembuatan website.
Kelas ini merupakan langkah ke-satu Anda untuk menjadi React Developer.
Peralatan Belajar
Spesifikasi minimal perangkat:
Prosesor
Intel Celeron (Rekomendasi Core i3 ke atas)
Tools yang dibutuhkan untuk belajar:
Web Browser (Google Chrome atau Mozilla Firefox)
Lihat semua peralatan belajar
Lihat semua peralatan belajarKelas ini membutuhkan spesifikasi perangkat seperti berikut:
RAM
1GB
Layar
1366 x 768 (Rekomendasi Full HD 1920 x 1080)
Sistem Operasi
Windows, Linux, MacOS
Prosesor
Intel Celeron (Rekomendasi Core i3 ke atas)
Kelas ini membutuhkan beberapa tools berikut:
Web Browser (Google Chrome atau Mozilla Firefox)
Teks Editor (VSCode)
Metode Ajar
Lihat semua metode ajar
Lihat semua metode ajarKontributor
2Curriculum Developer yang membangun kelas ini:
Dimas Maulana Dwi Saputra
Curriculum Developer at Dicoding Indonesia
Nur Rizki Adi Prasetyo
Curriculum Developer at Dicoding Indonesia
Reviewer
62Code Reviewer yang akan me-review tugas dan kode Anda:
Bibita Habibi Mustafa
System Engineer at Dicoding Indonesia
Moch Ridwan Taufik Alamsyah
R&D Engineer at Citra Sabda Abadi, External Code Reviewer at Dicoding Indonesia
- Full Stack Development Enthusiast
- Mobile Development Enthusiast
- Machine Learning Enthusiast
- IoT Enthusiast
Motto: "What We Learn When We Learn By Doing?" Roger C. Schank
Lihat semua kontributor dan reviewer
Lihat semua kontributor dan reviewerKontributor kelas
Curriculum Developer yang membangun kelas ini:
Dimas Maulana Dwi Saputra
Curriculum Developer at Dicoding Indonesia
Nur Rizki Adi Prasetyo
Curriculum Developer at Dicoding Indonesia
Tim Reviewer
Code Reviewer yang akan me-review tugas dan kode Anda:
Bibita Habibi Mustafa
System Engineer at Dicoding Indonesia
Moch Ridwan Taufik Alamsyah
R&D Engineer at Citra Sabda Abadi, External Code Reviewer at Dicoding Indonesia
- Full Stack Development Enthusiast
- Mobile Development Enthusiast
- Machine Learning Enthusiast
- IoT Enthusiast
Motto: "What We Learn When We Learn By Doing?" Roger C. Schank
Nasrul Gunawan
Elixir Backend Developer at Global IT Support
Khofidin
IT & Traceability Manager at Austrex
Amril Hakim Sihotang
External Code Reviewer at Dicoding Indonesia
Luthfi Alfarisi
External Code Reviewer at Dicoding Indonesia
Inggih Wicaksono
Web Developer at Erasys Consulting
- Fullstack man but currently focus on React.js
- Hacktoberfest fans @igihcksn
Agista Septiyanto
Product Engineer
Tim product
Alvin Indra Pratama
Frontend Developer at Antikode
Alfian Yusuf Abdullah
Head of Reviewer at Dicoding Indonesia
khairul anas
External Code Reviewer at Dicoding Indonesia
• Dicoding Graduate
• Flutter Developer
• Mobile & Web Enthusiast
Gilang Ramadhan
Curriculum Developer at Dicoding Indonesia
Our team at Dicoding Indonesia thrives under my coordination, where we've honed a robust curriculum enhancing the Android and iOS development skills of our students. With a rich educational backdrop that spans from Politeknik Negeri Semarang to specialized certifications from Udacity and the University of Toronto, I've forged a path that intersects innovative teaching with cutting-edge technology.
As a Curriculum Developer and Contributor Coordinator, my focus is on crafting high-quality educational content and managing our elite contributors. Our success is evident in the elevated learning experiences we deliver, rooted in my expertise in UX Design, Android Development, iOS Development, and Project Management, ensuring that every student is equipped for the dynamic demands of the tech industry.
Alexzander Purwoko
Code Reviewer at Dicoding Indonesia
Thingkilia Finnatia Husin
External Code Reviewer at Dicoding Indonesia
Mellania Permata Sylvie
External Reviewer Machine Learning di Dicoding
Information system student, Machine Learning Enthusiasm, and Tensorflow Developer Certified
Lukman Bahar Agung Pambudi
External Code Reviewer at Dicoding Indonesia
Ananda Dwi Prayoga
Android Engineer at Vidio.com
Muhammad Nazar Alwi
External Code Reviewer at Dicoding Indonesia
Ivan Andrianto
Academy Code Reviewer at Dicoding Indonesia
Rosyiidah Hasnaa
Frontend Developer
Applied Bachelor of Informatics Engineering from Politeknik Elektronika Negeri Surabaya. I have experience building a website using html, css, bootstrap, and javascript and making a responsive website. I enjoy learning about front-end developers in my free time. An eager and conscientious person who works well in team environments. I'm looking for opportunities in front-end web development.
Let's connect with me on linkedin.com/in/syiidahasnaa
Shaddam Amru
Frontend Engineer
Muhammad Ilham Adhim
Front-End Web Developer
Muhammad Rifki Erlangga
External Code Reviewer at Dicoding Indonesia
Mohamad Zaelani
External Code Reviewer Dicoding
Feel free to connect with me on LinkedIn.
• External Code Reviewer Dicoding
• Backend Developer
• TensorFlow Developer Certified
Swanddd
External Code Reviewer at Dicoding Indonesia
Fiqri ardiansyah
Frontend Developer at PT. SPM
HA, nice!
Take a look my portfolio
Farhan Rafly Fahrezi Saepulloh
Frontend Engineer
If the physics says it is allowed, the engineers will find a way.
Gusti Muhammad Aulia Nur Sulthan
Hallo Semua.
Perkenalkan nama saya Gusti Muhammad Aulia Nur Sulthan biasa di panggil tann. saat ini saya mahasiswa tingkat akhir. saya sangat tertarik dibidang Artificial Intelligence dan sedang berfokus di Natural language processing.Â
saya sangat open untuk kolaborasi khususnya di machine learning.
Samodra
External Code Reviewer at Dicoding Indonesia
YUSRIL ADRIANSYAH PUTRA
External Code Reviewer at Dicoding Indonesia
Ahmad Zein Al Wafi
Machine Learning Architect
Transforming data into AI solutions to drive business innovation
Hasan Ismail Abdulmalik
Software Engineering Student at College of Vocational Studies IPB University
I am a web developer who is interested in both backend and frontend development. I have been teaching myself web development and am familiar with programming languages such as HTML, CSS, JavaScript, PHP and Python as well as frameworks like Laravel, Django, React and Node.js. I am eager to gain practical experience and contribute to the development of high-quality websites and software.
Sarah Salsabila
Ex-Reviewer at Dicoding Indonesia
Computer Science Student , Machine Learning and Data Science Enthusias
Yudistira Arya Mutamang
External Code Reviewer at Dicoding Indonesia
Ilham Shiddiq
External Code Reviewer at Dicoding Indonesia. Backend Developer at a company in Bandung.
Rully Indra Laelaningrum
Lead Product Engineer at Dicoding Indonesia
Currently enjoying building impactful products and leading teams to success. Let's talk about leadership, product development, engineering, and project management.
Abraham Bulyan Zebua
make something from nothing
I love design and make new things especially for make an app and my desire is to make apps looks nice and friendly for user not just nice for eye but easy to use
Muhammad Alvino Dienova
External Reviewer at Dicoding Indonesia
Front-End Web Developer
Eko Rahayu Widodo
Software Engineer
• Lifelong Learner.
• Let's Connect ^^.
Tia Dwi Setiani
Curriculum Developer at Dicoding Indonesia
Certified Tensorflow Developer
Marcello Sebastian
External Code Reviewer at Dicoding Indonesia
Front-end Development Enthusiast
Sofyan Egi Lesmana
You can reach out me on my Linkedin.
Rizqy Hidayat
Product Engineer, Dicoding Indonesia
Product Engineer, Dicoding
Faridatul Nur Aidah
Product Engineer @ Dicoding Indonesia
Hi, I'm Farida. I am a Product Engineer at Dicoding, while building our product we always gather background and expectations from stakeholders to help them achieve impact in the industry. We use the Test Driven Development and DevOps Mindset to maintain our product quality.
Being a developer and woman is not hard if you commit to always growth. If you have questions or difficulties in understanding, ask your mentors or colleagues. There are ways if you want to change.
Kevin Jonathan
External Code Reviewer at Dicoding Indonesia
Research Assistant at Waseda University | Apple Developer Academy Alumni
Refiandi Reza Syawaldriyansah
External Reviewer Dicoding
Front-End & Javascript Enthusiast
Shidqi Rifat Pangestu
Frontend Developer at Badr Interactive
- Frontend web enthusiast
- Contribute through technology </>
Fazza Razaq Amiarso
Software Engineer@WidaTech & Mentor
I'm a self-taught web developer focusing on making everyone can inclusively use the web. Currently learning and building interactive experience on the Web and Mobile.
Huge believer (and doer ofc) in learning by doing.
Personal Website:Â https://www.fazzaamiarso.com
Github: https://github.com/fazzaamiarso
Fauzi Kurniawan
External Code Reviewer at Dicoding Indonesia
Javascript enthusiast
Irenius Brayen Luhat
Self-employed
Seorang pembelajar dan pengembang web. Saya adalah seorang antusias Javascript, saya mendedikasikan banyak waktu belajar saya di sini. Kenali lebih jauh dengan mengunjung website profil saya.
Muhammad Zainul Hakim
Developer
Learning the web tech.
Bibita Habibi Mustafa
System Engineer at Dicoding Indonesia
Moch Ridwan Taufik Alamsyah
R&D Engineer at Citra Sabda Abadi, External Code Reviewer at Dicoding Indonesia
- Full Stack Development Enthusiast
- Mobile Development Enthusiast
- Machine Learning Enthusiast
- IoT Enthusiast
Motto: "What We Learn When We Learn By Doing?" Roger C. Schank
Buchori Rafsanjani
Curriculum Developer at Dicoding Indonesia
Widyarso Joko Purnomo
Khrisna Indrawan Eka Putra
Ahmad Arif Faizin
Curriculum Developer at Dicoding Indonesia
Nasrul Gunawan
Elixir Backend Developer at Global IT Support
Khofidin
IT & Traceability Manager at Austrex
Amril Hakim Sihotang
External Code Reviewer at Dicoding Indonesia
Ahmad dari Dicoding
Managing Editor at Dicoding Indonesia
Luthfi Alfarisi
External Code Reviewer at Dicoding Indonesia
Inggih Wicaksono
Web Developer at Erasys Consulting
- Fullstack man but currently focus on React.js
- Hacktoberfest fans @igihcksn
Agista Septiyanto
Product Engineer
Tim product
Alvin Indra Pratama
Frontend Developer at Antikode
Alfian Yusuf Abdullah
Head of Reviewer at Dicoding Indonesia
khairul anas
External Code Reviewer at Dicoding Indonesia
• Dicoding Graduate
• Flutter Developer
• Mobile & Web Enthusiast
Fahmi Jabbar
External Code Reviewer at Dicoding Indonesia
Dimas Maulana Dwi Saputra
Curriculum Developer at Dicoding Indonesia
Gilang Ramadhan
Curriculum Developer at Dicoding Indonesia
Our team at Dicoding Indonesia thrives under my coordination, where we've honed a robust curriculum enhancing the Android and iOS development skills of our students. With a rich educational backdrop that spans from Politeknik Negeri Semarang to specialized certifications from Udacity and the University of Toronto, I've forged a path that intersects innovative teaching with cutting-edge technology.
As a Curriculum Developer and Contributor Coordinator, my focus is on crafting high-quality educational content and managing our elite contributors. Our success is evident in the elevated learning experiences we deliver, rooted in my expertise in UX Design, Android Development, iOS Development, and Project Management, ensuring that every student is equipped for the dynamic demands of the tech industry.
Gunawan Wahyu Andreanto
Full Stack Developer
Alexzander Purwoko
Code Reviewer at Dicoding Indonesia
Thingkilia Finnatia Husin
External Code Reviewer at Dicoding Indonesia
Mellania Permata Sylvie
External Reviewer Machine Learning di Dicoding
Information system student, Machine Learning Enthusiasm, and Tensorflow Developer Certified
Lukman Bahar Agung Pambudi
External Code Reviewer at Dicoding Indonesia
Ni Luh Putu Anita Dewi
Ananda Dwi Prayoga
Android Engineer at Vidio.com
Muhammad Nazar Alwi
External Code Reviewer at Dicoding Indonesia
Ivan Andrianto
Academy Code Reviewer at Dicoding Indonesia
Rosyiidah Hasnaa
Frontend Developer
Applied Bachelor of Informatics Engineering from Politeknik Elektronika Negeri Surabaya. I have experience building a website using html, css, bootstrap, and javascript and making a responsive website. I enjoy learning about front-end developers in my free time. An eager and conscientious person who works well in team environments. I'm looking for opportunities in front-end web development.
Let's connect with me on linkedin.com/in/syiidahasnaa
Shaddam Amru
Frontend Engineer
Muhammad Ilham Adhim
Front-End Web Developer
Muhammad Rifki Erlangga
External Code Reviewer at Dicoding Indonesia
Mohamad Zaelani
External Code Reviewer Dicoding
Feel free to connect with me on LinkedIn.
• External Code Reviewer Dicoding
• Backend Developer
• TensorFlow Developer Certified
Swanddd
External Code Reviewer at Dicoding Indonesia
Fiqri ardiansyah
Frontend Developer at PT. SPM
HA, nice!
Take a look my portfolio
Farhan Rafly Fahrezi Saepulloh
Frontend Engineer
If the physics says it is allowed, the engineers will find a way.
Gusti Muhammad Aulia Nur Sulthan
Hallo Semua.
Perkenalkan nama saya Gusti Muhammad Aulia Nur Sulthan biasa di panggil tann. saat ini saya mahasiswa tingkat akhir. saya sangat tertarik dibidang Artificial Intelligence dan sedang berfokus di Natural language processing.Â
saya sangat open untuk kolaborasi khususnya di machine learning.
Samodra
External Code Reviewer at Dicoding Indonesia
YUSRIL ADRIANSYAH PUTRA
External Code Reviewer at Dicoding Indonesia
Ahmad Zein Al Wafi
Machine Learning Architect
Transforming data into AI solutions to drive business innovation
Hasan Ismail Abdulmalik
Software Engineering Student at College of Vocational Studies IPB University
I am a web developer who is interested in both backend and frontend development. I have been teaching myself web development and am familiar with programming languages such as HTML, CSS, JavaScript, PHP and Python as well as frameworks like Laravel, Django, React and Node.js. I am eager to gain practical experience and contribute to the development of high-quality websites and software.
Sarah Salsabila
Ex-Reviewer at Dicoding Indonesia
Computer Science Student , Machine Learning and Data Science Enthusias
Yudistira Arya Mutamang
External Code Reviewer at Dicoding Indonesia
Ilham Shiddiq
External Code Reviewer at Dicoding Indonesia. Backend Developer at a company in Bandung.
Rully Indra Laelaningrum
Lead Product Engineer at Dicoding Indonesia
Currently enjoying building impactful products and leading teams to success. Let's talk about leadership, product development, engineering, and project management.
Abraham Bulyan Zebua
make something from nothing
I love design and make new things especially for make an app and my desire is to make apps looks nice and friendly for user not just nice for eye but easy to use
Muhammad Alvino Dienova
External Reviewer at Dicoding Indonesia
Front-End Web Developer
Eko Rahayu Widodo
Software Engineer
• Lifelong Learner.
• Let's Connect ^^.
Tia Dwi Setiani
Curriculum Developer at Dicoding Indonesia
Certified Tensorflow Developer
Marcello Sebastian
External Code Reviewer at Dicoding Indonesia
Front-end Development Enthusiast
Sofyan Egi Lesmana
You can reach out me on my Linkedin.
Rizqy Hidayat
Product Engineer, Dicoding Indonesia
Product Engineer, Dicoding
Faridatul Nur Aidah
Product Engineer @ Dicoding Indonesia
Hi, I'm Farida. I am a Product Engineer at Dicoding, while building our product we always gather background and expectations from stakeholders to help them achieve impact in the industry. We use the Test Driven Development and DevOps Mindset to maintain our product quality.
Being a developer and woman is not hard if you commit to always growth. If you have questions or difficulties in understanding, ask your mentors or colleagues. There are ways if you want to change.
Kevin Jonathan
External Code Reviewer at Dicoding Indonesia
Research Assistant at Waseda University | Apple Developer Academy Alumni
Seprian Dani
External Academy Code Reviewer at Dicoding Indonesia
Refiandi Reza Syawaldriyansah
External Reviewer Dicoding
Front-End & Javascript Enthusiast
Shidqi Rifat Pangestu
Frontend Developer at Badr Interactive
- Frontend web enthusiast
- Contribute through technology </>
Fazza Razaq Amiarso
Software Engineer@WidaTech & Mentor
I'm a self-taught web developer focusing on making everyone can inclusively use the web. Currently learning and building interactive experience on the Web and Mobile.
Huge believer (and doer ofc) in learning by doing.
Personal Website:Â https://www.fazzaamiarso.com
Github: https://github.com/fazzaamiarso
Fauzi Kurniawan
External Code Reviewer at Dicoding Indonesia
Javascript enthusiast
Irenius Brayen Luhat
Self-employed
Seorang pembelajar dan pengembang web. Saya adalah seorang antusias Javascript, saya mendedikasikan banyak waktu belajar saya di sini. Kenali lebih jauh dengan mengunjung website profil saya.
Muhammad Zainul Hakim
Developer
Learning the web tech.
Qwerty
Ribuan siswa sukses belajar di Dicoding Academy. Apa kata mereka? Berikut adalah testimoni asli mereka.
Lihat semua testimoni
Lihat semua testimoniBerikut adalah beberapa pertanyaan yang paling sering ditanyakan.
Materi yang akan Anda pelajari pada kelas ini.
Memahami HAKI, mekanisme belajar, forum diskusi, glosarium, dan daftar referensi.
5 Menit
5 Menit
10 Menit
5 Menit
5 Menit
10 Menit
10 Menit
5 Menit
Pengenalan website, cara kerjanya, dan tools-nya dalam mengembangkannya.
5 Menit
15 Menit
10 Menit
15 Menit
10 Menit
15 Menit
15 Menit
Kuis: Pendahuluan
15 Menit
Mempelajari alat yang digunakan dalam membangun struktur halaman website. Modul ini membahas tentang HTML, struktur dasar dokumen HTML, dsb.
Pengantar HTML
5 Menit
Latihan: Membangun Halaman Web Pertama (Halaman Profil)
25 Menit
Latihan: Identifikasi Elemen pada Halaman Profil
15 Menit
Anatomi Elemen HTML
15 Menit
Attribute di Elemen HTML
20 Menit
Anatomi Dokumen HTML
20 Menit
Rangkuman Pengenalan HTML
15 Menit
Kuis: Pengenalan HTML
15 Menit
Mendalami penerapan HTML dalam membangun struktur halaman web secara lebih lanjut. Di antaranya seperti beragam elemen HTML, teknik mengorganisir konten website dengan elemen semantik, mengenal attribute pada elemen, generic element, table, dsb. Selain itu, modul ini membahas tentang perbedaan antara elemen yang bersifat inline dan block.
Pengantar Pendalaman HTML
5 Menit
Paragraf
10 Menit
Heading
10 Menit
List
15 Menit
Latihan: Menambahkan List pada Halaman Profil
10 Menit
Gambar
15 Menit
Latihan: Menambahkan Gambar pada Halaman Profil
25 Menit
Block Formatting Text: Long Quotations, Preformatted Text, dan Figure
25 Menit
Inline Formatting Text: Anchor, Emphasized Text, Important Text, dan Short Quotation
20 Menit
Inline Formatting Text: Citation, Defining Terms, Subscript, Superscript, Highlighted Text, dan Line Break
20 Menit
Latihan: Menerapkan Elemen Anchor pada Halaman Profil
20 Menit
Semantic HTML: Mengorganisasi Halaman Konten
5 Menit
Semantic HTML: Header, Footer, Main, dan Nav
15 Menit
Semantic HTML: Articles, Aside, dan Section
15 Menit
Generic Element
15 Menit
Pengantar Latihan: Mengorganisasi Konten pada Halaman Profil
15 Menit
Latihan: Menetapkan Elemen Header, Main, dan Footer di Halaman Profil
20 Menit
Latihan: Menerapkan Elemen Div, Aside, Article, dan Section di Halaman Profil
35 Menit
Tabel
5 Menit
Struktur Dasar Tabel
15 Menit
Spanning Cell
20 Menit
Elemen dan Atribut pada Tabel
5 Menit
Latihan: Menerapkan Elemen Tabel pada Halaman Profil
20 Menit
Input User
20 Menit
Atribut pada Elemen Input
15 Menit
Mengirim Data Formulir
25 Menit
Special Character
10 Menit
Rangkuman Pendalaman HTML
35 Menit
Kuis: Pendalaman HTML
15 Menit
Memahami peran CSS dalam pembuatan website, benefitnya, dan mengetahui penulisan sintaks dasar CSS dengan menerapkan beberapa basic styling pada elemen HTML.
Pengantar Pengenalan CSS
5 Menit
Keuntungan dan Cara CSS Bekerja
5 Menit
Memberi Markup pada Dokumen HTML
5 Menit
Menulis Aturan Styling
10 Menit
Melampirkan Styling pada Dokumen HTML
10 Menit
Pengantar Latihan: Menerapkan Styling Dasar pada Halaman Profil
5 Menit
Latihan: Styling untuk Halaman Profil
10 Menit
Latihan: Menulis Rules pada Berkas CSS
10 Menit
Latihan: Menghubungkan Berkas CSS dengan Halaman Profil
10 Menit
CSS Conception
20 Menit
Rangkuman Pengenalan CSS
15 Menit
Kuis: Pengenalan CSS
15 Menit
Mendalami penerapan CSS dalam mempercantik tampilan halaman website secara lebih lanjut. Di antaranya seperti variatif selector, styling untuk font dan text, memahami tentang foreground color dan background color, box model, shadow, positioning, layouting menggunakan float, dan media query.
Pengantar Pendalaman CSS
5 Menit
Selector Dasar: Type Selector, dan Class Selector
15 Menit
Selector Dasar: ID Selector, Attribute Selector, dan Universal Selector
20 Menit
Combinators: Adjacent SIbling Selector dan General Sibling Selector
25 Menit
Combinators: Child Selector dan Descendant Selector
25 Menit
Pseudo Selector
30 Menit
Formatting Text
5 Menit
Font Styling: Font Family dan Font Size
25 Menit
Font Styling: Font Weight, Font Style, Font Variant, dan Shorthand
15 Menit
Text Styling: Line Height, Text Indent, dan Text Alignment
20 Menit
Text Styling: Text Decoration, Text Transform, Word-Letter Spacing, dan Text Shadow
20 Menit
Pengantar Latihan: Menerapkan Font Styling pada Halaman Profil
5 Menit
Latihan: Menggunakan Font dari Google Fonts
25 Menit
Latihan: Menetapkan Ukuran, Ketebalan, dan Alignment Teks di Halaman Profil
30 Menit
Pewarnaan
5 Menit
Menetapkan Nilai Warna
25 Menit
Warna untuk Teks dan Latar Belakang
20 Menit
Opacity
20 Menit
Box Model
5 Menit
Apa Itu Box Element
5 Menit
Box Model: Box Dimensions
25 Menit
Box Model: Border
20 Menit
Box Model: Padding
20 Menit
Box Model: Margin
20 Menit
Box Model: Centering Content
15 Menit
Display Roles
15 Menit
Box Shadow
15 Menit
Rounded Corner
15 Menit
Pengantar Latihan: Mengatur Box Model di Halaman Profil
5 Menit
Latihan: Menetapkan Ukuran pada Gambar
20 Menit
Latihan: Menerapkan Card Style pada Elemen Article
20 Menit
Latihan: Menerapkan Jumbotron dan Navigasi pada Elemen Header
20 Menit
Latihan: Menyesuaikan Padding dan Margin pada Elemen Body dan Main
15 Menit
Positioning
5 Menit
Positioning: Perbedaan Static Flow dan Non-Static Flow
15 Menit
Positioning: Normal Flow
15 Menit
Positioning: Relative Positioning
15 Menit
Positioning: Absolute Positioning
20 Menit
Positioning: Fixed Positioning
15 Menit
Floating
20 Menit
Permasalahan Penerapan Float
15 Menit
Clear Property
15 Menit
Teknik Overflow
15 Menit
Pengantar Latihan: Menerapkan Positioning dan Float pada Halaman Profil
5 Menit
Latihan: Menerapkan Float pada Elemen Content dan Aside
30 Menit
Konfigurasi Meta Tag Viewport untuk Responsibilitas Layout
20 Menit
Specific Style dengan Media Query
20 Menit
Latihan: Membuat Mobile Version untuk Halaman Profil
25 Menit
Latihan: Menerapkan Sticky Position pada Navigation List
25 Menit
Debugging dan Optimasi
15 Menit
Rangkuman Pendalaman CSS
35 Menit
Kuis: Pendalaman CSS
15 Menit
Memahami tentang penggunaan flexbox sebagai teknik baru dalam menyusun layout yang mudah dan responsif pada beragam perangkat.
Pengantar Flexbox
5 Menit
Alasan Flexbox Hadir
10 Menit
Dasar-Dasar dan Terminologi Flexbox
15 Menit
Properti-Properti pada Flex Container
30 Menit
Properti-Properti pada Flex Items
25 Menit
Latihan: Implementasi Flexbox pada Halaman Profil
40 Menit
Pengenalan Latihan: Landing Page Dicoding
10 Menit
Latihan: Membangun Landing Page Dicoding
40 Menit
Latihan: Meningkatkan Responsivitas pada Landing Page Dicoding
25 Menit
Rangkuman Layout Responsif dengan Flexbox
15 Menit
Kuis: Layout Responsif dengan Flexbox
15 Menit
Mengingat kembali seluruh materi-materi yang dipelajari melalui rangkuman serta melakukan validasi kepemahaman dan ingatan melalui ujian akhir.
Rangkuman Kelas
60 Menit
Ujian Akhir
15 Menit
Membuat website sederhana dengan menerapkan semantic element dan layout flexbox.
Submission: Tugas Akhir Membuat Website
600 Menit