MeanJS এ Model, View, এবং Controller ব্যবস্থাপনা

MeanJS এর MVC আর্কিটেকচার - মিনজেএস (MeanJS) - Web Development

235

MeanJS স্ট্যাকটি Model-View-Controller (MVC) আর্কিটেকচার অনুসরণ করে, যা অ্যাপ্লিকেশন ডেভেলপমেন্টে ডেটা, ইউজার ইন্টারফেস এবং অ্যাপ্লিকেশনের লজিক আলাদা করে পরিচালনা করতে সহায়তা করে। এর ফলে, অ্যাপ্লিকেশন উন্নত, স্কেলেবল এবং রক্ষণাবেক্ষণযোগ্য হয়ে ওঠে। চলুন, MeanJS স্ট্যাকের Model, View, এবং Controller ব্যবস্থাপনার ধারণা এবং কিভাবে এগুলি তৈরি ও পরিচালনা করা যায় তা দেখি।


১. Model (ডেটা মডেল)

Model হল অ্যাপ্লিকেশনের ডেটা বা ইনফরমেশন স্টোরেজের প্রতিনিধিত্ব। MongoDB ডেটাবেসে ডেটা সংরক্ষণ এবং পরিচালনার জন্য Mongoose ব্যবহৃত হয়, যা MongoDB-এর জন্য একটি Object Data Modeling (ODM) লাইব্রেরি। Model-এ ডেটা স্টোরেজ, বৈধতা, এবং সম্পর্কগুলি সংজ্ঞায়িত করা হয়।

Model তৈরি করা:

Model তৈরি করতে, আপনাকে প্রথমে Mongoose মডিউল ইনস্টল করতে হবে (যদি আপনি এটি ইতিমধ্যেই ইনস্টল না করে থাকেন):

npm install mongoose

এখন, একটি Model তৈরি করা যাক। উদাহরণস্বরূপ, আমরা একটি User মডেল তৈরি করব:

// models/user.server.model.js

const mongoose = require('mongoose');
const Schema = mongoose.Schema;

// User Schema তৈরি করা
const UserSchema = new Schema({
  name: {
    type: String,
    required: 'Name is required'
  },
  email: {
    type: String,
    required: 'Email is required',
    unique: true
  },
  created: {
    type: Date,
    default: Date.now
  }
});

// Model তৈরি করা
mongoose.model('User', UserSchema);

এখানে, User মডেলটি MongoDB-তে একটি User ডকুমেন্ট তৈরি করবে, যেখানে নাম, ইমেইল এবং তৈরি হওয়ার সময় থাকবে।


২. View (ভিউ)

View হল ইউজার ইন্টারফেস, যা অ্যাপ্লিকেশনের ব্যবহারকারীকে প্রদর্শন করা হয়। MeanJS এ, ভিউ সাধারণত AngularJS ব্যবহার করে তৈরি হয়। AngularJS ডাইনামিক ইউজার ইন্টারফেস তৈরি করতে সাহায্য করে এবং two-way data binding এর মাধ্যমে মডেল এবং ভিউয়ের মধ্যে সিঙ্ক্রোনাইজেশন রাখে।

AngularJS এ View তৈরি করা:

AngularJS এর controller থেকে ডেটা নিয়ে view তে প্রদর্শন করা হয়। উদাহরণস্বরূপ, আমরা একটি সিম্পল ইউজার লিস্ট ভিউ তৈরি করব:

<!-- views/userList.client.view.html -->
<div ng-controller="UserController">
  <h2>User List</h2>
  <ul>
    <li ng-repeat="user in users">{{ user.name }} - {{ user.email }}</li>
  </ul>
</div>

এখানে, users ডেটা AngularJS controller থেকে আসবে এবং ভিউতে ng-repeat ডিরেকটিভ ব্যবহার করে লিস্ট হিসেবে প্রদর্শিত হবে।


৩. Controller (কন্ট্রোলার)

Controller হল অ্যাপ্লিকেশনের লজিকের অংশ, যা মডেল এবং ভিউয়ের মধ্যে যোগাযোগ স্থাপন করে। Controller ব্যবহারকারীর ইনপুট এবং অ্যাপ্লিকেশনের ডেটা ম্যানিপুলেশন পরিচালনা করে। MeanJS-এ Express.js এবং AngularJS উভয়েই কন্ট্রোলার ব্যবহৃত হয়।

