ejs login and signup with tailwind

README updated with instructions
app.js file moved (fixing previous commit)
2025-05-02 01:53:47 -07:00 · 2025-05-01 19:31:07 -07:00 · 2025-05-01 19:25:57 -07:00 · 2025-05-01 19:24:18 -07:00 · 2025-04-30 17:17:00 -07:00 · 2025-04-29 16:02:10 -07:00
8 changed files with 166 additions and 29 deletions
@@ -1,2 +1,4 @@
 mongoURI='mongodb://localhost:27017/'
 database='nameOfDatabase'
+PORT=8000
+
@@ -24,11 +24,27 @@ Example:

 ## Usage

-***Please check back later.***
+1. **Clone the repository:**
+   ```bash
+   git clone https://github.com/JoaquinPar/2800-202510-BBY14.git
+   cd 2800-202510-BBY14
+   ```

-1. ...
-2. ...
-3. ...
+2. **Install dependencies:**
+   ```bash
+   npm install
+   ```
+   This will install Express, express-session, EJS, dotenv, and any other required packages listed in `package.json`.
+
+3. **Create and configure the environment file:**
+   - Create a file named `.env` in the root directory of the project.
+   - Add the necessary environment variables to this file.
+
+4. **Run the application:**
+   ```bash
+   node app.js
+   ```
+   The application should now be running, typically on `http://localhost:3000` (or the port specified in your `.env` file).

 ---

