Javascript Dersleri || JQuery Dersleri -46- Uygulama 6 : Login (Kullanıcı Girişi)

[@elmaddinbilga]

Ilk kullanici adindan baska digerlerini kabul etmiyor, alert veriyor

[@bidoluyazlm]

Elmaddin Mahammadli evet haklısınız orada küçük bir hata mevcut, 47. dersin yani bir sonraki videonun başında açıkladım bunu. Orayı izleyebilir ve düzeltebilirsiniz. İyi çalışmalar.

[@elmaddinbilga]

@@bidoluyazlm şimdi gördüm. Teşekkür ederim

[@YazilimciEfe]

​@@bidoluyazlmçok sağol abi

[@ibrahimapaydinn]

Bir kere o sayfanın linkini kopyalayan bir daha kullanıcı girişi yapmadan sayfayı kullanabilir. Phpde bu imkansız.

[@bidoluyazlm]

Bu bir pekiştirme olarak yapıldı. Normalde kullanılmaması gerektiğini söyledim diye hatırlıyorum

[@ozdusum]

Teşekkürler

[@bidoluyazlm]

iyi çalışmalar

[@yahyaktrcg3885]

Hocam sizin yaptığınız kodların hepsini yazdım ama bende çalışmadı neden acaba birşeyler import etmemmi gerekiyor

[@bidoluyazlm]

drive.google.com/drive/folders/1aWDX6X0AQHD59Kdnwb9Fo6Ou8i55cwbj?usp=sharing
Bu linkte kodlar mevcut bir karşılaştırın isterseniz. text-compare.com/ Bu site karşılaştırma yapmanızda yardımcı olabilir size

[@yahyaktrcg3885]

@@bidoluyazlm tamamdır hocam sağolun

[@kasdanadam2280]

"of" ne işe yarıyor acaba ilk defa gördüm de, cevabınızı bekliyorum :)

[@zekikayhan4892]

hocam burada hatamı bir türlü bulamadım buradan yazı olarak paylaşır mısınız?

[@bidoluyazlm]

ruclips.net/video/X8hCpXqKlQE/видео.html Açıklama kısmından kodlara ulaşabilirsiniz.

[@ozgurdogru2727]

hocam örnekler çok güzel çok teşekkürler. konumlandırma olarak flex kullanmanızı öneririm hocam. inputlar biraz asimetrik durmuş:))

[@bidoluyazlm]

Merhaba, çok teşekkür ederim beğenmenize sevindim. Genel olarak bootstrap candır diyorum:) yorumunuzda haklısınız daha iyisi olabilirdi. Görüntüde hoşuma gitmiyor, basit anlatmaya çalışmayı biraz abarttım sanırım, kusura bakmayın bunun için :)

[@ozgurdogru2727]

@@bidoluyazlm estağfurullah hocam siz, bizim için videolar çekerken ben neyin kusuruna bakacağım. Umarım kanalınız çok iyi yerlere gelir. Hak ettiğiniz izlenmelere ulaşırsınız

[@bidoluyazlm]

@@ozgurdogru2727 çok teşekkür ederim, iyi çalışmalar size de

[@muhammetaytas4328]

merhaba, hocam.
document.getElementById("kullaniciAdi").value;
satırında value yerine innerText yazınca hata vermesinin sebebi nedir, hocam?

[@bidoluyazlm]

Merhaba, innerText div yada p, h gibi elementlerin içine yazdırma işlemi yapar. Inputlar için, değer okuma ya da değer yazma işlemleri için value kullanılır.

[@KuleGalata]

hocam konu hala günel mi?

[@bidoluyazlm]

Nasıl yani anlayamadım

[@hasantaskn1594]

hocam merhaba ben de kodumu çalıştıramadım hatama bakıyorum bakıyorum bulamıyorum. Vaktiniz olursa bakmanız mümkün mü? Şimdiden teşekkür ederim.



javascript

body{
margin: 0;
background-color: aquamarine;
}
#div1{
width: 30%;
height: 200px;
position: absolute;
background-color: lightgreen;
border-radius: 15px;
left: 35%;
top: 25%;
}
#kullaniciadi{
width: 150px;
height: 30px;
margin-left: 20px;
margin-top: 20px;
}
#parola{
width: 150px;
height: 30px;
margin-left: 66px;
margin-top: 20px;
}
#btn{
width: 250px;
height: 30px;
margin-left: 73px;
margin-top: 10px;
}



Kullanici Adi:

Parola:


Giriş Yap
var kullanicilar = [{kullaniciadi:"admin", parola:"admin"},
{kullaniciadi:"javascript", parola:"1234"},
{kullaniciadi:"bidoluyazilim", parola:"4321"}];
var girilenkullaniciadi;
var girilenparola;
var x;
function kontrolet() {
girilenkullaniciadi = document.getElementById("kullaniciadi").value;
girilenparola = document.getElementById("parola").value;
for(x of kullanicilar) {
if( (x.kullaniciadi == girilenkullaniciadi) && (x.parola == girilenparola)) {
return true;
}
else{
return false;
}
}
}
function girisonayi() {
kontrolet();
if(kontrolet()) {
window.open("45gerisay.html", "_self");
}
else {
alert("Hatalı giriş yaptınız. Tekrar deneyiniz..");
document.getElementById("kullaniciadi").value= "";
document.getElementById("parola").value= "";
}
}

