TensorFlow.js: স্কেলে মেশিন লার্নিং মডেল স্থাপন ও হোস্ট করতে Firebase হোস্টিং ব্যবহার করুন

1. ভূমিকা

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

আপনি কি নির্মাণ করবেন

এই কোড ল্যাবে আপনি একটি কাস্টম সংরক্ষিত TensorFlow.js মডেল হোস্ট করতে সক্ষম এবং এর সাথে সম্পর্কিত সম্পদ যেমন HTML, CSS এবং JavaScript পরিচালনা করতে সক্ষম একটি সম্পূর্ণ এন্ড থেকে এন্ড সিস্টেম তৈরি করবেন। আমরা একটি খুব সাধারণ লাইটওয়েট মডেল তৈরি করব যা কিছু ইনপুট মান দিয়ে একটি সংখ্যাসূচক আউটপুট মান ভবিষ্যদ্বাণী করতে পারে (উদাহরণস্বরূপ, একটি বাড়ির বর্গাকার ফুটেজ দেওয়া মূল্য কত), এবং এটিকে ফায়ারবেস হোস্টিংয়ের মাধ্যমে হোস্ট করব যাতে এটি স্কেলে ব্যবহার করা যায়।

আপনি কি শিখবেন

  • কিভাবে সঠিক বিন্যাসে একটি কাস্টম TensorFlow.js মডেল সংরক্ষণ করবেন
  • হোস্টিং এর জন্য কিভাবে একটি ফায়ারবেস অ্যাকাউন্ট সেটআপ করবেন
  • ফায়ারবেস হোস্টিং-এ কীভাবে আপনার সম্পদ স্থাপন করবেন
  • কীভাবে একটি মডেলের নতুন সংস্করণ স্থাপন করবেন।

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

আপনি কি আমাদের সাথে শেয়ার করুন

আপনি যদি এই স্ট্যাকটি ব্যবহার করে দুর্দান্ত কিছু তৈরি করে থাকেন তবে আমাদের জানান! আমরা আপনার সৃষ্টি দেখতে চাই.

আমাদের টেনসরফ্লো ব্লগে বা আমাদের শো অ্যান্ড টেলস- এর মতো ভবিষ্যত ইভেন্টে আপনার প্রোজেক্ট দেখানোর সুযোগের জন্য #MadeWithTFJS হ্যাশট্যাগ ব্যবহার করে সোশ্যাল মিডিয়াতে আমাদের ট্যাগ করুন।

2. ফায়ারবেস হোস্টিং কি?

ফায়ারবেস হোস্টিং আপনার ওয়েব অ্যাপ, স্ট্যাটিক/ডাইনামিক কন্টেন্ট এবং মাইক্রোসার্ভিসের জন্য দ্রুত এবং নিরাপদ প্রোডাকশন-গ্রেড হোস্টিং প্রদান করে

একটি একক কমান্ডের সাহায্যে, আপনি দ্রুত ওয়েব অ্যাপ স্থাপন করতে পারেন এবং একটি বিশ্বব্যাপী CDN (কন্টেন্ট ডেলিভারি নেটওয়ার্ক) এ বিষয়বস্তু পরিবেশন করতে পারেন যাতে আপনার বিষয়বস্তু প্রায় কোথাও কম লেটেন্সি সহ উপলব্ধ থাকে। আপনি ফায়ারবেস ক্লাউড ফাংশনগুলির সাথে ফায়ারবেস হোস্টিং বা ক্লাউড রানের সাথে মাইক্রোসার্ভিসগুলি তৈরি এবং হোস্ট করতেও যুক্ত করতে পারেন, তবে এটি এই কোডল্যাবের সুযোগের বাইরে।

ফায়ারবেস হোস্টিং কী ক্ষমতা

  • একটি নিরাপদ সংযোগের মাধ্যমে সামগ্রী পরিবেশন করুন - আধুনিক ওয়েব সুরক্ষিত৷ প্রায়শই ক্লায়েন্ট সাইডের সেন্সর অ্যাক্সেস করার জন্য সাইটটিকে অবশ্যই একটি সুরক্ষিত প্রসঙ্গে সরবরাহ করতে হবে। জিরো-কনফিগারেশন SSL Firebase হোস্টিং-এ তৈরি করা হয়েছে, তাই হোস্ট করা সমস্ত ফাইলের জন্য কন্টেন্ট সবসময় নিরাপদে বিতরণ করা হয়।
  • হোস্ট স্ট্যাটিক এবং ডাইনামিক কন্টেন্ট প্লাস মাইক্রোসার্ভিস সহ প্রমাণীকরণের জন্য সমর্থন তাই শুধুমাত্র লগ ইন করা ব্যবহারকারীরা চাইলে সেই ফাইলগুলি লোড/দেখতে পারে।
  • বিষয়বস্তু দ্রুত বিতরণ করুন - আপনার আপলোড করা প্রতিটি ফাইল সারা বিশ্বের CDN প্রান্তে SSD-এ ক্যাশে করা হয়। আপনার ব্যবহারকারীরা যেখানেই থাকুন না কেন, বিষয়বস্তু দ্রুত বিতরণ করা হয়।
  • একটি কমান্ড দিয়ে নতুন সংস্করণ স্থাপন করুন - Firebase কমান্ড লাইন ইন্টারফেস ব্যবহার করে, আপনি আপনার অ্যাপটি কয়েক সেকেন্ডের মধ্যে চালু করতে পারেন।
  • এক ক্লিকে রোলব্যাক - দ্রুত স্থাপনাগুলি দুর্দান্ত, তবে ভুলগুলি পূর্বাবস্থায় ফিরিয়ে আনতে সক্ষম হওয়া আরও ভাল৷ Firebase হোস্টিং এক-ক্লিক রোলব্যাকের সাথে সম্পূর্ণ সংস্করণ এবং প্রকাশ ব্যবস্থাপনা প্রদান করে।

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

