├── .gitignore ├── .env ├── public └── styles.css ├── package.json ├── views ├── index.hbs ├── login.hbs └── register.hbs └── app.js /.gitignore: -------------------------------------------------------------------------------- 1 | /node_modules -------------------------------------------------------------------------------- /.env: -------------------------------------------------------------------------------- 1 | DATABASE = login-db 2 | DATABASE_HOST = localhost 3 | DATABASE_USER = root 4 | DATABASE_PASSWORD = -------------------------------------------------------------------------------- /public/styles.css: -------------------------------------------------------------------------------- 1 | nav { 2 | background-color: black; 3 | color: white; 4 | display: flex; 5 | justify-content: space-between; 6 | padding: 30px 60px; 7 | } 8 | 9 | nav ul { 10 | display: flex; 11 | justify-content: space-around; 12 | align-items: center; 13 | } 14 | 15 | nav li { 16 | list-style: none; 17 | } 18 | 19 | nav li a { 20 | color: white; 21 | text-decoration: none; 22 | font-weight: bold; 23 | padding: 5px 8px; 24 | } 25 | 26 | nav li a:hover { 27 | color: yellow; 28 | text-decoration: none; 29 | } -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "nodejs-form", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1", 8 | "start": "nodemon app.js" 9 | }, 10 | "keywords": [], 11 | "author": "", 12 | "license": "ISC", 13 | "dependencies": { 14 | "bcryptjs": "^2.4.3", 15 | "cookie-parser": "^1.4.6", 16 | "dotenv": "^16.0.2", 17 | "express": "^4.18.1", 18 | "hbs": "^4.2.0", 19 | "jsonwebtoken": "^8.5.1", 20 | "mysql": "^2.18.1", 21 | "nodemon": "^2.0.19" 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /views/index.hbs: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 | {{!-- Navigation links --}} 14 | 22 | 23 | {{!-- Body --}} 24 |

25 |

26 |

My Login Project

27 |

This project demostrates how to implement login and register functionalities with Node.js and MySQL

28 |

29 |

30 | 31 | -------------------------------------------------------------------------------- /views/login.hbs: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 | {{!-- Navigation links --}} 14 | 22 | 23 | {{!-- Body --}} 24 |

25 |

26 |

27 |

28 | 40 |

41 |

42 |

43 | 44 | -------------------------------------------------------------------------------- /app.js: -------------------------------------------------------------------------------- 1 | const express = require('express'); 2 | const mysql = require("mysql") 3 | const path = require("path") 4 | const dotenv = require('dotenv') 5 | const jwt = require("jsonwebtoken") 6 | const bcrypt = require("bcryptjs") 7 | 8 | dotenv.config({ path: './.env'}) 9 | 10 | const app = express(); 11 | 12 | const db = mysql.createConnection({ 13 | host: process.env.DATABASE_HOST, 14 | user: process.env.DATABASE_USER, 15 | password: process.env.DATABASE_PASSWORD, 16 | database: process.env.DATABASE 17 | }) 18 | 19 | const publicDir = path.join(__dirname, './public') 20 | 21 | app.use(express.static(publicDir)) 22 | app.use(express.urlencoded({extended: 'false'})) 23 | app.use(express.json()) 24 | 25 | app.set('view engine', 'hbs') 26 | 27 | db.connect((error) => { 28 | if(error) { 29 | console.log(error) 30 | } else { 31 | console.log("MySQL connected!") 32 | } 33 | }) 34 | 35 | app.get("/", (req, res) => { 36 | res.render("index") 37 | }) 38 | 39 | app.get("/register", (req, res) => { 40 | res.render("register") 41 | }) 42 | 43 | app.get("/login", (req, res) => { 44 | res.render("login") 45 | }) 46 | 47 | app.post("/auth/register", (req, res) => { 48 | const { name, email, password, password_confirm } = req.body 49 | 50 | db.query('SELECT email FROM users WHERE email = ?', [email], async (error, result) => { 51 | if(error){ 52 | console.log(error) 53 | } 54 | 55 | if( result.length > 0 ) { 56 | return res.render('register', { 57 | message: 'This email is already in use' 58 | }) 59 | } else if(password !== password_confirm) { 60 | return res.render('register', { 61 | message: 'Password Didn\'t Match!' 62 | }) 63 | } 64 | 65 | let hashedPassword = await bcrypt.hash(password, 8) 66 | 67 | console.log(hashedPassword) 68 | 69 | db.query('INSERT INTO users SET?', {name: name, email: email, password: hashedPassword}, (err, result) => { 70 | if(error) { 71 | console.log(error) 72 | } else { 73 | return res.render('register', { 74 | message: 'User registered!' 75 | }) 76 | } 77 | }) 78 | }) 79 | }) 80 | 81 | app.listen(5000, ()=> { 82 | console.log("server started on port 5000") 83 | }) 84 | -------------------------------------------------------------------------------- /views/register.hbs: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 | {{!-- Navigation links --}} 14 | 22 | 23 | {{!-- Body --}} 24 |

25 |

26 |

27 |

28 | 48 |

49 |

50 | 51 | {{#if message }} 52 |

53 | {{/if}} 54 |

55 | 56 | --------------------------------------------------------------------------------

My Login Project

{{message}}