[@bidoluyazlm]

Merhaba,
Giriş Yap
burada girisonayi dedikten sonra fonksiyon olduğu için parantez aç-kapa eklemeniz gerekir.
Giriş Yap
Bu şekilde yaparsanız çalışacaktır :)

[@hasantaskn1594]

@@bidoluyazlm hocam ne diyeceğimi bilemiyorum. O kadar kontrol ettim ki anlatamam. Nasıl görebiliyorsunuz. Saygılarımla önünüzde şapka çıkartmak istiyorum. Sorulara cevap verdiğiniz için ayrıyeten teşekkür ederim

[@bidoluyazlm]

@@hasantaskn1594 rica ederim. Olur öyle şeyler sıkmayın canınızı. Bazen böyle küçük şeyler gözden kaçabiliyor :)

[@meryemoralsu]

Merhabalar ben arkaplandaki değişiklikler olmadan sadece div1 kısmı ile yaptım uygulamayı, fakat çalışmıyor. Nerede yanlış yapmış olabilirim, yardımcı olursanız sevinirim..
UYGULAMA 6

#div1 {
width: 30%;
height: 150px;
background-color: darkgrey;
border-radius: 10px;
text-align: center;
margin-top: 170px;
margin-left: 450px;
font-size: 25px;
padding-top: 60px;
}
#btn1{
font-size: 20px;
margin-left: 150px;
}



Kullanıcı Adı :


Parola :


GİRİŞ YAP

var kullanicilar = [{ kullaniciAdi: "admin", parola: "admin"},
{kullaniciAdi: "Şafak ", parola: "123"},
{kullaniciAdi: "Oral", parola: "123"}];
var girilenKullaniciAdi;
var girilenParola;
function kontrolEt() {
girilenKullaniciAdi = document.getElementById("kullaniciAdi").value;
girilenParola = document.getElementById("parola").value;
for (x of kullanicilar) {
if ((x.kullaniciAdi == girilenKullaniciAdi) && (x.parola == girilenParola))
{
return true;
}

}
function girisOnayi() {
kontrolEt();
if (kontrolEt()) {
window.open("uyg5.html", "_self");
}
else{
alert("Kullanıcı adı veya şifre hatalı. Yeniden deneyiniz...");
}

}

[@bidoluyazlm]

Merhaba, geç dönüşüm için kusura bakmayın yeni bakabildim. İlk olarak kontrolEt() fonksiyonunu açmışsınız ama "}" ile kapatmayı unutmuşsunuz burası birinci hata. İkincisi ise girisOnayi() fonksiyonunu kontrolEt() içinde yazmışsınız. Bu sebeple butona tıklandığında o buton bunu görmüyor ve çalışmıyor. Bu fonksiyonu ayrı bir fonksiyon olarak dışarıda yazmanız gerekir. Bu şekilde düzenlerseniz çalışacaktır. Aşağıda çalışan kodu paylaşıyorum sizinle. İyi çalışmalar :)
UYGULAMA 6

#div1 {
width: 30%;
height: 150px;
background-color: darkgrey;
border-radius: 10px;
text-align: center;
margin-top: 170px;
margin-left: 450px;
font-size: 25px;
padding-top: 60px;
}
#btn1{
font-size: 20px;
margin-left: 150px;
}



Kullanıcı Adı :


Parola :


GİRİŞ YAP

var kullanicilar = [{ kullaniciAdi: "admin", parola: "admin"},
{kullaniciAdi: "Şafak ", parola: "123"},
{kullaniciAdi: "Oral", parola: "123"}];
var girilenKullaniciAdi;
var girilenParola;


function kontrolEt() {
girilenKullaniciAdi = document.getElementById("kullaniciAdi").value;
girilenParola = document.getElementById("parola").value;
for (x of kullanicilar) {
if ((x.kullaniciAdi == girilenKullaniciAdi) && (x.parola == girilenParola))
{
return true;
}

}


}
function girisOnayi() {
kontrolEt();
if (kontrolEt()) {
window.open("uyg5.html", "_self");
}
else{
alert("Kullanıcı adı veya şifre hatalı. Yeniden deneyiniz...");
}

}

[@meryemoralsu]

@@bidoluyazlm Süpersinizzz, cok teşekkür ediyorum, sizde biliyorsunuz zaten insan böyle bir yerde takılınca ve arayıp arayıp bulamayınca demoralize oluyor. Şimdi topladım hemen kendimi, emeğinize sağlık tekrardan...

[@bidoluyazlm]