ডিফল্টরূপে, প্রতিটি ফায়ারবেস প্রকল্পের web.app এবং firebaseapp.com ডোমেনে বিনামূল্যে সাবডোমেন রয়েছে৷ এই দুটি সাইট একই স্থাপন করা সামগ্রী এবং কনফিগারেশন পরিবেশন করে। আপনি চাইলে আপনার নিজের ডোমেন নামটি একটি Firebase-হোস্টেড সাইটেও সংযুক্ত করতে পারেন।

বাস্তবায়নের পদক্ষেপ

কিন্তু এর কোনোটি করার আগে আমাদের একটি মেশিন লার্নিং মডেল এবং ওয়েব অ্যাপ স্থাপন করতে হবে। সুতরাং আসুন একটি তৈরি করা যাক!

3. বাড়ির দামের পূর্বাভাস দেওয়ার জন্য একটি সাধারণ মেশিন লার্নিং মডেল

এই অনুশীলনের উদ্দেশ্যে আমরা একটি খুব সাধারণ এমএল মডেল তৈরি করব যা সংখ্যাগত মানগুলির পূর্বাভাস দেয়। আমরা চেষ্টা করব এবং মেশিন লার্নিং ব্যবহার করে একটি কাল্পনিক বাড়ির মূল্য অনুমান করার জন্য এর আকার বর্গফুটে শুধুমাত্র দৃষ্টান্তমূলক উদ্দেশ্যে ব্যবহার করব। প্রকৃতপক্ষে এই ডেমোর জন্য আমরা আমাদের প্রশিক্ষণের ডেটার পূর্বাভাসিত মান পেতে বাড়ির বর্গফুট 1000x করব, কিন্তু মেশিন লার্নিংকে নিজের জন্য এটি শিখতে হবে।

বাস্তবে আপনি বাস্তব বিশ্বের ডেটা ব্যবহার করতে বেছে নেবেন যার মধ্যে আরও জটিল সম্পর্ক থাকতে পারে (উদাহরণস্বরূপ ছোট ঘরগুলির জন্য ডলারের মূল্য অনুমান করার জন্য এটির আকার মাত্র 500x, কিন্তু একটি নির্দিষ্ট থ্রেশহোল্ডের পরে এটি ধীরে ধীরে 1000x হয়ে যায় ইত্যাদি) এবং আপনার আরও উন্নত প্রয়োজন হতে পারে সেই মানগুলির পূর্বাভাস দেওয়ার সর্বোত্তম উপায় শিখতে মডেল।

আমরা আজ যে মডেলটি তৈরি করব (রৈখিক রিগ্রেশন) পর্যাপ্ত বাস্তব বিশ্বের ডেটা দেওয়া অন্যান্য অনেক জিনিসের ভবিষ্যদ্বাণী করতে ব্যবহার করা যেতে পারে এবং উপরের আমাদের অনুমানমূলক ব্যবহারের ক্ষেত্রে শুরু করা সহজ। যাইহোক, আজকে আমাদের ফোকাস একটি প্রদত্ত ব্যবহারের ক্ষেত্রে একটি মডেল বনাম ডিজাইনিং এবং অপ্টিমাইজ করা কিভাবে সংরক্ষণ এবং স্থাপন করা যায় তা শিখছে। সুতরাং এর এটি পেতে দেওয়া যাক!

প্রশিক্ষণ এবং পরীক্ষার তথ্য

সমস্ত ML মডেল কিছু উদাহরণ প্রশিক্ষণ ডেটা প্রাপ্তির মাধ্যমে শুরু হয় যা আমরা মডেলটিকে ভবিষ্যতে মান অনুমান করতে সক্ষম হতে শেখাতে ব্যবহার করতে পারি। সাধারণত আপনি একটি ডাটাবেস, ফাইলের ফোল্ডার, CSV বা আরও কিছু থেকে এই ধরনের ডেটা নিতে পারেন, কিন্তু এখানে আমরা সরাসরি জাভাস্ক্রিপ্টে একটি অ্যারে হিসাবে 20টি উদাহরণ হার্ডকোড করব যা নীচে দেখানো হয়েছে। আমরা এই কোডটি এমন একটি পরিবেশে প্রতিলিপি করার পরামর্শ দিই যেখানে আপনি এখনকার জন্য কোডিং করতে খুশি হন যেমন Glitch.com , অথবা স্থানীয়ভাবে আপনার নিজস্ব পাঠ্য সম্পাদক যদি আপনি লোকালহোস্টে একটি সার্ভার চালাতে সক্ষম হন।