Express.js কন্ট্রোলার:

Express.js কন্ট্রোলারটি সার্ভার সাইডে রিকোয়েস্ট হ্যান্ডলিং করে। উদাহরণস্বরূপ, User মডেলের জন্য একটি কন্ট্রোলার তৈরি করা:

// controllers/user.server.controller.js

const mongoose = require('mongoose');
const User = mongoose.model('User');

// User ডেটা পেতে কন্ট্রোলার ফাংশন
exports.listUsers = function(req, res) {
  User.find().exec(function(err, users) {
    if (err) {
      return res.status(400).send({
        message: 'Error fetching users'
      });
    } else {
      res.json(users);
    }
  });
};

// User ডেটা যোগ করার কন্ট্রোলার ফাংশন
exports.createUser = function(req, res) {
  const user = new User(req.body);

  user.save(function(err) {
    if (err) {
      return res.status(400).send({
        message: 'Error saving user'
      });
    } else {
      res.json(user);
    }
  });
};

এখানে, listUsers ফাংশনটি User মডেল থেকে সমস্ত ইউজার ডেটা ফেচ করে এবং createUser ফাংশনটি নতুন ইউজার ডেটা MongoDB তে সেভ করে।

AngularJS কন্ট্রোলার:

AngularJS কন্ট্রোলার ক্লায়েন্ট সাইডের কোডের জন্য ব্যবহৃত হয়, যেখানে ভিউয়ের সাথে ডেটা বাইন্ডিং ও লজিক ম্যানেজমেন্ট করা হয়।

// controllers/user.client.controller.js

angular.module('mean').controller('UserController', ['$scope', '$http', function($scope, $http) {
  // User তালিকা ফেচ করার ফাংশন
  $http.get('/api/users').then(function(response) {
    $scope.users = response.data;
  }, function(error) {
    console.log('Error fetching users');
  });
}]);

এখানে, UserController কন্ট্রোলারটি $http সেবার মাধ্যমে সার্ভার থেকে ইউজার ডেটা ফেচ করে এবং তা $scope.users এ সংরক্ষণ করে, যা view-এ প্রদর্শিত হবে।


৪. Model, View, এবং Controller একত্রিত করা

MeanJS স্ট্যাকে Model, View, এবং Controller এর সমন্বয়ে একটি পূর্ণাঙ্গ অ্যাপ্লিকেশন তৈরি করা হয়। এখানে সার্ভার সাইড কন্ট্রোলার (Express.js) মডেলকে ডেটা প্রসেস করতে ব্যবহার করে এবং ক্লায়েন্ট সাইড কন্ট্রোলার (AngularJS) সেই ডেটা ভিউতে প্রদর্শন করে।

সম্পূর্ণ রাউটিং:

Express.js এবং AngularJS এর মধ্যে সঠিক সংযোগ তৈরি করতে আপনাকে রাউটিং সেটআপ করতে হবে।

// routes/user.server.routes.js

module.exports = function(app) {
  const users = require('../controllers/user.server.controller');

  // Users রুট সেটআপ
  app.route('/api/users')
    .get(users.listUsers)
    .post(users.createUser);
};

এখানে, GET /api/users ইউজার তালিকা ফেচ করতে ব্যবহার হবে এবং POST /api/users নতুন ইউজার ডেটা সেভ করতে ব্যবহার হবে।


সারাংশ

MeanJS স্ট্যাকের মধ্যে Model, View, এবং Controller ব্যবস্থাপনা অ্যাপ্লিকেশনকে সুষ্ঠু, স্কেলেবল এবং রক্ষণাবেক্ষণযোগ্য করে তোলে।

  • Model MongoDB এর ডেটা ম্যানেজমেন্ট,
  • View AngularJS এর মাধ্যমে ডাইনামিক ইউজার ইন্টারফেস তৈরি করে,
  • এবং Controller Express.js (সার্ভার সাইড) এবং AngularJS (ক্লায়েন্ট সাইড) এর মাধ্যমে ডেটা প্রক্রিয়াকরণ ও প্রদর্শন পরিচালনা করে।

এটি ডেভেলপারদের জন্য একটি শক্তিশালী ও সুসংগঠিত উপায় তৈরি করে, যাতে তারা দ্রুত এবং কার্যকরী অ্যাপ্লিকেশন ডেভেলপ করতে পারেন।

Content added By
Promotion

Are you sure to start over?

Loading...