Redux-এ সার্ভারের জন্য ডাটাবেস

গত ক্লাসে, আমরা msw ইনস্টল করেছিলাম, যা আমাদের অ্যাপ্লিকেশনটির সার্ভারের সাথে কাজ করার অভিনয় করতে সাহায্য করবে। এবং শুরুতে আমরা চাই যে অ্যাপ্লিকেশন চালু হওয়ার সময় সার্ভারে ইতিমধ্যে থাকা ডেটা লোড হয়ে আসুক।

আসুন আমাদের পণ্য সহ অ্যাপ্লিকেশনটি খুলি, এবং এটির server.js ফাইলটি খুলি। এখানে ইতিমধ্যেই আমাদের গত ক্লাসের কয়েক লাইন কোড রয়েছে।

এবং প্রথম জিনিস যা আমরা নিজেদের জিজ্ঞাসা করব: সাধারণত ডেটা কোথায় সংরক্ষণ করা হয়? হ্যাঁ, অবশ্যই ডাটাবেসে, আমরা কোন দ্বিধা ছাড়াই উত্তর দেব। তাই আসুন আরও একটি দুর্দান্ত টুল ব্যবহার করি, যা আমাদের আমাদের ডেটার মডেল তৈরি করতে দেবে, এবং এটাও তৈরি করবে যেন আমরা একটি আসল SQL ডাটাবেসের সাথে কাজ করছি।

যে টুলটি এতে আমাদের সাহায্য করবে - তা হল লাইব্রেরি @mswjs/data। এটি ইনস্টল করতে, টার্মিনালে নিম্নলিখিত কমান্ডটি লিখুন:

npm install @mswjs/data --save-dev

এখন server.js ফাইলে আমাদের প্রয়োজনীয় জিনিসগুলি ইম্পোর্ট করি:

import { factory, oneOf, manyOf, primaryKey } from '@mswjs/data'

এবং আমাদের ইম্প্রোভাইজড ডাটাবেস তৈরি করি। এর জন্য আমরা ফাংশনটি factory ব্যবহার করব। আমরা এটি ইম্পোর্টের পরে এবং ওয়ার্কার এক্সপোর্ট করার আগে নিচে করব:

export const db = factory({})

এবং আমরা এতে কী কী ডেটা সংরক্ষণ করব? সার্ভার থেকে আমাদের পণ্য, বিক্রেতা এবং ব্যবহারকারীর প্রতিক্রিয়া পাওয়া উচিত। অর্থাৎ আমাদের ডাটাবেসে আমাদের তিনটি মডেল তৈরি করা উচিত, যা factory অবজেক্ট আকারে গ্রহণ করে:

export const db = factory({
	product: {},
	seller: {},
	reaction: {},
})

একটি আসল SQL ডাটাবেসের মতোই আমাদের প্রতিটি মডেলের একটি primary key থাকা উচিত। প্রথাগতভাবে, আমরা id কে这样一个 ফিল্ড হিসাবে নিয়োগ করব, যেটি তৈরি করতে আমরা সেই একই nanoid লাইব্রেরি ব্যবহার করব:

export const db = factory({
	product: {
		id: primaryKey(nanoid),
	},
	seller: {
		id: primaryKey(nanoid),
	},
	reaction: {
		id: primaryKey(nanoid),
	},
})

ফাইলের শুরুতে ইম্পোর্টের লাইনে nanoid যোগ করতে ভুলবেন না:

import { nanoid } from '@reduxjs/toolkit'

পরবর্তী পাঠে আমরা আমাদের মডেলগুলিকে প্রয়োজনীয় ফিল্ড দিয়ে সম্পূরক করব।

আপনার শিক্ষার্থীদের সহ আপনার অ্যাপ্লিকেশনটি খুলুন। এই পাঠের উপাদানটি দেখে নেওয়ার পরে, আপনার অ্যাপ্লিকেশনের জন্য @mswjs/data ইনস্টল করুন।

এরপর factory ফাংশনের সাহায্যে একটি ডাটাবেস মডেল db তৈরি করুন। পাঠে দেখানো হয়েছে তার মতো করেই এটিকে তিনটি অবজেক্ট (student, teacher, vote) আপনার ডেটার জন্য পাস করুন।