todo-list-homework

Arkadaşlar merhaba, Bu haftaki ev ödevinizde VUE CLI ortamında component kullanarak bir todo list app hazırlamanızı istyeceğim.

DETAYLAR

• Bootstrap kütüphanesini dahil edip kullanmanızı istiyorum.

• 1 adet form componenti olmalı ve form componenti içerisinde title, description ve status form elemanlarını barındırmalı. Status değerlerimiz WAITING, IN PROGRESS ve COMPLETED

• İlgili form edit ve yeni todo eklemede kullanılacak.

• Edit ve Yeni ekleme sırasında buton text'i ve rengi farklı olmalı

• 1 adet todo item componentimiz olmalı bu compenent todo detaylarını göstermeli ve bir edit butonu içermeli. Status tipine göre farklı renkte olmalı. Her status için bir renk ataması yapmalısınız.

• Her Status için bir selectbox ile filtre yapacağız. Filtreye göre seçilen todo itemlar ekranda belirecek. Diğerleri ekrandan kaldırılacak. Tümünü seçtiğimde tekrar tümü gelmeli.

ARAŞTIRMA VE EK OLARAK

• Validasyonlar için VeeValidate kütüphanesini araştırıp uygulamaya çalışmanızı istiyorum. Form field'ları boş ise validate etmeye çalışalım.
• Validasyon yapamayan arkadaşlar için ödevi yine kabul edeceğim. Ama artık bu tarz entegrasyonları yapabiliyor olmalısınız. Örnek dokümandaki kodları kendi projemize uygulayıp entegre etmeye çalışalım lütfen.

Kaynak: https://logaretm.github.io/vee-validate/#usage

Yardımcı Kaynaklar

https://www.npmjs.com/package/bootstrap

https://logaretm.github.io/vee-validate/

https://logaretm.github.io/vee-validate/#usage

ve tüm yaptığımız örnekler....