Dijital Saat Uygulaması Yapımı

Hazırlayan: 22430050003 Ömer Faruk YALÇINKAYA

React , Css ve JavaScript kullanarak 12 zaman dilimli bir dijital saat uygulaması oluşturmayı amaçladım.Bu 12 zaman dilimli dijital saat uygulması projemde 00.00-11.59 arası (AM),12.00-23.59 arası(PM) göstermektedir.Bu proje ile, gerçek zamanlı bir saat görüntüsü sunmayı hedefledim. Saat, dakika  saniye, gün, ay ve yıl bilgilerini içeren ve her saniye güncellenen bu  proje ile , kullanıcı dostu bir kullanım sağlamak ve kullanıcının istediği zamanda uygulamaya girip  o anki saati ve tarihi rahatça öğrenmesini hedefledim.Ayrıca sayfanın arka planında kullanıcıya hitap etmesi adına güzel arka plan resmi ekledim.

Bu projeyi, React kütüphanesini kullanarak  geliştirdim. React, kullanıcı arayüzlerini oluşturmak için kullanılan popüler bir JavaScript kütüphanesidir. Projeyi, "create-react-app" komutu ile oluşturulan bir başlangıç şablonu üzerine inşa ettim. Bu şablon, geliştirme sürecini kolaylaştırmak ve başlangıç yapılandırmasını sağlamak için bir dizi araç ve ayar içerir.

Projeyi, iki bileşenden oluşturdum: "Clock" bileşeni ve "App" bileşeni. "Clock" bileşeni, güncel saat ve tarih bilgilerini depolamak ve görüntülemek için kullandım. Bunun için React'in "useState" ve "useEffect" kancalarını kullandım. "useState" ile "time" adında bir state değişkeni tanımladım ve "setDate" fonksiyonuyla güncelledim. "useEffect" kancası, bileşenin oluşturulduğu anda bir zamanlayıcı başlattım ve her saniye "setDate" fonksiyonunu çağırarak saat bilgisini güncellemesini sağladım. Ayrıca, bileşenin hafızayı boşaltmasını sağlamak için "useEffect" kancasının temizleme fonksiyonunu kullandım.

"App" bileşeni, "Clock" bileşenini içeren ana bileşendir. Bu bileşeni kullanarak, uygulamanın genel yapısını belirlemek istedim. "Clock" bileşenini, "App" bileşeninde kullanarak web sayfasında görüntülenmesini sağladım.

Projeyi, terminalde "npm start" komutuyla başlattım ve localhost:3000 bağlantısında bana uygulamayı açtı. localhost:3000, yerel bir geliştirme sunucusudur ve projeyi tarayıcımızda görüntülememizi sağlar. Saat her saniye güncellenir ve sürekli olarak güncel saat ve tarih bilgisini görüntüler.

Sonuç olarak, dijital saat projesini web tabanlı bir uygulama olarak geliştirdim. Projede temel bir saat görüntüsü oluşturdum ve React framework'ü kullandım. Projeyi oluştururken, kullanıcıyı yormadan basit bir şekilde kullanılır ve  kullanıcıya güncel saat bilgisini   sunmayı amaçladım.