model.js

// House square footage.
const data =    [800, 850, 900, 950, 980, 1000, 1050, 1075, 1100, 1150, 1200, 1250, 1300, 1400, 1500, 1600, 1700, 1800, 1900, 2000];

// Estimated dollar cost of house for each piece of data above (1000x square footage).
const answers = [800000, 850000, 900000, 950000, 980000, 1000000, 1050000, 1075000, 1100000, 1150000, 1200000,  1250000 , 1300000, 1400000, 1500000, 1600000, 1700000, 1800000, 1900000, 2000000];

// Testing data separate from training data.
const dataTest =     [886, 1225, 500];
const answersTest =  [886000, 1225000, 500000];

আপনি দেখতে পাচ্ছেন যে প্রতিটি ডেটার জন্য আমাদের কাছে একটি সংশ্লিষ্ট উত্তর মান রয়েছে যা আমরা ভবিষ্যতে চেষ্টা করব এবং ভবিষ্যদ্বাণী করব (আপনি একটি সাধারণ 2D গ্রাফে এগুলিকে x এবং y মান হিসাবে কল্পনা করতে পারেন)।

সুতরাং 800 মানের জন্য, আমরা $800,000 এর একটি আউটপুট উত্তর অনুমান তৈরি করতে চাই। 900 মানটির জন্য আমরা $900,000 আউটপুট করব এবং আরও অনেক কিছু। মূলত সংখ্যাটি 1000 দ্বারা গুণ করা হয়। তবে ML মডেলটি 1000 * N-এর এই সরল সম্পর্ক সম্পর্কে জানে না এবং আমাদের দেওয়া এই উদাহরণগুলি থেকে এটি নিজে থেকেই শিখতে হবে।

লক্ষ্য করুন কীভাবে আমাদের কাছে কিছু পরীক্ষার ডেটা রয়েছে যা প্রশিক্ষণের ডেটা থেকে সম্পূর্ণ আলাদা। এটি আমাদের প্রশিক্ষিত মডেলটিকে মূল্যায়ন করতে দেয় যে এটি আগে কখনও দেখেনি এমন ডেটাতে এটি কতটা ভাল পারফর্ম করে।

আমরা নিম্নলিখিত html ব্যবহার করে TensorFlow.js লাইব্রেরির সাথে এই স্ক্রিপ্টটি লোড করব:

train.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Training Model</title>
    <meta charset="utf-8">
  </head>  
  <body>   
    <!-- Import TensorFlow.js library -->
    <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs/dist/tf.min.js" type="text/javascript"></script>
    <!-- Import our JS code to train the model -->
    <script src="/model.js" defer></script>
  </body>
</html>

মডেল প্রশিক্ষণ

পরবর্তীতে ফাইলের শেষে উপরের আমাদের বিদ্যমান জেএস কোডে নীচের কোডটি যোগ করে মডেলটিকে প্রশিক্ষণ দেওয়ার সময় এসেছে।

কৌতূহলীদের জন্য মন্তব্য যোগ করা হয়েছে, তবে যেমন উল্লেখ করা হয়েছে এই কোডল্যাবটি একটি সংরক্ষিত মডেল নেওয়া এবং এটি হোস্ট করার বিষয়ে আরও বেশি। আপনি যদি আরও বিস্তারিতভাবে মডেল তৈরি করতে চান তবে শেষে লিঙ্কযুক্ত আরও কোডল্যাব রয়েছে। আপাতত আপনি আপনার প্রোজেক্টে কোডটি কপি করে পেস্ট করতে পারেন।

model.js

// Create Tensor representations of our vanilla JS arrays above 
// so can be used to train our model.
const trainTensors = {
  data: tf.tensor2d(data, [data.length, 1]),
  answer: tf.tensor2d(answers, [answers.length, 1])
};

const testTensors = {
  data: tf.tensor2d(dataTest, [dataTest.length, 1]),
  answer: tf.tensor2d(answersTest, [answersTest.length, 1])
};


// Now actually create and define model architecture.
const model = tf.sequential();

// We will use one dense layer with 1 neuron and an input of 
// a single value.
model.add(tf.layers.dense({inputShape: [1], units: 1}));

// Choose a learning rate that is suitable for the data we are using.
const LEARNING_RATE = 0.0001;

train();

async function train() {
  // Compile the model with the defined learning rate and specify
  // our loss function to use.
  model.compile({
    optimizer: tf.train.sgd(LEARNING_RATE),
    loss: 'meanAbsoluteError'
  });

  // Finally do the training itself over 500 iterations of the data.
  // As we have so little training data we use batch size of 1.
  // We also set for the data to be shuffled each time we try 
  // and learn from it.
  let results = await model.fit(trainTensors.data, trainTensors.answer, {epochs: 500, batchSize: 1, shuffle: true});
  
  // Once trained we can evaluate the model.
  evaluate();
}

