- node.js
- express
- bcrypt
- jwt (jsonwebtoken)
- mysql
- react
- react-context-devtool
- react-router
- redux
- redux-persist
- axios
- boostrap
This App is an E-commerce, you can:
- signup
- signin (token)
- add a product to your cart
- add a product to sell
- visualize the product and detail
- sort the product list by categorie
- edit your cart (qty)
- edit your profil (change email, name..)
- edit your product (change price, add promotion)
- have acces to your order history
- ....
Handle error :
var mailformat = /^[\w-]+@([\w-]+\.)+[\w-]{2,4}$/g; switch (true) { case userObject.firstName.length < 3: alert("first name error: min 3 character"); break; case userObject.lastName.length < 3: alert("last name error: min 3 character"); break; case userObject.url.length < 10: alert("url profile picture require"); break; case userObject.password < 8: alert("password minimun 8 character"); break; case !userObject.email.match(mailformat): alert("email incorrect"); break; case userObject.password !== this.state.confirmPassword: alert("confirm password error"); break; default:Handle if an user already use this email Back-End:
/*********************** Check if user with this email already exist *************************/ await app.use("/users/sign-up", (req, res, next) => { console.log(req.body.email); connection.query( `SELECT * FROM users WHERE email = '${req.body.email}'`, (err, results) => { if (err) throw err; if (results.length > 0) { res.status(200).send("this EMAIL already exist"); } else { next(); } } ); });Api, Back-end (token, bcrypt)
await app.post("/users/sign-in", function(req, res) { let password = req.body.password; let email = req.body.email; let hash = ""; connection.query(sqlRequestUsers.mailUser, [email], function(err, results) { if (err) throw err; // handle email error if (!Array.isArray(results) || !results.length) { res.send("Sorry, email incorrect"); } else { let name = results[0].name; let id = results[0].id; /******* TOKEN *******/ let token = jwt.sign( { email: email, name: name, id: id }, config.secret ); hash = results[0].password; // handle password error bcrypt.compare(password, hash, function(err, result) { if (result == true) { // get the decoded payload ignoring signature, no secretOrPrivateKey needed var decoded = jwt.decode(token); // get the decoded payload and header var decoded = jwt.decode(token, { complete: true }); res.status(200).send({ auth: true, token: token, email: email, id: id, }); } else { res.send("password error"); } }); } }); });switch (true) { case productObject.category.length < 2: alert("category error: min 2 characters"); break; case productObject.name.length < 3: alert("name error: min 3 characters"); break; case productObject.description.length < 10: alert("description required min 10 characters"); break; case productObject.url.length < 1: alert("url of product picture required min 10 characters"); break; case productObject.prices.length < 1: alert("Price missing"); break; default:i store it in the state
headerWithToken: { headers: { Authorization: "Bearer " + this.props.token, }, },axios.post("http://localhost:8080/products/",productObject,this.state.headerWithToken)const jwt = require('jsonwebtoken'); const config = require("../routes/modules/config"); module.exports = (req, res, next) => { try { const token = req.headers.authorization.split(' ')[1]; const decodedToken = jwt.verify(token, config.secret); if (decodedToken) { next(); } else { res.sendStatus(403) } } catch { res.status(401).json({ error: new Error('Invalid request!') }); } }Import the middleware:
const auth = require("../middleware/auth");Example of use:
// POST /productEdit/:id => Update this specific product from the database await app.post("/productEdit/:id", auth, (req, res) => { req.body.id = req.params.id; if (req.body.idUser === req.body.id_user_affiliate) { connection.query(sqlRequestProduct.editProduct(req.body), (err) => { if (err) { console.log(err); res.sendStatus(500); } else res.send("Updated"); }); } }); componentDidMount() { axios .get(`http://localhost:8080/products/`) .then((result) => { this.props.setListOfProducts(result.data); }) .catch(() => { console.log("Oops, request failed!"); }); }Project is: Finish





