backend for login system

project/my-project-name/backend/index.js

@@ -1,65 +1,57 @@
 const express = require('express');
-const planetscale = require('./config/planetscale')
-const cors = require('cors')
+const planetscale = require('./config/planetscale');
+const cors = require('cors');
 
 const app = express();
 
 const PORT = 3002;
 app.use(cors());
-app.use(express.json())
-
+app.use(express.json());
 
 // Route for creating the user
-app.post('/api/signup', (req,res)=> {
-
-    const email = req.body.email;
-    const username = req.body.username;
-    const password = req.body.password;
-    const query = "INSERT INTO users (email, username, password_hash) VALUES (?,?,?)";
-
-    console.log(email, username, password);
-
-    planetscale.query(query,[email, username, password], ( err, result ) => {
-        if(err) {
-            console.log(err);
-        } 
-        console.log(result);
-    });   
+app.post('/api/signup', (req, res) => {
+  const email = req.body.email;
+  const username = req.body.username;
+  const password = req.body.password;
+  const query = "INSERT INTO users (email, username, password_hash) VALUES (?,?,?)";
+
+  planetscale.query(query, [email, username, password], (err, result) => {
+    if (err) {
+      return res.status(500).json({ error: 'Account already exists' });
+    }
+    return res.status(200).json({ message: 'Signup successful' });
+  });
 });
 
-// Route for login 
-app.get('/api/login/:email', (req, res) => {
-
-    const email = req.params.email;
-    const query = `SELECT * FROM users where email = ?`;
-
-    planetscale.query(query, email, (err, data) => {
-    //   const p = data.params.password;
-    //   if (err) return res.json({ error: err.message });
-    //   else if (p != password) return res.send(false);
-        res.send(data);
-    });
+// Route for login
+app.post('/api/login', (req, res) => {
+  const email = req.body.email;
+  const password = req.body.password;
+  const query = `SELECT * FROM users WHERE email = ?`;
+
+  planetscale.query(query, email, (err, result) => {
+    if (!data || data.length === 0) {
+      return res.status(404).json({ error: 'Invalid email or password' });
+    } else if (result[0].password_hash !== password) {
+      return res.status(401).json({ error: 'Invalid email or password' });
+    }
+    return res.status(200).json({ message: 'Login successful' });
+  });
 });
 
 // Route for deleting account
-app.post('/api/delete', (req,res)=> {
-
-    const email = req.body.email;
-    const username = req.body.username;
-    const password = req.body.password;
-    const query = `DELETE FROM users WHERE email = ?`;
-
-    console.log(email, username, password);
-
-    planetscale.query(query, email, ( err, result ) => {
-        if(err) {
-            console.log(err);
-        } 
-        console.log(result);
-    });   
+app.post('/api/delete-account', (req, res) => {
+  const email = req.body.email;
+  const query = `DELETE FROM users WHERE email = ?`;
+
+  planetscale.query(query, email, (err, result) => {
+    if (err) {
+      return res.status(500).json({ error: 'An error occurred while deleting the account' });
+    }
+    return res.status(200).json({ message: 'Account deleted successfully' });
+  });
 });
 
-
-app.listen(PORT, ()=>{
-    console.log(`Server is running on ${PORT}`)
-})
+app.listen(PORT, () => {
+  console.log(`Server is running on ${PORT}`);
+});

project/my-project-name/frontend/src/components/Api.js

@@ -0,0 +1,37 @@
+import axios from 'axios';
+
+// create new account
+const addNewUser = async (email, username, password) => {
+  try {
+    const resp = await axios.post('http://localhost:3002/api/signup', { email: email, username: username, password: password });
+    return true;
+  } catch (err) {
+    return false;
+  }
+};
+
+// login
+const checkLoginDetails = async (email, password) => {
+  try { 
+    const resp = await axios.get(`http://localhost:3002/api/login`, { email: email, password: password });
+    return true;
+  } catch (err) {
+    return false;
+  }
+};
+
+// delete account
+const deleteAccount = async (email, password) => {
+  try {
+     const resp = await axios.get(`http://localhost:3002/api/delete-account`, { email: email, password: password });
+     return true;
+  } catch (err) {
+      return false;
+    }
+};
+
+export {
+    addNewUser,
+    checkLoginDetails,
+    deleteAccount,
+  };

project/my-project-name/frontend/src/components/Home.js

@@ -28,18 +28,7 @@ const Home = () => {
 
       <div className="container">
         <div className="row row-cols-1 row-cols-sm-2 row-cols-md-3 g-3">
-          <Posts />
-          <Posts />
-          <Posts />
-          <Posts />
-          <Posts />
-          <Posts />
-          <Posts />
-          <Posts />
-          <Posts />
-          <Posts />
-          <Posts />
-          <Posts />
+        <Posts posts = {posts}/>
         </div>
       </div>
     </div>

project/my-project-name/frontend/src/components/Posts.js

@@ -17,12 +17,10 @@ const Posts = ({ title, content, author }) => {
           >
             <title>Placeholder</title>
             <rect width="100%" height="100%" fill="#55595c"></rect>
-            <text x="50%" y="50%" fill="#eceeef" dy=".3em">
-              image
-            </text>
+            <image href={require("../Asset/image.jpg")} width="100%" height= "100%" />
           </svg>
           <div className="card-body">
-            <p className="card-text">Caption</p>
+            <p className="card-text">beautiful picture</p>
             <div className="d-flex justify-content-between align-items-center">
               <div className="btn-group">
                 <button
@@ -38,7 +36,7 @@ const Posts = ({ title, content, author }) => {
                   Share
                 </button>
               </div>
-              <small className="text-body-secondary">9 mins</small>
+              <small className="text-body-secondary">0 mins</small>
             </div>
           </div>
         </div>

project/my-project-name/frontend/src/components/SignUp.js

@@ -20,7 +20,7 @@ const SignUp = () => {
 
     // Perform signup logic here, such as sending the data to an API endpoint
     console.log("Signup form submitted", email, password);
-    const isValidDetails = axios.post('http://localhost:3002/api/signup', { email: email, username: username, password: password })
+    const isValidDetails = axios.post('http://localhost:3002/api/signup', { email: email, username: username, password: password });
 
     if (!isValidDetails) {
       console.log("Signup failed");