Slide DevCoach

DevCoach 129 : Back-End | Membangun aplikasi modern dengan Message Queue

Transcript

1. Dicoding Slides Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore. Front-End Web
2. Position CSS Pre-processor, Lebih dari Sekadar Penulisan Gaya Front-End Web Nur Rizki Adi Curriculum Developer
3. Learning Objectives • Apa Itu CSS pre-processor • Sass, salah satu CSS pre-processor • Fitur-fitur dari Sass • CSS Basic vs. CSS pre-processor • Penerapan Sass dalam landing page. Front-End Web
4. Agenda • Apa Itu Asynchronous JavaScript Request • Konsep Kerja Asynchronous Request • Web API untuk Membuat Request • Format Pertukaran Data • Global Asynchronous Function Front-End Web
5. CSS Native atau CSS Framework? Front-End Web
6. CSS frameworks…
7. Or… CSS native?
8. CSS Native atau CSS Framework? Silakan tulis preferensimu di live chat youtube! Front-End Web
9. CSS Pre-processor Sass Front-End Web
10. Sass Front-End Web
11. Kenalin, Aku Sass • Singkatan dari Syntactically Awesome Style Sheets. • Dikembangkan oleh Hampton Catlin. Front-End Web
12. Apa sih Maksud dari CSS Pre-processor? Front-End Web
13. Apa Itu CSS Pre-processor • Sebuah program yang dapat menghasilkan kode CSS dari kode lain yang lebih kaya fitur dan manfaat. • Dengan adanya ia, kita dapat menuliskan kode CSS layaknya bahasa pemrograman yang memiliki beragam fitur, misalnya variabel, operator, percabangan, perulangan, dan sebagainya. Front-End Web
14. Cara Kerja CSS Pre-processor Front-End Web
15. Fitur-Fitur dalam Sass • Tipe Data dan Variabel • Nesting Selector • Flow control • Function • Mixin • Modular dengan Use • Built-in Module Front-End Web
16. Let’s get dirty our hands
17. Manfaat CSS Pre-processor • Web developer makin semangat dan senang. • Memiliki fitur-fitur yang tidak dimiliki oleh CSS native. • Memfasilitasi penulisan kode secara rapi, terstruktur, dan hemat untuk memproduksi kode CSS. • Proses debugging atau maintenance menjadi lebih mudah dan cepat. • Memiliki kendali untuk memodifikasi beragam framework CSS (seperti Bootstrap). • Tidak sedikit perusahaan yang menggunakan Sass. Front-End Web
18. Fitur-Fitur yang Sudah Ada di CSS • Using CSS custom properties (variables) • Using CSS nesting • Flow control Front-End Web
19. Vendor-Vendor CSS Pre-processor Front-End Web
20. What are the best CSS preprocessors/postprocessors?
21. Thank You nurrizkiadip Nur Rizki Adi Prasetyo @NAdiPrasetyo nrizki@dicoding.com Nur Rizki Adi Prasetyo Nur Rizki Adi Prasetyo Front-End Web
22. Feedback! Hadiah: • 2 Token Langganan Academy (30 Hari) *untuk pengisi feedback terpilih! dicoding.id/devcoachfeedback
23. Front-end Web