async function evaluate(stuff) {
  // Predict answer for a single piece of data.
  model.predict(tf.tensor2d([[768]])).print();
}

উপরের কোডটি ব্যবহার করে আমরা ইনপুট মান দেওয়া একটি আউটপুট মান ভবিষ্যদ্বাণী করতে সক্ষম একটি মডেলকে প্রশিক্ষণ দিতে সক্ষম হয়েছি। উপরের কোডটি চালানোর ফলে আমি ইনপুট মান 768-এর জন্য 768,073 একটি ভবিষ্যদ্বাণী পেয়েছি যা আপনার ব্রাউজারের ডেভেলপার কনসোলে প্রিন্ট করা হয়েছে (যদি আপনার এটি ইতিমধ্যে খোলা না থাকে তবে এটি খুলতে F12 টিপুন)। এটি বাড়ির দামের একটি সুন্দর অনুমান যা আমরা উদাহরণ দিয়েছি যেগুলি ইনপুট থেকে 1000x বেশি। দ্রষ্টব্য: আপনার পূর্বাভাসিত মান কিছুটা আলাদা হতে পারে এবং এটি স্বাভাবিক।

আমরা যদি এই পারফরম্যান্সে খুশি হতাম, তাহলে আমাদের এখন যা করতে হবে তা হল এই মডেলটিকে ডিস্কে সংরক্ষণ করুন যাতে আমরা এটিকে Firebase হোস্টিং-এ আপলোড করতে পারি!

মডেল সংরক্ষণ

উপরের মূল্যায়ন ফাংশনের শেষে নীচের কোডটি যুক্ত করা (modell.predict এর পরে) সরাসরি ওয়েব ব্রাউজার থেকে প্রশিক্ষণ সম্পূর্ণ হওয়ার পরে ফলাফলের মডেলটি রপ্তানি করতে এবং ডিস্কে সংরক্ষণ করার অনুমতি দেয় যাতে আমরা কোথাও হোস্ট করতে পারি এবং ভবিষ্যতে এটি ব্যবহার করতে পারি। প্রতিবার আমরা পৃষ্ঠা লোড করার সময় পুনরায় প্রশিক্ষণের প্রয়োজন ছাড়াই।

model.js

await model.save('downloads://my-model');

আপনি যদি এখন train.html পরিদর্শন করেন এবং পৃষ্ঠাটি চালান তবে এটিকে মডেলটি প্রশিক্ষণ দেওয়া উচিত (যেটিতে কয়েক সেকেন্ড সময় লাগতে পারে) এবং তারপরে সম্পূর্ণ প্রশিক্ষিত মডেলটি ডাউনলোড করার জন্য অনুরোধ করা উচিত।

4. ফায়ারবেস সেট আপ করা

Firebase এ সাইন ইন করুন এবং একটি প্রকল্প তৈরি করুন

আপনি যদি Firebase এ নতুন হন তাহলে আপনার Google অ্যাকাউন্ট ব্যবহার করে সাইন আপ করা সহজ। শুধু https://firebase.google.com/ এ যান এবং আপনার নিয়মিত Google অ্যাকাউন্ট দিয়ে সাইন ইন করুন যা আপনি ব্যবহার করতে চান। একবার আপনি হোম পেজে পুনঃনির্দেশিত হলে, পৃষ্ঠার উপরের ডানদিকে "কনসোলে যান" এ ক্লিক করুন:

ea7ff3f08e4019b0.png

একবার আপনি কনসোলে পুনঃনির্দেশিত হয়ে গেলে আপনাকে এইরকম একটি ল্যান্ডিং পৃষ্ঠা দেখতে হবে:

166d9408ad46599b.png

একটি নতুন ফায়ারবেস প্রজেক্ট তৈরি করতে দেখানো হিসাবে শুধু Add Project এ ক্লিক করুন, আপনার প্রোজেক্টকে একটি অনন্য নাম দিন, শর্তাবলী স্বীকার করুন এবং চালিয়ে যান ক্লিক করুন।

পরবর্তীতে আপনাকে জিজ্ঞাসা করা হবে আপনি আপনার প্রকল্পে বিশ্লেষণ যোগ করতে চান কিনা। আপনি যদি এই জাতীয় বিশ্লেষণগুলিতে অ্যাক্সেস পেতে চান তবে নির্দ্বিধায় এই বিকল্পটি সক্ষম করুন এবং দেখানো হিসাবে চালিয়ে যান ক্লিক করুন:

a34c2be47b26e6b5.png

যদি সবকিছু ঠিকঠাক হয় তবে আপনাকে দেখানো হিসাবে একটি প্রজেক্ট রেডি পৃষ্ঠা দিয়ে শুভেচ্ছা জানানো উচিত:

1306dc803ad22338.png

