Sawo-Community · prathimacode-hub · Jun 2, 2022 · Jun 2, 2022 · Jun 2, 2022 · Jun 2, 2022
diff --git a/Projects/Register-The-Signed-In-User-To-Database/.gitignore b/Projects/Register-The-Signed-In-User-To-Database/.gitignore
@@ -0,0 +1 @@
+/node_modules
diff --git a/Projects/Register-The-Signed-In-User-To-Database/README.md b/Projects/Register-The-Signed-In-User-To-Database/README.md
@@ -0,0 +1,21 @@
+# Signup-Page
+
+### Configure your MongoDB Database :
+
+Add your mongoDb connection string in db.js 
+
+### How to run the project
+
+Step 1 : Open your terminal in the root folder.
+
+Step 2 : Install the dependencies with the following command
+```
+npm install
+```
+Step 3 :  Run the backend with the following command(Dont forget to configure your MongoDb connection)
+```
+nodemon index
+```
+Step 4 : Open the `index.html` file in your browser
+
+## That's it !!
diff --git a/Projects/Register-The-Signed-In-User-To-Database/db.js b/Projects/Register-The-Signed-In-User-To-Database/db.js
@@ -0,0 +1,11 @@
+const mongoose = require('mongoose');
+
+const dbURI = 'Enter your MongoDB Connection string here';
+
+const connectToDatabase = () => {
+  mongoose.connect(dbURI, () => {
+    console.log('connected to database');
+  });
+}
+
+module.exports = connectToDatabase;
diff --git a/Projects/Register-The-Signed-In-User-To-Database/frontend/index.html b/Projects/Register-The-Signed-In-User-To-Database/frontend/index.html
@@ -0,0 +1,54 @@
+<!DOCTYPE html>
+<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>Document</title>
+    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
+        integrity="sha384-0evHe/X+R7YkIZDRvuzKMRqM+OrBnVFBL6DOitfPri4tjfHxaWutUpFmBp4vmVor" crossorigin="anonymous">
+    <link rel="stylesheet" href="./styles.css">
+</head>
+
+<body>
+    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
+        integrity="sha384-pprn3073KE6tl6bjs2QrFaJGz5/SUsLqktiwsUTF55Jfv3qYSDhgCecCxMW52nD2"
+        crossorigin="anonymous"></script>
+
+
+    <script>
+        const handleSubmit = async (e) => {
+            let email = document.getElementById('email').value
+            console.log(email);
+
+            const response = await fetch("http://localhost:5000/api/auth/signup", {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json'
+                },
+                body: JSON.stringify({ email })
+            });
+            const json = await response.json();
+            console.log(json);
+
+            alert(json.msg);
+
+            if(json.success) {
+                document.getElementById('success').style.visibility = 'visible';
+                document.getElementById('success').innerHTML = 'Thank you for signing up!';
+            }
+
+        }
+    </script>
+
+    <div align="center" class="container">
+        <div class="mb-3">
+            <input type="email" class="form-control" id="email" placeholder="Email ID">
+        </div>
+        <div class="btn btn-success" onclick="handleSubmit()">Submit</div>
+        <div id="success"></div>
+    </div>
+</body>
+
+</html>
diff --git a/Projects/Register-The-Signed-In-User-To-Database/frontend/styles.css b/Projects/Register-The-Signed-In-User-To-Database/frontend/styles.css
@@ -0,0 +1,18 @@
+body{
+    background-image: url('https://img.freepik.com/free-photo/flat-lay-travel-composition-with-world-map-wooden-background_169016-16173.jpg?w=2000');
+}
+.container {
+
+    width: 50%;
+    margin-top: 200px;
+    padding: 50px;
+}
+
+#success {
+    visibility: hidden;
+    margin: 20px;
+    font-size: 30px;
+    background-color: white;
+    color: green;
+    padding: 30px;
+}
diff --git a/Projects/Register-The-Signed-In-User-To-Database/index.js b/Projects/Register-The-Signed-In-User-To-Database/index.js
@@ -0,0 +1,17 @@
+const express = require('express');
+const cors = require('cors');
+const connectToDatabase = require('./db');
+
+connectToDatabase();
+
+const app = express();
+const port = process.env.PORT || 5000;
+
+app.use(cors());
+app.use(express.json());
+
+app.use('/api/auth', require('./routes/auth'));
+
+app.listen(port, () => {
+  console.log(`Listening on port ${port}`);
+});
diff --git a/Projects/Register-The-Signed-In-User-To-Database/models/user.js b/Projects/Register-The-Signed-In-User-To-Database/models/user.js
@@ -0,0 +1,13 @@
+const mongoose = require('mongoose');
+const Schema = mongoose.Schema;
+
+const UserSchema = new Schema ({
+    email: {
+        type: String,
+        required: true,
+        unique: true
+    },
+})
+
+const User = mongoose.model('user', UserSchema);
+module.exports = User;