acikyazilimagi / deprem-io-frontend

current-front

acikyazilimagi

BENİ OKU

Bu kod tabanında, şu anda yapım aşamasında bulunan acikyazilimagi.com'nun önizleme sürümü yer almaktadır.

main branch'ine aktarılan değişiklikler, bir dizi derleme işleminden sonra https://acikyazilimagi.com adresinde belirecektir.

Projeyi Çalıştırmak

Çalışma Ortamını Hazırlamak

node.js ve pre-commit'in son sürümlerinin sisteminizde kurulu olduğundan emin olun.

Repository'i klonlayıp, npm üzerinden bağımlılıkları çekerek çalışma ortamınızı hazır hale getirin.

git clone https://github.com/acikyazilimagi/acikyazilimagi.git
cd acikyazilimagi

corepack up
pre-commit install

Çalışmaya Başlamak

node --run dev komutu ile geliştirme modunda kod tabanına müdahale etmeye başlayabilirsiniz. Komutu çalıştırdıktan bir süre sonra browser'ınız açılacak, siz değişiklik yaptığınız sürece "hot reloading" sayesinde browser'daki kod otomatik olarak güncellenecektir.

Çalışmayı Kontrol Etmek

pre-commit run --all-files komutu ile yapılan geliştirmenin belirlenen standartlara uyup uymadığını kontrol edebilirsiniz. Eğer bu kontrolü yapmazsanız Pull Request oluşturduğunuzda GitHub tarafından bu kontroller otomatik işletilecek ve açmış olduğunuz Pull Request'i sizden güncellemenizi isteyecektir.

Bazı kod standartları otomatik olarak düzeltilebilmektedir, bunu sağlamak için node --run format komutunu kullanabilirsiniz.

Aynı zamanda yazmış olduğunuz birim testlerini node --test komutu ile başlatabilirsiniz. Testler de aynı lint işlemi gibi hem pull request hem de push esnasında GitHub Actions tarafından CI/CD otomasyonuna bağlı olarak çalıştırılmaktadır.

Dizin Yapısı

Klasör	Açıklama
/src/	Kaynak dosyalarını içeren klasör
/public/	Web dizininde yer alacak tüm statik dosyalar

Gereksinimler