উহু! আমরা একটি প্রকল্প আছে. নতুন তৈরি প্রকল্পের জন্য কনসোলে নিয়ে যেতে অবিরত ক্লিক করুন। পৃষ্ঠাটি পরে ব্যবহারের জন্য খোলা রাখুন তবে আপাতত আমাদের কিছু টুলিং ইনস্টল করতে হবে।

CLI ইনস্টল এবং সংযোগ করা হচ্ছে

ফায়ারবেস একটি নোড NPM প্যাকেজ হিসাবে উপলব্ধ যা আপনি কমান্ড লাইন ইন্টারফেস (CLI) এর মাধ্যমে ইনস্টল এবং ব্যবহার করতে পারেন যা আপনার স্থানীয় ফাইল এবং ফোল্ডারগুলিকে Firebase হোস্টিং-এ স্থাপন করা সহজ করে তোলে। আজকের টিউটোরিয়ালের জন্য আমরা একটি লিনাক্স পরিবেশ ব্যবহার করব, তবে আপনার যদি উইন্ডোজ বা ম্যাক থাকে, তাহলে আপনি আপনার ডিভাইসে CLI টুলিং সেট আপ করতে এখানে নির্দেশাবলী অনুসরণ করতে পারেন।

লিনাক্সে যাইহোক, আমরা প্রথমে NPM এবং Node.js ইনস্টল করব যদি এটি ইতিমধ্যে না থাকে ( অন্যান্য পরিবেশ ব্যবহার করলে এই নির্দেশাবলী অনুসরণ করুন) একটি টার্মিনাল উইন্ডোতে নিম্নলিখিত 3টি কমান্ড ব্যবহার করে:

কমান্ড লাইন টার্মিনাল:

sudo apt update

কমান্ড লাইন টার্মিনাল:

sudo apt install nodejs

কমান্ড লাইন টার্মিনাল:

sudo apt install npm

এখন Node.js এবং NPM ইনস্টল করা আছে আপনাকে ফায়ারবেস কমান্ড লাইন টুল ইনস্টল করার জন্য একটি টার্মিনাল উইন্ডোতে নিম্নলিখিতগুলি চালাতে হবে:

কমান্ড লাইন টার্মিনাল:

sudo npm install -g firebase-tools

দারুণ! আমরা এখন আমাদের ফায়ারবেস প্রকল্পকে আমাদের সিস্টেমের সাথে সংযুক্ত করতে প্রস্তুত যাতে আমরা ফাইলগুলিকে এটিতে পুশ করতে পারি এবং আরও অনেক কিছু করতে পারি।

ফায়ারবেসে লগ ইন করা হচ্ছে

নিম্নলিখিত কমান্ডটি চালিয়ে আপনার Google অ্যাকাউন্ট ব্যবহার করে ফায়ারবেসে লগ ইন করুন:

কমান্ড লাইন টার্মিনাল:

firebase login

আপনাকে দেখানো হিসাবে আপনার Google Firebase অ্যাকাউন্টে অ্যাক্সেস দিতে বলা হবে:

4dc28589bef2ff5d.png

এটির অনুমতি দিন এবং অবশেষে আপনার ফায়ারবেস অ্যাকাউন্টে আপনার কমান্ড লাইন সরঞ্জামগুলির একটি সফল সংযোগ দেখতে হবে:

df397ec7a555e8de.png

উইন্ডোটি বন্ধ করুন এবং কমান্ড লাইন টার্মিনালে ফিরে যান যা আপনি আগে টাইপ করেছিলেন যেখানে এখন দেখানো হিসাবে নতুন কমান্ড গ্রহণ করার জন্য প্রস্তুত হওয়া উচিত (আমরা আমাদের স্ক্রিনশটে যে কোনও ব্যক্তিগত তথ্য লুকিয়ে রেখেছি):

67a3ff39d3c0f3e4.png

অভিনন্দন! আমরা এখন আমাদের স্থানীয় মেশিন থেকে আমাদের তৈরি প্রকল্পে ফাইল পুশ করার জন্য প্রস্তুত।

ফায়ারবেস হোস্টিং-এ স্থাপন করার জন্য আপনার প্রকল্প শুরু করা হচ্ছে

আপনার স্থানীয় ফোল্ডারটিকে আপনার Firebase প্রকল্পের সাথে সংযুক্ত করতে, আপনার স্থানীয় প্রকল্প ডিরেক্টরির রুট থেকে নিম্নলিখিত কমান্ডটি চালান (যে ফোল্ডারটি আপনি স্থাপন করার সময় ফাইল আপলোড করার জন্য ব্যবহার করতে চান)।

কমান্ড লাইন টার্মিনাল:

firebase init

এই কমান্ডটি কার্যকর করার পরে, নীচে দেখানো হিসাবে সেটআপ সম্পূর্ণ করতে টার্মিনালে নির্দেশাবলী অনুসরণ করুন:

61e0f6d92ef3e1c4.png

