Node.JS ile Kullanıcı Kayıt ve Giriş İşlemleri

Blog Gönderisi Resmi

Hizmetlerimiz hakkında bilgi almak için tıklayın.

Bugünkü konumuzda Node.JS ile kullanıcı kayıt olma ve giriş yapma endpointlerini göstereceğiz, öncelikle dikkat etmeniz gereken konulardan bir tanesi sunucunuzun Node.JS destekleyip desteklemediğidir, Eğer sunucunuz Node.JS işlemlerini desteklemiyorsa, aynı işlemleri PHP üzerinden yapabilirsiniz, genel olarak tüm sunucular PHP destekler.

PHP ile Kayıt Olma ve Giriş Yapma İşlemleri

Sunucunuz Node.JS destekliyorsa, devam edelim ->

HTML Formları Oluşturma

Kayıt Ol

İlk önce kayıt olma bölümünün HTML Kodlarını yazalım ->


<form action="http://localhost:3000/register" method="post">
    <input type="text" name="username" placeholder="Kullanıcı Adı" required>
    <input type="email" name="email" placeholder="E-posta" required>
    <input type="password" name="password" placeholder="Şifre" required>
    <button type="submit">Kayıt Ol</button>
</form>

Giriş Yap

Ardından, giriş yapma bölümünün HTML kodlarını yazalım ->


<form action="http://localhost:3000/login" method="post">
    <input type="text" name="username" placeholder="Kullanıcı Adı" required>
    <input type="password" name="password" placeholder="Şifre" required>
    <button type="submit">Giriş Yap
</form>

Node.JS Geçişi


Node.js kullanarak bir kayıt ve giriş sistemi oluşturmak için server.js dosyası, HTML formu ve veritabanı bağlantısını içeren bir yapı kuracağız.

  1. Bu makalede mysql kullanacağız.
  2. Bu makalede express kullanacağız.
  3. Bu makalede bcrypt kullanacağız.

Gerekli Modülleri Yükleme


Terminal veya komut satırında bu komutları çalıştırarak gerekli modülleri yükleyin:


npm init -y
npm install express mysql bcrypt body-parser

Gerekli modülleri yükleyerek, projemizin ihtiyaçları doğrultusunda kullanacağımız modüller geliştirilebilir ve arttırılabilir.

Veritabanı Oluşturma


Öncelikle, kullanıcı bilgilerini saklamak için basit bir veritabanı yapısı gereklidir. MySQL kullanarak users adında bir tablo oluşturabiliriz:


CREATE TABLE users (
    id INT AUTO_INCREMENT PRIMARY KEY,
    username VARCHAR(50) NOT NULL,
    email VARCHAR(100) NOT NULL,
    password VARCHAR(255) NOT NULL
);

server.js Dosyasını Oluşturma


server.js dosyasında, bir Express sunucusu kuracak ve veritabanı işlemlerini yöneteceğiz.


const express = require('express');
const mysql = require('mysql');
const bcrypt = require('bcrypt');
const bodyParser = require('body-parser');

const app = express();
const saltRounds = 10;

Veritabanı Bağlantısı


Veritabanımızı oluşturduk, server.js'ye gerekli modülleri yükledik, şimdi veritabanımıza bağlanabilmek için gerekli kodu server.js dosyamıza ekleyelim.


// Veritabanı bağlantısını yapılandırma
const db = mysql.createConnection({
    host: 'localhost',
    user: 'root', // Kullanıcı adınız
    password: '', // Veritabanı şifreniz
    database: 'test' // Veritabanı adınız
});

// Veritabanına bağlanma
db.connect((err) => {
    if (err) throw err;
    console.log('Veritabanına bağlandı');
});

// Body-parser middleware'ını kullanma
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));

Kayıt Ol Endpoint


Veritabanımızı oluşturduk, server.js'ye gerekli modülleri yükledik, ardından kayıt olmak için gerekli endpointi server.js dosyamıza ekleyelim.