@@ -37,7 +53,6 @@ Example:
 ```
 retirementCalculator/
 ├── src/
-|   ├── app.js
 │   ├── views/
 │   ├── public/
 |   |    ├── css/
@@ -45,6 +60,7 @@ retirementCalculator/
 |   |    ├── images/
 |   |    └── scripts/
 │   └── util/
+├── app.js
 ├── .env.example
 ├── .gitignore
 ├── LICENSE
@@ -62,6 +78,7 @@ retirementCalculator/
 - **[Mitchell Schaeffer](https://github.com/knighthawk4227)** - BCIT CST Student with a passion for technology.

 ---
+## more details to come...

 ## Limitations and Future Work
 ### Limitations
@@ -0,0 +1,12 @@
+<html>
+ <body>
+  Team Name: BBY-14
+  Team Members:
+  <ul>
+    <li> Joaquin Paredes </li>
+    <li> Nicolas Agostini </li>
+    <li> Mitchell Schaeffer </li>
+    <li> Braeden Sowinski </li>
+  </ul>
+ </body>
+</html>
@@ -1,11 +1,15 @@
 const express = require('express');
 const path = require('path');
+const dotenv = require('dotenv');
+
+dotenv.config();

 const app = express();
-const port = 8000;
+
+const port = process.env.PORT || 3000;

 app.set('view engine', 'ejs');
-app.set('views',path.join(__dirname, 'views'));
+app.set('views', path.join(__dirname, '/src/views'));

 /*
 ROUTINGS
@@ -69,4 +73,4 @@ app.get('/*splat', (req, res) => {

 app.listen(port, () => {
    console.log(`Server listening on port ${port}`);
-});
+});
@@ -9,6 +9,7 @@
      "version": "0.1.0",
      "license": "MIT",
      "dependencies": {
+        "dotenv": "^16.5.0",
        "ejs": "^3.1.10",
        "express": "^5.1.0"
      },
@@ -315,6 +316,17 @@
        "node": ">= 0.8"
      }
    },
+    "node_modules/dotenv": {
+      "version": "16.5.0",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.5.0.tgz",
+      "integrity": "sha512-m/C+AwOAr9/W1UOIZUo232ejMNnJAJtYQjUbHoNTBNTJSvqzzDh7vnrei3o3r3m9blf6ZoDkvcw0VmozNRFJxg==",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://dotenvx.com"
+      }
+    },
    "node_modules/dunder-proto": {
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
@@ -339,7 +351,6 @@
      "version": "3.1.10",
      "resolved": "https://registry.npmjs.org/ejs/-/ejs-3.1.10.tgz",
      "integrity": "sha512-UeJmFfOrAQS8OJWPZ4qtgHyWExa088/MtK5UEyoJGFH67cDEXkZSviOiKRCZ4Xij0zxI3JECgYs3oKx+AizQBA==",
-      "license": "Apache-2.0",
      "dependencies": {
        "jake": "^10.8.5"
      },
@@ -2,10 +2,10 @@
  "name": "retirementcalculator",
  "version": "0.1.0",
  "description": "Retirement Calculator",
-  "main": "./src/app.js",
+  "main": "app.js",
  "scripts": {
-    "start": "node ./src/app.js",
-    "dev": "nodemon ./src/app.js"
+    "start": "node app.js",
+    "dev": "nodemon app.js"
  },
  "repository": {
    "type": "git",
@@ -18,6 +18,7 @@
  },
  "homepage": "https://github.com/JoaquinPar/2800-202510-BBY14#readme",
  "dependencies": {
+    "dotenv": "^16.5.0",
    "ejs": "^3.1.10",
    "express": "^5.1.0"
  },
@@ -1,12 +1,53 @@
 <!DOCTYPE html>
-<html>
-    <head>
-        <title></title>
-    </head>
-    <body>
-        <h1>Welcome!</h1>
-        <form method="get" action="/signup">
-            <button type="submit">signup</button>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Login Page</title>
+    <link rel="stylesheet" href="/css/style.css" <link rel="stylesheet" href="/css/style.css">
+    <link rel="stylesheet" href="../public/css/style.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css">
+    <link href="https://cdn.jsdelivr.net/npm/tailwindcss@3.3.2/dist/tailwind.min.css" rel="stylesheet">
+</head>
+
+<body>
+    <div class="flex justify-center items-center h-screen bg-gray-700">
+        <form action="/login" method="POST">
+            <div class="w-96 p-6 shadow-1g bg-white rounded-md">
+                <h1 class="text-3xl block text-center font-semibold"> Login </h1>
+                <hr class="mt-3">
+                <div class="mt-3">
+                    <label for="email" class="block text-base mb-2">Email</label>
+                    <input type="text" id="email" name="email"
+                        class="border focus:border-gray-600 w-full text-base px-2 py-1 focus:outline-none focus:ring-0 "
+                        placeholder="Enter Email" />
+                </div>
+                <div class="mt-3">
+                    <label for="password" class="block text-base mb-2">Password</label>
+                    <input type="password" id="password" name="password"
+                        class="border focus:border-gray-600 w-full text-base px-2 py-1 focus:outline-none focus:ring-0 "
+                        placeholder="Enter Password" />
+                </div>
+                <div class="text-red-800 font-bold hidden" id="forgor"> Your Password is incorrect...</div>
+                <div class="mt-3 flex justify-between items-center">
+                    <div>
+                        <input type="checkbox">
+                        <label>Remember me</label>
+                    </div>
+                    <div>
+                        <a href="#" class="text-indigo-600 font-semibold">Forgot Password? </a>
+                    </div>
+                </div>
+                <div class="mt-5">
+                    <button type="submit"
+                        class="border-2 border-gray-600 bg-blue-600 text-white py-1 w-full rounded-md hover:bg-transparent hover:text-indigo-700 font-semibold">Login</button>
+                </div>
+            </div>
        </form>
-    </body>
-</html>
+    </div>
+    <script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
+</body>
+
+</html>
@@ -1,9 +1,58 @@
 <!DOCTYPE html>
-<html>
-    <head>
+<html lang="en">

-    </head>
-    <body>
-        <h1>SIGNUP</h1>
-    </body>
-</html>
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Signup</title>
+    <link rel="stylesheet" href="/css/style.css" <link rel="stylesheet" href="/css/style.css">
+    <link rel="stylesheet" href="../public/css/style.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css"
+        integrity="sha512-Evv84Mr4kqVGRNSgIGL/F/aIDqQb7xQ2vcrdIwxfjThSH8CSR7PBEakCr51Ck+w+/U6swU2Im1vVX0SVk9ABhg=="
+        crossorigin="anonymous" referrerpolicy="no-referrer" />
+</head>
+
+<body>
+    <div class="flex justify-center items-center h-screen bg-gray-700">
+        <form action="/login" method="POST">
+            <div class="w-96 p-6 shadow-1g bg-white rounded-md">
+                <h1 class="text-3xl block text-center font-semibold"> Signup </h1>
+                <hr class="mt-3">
+                <div class="mt-3">
+                    <label for="email" class="block text-base mb-2">Email</label>
+                    <input type="text" id="email" name="email"
+                        class="border focus:border-gray-600 w-full text-base px-2 py-1 focus:outline-none focus:ring-0 "
+                        placeholder="Enter Email" />
+                </div>
+                <div class="mt-3">
+                    <label for="password" class="block text-base mb-2">Password</label>
+                    <input type="password" id="password" name="password"
+                        class="border focus:border-gray-600 w-full text-base px-2 py-1 focus:outline-none focus:ring-0 "
+                        placeholder="Enter Password" />
+                    <label for="password" class="block text-base mb-2 mt-3">Re-type Password</label>
+                    <input type="password" id="repassword" name="password"
+                        class="border focus:border-gray-600 w-full text-base px-2 py-1 focus:outline-none focus:ring-0 "
+                        placeholder="Enter Password" />
+                </div>
+                <div class="text-red-800 font-bold hidden" id="forgor"> Your Password is incorrect...</div>
+                <div class="mt-3 flex justify-between items-center">
+                    <div>
+                        <input type="checkbox">
+                        <label>Remember me</label>
+                    </div>
+                    <div>
+                        <a href="#" class="text-indigo-600 font-semibold">Forgot Password? </a>
+                    </div>
+                </div>
+                <div class="mt-5">
+                    <button type="submit"
+                        class="border-2 border-gray-600 bg-blue-600 text-white py-1 w-full rounded-md hover:bg-transparent hover:text-indigo-700 font-semibold">Login</button>
+                </div>
+            </div>
+        </form>
+    </div>
+    <script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
+</body>
+
+</html>
Author	SHA1	Message	Date
knighthawk4227	44cee349e9	ejs login and signup with tailwind	2025-05-02 01:53:47 -07:00
nicoagostini	2bd4b1e16e	README updated with instructions	2025-05-01 19:31:07 -07:00
nicoagostini	7f9e594e9b	app.js file moved (fixing previous commit)	2025-05-01 19:25:57 -07:00
nicoagostini	1f9416e0bd	.env file created and app.js moved to root folder	2025-05-01 19:24:18 -07:00
Joaquin	e4a6c7ef36	merge feature/routing with dev	2025-04-30 17:17:00 -07:00
SowinskiBraeden	c1f3aa126b	Merge branch 'dev' of github.com:JoaquinPar/2800-202510-BBY14 into dev	2025-04-29 16:02:10 -07:00
SowinskiBraeden	f3ee6d091e	update/create about.html page	2025-04-29 16:00:59 -07:00
mitchell	a143dc439b	adding readme info	2025-04-29 15:57:56 -07:00