এখানে আমরা আপনার কীবোর্ডের নিচের তীরটি ব্যবহার করে হোস্টিং নির্বাচন করতে পারি এবং তারপর নির্বাচন করতে স্পেসবার টিপুন এবং তারপর নিশ্চিত করতে এন্টার চাপুন।

এখন আমরা ব্যবহার করার জন্য আগে তৈরি করা বিদ্যমান প্রকল্পটি নির্বাচন করতে পারি:

4f2a1696d5cfd72f.png

"একটি বিদ্যমান প্রকল্প ব্যবহার করুন" এ এন্টার টিপুন এবং তারপরে নীচে দেখানো তীর কী ব্যবহার করে এটি নির্বাচন করুন:

4dfcf2dff745f2c.png

অবশেষে এটি ব্যবহার করতে এন্টার টিপুন এবং তারপরে পপ আপ হওয়া চূড়ান্ত স্ক্রিনে ডিফল্টগুলি স্বীকার করুন এবং একক পৃষ্ঠা অ্যাপ্লিকেশন হিসাবে কনফিগার করতে "না" বলুন:

7668a2175b624af2.png

আপনি যদি এটি করতে চান তবে এটি আপনাকে একাধিক এইচটিএমএল পৃষ্ঠা হোস্ট করার অনুমতি দেবে৷

এখন প্রারম্ভিকতা সম্পূর্ণ হয়েছে আপনি একটি firebase.json ফাইল লক্ষ্য করবেন এবং যে ডিরেক্টরি থেকে আমরা উপরের কমান্ডগুলি কার্যকর করেছি সেখানে একটি "পাবলিক" ফোল্ডার তৈরি করা হয়েছে।

cd7724b92f3d507.png

আমাদের এখন যা করতে হবে তা হল আমরা যে ফাইলগুলি তৈরি করতে চাই সেগুলি আমাদের তৈরি করা সর্বজনীন ফোল্ডারে সরানো এবং স্থাপন করা ভাল হবে! এখন এটা করা যাক.

5. আপনার TensorFlow.js ওয়েবপেজ তৈরি করা

আপনার সংরক্ষিত মডেল লোড হচ্ছে৷

প্রথমে আমরা নিশ্চিত করি যে আমরা আগে কোডল্যাবে সংরক্ষিত মেশিন লার্নিং মডেলটি আমাদের সর্বজনীন ফোল্ডারে কপি করেছি যা আমরা এইমাত্র Firebase দিয়ে তৈরি করেছি। দেখানো হিসাবে এই ফোল্ডারে আপনার সংরক্ষিত ফাইলগুলিকে কেবল টেনে আনুন এবং ফেলে দিন:

cd6f565189e23705.png

আপনি আমাদের জন্য Firebase তৈরি index.html এবং 404.html ফাইলগুলিও লক্ষ্য করবেন। আসুন এগিয়ে যাই এবং আপনার মেশিনে আপনার প্রিয় পাঠ্য সম্পাদক ব্যবহার করে index.html সম্পাদনা করি যাতে আমরা দেখানো হিসাবে আমাদের নিজস্ব কাস্টম কোড যোগ করতে পারি:

index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Hello World - TensorFlow.js</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- Import the webpage's stylesheet -->
    <link rel="stylesheet" href="style.css">
  </head>  
  <body>
    <h1>TensorFlow.js Hello World</h1>
    <p>Check the console (Press F12) to see predictions!</p>
    <!-- Import TensorFlow.js library -->
    <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs/dist/tf.min.js" type="text/javascript"></script>

    <!-- Import the page's JavaScript to do some stuff -->
    <script src="script.js" defer></script>
  </body>
</html>

উপরের index.html-এর জন্য আমাদের নতুন কোডে আমরা একটি স্টাইল শীট নির্দিষ্ট করেছি যাতে আমরা পরে আমাদের পৃষ্ঠায় স্টাইল যোগ করতে পারি যদি আমরা তা করতে পারি, এবং আমাদের TensorFlow.js ব্যবহার করার জন্য যে কোডটি লিখতে হবে সেটি হোস্ট করার জন্য script.jsও সংরক্ষিত। মডেল

আসুন এগিয়ে যাই এবং এখন সেই ফাইলগুলি তৈরি করি এবং সেগুলিকে নিম্নরূপ পপুলেট করি যাতে তারা কিছু দরকারী করতে পারে:

style.css

/** Leave blank for now **/

script.js

// Load our saved model from current directory (which will be 
// hosted via Firebase Hosting)
async function predict() {
  // Relative URL provided for my-model.json.
  const model = await tf.loadLayersModel('my-model.json');
  // Once model is loaded, let's try using it to make a prediction!
  // Print to developer console for now.
  model.predict(tf.tensor2d([[1337]])).print();
}

predict();

আপনি যদি সঠিকভাবে পদক্ষেপগুলি অনুসরণ করেন তবে আপনি এখন আমাদের তৈরি করা সর্বজনীন ফোল্ডারে নিম্নলিখিত সম্পাদিত ফাইলগুলি দেখতে পাবেন:

253498c703c04ee.png

