Rel

controllers/auth.js

@@ -0,0 +1,26 @@
+const {Application} = require("../core/server");
+
+
+Application.get("/", LoginPage);
+Application.get("/login", LoginPage);
+Application.get("/register", RegisterPage);
+
+/**
+ * @param {import("express").Request} request
+ * @param {import("express").Response} response
+ */
+async function LoginPage(request, response)
+{
+    response.render("login");
+}
+
+
+
+/**
+ * @param {import("express").Request} request
+ * @param {import("express").Response} response
+ */
+async function RegisterPage(request, response)
+{
+    response.render("register");
+}

core/server.js

@@ -4,4 +4,6 @@ const Application = express();
 
 Application.listen(3307);
 
+Application.set('view engine', 'ejs');
+
 exports.Application = Application;

database/connection.js

@@ -0,0 +1,7 @@
+const knex = require("knex");
+
+const config = require("../config.json");
+
+const DB = knex(config.database);
+
+module.exports = DB;

database/session.js

@@ -0,0 +1,24 @@
+const DB = require("./connection");
+const session = require('express-session');
+const KnexSessionStore = require('connect-session-knex')(session);
+const {Application} = require("../core/server");
+
+const store = new KnexSessionStore({
+    knex: knex,
+    tablename: 'sessions',
+    sidfieldname: 'sid',
+    createtable: true,
+    clearInterval: 1000 * 60 * 60 // Süresi dolmuş sessionları temizleme aralığı (1 saat)
+});
+
+Application.use(session({
+    secret: 'ekoetkimardinsaqut',
+    resave: false,
+    saveUninitialized: false,
+    store: store,
+    cookie: {
+        maxAge: 1000 * 60 * 60 * 3,
+        secure: true,
+        httpOnly: true 
+    }
+}));

index.js

@@ -1,4 +1,6 @@
 require('dotenv').config({quiet:true});
 
 require("./core/server.js");
-require("./core/static.js");
+require("./core/static.js");
+
+require("./controllers/auth.js");

public/assets/css/style.css

@@ -23104,9 +23104,6 @@ input[type=range]::-webkit-slider-thumb {
   margin-bottom: -60px;
   position: relative;
 }
-.login-form-container .logo img {
-  filter: brightness(100);
-}
 .login-form-container .app-form {
   padding: 30px 30px;
 }

views/login.ejs

@@ -0,0 +1,41 @@
+<%-include("./partials/header.ejs") %>
+<div class="">
+    <main class="w-100 p-0">
+        <div class="container-fluid">
+            <div class="row">
+                <div class="col-12 p-0">
+                    <div class="login-form-container">
+                        <div class="mb-4">
+                            <a class="logo" href="index.html">
+                                <img alt="#" src="/logo.png" class="w-100 h-100">
+                            </a>
+                        </div>
+                        <div class="form_container">
+                            <form class="app-form" method="post" action="/login" enctype="multipart/form-data">
+                                <div class="mb-3 text-center">
+                                    <h3>Hesabınıza Giriş yapın</h3>
+                                    <p>
+                                        EkoEtki: Doğadaki izinizi ölçen, çevresel farkındalığı puanlayan akıllı ekolojik karne sistemidir
+                                    </p>
+                                </div>
+                                <div class="mb-3">
+                                    <label class="form-label" for="emailId">E-Posta Adresiniz</label>
+                                    <input class="form-control" type="email" id="emailId">
+                                </div>
+                                <div class="mb-3">
+                                    <label class="form-label" for="password">Şifreniz</label>
+                                    <input class="form-control" type="password" id="password">
+                                </div>
+                                <div>
+                                    <button class="btn btn-primary w-100" type="submit">Giriş Yap</button>
+                                    <a class="btn btn-primary w-100 mt-1" href="/register">Kayıt Ol</a>
+                                </div>
+                            </form>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </main>
+</div>
+<%-include("./partials/footer.ejs") %>

views/partials/footer.ejs

@@ -0,0 +1,5 @@
+</div>
+<script src="../assets/js/jquery-3.6.3.min.js"></script>
+<script src="../assets/vendor/bootstrap/bootstrap.bundle.min.js"></script>
+</body>
+</html>

views/partials/header.ejs

@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="tr">
+<head>
+    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
+    <meta content="IE=edge" http-equiv="X-UA-Compatible">
+    <meta content="width=device-width, initial-scale=1.0" name="viewport">
+    <meta content="la-themes" name="author">
+    <link href="/favicon.png" rel="icon" type="image/x-icon">
+    <link href="/favicon.png" rel="shortcut icon" type="image/x-icon">
+    <title>Ekoetki</title>
+    <link href="../assets/vendor/fontawesome/css/all.css" rel="stylesheet">
+    <link href="https://fonts.googleapis.com" rel="preconnect">
+    <link crossorigin href="https://fonts.gstatic.com" rel="preconnect">
+    <link href="https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap" rel="stylesheet">
+    <link href="/assets/vendor/tabler-icons/tabler-icons.css" rel="stylesheet" type="text/css">
+    <link href="/assets/vendor/bootstrap/bootstrap.min.css" rel="stylesheet" type="text/css">
+    <link href="/assets/css/style.css" rel="stylesheet" type="text/css">
+    <link href="/assets/css/responsive.css" rel="stylesheet" type="text/css">
+</head>
+<body>
+<div class="app-wrapper d-block">

views/register.ejs

@@ -0,0 +1,49 @@
+<%-include("./partials/header.ejs") %>
+<div class="">
+    <main class="w-100 p-0">
+        <div class="container-fluid">
+            <div class="row">
+                <div class="col-12 p-0">
+                    <div class="login-form-container">
+                        <div class="mb-4">
+                            <a class="logo" href="index.html">
+                                <img alt="#" src="/logo.png" class="w-100 h-100">
+                            </a>
+                        </div>
+                        <div class="form_container">
+                            <form class="app-form">
+                                <div class="mb-3 text-center">
+                                    <h3>Yeni hesap oluşturun</h3>
+                                    <p>
+                                        EkoEtki; bireylerin doğaya yönelik tutumlarını objektif kriterlerle analiz eden ve çevresel farkındalığı dijital bir 'Doğa Puanı' ile somutlaştıran yenilikçi bir davranış ölçümleme sistemidir.
+                                    </p>
+                                </div>
+                                <div class="mb-3">
+                                    <label class="form-label">Username</label>
+                                    <input class="form-control" placeholder="Enter Your Username" type="text">
+                                </div>
+                                <div class="mb-3">
+                                    <label class="form-label">Email</label>
+                                    <input class="form-control" placeholder="Enter Your Email" type="email">
+                                </div>
+                                <div class="mb-3">
+                                    <label class="form-label">Password</label>
+                                    <input class="form-control" placeholder="Enter Your Password" type="password">
+                                </div>
+                                <div class="mb-3 form-check">
+                                    <input class="form-check-input" id="formCheck1" type="checkbox">
+                                    <label class="form-check-label" for="formCheck1">remember me</label>
+                                </div>
+                                <div>
+                                    <a class="btn btn-primary w-100" href="index.html" role="button">Giriş Yap</a>
+                                    <a class="btn btn-primary w-100 mt-1" href="index.html" role="button">Kayıt Ol</a>
+                                </div>
+                            </form>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </main>
+</div>
+<%-include("./partials/footer.ejs") %>