Add dev code to test

devfolder/app.js

@@ -0,0 +1,38 @@
+const express = require('express');
+const bodyParser = require('body-parser');
+const jwt = require('jsonwebtoken'); // Import the jsonwebtoken library
+
+const app = express();
+const PORT = 5000;
+const cors = require('cors');
+
+const corsOptions = {
+    origin: 'http://127.0.0.1:5500', // Replace with your frontend's origin
+    methods: 'GET,HEAD,PUT,PATCH,POST,DELETE',
+    credentials: true,
+    optionsSuccessStatus: 204,
+  };
+  
+app.use(cors(corsOptions));
+
+app.use(bodyParser.json());
+
+const secretKey = 'your-secret-key'; // Replace with a strong secret key for encoding the JWT token
+
+app.post('/api/auth', (req, res) => {
+    const { user_name, password } = req.body;
+
+    // Check the username and password (for demonstration purposes, accept any non-empty values)
+    if (user_name && password) {
+        // Authentication successful, create a JWT token
+        const token = jwt.sign({ user_name }, secretKey, { expiresIn: '1h' }); // Token expires in 1 hour
+        res.json({ token });
+    } else {
+        // Authentication failed
+        res.status(401).json({ error: 'Invalid username or password' });
+    }
+});
+
+app.listen(PORT, () => {
+    console.log(`Server is running on port ${PORT}`);
+});

frontend/index.html

@@ -44,5 +44,5 @@
   <script src="index.js"></script>
 </body>
 
-<footer>HI</footer>
+<footer><p>© 2023 Password Manager</p></footer>
 </html>

frontend/index.js

@@ -43,7 +43,7 @@ async function getAuth() {
 let _username = document.getElementById("username").value;
 let _password = document.getElementById("password").value;
     try {
-        const response = await fetch('http://127.0.0.1:5000/', {
+        const response = await fetch('http://127.0.0.1:5000/api/auth', {
             method: 'POST',
             headers: {
                 'Content-Type': 'application/json'
@@ -62,6 +62,8 @@ let _password = document.getElementById("password").value;
         const token = data.token;
 
         console.log(`Got token: ${token}`)
+        console.log(data)
+        handleAuthRes(data);
     } catch (error) {
         console.log('Error', error);
     }
@@ -70,7 +72,7 @@ let _password = document.getElementById("password").value;
 
 function handleAuthRes(data) {
     if(data.token){
-        localStorage.setItem('token', token.data);
+        localStorage.setItem('token', data.token);
         console.log("Logged In...")
     } else {
         console.error('Login Failed:', data.error)

frontend/style.css

@@ -29,8 +29,8 @@ body {
   backdrop-filter: blur(20px);
   justify-content: center;
   align-items: center;
-  width: 500px;
+  width: 450px;
-  height: 450px;
+  height: 400px;
   flex-direction: column;
   padding: 70px;
   padding-bottom: 90px;
@@ -155,4 +155,9 @@ footer{
   background-color: rgb(12, 12, 12);
   height: 50px;
   width: 100vw;
+}
+
+footer p{
+  color: white;
+  text-align: center;
 }

package.json

@@ -0,0 +1,20 @@
+{
+  "name": "unnamed-password-manager",
+  "version": "1.0.0",
+  "description": "Hi",
+  "main": "index.js",
+  "scripts": {
+    "start": "nodemon devfolder/app.js"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "nodemon": "^3.0.1"
+  },
+  "dependencies": {
+    "cors": "^2.8.5",
+    "express": "^4.18.2",
+    "jsonwebtoken": "^9.0.2"
+  }
+}