আমাদের এখন যা করতে হবে তা হল আমাদের ফাইলগুলি স্থাপন করা যাতে আমরা এটি কাজ করে তা পরীক্ষা করতে পারি!

6. আপনার মডেল এবং ওয়েবসাইট স্থাপন করা

লাইভে যাচ্ছে

আপনার স্থানীয় মেশিনের ফায়ারবেস প্রোজেক্ট ফোল্ডারে আপনি যে টার্মিনাল উইন্ডোটি খুলেছিলেন তার দিকে ফিরে যান (এটি সেই ফোল্ডার যেখানে ফায়ারবেস ইনিট ফাইলগুলির সাথে উপরে আমাদের "পাবলিক" ফোল্ডার রয়েছে)।

আপনার সর্বজনীন ফোল্ডার ফাইলগুলি স্থাপন করতে কেবল নিম্নলিখিতটি টাইপ করুন:

কমান্ড লাইন টার্মিনাল:

firebase deploy

টার্মিনাল কমান্ডটি সম্পূর্ণ হতে দিন এবং আপনি এটি ব্যবহার করতে ব্যবহার করতে পারেন এমন URL সহ আপনার একটি সফল রিলিজ হওয়া উচিত:

c5795cae85ed82a5.png

উপরের আমাদের উদাহরণে আপনি আমাদের স্থাপনার চূড়ান্ত url দেখতে পারেন:

https://tensorflow-js-demo.web.app (কিন্তু আপনার URL হবে আপনার তৈরি করা প্রকল্পের নাম)।

একটি ওয়েব ব্রাউজারে এই URLটি খুলুন যাতে এটি কাজ করে যা সফল হলে আপনার খোলা পৃষ্ঠার বিকাশকারী কনসোলে এরকম কিছু প্রিন্ট করা উচিত (ডেভেলপার কনসোল খুলতে F12 টিপুন)।

182aee0acfa7c41e.png

আপনি দেখতে পাচ্ছেন যে স্থাপন করা ডোমেনে পৃষ্ঠা লোড হচ্ছে এবং আমরা সঠিকভাবে 1337 বর্গফুটের জন্য আমাদের মডেলের ভবিষ্যদ্বাণী দেখতে পাচ্ছি, যা $1,336,999.25 হিসাবে আসে যা সত্যিই একটি খুব ভাল অনুমান কারণ আমরা এটি 1000x বর্গফুট হবে বলে আশা করছিলাম৷ আমরা অবশ্যই আমাদের পছন্দ মতো অনেকগুলি ভবিষ্যদ্বাণী করতে পারি যদি আমরা মডেলটিকে কল করার জন্য একটি সুন্দর ইউজার ইন্টারফেস তৈরি করি এবং এটি সম্পূর্ণরূপে JavaScript-এ চলবে আপনার প্রশ্নগুলিকে ব্যক্তিগত এবং সুরক্ষিত রেখে৷

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

ব্যবহার নিরীক্ষণ

আপনি আপনার ওয়েবসাইটের কোডে যোগ করতে পারেন এমন যেকোনো Google বিশ্লেষণ ছাড়াও, Firebase আপনার প্রকল্পের কনসোলের মাধ্যমে সংস্করণ এবং ব্যবহারের পরিসংখ্যানও অফার করে। স্থাপন করার পরে আপনি এরকম কিছু দেখতে পাবেন যা আপনি প্রয়োজন অনুসারে সময়ে সময়ে পরীক্ষা করতে পারেন:

42b1cb8f7c10016.png

fbdd6504bec7c3d.png

আপনি দেখতে পাচ্ছেন, ডিফল্টরূপে, বিনামূল্যের স্তরে আপনি আপনার হোস্ট করা ফাইলগুলির জন্য প্রতি মাসে 10GB ব্যান্ডউইথ পাবেন৷ যদি আপনার সাইটটি আরও জনপ্রিয় হয় তবে একটি নির্দিষ্ট মাসে এর থেকে বেশি ব্যবহার করার জন্য আপনাকে একটি বিলিং অ্যাকাউন্ট যোগ করতে হতে পারে। আপনি এখানে বৃহত্তর প্রকল্পগুলির জন্য ফায়ারবেস পরিকল্পনাগুলি পরীক্ষা করে দেখতে পারেন যদিও প্রোটোটাইপের জন্য বেশিরভাগ নৈমিত্তিক ব্যবহারকারীরা সম্ভবত বিনামূল্যের স্তর অতিক্রম করবেন না যদি আপনার মডেলটি ছোট হয় এবং ব্যবহার কম হয় তাই এটি পরীক্ষা করার একটি দুর্দান্ত উপায় এবং এটি আপনার প্রতিশ্রুতি দেওয়ার আগে এটি আপনার চাহিদা পূরণ করে তা পরীক্ষা করার একটি দুর্দান্ত উপায় আপনি আপনার ব্যবসা বা ধারণা বাড়ার সাথে সাথে একটি অর্থপ্রদানের পরিকল্পনায়।

7. অভিনন্দন