• node.js (https://nodejs.org/)
• pre-commit (https://pre-commit.com/)

Lisans

MIT License, daha fazla detay için lütfen LICENSE dosyasını inceleyin.

Katkı Sağlayamak

Herhangi bir katkıya açıktır. Hata düzenlemeleri, yeni özellik ve modüller ekleyebilirsiniz.

• Koda katkı sağlamak için: Yukarıda anlatıldığı gibi repository'i klonlayın, değişikliklerinizi gerçekleştirin, ve bir pull request oluşturun.
• Bir hata bildirmek için: Bir şeyler ters gidiyorsa, GitHub Issues üzerinden yeni bir issue oluşturup bize bildirin.

deprem-io-frontend's Issues

yardimet tipi icin detay sayfasinda veriler fieldlarda gozukmuyor

Bug: Gida ve isinma Yardımı Detay

• Gida yardimda telefon numarası kısmında sıkıntı var enkaz formu gibi olsun
• Aracım var kısmındaki data gösterilmiyor

Enkaz alında bulunanlar sayfasında ki "Harita Görünümüne Tıkla" linki çalışmıyor

Açıklama ( Describe the bug)

Enkaz alında bulunanlar sayfasında ki "Harita Görünümüne Tıkla" linki çalışmıyor

Test yapılan link: https://dev.thechainlist.io/yardim-istekleri/enkaz.html#
Yönlendirilen hatalı link: https://dev.thechainlist.io/yardim-istekleri/enkaz-harita.html

Adımlar (To Reproduce)

• Ana sayfa yardım listesi altında ki enkaz altında bulunanlar linkine tıkla
• Sağ üstte bulunan Harita Görünümüne tıkla

Alınan sonuç (behavior)

Hata sayfası

Beklenen sonuç (Expected behavior)

Haritanın görüntülenmesi

Öncelik (Priority)

P3

Ekran Görüntüsü (Screenshots/Video)

(Mobil)Isınmaya İhtiyacım Var' a tıkladığımızda Isınma İhtiyaç Formu' da

Bug: Telefon alanı zorunlu olmayacak

telefon alanı zorunlu olmayacak ama enkaz gida ve ısınma formlarında frontendde zorunlu onu düzeltelim

Araç Fiterin Test

Gıda, ısınma ve erzak kısmında araç filteringinin diğer yerleri bozmuyor olması lazım

iletisim bilgileri doldurulacak

iletisim.html dosyasi https://deprem.io/iletisim seklinde doldurulacak diger sayfalarda ki formlari ornek alin lutfen

Static HTML generation / Templating

This is not urgent, but we'll have to talk soon or later.

When this repo was created, there weren't many pages, so to keep the requirements to a minimum, we worked directly on html pages. But now we need a template engine.

We need a tool where we can at least include HTML partials.

We can use

• vite.js with handlebars(https://github.com/alexlafroscia/vite-plugin-handlebars)
• pug.js with some bundler(gulp vs)

If anyone have experience with static html generation / templating, we can talk about it.

Formlarin basina uyari mesaji eklenmeli

Safari Tarayıcıda Dropdown Yazı Renklerİ

Safari tarayıcıda dropdownların rengi temaya uygun olarak düzenlenmeli.

yardimlar ve yardim istekleri olusturuldugunda alert eklenmeli

https://sweetalert2.github.io/
implement edilsin backend den gelen veriyi gorebilirsiniz

/yardimet şehir filtresi eklenecek

Backende /yardimet?sehir=Istanbul eklendi.

Şu backendden test edebilirsiniz
https://deprem-27jjydhzba-ew.a.run.app/yardimet?sehir=Istanbul

Konaklama Sayfası Sonrası Yönlendirme Problemi

Konaklama sayfasına tıkladıktan sonra (https://deprem.io/yardim-list-konaklama) iş makinesi'ne tıklandığında gıda, yolcu taşımaya'ya tıklandığında ısınma sayfasına yönlendirme yapılıyor.

“Yardım al” sekmesine yağma olaylarına müdahale için “güvenlik ihtiyacım var” sekmesi gerekecek.

depremyardim.com'a bağlantı verilmesi.

Merhabalar,

100k unique user'a sahip olan depremyardim.com'a aktif olarak kayıtlar girilmekte.
deprem.io yararlı linkler sayfasından depremyardim.com'a link verilebilir.

Yardım Al kısmındaki butonda ve sayfada yazım hatası

form submissiondan sonra ilgili listeye redirect edilmeli

ornegin gida formu submit edildiyse onay mesaji gozuktukten sonra gida bekleyenlerin listesine gecilebilir

Kronik rahatsızlıgı olanların ilaç problemi ile alakalı kısım

İsteğiniz şeyi tanımlayın
Bu alanda bölgeden sürekli girip çıkan ekiplerin kronik rahatsızlığı olan insanlara ilaç tedariğinde yardımcı olması amaçlı bi kısım uygun görülmesi halinde eklenebilir.
Bölgede bu amaçlı arayış çok fazlaymış, kronik rahatsızlığı olanlar o tarafa yardıma gelenlerden talep ediyormuş.
buraktuzlutas#4581

Değerlendirdiğiniz alternatifleri tanımlayın
Yardım Listeleri kısmına İlaç ihtiyacı olanlar bölge yakınlarından ilaç tedariği konusunda iletişime geçebilmeli

Ek Bağlam

Gece ve gündüz modlarının eklenmesi

Konaklama Sağlayanlar Detay sayfası yok

Konaklama Sağlayanlar Detay sayfası yok

yararli linkler sayfasi

deprem.io'da ki yararli linklerin olusturulmasi gerekiyor

Footer nav styling on mobile

nav elements can be listed one below the other or side by side with smaller font. all ui dev should be "mobile-first"

API endpointler degistirilecek

https://deprem-27jjydhzba-ew.a.run.app/yardim/63e3940d3c12f65e945ff371

Yardım list items fix view

yardım listeleri itemlerinde , isim numara tarih gibi bilgiler tam düzenli durmuyor onun düzeltilmesi lazım

Evim Müsait Yönlendirme Linki

Anasayfadan EvimMüsait projesine yönlendirme linkinin yerleştirilmesi.

https://evimmusait.com/
https://twitter.com/EvimMusait

/yardim:id bağlanacak

/yardim/:id kısmından canlı data çekilecek -> yardımKayit formu eklendi backendde dökümanı var

https://github.com/acikkaynak/deprem-io-backend

Şu endpointten test edebilirsiniz
https://deprem-27jjydhzba-ew.a.run.app/yardim/63e3940d3c12f65e945ff371

Paylaş butonu ile birlikte açılan container boş geliyor

İleriye yönelik bir geliştirme olup olmayacağını bilmiyorum ama bu buton ile açılan container boş geliyor.

Kurumlara bağış yap sayfasına yeni linkler eklenmesi

Liste sayfalarina liste front endi implement edilmeli

Liste sayfalarina yardim-istekleri.html de ki sekilde listeler implement edilmeli

Özellik isteği - Gıda yardımı sağlayanların listesi

Yardım Listeleri kısmında Gıda yardımı sağlayanların listesi yok, şehirlerde toplu olarak yemek dağıtımları yerleri var ama bunlar whatsapp, instagram, twitterdan geziniyor ama sağlıklı bir listeye ulaşılamıyor. Bilgi dağınıklığı mevcut. Bu issue'nun buraya ait olmadığını biliyorum ama size ulaştırmak için burdan yazıyorum. Bu özelliğin geliştirilmesi için destek vermeye hazırım

twitter share link'i çalışmıyor

ana sayfadaki paylaş kısmındaki twitter share çalışmıyor.

Formlara Google Maps Linki ekleyin

Formlara Google Maps Linki ekleyin

Köylerin Yardım Durumu Geri Butonu

"Köylerin Yardım Durumu" sayfasındaki geri butonu hep "Köylerin Yardım Durumu" sayfasına yönlendiriyor

Listelerin detay sayfalari yapilmali

deprem.io'nun aynisi seklinde detaylar ve yardim edilme formlari bulunmali ayni zamanda formlarin backend baglantilari yapilmali

• Enkaz ihtiyac
• Gida ihtiyac
• Isinma ihtiyac
• Oteller yardim
• Is makineleri yardim
• Yolcu tasiyabilenler yardim
• Gida yardim

Legal Documents and consent text for website

CEREZ_POLITIKASI (1).docx
Aydnlatma_ve_Rza_Metni.docx
GizlilikPolitikasi (1).docx

Aydınlatma Metni'ni okudum ve kabul ediyorum
Enkaz, yıkım, yardım ve destek ihtiyaçları konusunda verdiğim bilgilerin doğru ve teyit edilmiş olduğunu, bilgi kirliliği ve yanlış uygulamalara yol açmamak için gerekli tüm önlem ve tedbirleri aldığımı, vermiş olduğum bilgilerde meydana gelen değişiklik ve güncellemeleri bildireceğimi kabul ve beyan ederim.

Araç Durumu Database e yazılması kontrol edilmeli ve filtrelemeye katılmalı

Yardım talep formlarında birden fazla telefon numarası girilebilmesi

Afet bölgelerinde cep telefonu şarjı sorunu olduğu aşikar. Birden fazla telefon numarası alanı olması gerekli diye düşünüyorum.

detay sayfasinda dinamik arac durumunu

detay sayfasinda arac durumu backend baglatisi yapilmadi

Faydali linklere linkler eklenecek

https://linktr.ee/Kurtaranev?fbclid=PAAaZOauKEGjN-ALv4-uXRukR9TCMPzmeDx8nEMUIDF6hxVGGDjLuyvPj0JGg

KVKK düzenlenmesi gerekiyor

Ana sitede bu şekilde

Yolcu Taşıma Sayfasında Filtreleme Çalışmıyor

Yolcu Taşıma Sayfasında filtreleme fonksiyonu çalışmıyor, html dosyası ../assets/js/lists/ismakinesi.js script'ine point ediyor, yeni bir js dosyasında filtreleme fonksiyonunun doğru şekilde eklenmesi gerekiyor olabilir mi?

navbar responsive degil

yardim sagla kismina konum secenekleri

yardim sagla altinda bulunan formlarin icine konum secilebilecek selectbox eklenmeli

iletişim formu alert yok

gönder butonuna basamıyorum

Main nav share link alignment

share link is not aligned

can be fixed with css display flex on ".share-button-wrapper" element

Sahte Telefon numarası ve ilan girilmesi

sahte telefon numarası ve aynı başvurudan birden fazla olabiliyormuş. Bunun için

• numaralar +90 5XX XXX XX XX gibi kontrol edilebilir.
• İlanlar UID ile kontrol edilip, çoklanması engellenebilir
• numaralara sms - email verification entegrasyonu yapılabilir.

zorunlu alanların label'ları farklı renkte olsun

depremzedelerin daha hızlı giriş yapabilmesi için zorunlu alanlar daha belirgin olmalı.

Yardim haritalari kismini duzenleyelim

Adblock olan tarayicilarda site kullanilamiyor

Problem:
Adblocker olan tarayicilarda site kullanilamiyor. Bubble banner blocklandigi icin asagidaki banner cikiyor ve bir sure site https://bubble.io/ adresine yonlendiriliyor.

This app is a free plan and should have a Bubble banner. Please upgrade to remove this banner. Removing or altering the banner in any way is against Bubble terms and can lead to your account termination.

Ortam:
Chrome(macos) + uBlock

Zafiyet Adı : Information Disclosure

Zafiyet: Hassas Bilgi İfşası

Zafiyet Açıklaması: Kullanıcı adı , soyadı , telefon numarası gibi veriler uygulamada clear text olarak gözükmemektedir. Fakat uygulamadan dönen cevaplar incelendiğinde verilerin kullanıcıya açık bir şekilde gönderildiği gözükmektedir. Sadece arayüzde yıldızlı olarak gözükmektedir.

Bahsi Geçen İstekler:

Verileri döndüren URL : deprem.io/elasticsearch/msearch ve deprem.io/api/1.1/init/data?location=

Yeniden üretme adımları:

1.https://deprem.io/yardim-list-enkaz adresine gidin
2.Burp Suite intercepti açıp herhangi birinde "Detaya git"e basın.

3.elasticsearch/msearch ya da /api/1.1/init/data?location= ile başlayan request gelene kadar forward edin.

4.Bulduğunuz zaman repeater'a yollayın.

5.Bize gönderilen response'da veriler sansürsüz bir şekilde görülebilmekte.

Çözüm Önerisi : Yıldızlama işlemi sunucuda yapılıp, uygulama arayüzüne şifreli olarak gönderilmelidir.