@@meryemoralsu Rica ederim, demoralize olabilirsiniz tabii ki ama düşmek olmasın. Kolay bir iş değil ve yolun başındasınız, inancımızı yüksek tutalım, ben inanıyorum başaracaksınız :)

[@canncoder]

hocam kaliteli stok fotograf sitesi veya uygulaması tavsiye edermisiniz pinterest kullanıyorum ama bazen çoğu kötü oluyor

[@bidoluyazlm]

Ne yazık ki, çok fazla kullanmıyorum böyle uygulamalardan :(

[@turktale5895]

hocam mesela diyelimki sitemize host verdik rasgele bir kişi kaydolucak hani biz yeni obje ekledikya onu bi buttona atayabilirmiyiz?

[@bidoluyazlm]

Merhaba, burada sadece küçük bir örnek yapmak istedim, normalde kullanıcı bilgileri veritabanında kayıtlı olmalıdır, kimsenin görmemesi gerekir. O yüzden burada yaptığımız sadece olayın biraz mantığını anlatmaktı, yoksa tabii ki veriler bu şekilde göz önünde tutulmaz. Yeni kayıtlar da girişler de veritabanından kontrol edilerek onaylanır veya reddedilir.

[@rubblesoarch]

Hocam proje yi "zip " olarak atabilirmisiniz

[@gl.goncaa]

hocam kullanıcı adı ve parolayı veritabınında tutmak ve ordan çekmek daha sağlıklı değil mi, bu tercih edilen bir yol mu ?

[@bidoluyazlm]

Hayır, bunu kesinlikle örnek olarak yaptım asla bu şekilde tutulmaz. Aklınızda böyle kalmasın. Şifreler kriptolanarak tutulmalıdır. Kolay kolay çözümlenememelidir.

[@gl.goncaa]

@@bidoluyazlm anladım teşekkürler

[@mertfromhell]

hocam bunları gerçek bir site yaparken mesela böyle giriş sayfası yaptık veritabanını da bağladık diyelim kullanıcı üye olup giriş yaptığında anasayfaya yönlendirmek için dosyaları mı kullanmalıyız bu videodaki gibi yoksa backend için öğreneceğimiz frameworkde böyle sayfa atlamalar yer alırmı?

[@bidoluyazlm]

Merhaba, window.open sadece burada göstermek içindi. Bunu da tabii ki kullanabilirsiniz, farklı sayfalama yapabilirsiniz, ama tek bir sayfa üzerinden bunlar başarılı olunca bu sayfanın içerisini şu şekilde doldur gibi javascript müdahalesi de yapabilirsiniz.

[@serhun4949]

tam olarak neresi jquery

[@bidoluyazlm]

50. ders ile başlıyor

[@erhani2005]

Hocam oncelikle emeginize saglik.Hersey cok iyi ama ben array'de 3 isim ve parola yazdim inputta isim ve parola girdigimde sadece ilk isim dogru cikiyor ve 2.3 isimleri girdigimde hep yanlis veriyor.ben bu defa 2ci siradaki ismi ilk indexte yazdigimda calisiyor.Yani ozet olarak sadece arraydeki ilk isim ve parola calisiyor diger ikisini 100% dogru girsem de yanlis veriyor cok ilginc bir turlu cozemedim

[@bidoluyazlm]

Merhaba, ben çözdüm bir sonraki uygulamanın başına bakabilirsiniz :)

[@erhani2005]

@@bidoluyazlm sagolun hocam.Allah yardimcin olsun Cok emek veriyorsun insallah karsiligini kat be kat alirsin

[@bidoluyazlm]

@@erhani2005 Çok teşekkür ederim, güzel yorumlarınız beni oldukça mutlu ediyor, alıyorum gibi emeğimin karşılığını :)

[@deperusS]

çok uğraştım ama çalıştıramadım nerde hata yaptım bulamıyorum html ve js kısmını buraya atıyorum biri yardım edebilirse çok mutlu olurum



Ödev 4




var kullanicilar = [{kullaniciAdi:"admin",parola:"123"}];
var girilenkullaniciAdi;
var girilenParola;
var x;
function kontrolEt(){
girilenkullaniciAdi = document.getElementById("kullaniciAdi").value;
girilenParola = document.getElementById("parola").value;
for(x of kullanicilar){
if((x.kullaniciAdi == girilenkullaniciAdi) && (x.parola == girilenParola)){
return true;
}
else{
return false;
}
}
}
function girisOnayi(){
kontrolEt();
if(kontrolEt){
window.open("admin.html","_self");
}
else{
alert("Hatalı Kullanıcı Adı veya Parola")
document.getElementById("kullaniciAdi").value = "";
document.getElementById("parola").value ="";
}
}


Yönetim Paneli



Giriş

[@bidoluyazlm]

if(kontrolEt())
Bu şekilde değiştirirseniz düzelecektir. Fonksiyon olduğu için parantez olmadığında çalışmıyor.