অভিনন্দন, আপনি একটি কাস্টম বিল্ট মেশিন লার্নিং মডেল তৈরি এবং স্থাপন করতে Firebase-এর সাথে TensorFlow.js ব্যবহার করার জন্য আপনার প্রথম পদক্ষেপ নিয়েছেন যাতে আপনি এটি বিশ্বের সাথে শেয়ার করতে পারেন। শুধু কল্পনা করুন যে আপনি এই শক্তিশালী এবং মাপযোগ্য পদ্ধতি ব্যবহার করে তৈরি করতে পারেন যা উত্পাদন ব্যবহারের ক্ষেত্রে প্রস্তুত যদি আপনি চান যে ফায়ারবেস স্বয়ংক্রিয়ভাবে চাহিদার সাথে স্কেল করে, তাই 10, বা 10,000 ব্যবহারকারী এটি ব্যবহার করতে চান না কেন, এটি কাজ করবে .

আপনি যদি আপনার কোনো ফাইল পরিবর্তন করেন, তাহলে আগের মতোই ফায়ারবেস ডিপ্লোয় ব্যবহার করে আপনার অ্যাপ পুনরায় ব্যবহার করুন এবং আপনি যখন পরবর্তী পৃষ্ঠাটি লোড করবেন তখন আপনি ফাইলগুলির নতুন সংস্করণ পাবেন তা নিশ্চিত করতে আপনার ব্রাউজার ক্যাশে সাফ করতে ভুলবেন না। যদি আপনার কাছে বিকাশকারী সরঞ্জামগুলি খোলা থাকে তবে আপনি নেটওয়ার্ক ট্যাবের অধীনে এটিকে জোর করতে পারেন যখন আপনি এই ট্যাবের শীর্ষের কাছে "ক্যাশে অক্ষম করুন" চেকবক্সটি নির্বাচন করে জিনিসগুলিকে সহজ করার জন্য পরীক্ষা করছেন:

b1e4c1bf304a4869.png

রিক্যাপ

এই কোড ল্যাবে আমরা:

  1. বাড়ির দামের পূর্বাভাস দেওয়ার জন্য সম্পূর্ণ স্ক্র্যাচ থেকে একটি কাস্টম TensorFlow.js মডেলকে সংজ্ঞায়িত এবং প্রশিক্ষণ দেওয়া হয়েছে।
  2. আপনার ডেভেলপমেন্ট মেশিনে Firebase + Firebase CLI টুলিং সাইন আপ, কনফিগার এবং ইনস্টল করা হয়েছে।
  3. একটি কার্যকরী ওয়েবসাইট স্থাপন এবং চালু করা হয়েছে যা ধাপ 1 থেকে আমাদের প্রশিক্ষিত মডেল লোড করে এবং এটিকে একটি বাস্তব বিশ্বের ওয়েব অ্যাপ্লিকেশনে ব্যবহার করে যা বিশ্বের যে কোনো স্থানে, স্কেলে যে কেউ অ্যাক্সেস করতে পারে।

এরপর কি?

এখন যেহেতু আপনার কাছে শুরু করার জন্য একটি কাজের ভিত্তি আছে, এই মেশিন লার্নিং মডেল ডিপ্লয়মেন্ট বয়লারপ্লেটটি প্রসারিত করার জন্য আপনি কোন সৃজনশীল ধারণা নিয়ে আসতে পারেন?

আমরা আপনাকে আপনার নিজের ডেটা দিয়ে এটি ব্যবহার করতে দেখতে চাই। আপনি যে শিল্প বা এলাকায় থাকেন বা কাজ করেন সে সম্পর্কে চিন্তা করুন। ভবিষ্যতে আপনার (বা অন্যদের) কাজে লাগতে পারে এমন ভবিষ্যদ্বাণী করার জন্য আপনি কীভাবে এই জাতীয় ডেটাতে প্রশিক্ষণ দিতে পারেন? রিয়েল এস্টেট এখানে একমাত্র উদাহরণ নয়, এবং আমরা আপনাকে আপনার নিজের চ্যালেঞ্জেও এটি প্রয়োগ করতে উত্সাহিত করি। হ্যাপি হ্যাকিং!

#MadeWithTFJS ব্যবহার করে আপনার তৈরি করা যেকোনো কিছুতে আমাদের ট্যাগ করতে ভুলবেন না (অন্যরা যা তৈরি করেছে তার অনুপ্রেরণার জন্য এই লিঙ্কে ক্লিক করুন) সোশ্যাল মিডিয়াতে বৈশিষ্ট্যযুক্ত হওয়ার বা এমনকি ভবিষ্যতের TensorFlow ইভেন্টগুলিতে দেখানোর সুযোগের জন্য! আপনি কী তৈরি করেন তা দেখতে আমরা পছন্দ করব এবং অবশ্যই এই কোডল্যাবের লেখকের কাছে কোনো প্রতিক্রিয়া বা প্রশ্ন থাকলে পৌঁছান।

আরও গভীরে যেতে আরও TensorFlow.js কোডল্যাব

চেক আউট ওয়েবসাইট