// Kayıt Endpoint'i
app.post('/register', (req, res) => {
    const { username, email, password } = req.body;
    bcrypt.hash(password, saltRounds, (err, hash) => {
        if (err) {
            res.send({ success: false, message: 'Şifre hashleme hatası' });
        } else {
            const sql = 'INSERT INTO users SET ?';
            const user = { username, email, password: hash };

            db.query(sql, user, (err, result) => {
                if (err) throw err;
                res.send({ success: true, message: 'Kullanıcı kaydedildi' });
            });
        }
    });
});

Giriş Yap Endpoint


Kullanıcıları başarıyla veritabanımıza kayıt ettikten sonra, kullanıcıların giriş yaparken doğrulayabilmek için bir de giriş yapma endpointine ihtiyacımız var.


// Giriş Endpoint'i
app.post('/login', (req, res) => {
    const { username, password } = req.body;
    const sql = 'SELECT * FROM users WHERE username = ?';

    db.query(sql, [username], (err, results) => {
        if (err) throw err;

        if (results.length > 0) {
            bcrypt.compare(password, results[0].password, (err, isMatch) => {
                if (err) throw err;
                if (isMatch) {
                    res.send({ success: true, message: 'Giriş başarılı' });
                } else {
                    res.send({ success: false, message: 'Hatalı şifre' });
                }
            });
        } else {
            res.send({ success: false, message: 'Kullanıcı bulunamadı' });
        }
    });
});

Sunucuyu Başlatma


Her şey tamamsa, sunucumuzu başlatalım!


// Sunucuyu başlatma
const port = 3000;
app.listen(port, () => {
    console.log(`Sunucu http://localhost:${port} üzerinde çalışıyor`);
});

Bu HTML dosyalarını herhangi bir web tarayıcısında açarak, form üzerinden veri gönderebilirsiniz.

server.js dosyasını çalıştırarak Node.js sunucusunu başlatın ve localhost:3000 adresinde kayıt ve giriş işlemlerini gerçekleştirin.


node server.js

Notlar:


  1. Uygulamaya kendi isteklerinize göre kayıt olma formlarına Gizlilik Politası gibi checked'ler ekleyebilirsiniz.
  2. Gerçek bir uygulamada, HTTPS kullanarak veri iletimini güvenli hale getirmelisiniz.
  3. CORS (Cross-Origin Resource Sharing) ayarlarını yapılandırmanız gerekebilir, özellikle farklı bir port veya domain üzerinden istek gönderiyorsanız.
  4. Bu örnekler, temel bir anlayış için tasarlanmıştır. Uygulamanızı canlıya almadan önce güvenlik ve hata yönetimine dikkat edin.

Sizin İçin Önerdiklerimiz

Blog Resim
JavaScript Öğrenmeye Nerden Başlamalıyım?

JavaScript

Günümüzün en popüler programlama dillerinden biri olan JavaScript, web uygulamaları, tarayıcı oyunları, mobil uygulamalar ve hatta sunucu taraflı..

Devamını Oku
Blog Resim
Load-More Butonu Yapımı ve SEO Bakımından Önemi

JavaScript

Load more buttonu, bir web sitesinde belirli bir sayfada yer alan içeriğin sınırsız bir şekilde yüklenmesini sağlayan bir butondur. Bu buton, kullanıcıların...

Devamını Oku
Blog Resim
JavaScript Kütüphanelerinde En Çok Kullanılanlar

JavaScript

JavaScript, web geliştiricilerin en çok kullandığı programlama dillerinden biridir ve web sayfalarına etkileşimli özellikler eklemek için sık sık kullanılır.

Devamını Oku
Blog Resim
JavaScript’te Asenkron Programlama Nedir?

JavaScript

JavaScript, web uygulamalarının en yaygın kullanılan programlama dillerinden biridir. Ancak, web uygulama geliştiricileri genellikle JavaScript'teki ..

Devamını Oku