Angular02

Pada modul ini kita akan membuat template dari component recipe-detail. Saat ini template masih berupa hardcode, sebagai ide tampilan dahulu. Setelah ditambahkan recipe detail, tampilan kurang lebih seperti gambar diatas. Tujuannya, saat recipe dipilih, recipe detail akan ditampilkan. Untuk melakukan hal tersebut diperlukan komunikasi antar component, kita akan bahas komunikasi data antara component recipe-list dan … Read more

Recipe Model adalah class yang akan berisi stuktur data dari recipe. Dibuat dalam class agar kita mempunyai blueprint, jadi kita bisa konsisten dalam struktur data dari recipe. Buat file baru di folder recipes, dengan nama recipe.model.ts (penamaan bebas, disarankan nama harus deskriptif agar mudah dipahami). Untuk saat ini, data yang akan digunakan masih hardcode. Nanti … Read more

Setelah component selesai dibuat, berikutnya adalah mengatur hubungan antar component. Buka file app.component.html, akan berisi component header, recipes dan shopping list. Kemudian buka file recipes.component.html recipes.component.html akan berisi component recipe-list dan recipe-detail. Selanjutnya adalah file recipe-list.component.html, akan berisi component recipe-item. Kemudian buka file shopping-list.component.html, yang akan diisi component shopping-edit Berikutnya kita buat header, buka header.component.html. … Read more

Pendekatan tutorial adalah membuat real project, sambil mempelajar fitur-fitur Angular. Anda bisa membuat tema project sendiri, pada tutorial akan dibuat Buku Resep. Membuat Project Baru Untuk membuat angular project, lihat modul https://skillplus.web.id/instalasi-dan-project-setup/ Kita akan gunakan CSS Framework Bootstrap, lihat modul https://skillplus.web.id/menggunakan-bootstrap-pada-project-angular/ Planning Aplikasi Web app yang akan dibuat adalah seperti ini: Setup Project Silakan bereksperimen … Read more