ozancylan / to-do-list

bootstrap, Css ve Javascript kullanarak hazırladığım Yapılacaklar Listesi

Home Page:https://ozancylan.github.io/to-do-list/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

TO-DO LIST - YAPILACAKLAR LİSTESİ

Kodluyoruz.org & Patika.dev Başlangıç Seviye Frontend Web Development Patikası

Eğitim kapsamında Javascript ile to-do list geliştirdim.

to-do.list.mp4

Bootstrap, Css ve Javascript kullanarak Yapılacaklar Listesi geliştirdim. Eğitim kapsamında bazı zorunluluklar vardı. Örneğin; HTML içinde zorunlu olarak liste tanımlamamız gerekiyordu. Direkt olarak Javascript üzerinden atama yapmak yeterli değildi. Bu sebeple yazılan fonksiyonların tamamı ona göre yapıldı. Localstorage eklerken çok zorlandığımı itiraf etmeliyim. Bunun için bana yardımcı olan Tuğba Güler ' e tekrar çok teşekkür ederim.

Proje;

  • responsive yapıya sahip,

  • CSS ve Bootstrap ile renklendirme ve biçimlendirmeleri var
    (:hover, box-shadow, gradient gibi)

  • boş element eklemenizi önlüyor ve uyarı veriyor,

  • liste elemanı eklediğiniz ve sildiğinizde bildirim veriyor(Bootstrap, Toast özelliği ile),

  • liste elemanına tıkladığınızda "yapıldı" olarak işaretleniyor ve üstü çiziliyor,

  • localstorage sayesinde verileriniz kaybolmuyor dilediğiniz şekilde kullanabiliyorsunuz.

Ancak HTML'de bulunan elemanların kalması gerekiyor

Proje linki

Kullandığım teknolojiler;

  • HTML5
  • CSS
  • BOOTSTRAP v5.2
  • JAVASCRIPT

Yardım aldığım web sayfaları;

Renk Paletleri

Patika.dev Javascript

Gradient Generator

Fontawesome'dan CDN linki;

cdnJS sayfasından alındı

Ayrıca gerekli dosyalar klasörler olarak projenin içinde var. Versiyonları da görülmesi açısından isimlerini değiştirmedim.

Dilerseniz forklayabilir, clonelayabilir bilgisayarınızda çalıştırıp değişiklikler yapabilirsiniz. Yorumlara yazmanız ve istek göndermeniz yeterlidir.


📚Hakkımda;

LinkedIn

Patika.dev

📬Bana ulaşın

About

bootstrap, Css ve Javascript kullanarak hazırladığım Yapılacaklar Listesi

https://ozancylan.github.io/to-do-list/


Languages

Language:HTML 61.2%Language:JavaScript 38.8%