Mern Social Network الجزء الاول

imadbelasri Nodejs
NS

فهاد ال projet غادي نشوفوا كيفاش نقادو social network ب react js express nodejs & mongodb هاد ل projet لي غادي يكون عبارة على mini twitter فيه المستخدم ممكن يتبع أو يلغي متابعة مستخدم آخر يزيد تغريدات تعليقات يزيد إعجاب أو يلغي إعجاب هاد ل projet ماشي للمبتدئين ف react js و nodejs كنتي مبتدأ شوف الدورات الخاصة بالمبتدئين.


نظرة سريعة بالفيديو


1- إضافة projet جديد

أول حاجة زيد dossier جديد سميه لي بغيتي وداخلو زيد dossier آخر سميه backend هنا غادي يكون ل backend لي هو الجزء الخاص ب nodejs.

داخل dossier backend غادي تدير ل commande :

npm init 

ودخل المعلومات الخاصة بك مبغيتيش ممكن تخدم بديالي فقط زيد fichier سميه package.json وزيد فيه هاد الكود :

                                                    
                                                        {
  "name": "backend",
  "version": "1.0.0",
  "description": "react social network",
  "main": "server.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "belasri imad",
  "license": "ISC",
  "dependencies": {
    "bcryptjs": "^2.4.3",
    "body-parser": "^1.19.0",
    "cookie-parser": "^1.4.5",
    "cors": "^2.8.5",
    "dotenv": "^8.2.0",
    "express": "^4.17.1",
    "express-jwt": "^6.0.0",
    "formidable": "^1.2.2",
    "jsonwebtoken": "^8.5.1",
    "lodash": "^4.17.20",
    "mongoose": "^5.10.0",
    "nodemon": "^2.0.4"
  }
}
                                                    
                                                

2- إضافة قاعدة البيانات

قبل ما نزيدو قاعدة البيانات حيث زدنا قبل ل fichier package.json وفيه يلا شفتي لتحت كاين les packages لي غادي نحتاجو فل backend غادي تدير هاد ل commande : 

npm install 

منبعد ما يتزادو غادي نزيدو fichier جديد سميه env. هنا غادي يكون عندنا ل port لي غادي يتفتح فيه السيرفر ورابط قاعدة البيانات لي غادي تشوف هاد الفيديو باش تزيدها و JWT_SECRET لي ممكن تكتب فيها أي حاجة بغيتي غادي نحتاجوها من بعد.

الكود لي غادي تزيد هو :

                                                        
                                                            PORT = 8888

DATABASE_URL = "YOUR DATABASE URL | LE LIEN VERS VOTRE BASE DE DONNEES"
JWT_SECRET = kjndfkjvndkfjvndkfjvnkdjfvnkjdfnvkdjfvngbgbgbgbgb
                                                        
                                                    

3- إضافة ل User Model

دائما ف dossier backend زيد dossier جديد سميه models فيه غادي نزيدو fichier user.js هنا غادي يكونوا عندي المعلومات الخاصة بالمستخدم مع des fonctions لي غادي يمكنوا باش ن crypter ل mot de passe وأيضا نقارنوا les mot de passes فاش نبغيو نتكونيكطاو.

الكود لي غادي تزيد هو :

                                                        
                                                            const mongoose = require("mongoose");
const bcrypt = require("bcryptjs");
const { ObjectId } = mongoose.Schema;

const UserSchema = new mongoose.Schema(
  {
    name: {
      type: String,
      trim: true,
      required: true,
    },
    about: {
      type: String,
      trim: true,
    },
    image: {
      data: Buffer,
      contentType: String,
    },
    email: {
      type: String,
      trim: true,
      unique: true,
      required: true,
    },
    salt: String,
    hashed_password: {
      type: String,
      required: true,
    },
    following: [{ type: ObjectId, ref: "User" }],
    followers: [{ type: ObjectId, ref: "User" }],
  },
  {
    timestamps: true,
  }
);

UserSchema.virtual("password")
  .get(function () {
    return this._password;
  })
  .set(function (password) {
    this._password = password;
    let salt = (this.salt = bcrypt.genSaltSync(10));
    this.hashed_password = bcrypt.hashSync(password, salt);
  });

UserSchema.methods.comparePassword = function (passwordToCheck, cb) {
  bcrypt.compare(passwordToCheck, this.hashed_password, function (
    err,
    isMatch
  ) {
    if (err) cb(err);
    cb(null, isMatch);
  });
};

module.exports = mongoose.model("User", UserSchema);
                                                        
                                                    

4- إضافة ل Post Model

دائما ف dossier models زيد fichier post.js هنا غادي يكونوا عندي المعلومات الخاصة بالتغريدة أو tweet ممكن تبدل الإسم ل tweet يلا بغيتي.

الكود لي غادي تزيد هو :

                                                        
                                                            const mongoose = require("mongoose");
const { ObjectId } = mongoose.Schema;

const PostSchema = new mongoose.Schema(
  {
    text: {
      type: String,
      trim: true,
      required: true,
    },
    postedBy: {
      type: ObjectId,
      ref: "User",
    },
    likes: [{ type: ObjectId, ref: "User" }],
    comments: [
      {
        text: String,
        created: { type: Date, default: Date.now },
        postedBy: {
          type: ObjectId,
          ref: "User",
        },
      },
    ],
  },
  {
    timestamps: true,
  }
);

module.exports = mongoose.model("Post", PostSchema);
                                                        
                                                    

دروس ذات صلة

NS

Mern Social Network الجزء الثاني

فهاد الجزء الثاني من Mern Social Network من بعد ما زدنا فالجزء السابق ل models ديالنا دبا غادي ندوزو...


NS

Mern Social Network الجزء الثالت

فهاد الجزء الثالت من Mern Social Network من بعد ما زدنا فالجزء السابق ل controllers ديالنا دبا...


NS

Mern Social Network الجزء الرابع

فهاد الجزء الرابع من MERN social network غادي ندوزو ل frontend منبعد مازدنا ل backend فالأجزاء الساب...


NS

Mern Social Network الجزء الخامس

فهاد الجزء الخامس من MERN social network غادي نكملوا الجزء الخاص ب redux من بعد مازدنا types و actio...


NS

Mern Social Network الجزء السادس

فهاد الجزء السادس من MERN social network غادي نكملوا ل projet ديالنا وندوزوا للجزء الخاص بإضافة rout...


NS

Mern Social Network الجزء السابع

فهاد الجزء السابع من Mern Social Network غادي نكملوا الجزء الخاص بالمستخدم وغادي نزيدو ل c...


NS

Mern Social Network الجزء الثامن

فهاد الجزء الثامن من Mern Social Network غادي نزيدوا نكملوا الجزء الخاص بعرض وإضافة tweets ومنبعد غا...


NS

Mern Social Network الجزء التاسع والأخير

فهاد الجزء التاسع والاخير من Mern Social Network غادي نزيدو الإمكانية ديال متابعة وإلغاء م...