React ile Resim Galerisi Oluşturma Adım Adım

Bu proje, React kullanarak oluşturulan bir resim galerisi içerir.

Resimlere tıklanıldığında açılan bir lightbox özelliği vardır.

Kullanıcılar, resimleri yakınlaştırabilir ve tam ekran moduna geçebilir.

npm ile yeni bir React uygulaması oluşturmak için gerekli komutlar verilir.

Visual Studio Code kullanarak projeye başlangıç yapılır.

Uygulama için gerekli bağımlılıkların yüklenmesi sağlanır.

Lightbox paketi olan yet another react lightbox içeri aktarılır.

useState ile state yönetimi sağlanır.

Kullanıcı arayüzünde açık bir lightbox'ı yönetmek için buton eklenir.

Resim verileri Unsplash üzerinden alınarak data.js dosyasına yerleştirilir.

Resimler, lightbox içinde slayt gösterisi olarak görüntülenir.

Resimlerin görüntülenmesi için gerekli stil dosyaları içe aktarılır.

Lightbox içinde başlık ve açıklama gösterecek şekilde caption özellikleri eklenir.

Stil dosyaları ile görsel düzen ve konumlandırma gerçekleştirilir.

Tam ekran ve yakınlaştırma özellikleri lightbox'a eklenir.

Resimlere tıklanarak lightbox açma işlevi test edilir.

Hatalar düzeltilerek son düzenlemeler yapılır.

Uygulama kullanıcılar için etkili bir hale getirilir.