TensorFlow.js: از میزبانی Firebase برای استقرار و میزبانی مدل یادگیری ماشین در مقیاس استفاده کنید

۱. مقدمه

بنابراین شما یک مدل یادگیری ماشین سفارشی با TensorFlow.js ایجاد کرده‌اید، اما اکنون باید آن را در جایی میزبانی کنید تا در وب‌سایت مورد نظر خود استفاده کنید. گزینه‌های زیادی برای انجام این کار وجود دارد، اما امروز خواهیم دید که استفاده از Firebase Hosting چقدر آسان است که می‌تواند مزایای اضافی مانند نسخه‌بندی، ارائه مدل‌ها از طریق اتصال امن و موارد دیگر را نیز به شما ارائه دهد.

آنچه خواهید ساخت

در این آزمایشگاه کد، شما یک سیستم کامل و جامع ایجاد خواهید کرد که قادر به میزبانی و اجرای یک مدل TensorFlow.js ذخیره شده سفارشی به همراه دارایی‌های مرتبط با آن مانند HTML، CSS و جاوا اسکریپت است. ما یک مدل بسیار ساده و سبک خواهیم ساخت که می‌تواند با دریافت مقداری ورودی (مثلاً قیمت یک خانه با توجه به متراژ آن چقدر است) یک مقدار خروجی عددی را پیش‌بینی کند و آن را از طریق Firebase Hosting میزبانی می‌کند تا بتوان از آن در مقیاس بزرگ استفاده کرد.

آنچه یاد خواهید گرفت

  • چگونه یک مدل سفارشی TensorFlow.js را با فرمت مناسب ذخیره کنیم؟
  • نحوه تنظیم حساب Firebase برای میزبانی
  • نحوه استقرار دارایی‌های خود در Firebase Hosting
  • نحوه استقرار نسخه‌های جدید یک مدل.

لطفاً توجه داشته باشید: تمرکز این آزمایشگاه کد، نحوه‌ی انتخاب یک مدل آموزش‌دیده‌ی سفارشی و میزبانی آن برای استقرار است، نه دوره‌ای برای ساخت معماری مدل بی‌نقص، بنابراین ما با یک مثال ساده، به سرعت به سراغ ایجاد خود مدل یادگیری ماشین خواهیم رفت. اصول کار، صرف نظر از اینکه در نهایت چه مدلی را خودتان ایجاد می‌کنید، یکسان خواهد بود.

آنچه را که می‌سازید با ما به اشتراک بگذارید

اگر با استفاده از این مجموعه چیز جالبی ساخته‌اید، به ما اطلاع دهید! ما دوست داریم خلاقیت‌های شما را ببینیم.

با استفاده از هشتگ #MadeWithTFJS در شبکه‌های اجتماعی ما را تگ کنید تا پروژه شما در وبلاگ TensorFlow یا حتی رویدادهای آینده مانند Show & Tells ما نمایش داده شود.

۲. میزبانی فایربیس چیست؟

میزبانی فایربیس، میزبانی سریع و امن در سطح تولید را برای برنامه وب، محتوای استاتیک/دینامیک و میکروسرویس‌های شما فراهم می‌کند.

با یک دستور واحد، می‌توانید به سرعت برنامه‌های وب را مستقر کرده و محتوا را به یک CDN جهانی (شبکه تحویل محتوا) ارائه دهید و اطمینان حاصل کنید که محتوای شما تقریباً در هر مکانی با تأخیر کم در دسترس است. همچنین می‌توانید Firebase Hosting را با Firebase Cloud Functions یا Cloud Run برای ساخت و میزبانی میکروسرویس‌ها جفت کنید، اما این فراتر از محدوده این آزمایشگاه کد است.

قابلیت‌های کلیدی میزبانی فایربیس

  • محتوا را از طریق یک اتصال امن ارائه دهید - وب مدرن امن است. اغلب برای دسترسی به حسگرها در سمت کلاینت، سایت باید از طریق یک بستر امن ارائه شود. SSL بدون پیکربندی در Firebase Hosting تعبیه شده است، بنابراین محتوا همیشه برای همه فایل‌های میزبانی شده به صورت ایمن ارائه می‌شود.
  • میزبان محتوای استاتیک و پویا به همراه میکروسرویس‌ها با پشتیبانی از احراز هویت باشید، به طوری که فقط کاربران وارد شده بتوانند در صورت تمایل آن فایل‌ها را بارگیری/مشاهده کنند.
  • تحویل سریع محتوا - هر فایلی که آپلود می‌کنید روی SSDها در لبه‌های CDN در سراسر جهان ذخیره می‌شود. مهم نیست کاربران شما کجا هستند، محتوا به سرعت تحویل داده می‌شود.
  • نسخه‌های جدید را با یک دستور مستقر کنید - با استفاده از رابط خط فرمان Firebase، می‌توانید برنامه خود را در عرض چند ثانیه راه‌اندازی و اجرا کنید.
  • بازگشت به نسخه قبلی با یک کلیک - استقرار سریع عالی است، اما امکان لغو اشتباهات حتی بهتر است. Firebase Hosting مدیریت نسخه‌بندی و انتشار کامل را با بازگشت به نسخه‌های قبلی با یک کلیک ارائه می‌دهد.

چه در حال استقرار یک صفحه فرود ساده برای اپلیکیشن باشید و چه یک اپلیکیشن وب پیش‌رونده (PWA) پیچیده، هاستینگ زیرساخت، ویژگی‌ها و ابزارهای متناسب با استقرار و مدیریت وب‌سایت‌ها و اپلیکیشن‌ها را در اختیار شما قرار می‌دهد.

به طور پیش‌فرض، هر پروژه Firebase دارای زیردامنه‌های رایگان در دامنه‌های web.app و firebaseapp.com است. این دو سایت، محتوا و پیکربندی یکسانی را ارائه می‌دهند. در صورت تمایل، می‌توانید نام دامنه خود را نیز به یک سایت میزبانی شده توسط Firebase متصل کنید.

مراحل اجرا

اما قبل از اینکه بتوانیم هر یک از این کارها را انجام دهیم، به یک مدل یادگیری ماشین و یک برنامه وب برای استقرار نیاز داریم. پس بیایید یکی بسازیم!

۳. یک مدل ساده یادگیری ماشین برای پیش‌بینی قیمت خانه

برای این تمرین، یک مدل یادگیری ماشین بسیار ساده خواهیم ساخت که مقادیر عددی را پیش‌بینی می‌کند. ما سعی خواهیم کرد از یادگیری ماشین برای پیش‌بینی ارزش یک خانه فرضی با توجه به اندازه آن بر حسب فوت مربع، صرفاً برای اهداف نمایشی، استفاده کنیم. در واقع، برای این نسخه آزمایشی، ما به سادگی ۱۰۰۰ برابر فوت مربع خانه را ضرب می‌کنیم تا مقدار پیش‌بینی‌شده آن را برای داده‌های آموزشی خود به دست آوریم، اما یادگیری ماشین باید این را خودش یاد بگیرد.

در واقعیت، شما ترجیح می‌دهید از داده‌های دنیای واقعی استفاده کنید که ممکن است روابط پیچیده‌تری داشته باشند (مثلاً شاید برای خانه‌های کوچک‌تر، فقط ۵۰۰ برابر اندازه واقعی‌شان برای تخمین ارزش دلاری کافی باشد، اما پس از یک آستانه مشخص، به تدریج ۱۰۰۰ برابر می‌شود و غیره) و ممکن است برای یادگیری بهترین روش پیش‌بینی این مقادیر، به یک مدل پیشرفته‌تر نیاز داشته باشید.

مدلی که امروز ایجاد خواهیم کرد (رگرسیون خطی) می‌تواند با توجه به داده‌های کافی از دنیای واقعی، برای پیش‌بینی بسیاری از موارد دیگر مورد استفاده قرار گیرد و شروع کار با آن برای مورد استفاده فرضی ما در بالا ساده است. با این حال، تمرکز ما امروز یادگیری نحوه ذخیره و استقرار یک مدل در مقابل طراحی و بهینه‌سازی آن برای یک مورد استفاده معین است. پس بیایید شروع کنیم!

داده‌های آموزش و آزمایش

همه مدل‌های یادگیری ماشین با دریافت تعدادی داده آموزشی نمونه شروع می‌شوند که می‌توانیم از آنها برای آموزش مدل جهت پیش‌بینی مقادیر در آینده استفاده کنیم. معمولاً می‌توانید چنین داده‌هایی را از یک پایگاه داده، پوشه‌ای از فایل‌ها، CSV یا موارد دیگر دریافت کنید، اما در اینجا ما 20 نمونه را مستقیماً به عنوان یک آرایه در جاوا اسکریپت، همانطور که در زیر نشان داده شده است، کدگذاری می‌کنیم. توصیه می‌کنیم این کد را در محیطی که در حال حاضر از کدنویسی در آن راضی هستید، مانند Glitch.com ، یا ویرایشگر متن خودتان به صورت محلی، در صورتی که قادر به اجرای سرور روی localhost هستید، تکرار کنید.

مدل.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];

همانطور که می‌بینید، برای هر داده، یک مقدار پاسخ متناظر داریم که همان مقداری است که سعی می‌کنیم در آینده پیش‌بینی کنیم (می‌توانید این مقادیر را به عنوان مقادیر x و y روی یک نمودار ساده دوبعدی تصور کنید).

بنابراین برای مقدار ۸۰۰، می‌خواهیم تخمین پاسخ خروجی ۸۰۰۰۰۰ دلار تولید کنیم. برای مقدار ۹۰۰، ۹۰۰۰۰۰ دلار و به همین ترتیب تولید می‌کنیم. اساساً این عدد در ۱۰۰۰ ضرب می‌شود. با این حال، مدل یادگیری ماشین از این رابطه ساده ۱۰۰۰ * N اطلاعی ندارد و باید آن را خودش از مثال‌هایی که ارائه می‌دهیم یاد بگیرد.

توجه داشته باشید که ما همچنین تعدادی داده آزمایشی داریم که کاملاً جدا از داده‌های آموزشی هستند. این به ما امکان می‌دهد مدل آموزش‌دیده را ارزیابی کنیم تا ببینیم که روی داده‌هایی که قبلاً ندیده است، چقدر خوب عمل می‌کند.

ما این اسکریپت را به همراه کتابخانه TensorFlow.js با استفاده از html زیر بارگذاری خواهیم کرد:

قطار.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>

آموزش مدل

در مرحله بعد، زمان آن رسیده است که با اضافه کردن کد زیر به کد JS موجود در انتهای فایل، مدل را آموزش دهیم.

برای کنجکاوی بیشتر، توضیحاتی اضافه شده است، اما همانطور که گفته شد، این آزمایشگاه کد بیشتر در مورد گرفتن یک مدل ذخیره شده و میزبانی آن است. اگر مایلید ایجاد مدل را با جزئیات بیشتری درک کنید، آزمایشگاه‌های کد بیشتری در انتها لینک شده‌اند. فعلاً می‌توانید کد را کپی کرده و در پروژه خود قرار دهید.

مدل.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();
}

با استفاده از کد بالا، ما توانسته‌ایم مدلی را آموزش دهیم که قادر به پیش‌بینی مقدار خروجی با توجه به مقدار ورودی است. با اجرای کد بالا، پیش‌بینی ۷۶۸،۰۷۳ برای مقدار ورودی ۷۶۸ دریافت می‌کنم که در کنسول توسعه‌دهنده مرورگر شما چاپ می‌شود (اگر از قبل آن را باز نکرده‌اید، برای باز کردن آن، F12 را فشار دهید). با توجه به اینکه مثال‌هایی ارائه دادیم که ۱۰۰۰ برابر بیشتر از ورودی بودند، این یک تخمین نسبتاً خوب از قیمت خانه است. توجه: مقدار پیش‌بینی شده شما ممکن است کمی متفاوت باشد و این طبیعی است.

اگر از این عملکرد راضی بودیم، تنها کاری که اکنون باید انجام دهیم این است که این مدل را روی دیسک ذخیره کنیم تا بتوانیم آن را در Firebase Hosting آپلود کنیم!

ذخیره مدل

اضافه کردن کد زیر به انتهای تابع evaluate (بعد از model.predict) در بالا به ما این امکان را می‌دهد که مدل حاصل را پس از اتمام آموزش، مستقیماً از مرورگر وب صادر کرده و در دیسک ذخیره کنیم تا بتوانیم آن را در جایی میزبانی کنیم و در آینده بدون نیاز به آموزش مجدد هر بار بارگذاری صفحه، از آن استفاده کنیم.

مدل.js

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

اگر اکنون به train.html مراجعه کنید و صفحه را اجرا کنید، باید مدل را آموزش دهد (که ممکن است چند ثانیه طول بکشد) و سپس پس از تکمیل، از شما درخواست دانلود مدل آموزش‌دیده حاصل را می‌کند.

۴. راه‌اندازی فایربیس

وارد Firebase شوید و یک پروژه ایجاد کنید

اگر در فایربیس تازه‌کار هستید، ثبت‌نام با استفاده از حساب گوگل‌تان آسان است. کافیست به آدرس https://firebase.google.com/ بروید و با حساب گوگل معمولی خود که می‌خواهید از آن استفاده کنید، وارد شوید. پس از هدایت به صفحه اصلی، روی «برو به کنسول» در سمت راست بالای صفحه کلیک کنید:

ea7ff3f08e4019b0.png

پس از اینکه به کنسول هدایت شدید، باید صفحه فرودی شبیه به این را ببینید:

۱۶۶d۹۴۰۸ad۴۶۵۹۹b.png

برای ایجاد یک پروژه جدید Firebase، کافیست همانطور که نشان داده شده است، روی Add Project کلیک کنید، یک نام منحصر به فرد به پروژه خود بدهید، شرایط را بپذیرید و روی ادامه کلیک کنید.

در مرحله بعد از شما پرسیده می‌شود که آیا می‌خواهید تجزیه و تحلیل را به پروژه خود اضافه کنید. اگر مایل به دسترسی به چنین تجزیه و تحلیلی هستید، می‌توانید این گزینه را فعال کرده و مطابق شکل روی ادامه کلیک کنید:

a34c2be47b26e6b5.png

اگر همه چیز خوب پیش رفته باشد، باید با صفحه آماده پروژه، همانطور که نشان داده شده است، مواجه شوید:

۱۳۰۶dc۸۰۳ad۲۲۳۳۸.png

هورا! ما یک پروژه داریم. برای رفتن به کنسول پروژه تازه ایجاد شده، روی ادامه کلیک کنید. صفحه را برای استفاده‌های بعدی باز نگه دارید، اما فعلاً باید برخی ابزارها را نصب کنیم.

نصب و اتصال رابط خط فرمان (CLI)

فایربیس به عنوان یک بسته Node NPM در دسترس است که می‌توانید آن را نصب و از طریق رابط خط فرمان (CLI) استفاده کنید که استقرار فایل‌ها و پوشه‌های محلی شما را در Firebase Hosting آسان می‌کند. برای آموزش امروز ما از محیط لینوکس استفاده خواهیم کرد، اما اگر ویندوز یا مک دارید، می‌توانید دستورالعمل‌های اینجا را برای راه‌اندازی ابزار CLI روی دستگاه خود دنبال کنید .

با این حال، در لینوکس، ابتدا NPM و Node.js را نصب خواهیم کرد، اگر هنوز نصب نشده باشند ( اگر از محیط‌های دیگر استفاده می‌کنید، این دستورالعمل‌ها را دنبال کنید):

ترمینال خط فرمان:

sudo apt update

ترمینال خط فرمان:

sudo apt install nodejs

ترمینال خط فرمان:

sudo apt install npm

حالا که Node.js و NPM را نصب کرده‌اید، کافیست دستور زیر را در یک پنجره ترمینال اجرا کنید تا ابزارهای خط فرمان Firebase نصب شوند:

ترمینال خط فرمان:

sudo npm install -g firebase-tools

عالی! اکنون آماده‌ایم تا پروژه فایربیس خود را به سیستم خود متصل کنیم تا بتوانیم فایل‌ها را به آن ارسال کنیم و کارهای بیشتری انجام دهیم.

ورود به فایربیس

با استفاده از حساب گوگل خود و با اجرای دستور زیر وارد Firebase شوید:

ترمینال خط فرمان:

firebase login

از شما خواسته می‌شود که مطابق شکل زیر به حساب Google Firebase خود دسترسی بدهید:

4dc28589bef2ff5d.png

این را فعال کنید و در نهایت باید اتصال موفقیت‌آمیز ابزارهای خط فرمان خود را به حساب فایربیس خود مشاهده کنید:

df397ec7a555e8de.png

پنجره را ببندید و به ترمینال خط فرمانی که قبلاً در آن تایپ می‌کردید برگردید، که اکنون باید آماده پذیرش دستورات جدید باشد، همانطور که نشان داده شده است (ما هرگونه اطلاعات خصوصی را در تصویر خود پنهان کرده‌ایم):

67a3ff39d3c0f3e4.png

تبریک! اکنون آماده‌ایم تا فایل‌ها را از دستگاه محلی خود به پروژه ایجاد شده خود ارسال کنیم.

مقداردهی اولیه پروژه برای استقرار در Firebase Hosting

برای اتصال پوشه محلی خود به پروژه Firebase، دستور زیر را از ریشه دایرکتوری پروژه محلی خود (پوشه‌ای که می‌خواهید هنگام استقرار از آن برای آپلود فایل‌ها استفاده کنید) اجرا کنید.

ترمینال خط فرمان:

firebase init

پس از اجرای این دستور، کافیست دستورالعمل‌های موجود در ترمینال را دنبال کنید تا تنظیمات مطابق شکل زیر تکمیل شود:

61e0f6d92ef3e1c4.png

در اینجا می‌توانیم به سادگی با استفاده از فلش رو به پایین روی صفحه کلید، Hosting را انتخاب کنیم و سپس برای انتخاب، کلید فاصله (spacebar) را فشار دهیم و سپس برای تأیید، کلید Enter را بزنیم.

حالا می‌توانیم پروژه‌ی موجودی که قبلاً ایجاد کردیم را برای استفاده انتخاب کنیم:

4f2a1696d5cfd72f.png

روی عبارت "use an existing project" (استفاده از یک پروژه موجود) اینتر بزنید و سپس آن را با استفاده از کلید جهت پایین، همانطور که در زیر نشان داده شده است، انتخاب کنید:

4dfcf2dff745f2c.png

در نهایت برای استفاده از آن، Enter را فشار دهید و سپس در صفحه آخر که ظاهر می‌شود، پیش‌فرض‌ها را بپذیرید و برای پیکربندی به عنوان برنامه تک صفحه‌ای، «نه» بگویید:

7668a2175b624af2.png

این به شما امکان می‌دهد در صورت تمایل، چندین صفحه html را میزبانی کنید.

اکنون که مقداردهی اولیه کامل شده است، متوجه خواهید شد که یک فایل firebase.json و یک پوشه "public" در دایرکتوری که دستورات بالا را در آن اجرا کردیم، ایجاد شده‌اند.

cd7724b92f3d507.png

تنها کاری که الان باید انجام دهیم این است که فایل‌هایی را که می‌خواهیم مستقر کنیم به پوشه عمومی که ایجاد کرده‌ایم و برای استقرار آماده است، منتقل کنیم! بیایید همین الان این کار را انجام دهیم.

۵. ایجاد صفحه وب TensorFlow.js

بارگیری مدل ذخیره شده شما

ابتدا مطمئن شوید که مدل یادگیری ماشینی که قبلاً در codelab ذخیره کرده‌ایم را در پوشه عمومی خود که با Firebase ایجاد کرده‌ایم، کپی می‌کنیم. کافیست فایل‌های ذخیره شده خود را مطابق شکل به این پوشه بکشید و رها کنید:

cd6f565189e23705.png

همچنین متوجه خواهید شد که Firebase فایل‌های index.html و 404.html را برای ما ایجاد کرده است. بیایید با استفاده از ویرایشگر متن مورد علاقه خود در دستگاهتان، index.html را ویرایش کنیم تا بتوانیم کد سفارشی خودمان را همانطور که نشان داده شده است اضافه کنیم:

فهرست.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 در بالا، یک style sheet مشخص می‌کنیم تا بتوانیم بعداً در صورت تمایل به صفحه خود style اضافه کنیم، و همچنین script.js را برای میزبانی کدی که باید برای استفاده از مدل ذخیره شده TensorFlow.js بنویسیم، تعیین می‌کنیم.

بیایید ادامه دهیم و اکنون آن فایل‌ها را ایجاد کنیم و آنها را به صورت زیر پر کنیم تا کار مفیدی انجام دهند:

استایل.css

/** Leave blank for now **/

اسکریپت.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

تنها کاری که الان باید انجام دهیم این است که فایل‌هایمان را مستقر کنیم تا بتوانیم بررسی کنیم که کار می‌کند!

۶. استقرار مدل و وب‌سایت شما

پخش زنده

به پنجره ترمینالی که در پوشه پروژه فایربیس دستگاه محلی خود باز کرده بودید، برگردید (این پوشه‌ای است که پوشه "public" ما در بالا به همراه فایل‌های init فایربیس در آن قرار دارد).

برای استقرار فایل‌های پوشه عمومی خود، کافیست دستور زیر را تایپ کنید:

ترمینال خط فرمان:

firebase deploy

بگذارید دستور ترمینال کامل شود و شما باید یک نسخه موفقیت‌آمیز به همراه URL که می‌توانید برای استفاده از آن استفاده کنید، داشته باشید:

c5795cae85ed82a5.png

در مثال بالا، می‌توانید آدرس نهایی برای مشاهده‌ی استقرار ما را مشاهده کنید:

https://tensorflow-js-demo.web.app (اما URL شما نام پروژه‌ای خواهد بود که ایجاد کرده‌اید).

این URL را در یک مرورگر وب باز کنید تا بررسی کنید که آیا کار می‌کند یا خیر. در صورت موفقیت، باید چیزی شبیه به این در کنسول توسعه‌دهنده صفحه‌ای که باز می‌کنید چاپ شود (برای باز کردن کنسول توسعه‌دهنده، F12 را فشار دهید).

182aee0acfa7c41e.png

همانطور که می‌بینید صفحه در دامنه مستقر بارگذاری می‌شود، و ما به درستی می‌توانیم پیش‌بینی مدل خود را برای ۱۳۳۷ فوت مربع ببینیم که معادل ۱,۳۳۶,۹۹۹.۲۵ دلار است که در واقع تخمین بسیار خوبی است زیرا انتظار داشتیم این مقدار ۱۰۰۰ برابر فوت مربع باشد. مطمئناً می‌توانیم هر تعداد پیش‌بینی که دوست داریم انجام دهیم اگر یک رابط کاربری خوب برای فراخوانی مدل ایجاد کنیم و همه اینها کاملاً با جاوا اسکریپت اجرا می‌شوند و پرس‌وجوهای شما را خصوصی و ایمن نگه می‌دارند.

اکنون که مدل شما مستقر و میزبانی شده است، می‌توانید وب‌سایت را با هر کسی در جهان به اشتراک بگذارید و آنها قادر خواهند بود از برنامه شما در دستگاه خود استفاده کنند. واضح است که ممکن است بخواهید رابط کاربری بهتری اضافه کنید و ظاهر آن را عالی کنید، اما این فراتر از محدوده این آموزش است. هیچ محدودیتی برای برنامه‌های وب ممکن که می‌توانید مانند این میزبانی کنید، با پشتیبانی از یادگیری ماشین وجود ندارد که می‌توانند با یک کلیک و بدون نیاز به نصب کار کنند و ما شما را تشویق می‌کنیم که به موقعیت‌های دیگری فکر کنید که می‌توانند از یک مدل یادگیری ماشین در مرورگر بهره‌مند شوند.

نظارت بر میزان مصرف

علاوه بر هرگونه ابزار تحلیلی گوگل که می‌توانید به کد وب‌سایت خود اضافه کنید، فایربیس آمار نسخه‌بندی و میزان استفاده را از طریق کنسول برای پروژه شما ارائه می‌دهد. پس از استقرار، چیزی شبیه به این را مشاهده خواهید کرد که می‌توانید هر از گاهی در صورت نیاز آن را بررسی کنید:

42b1cb8f7c10016.png

fbdd6504bec7c3d.png

همانطور که می‌بینید، به طور پیش‌فرض، در سطح رایگان، ماهانه 10 گیگابایت پهنای باند برای فایل‌های میزبانی شده خود دریافت می‌کنید. اگر سایت شما محبوب‌تر است، ممکن است برای استفاده بیشتر از این مقدار در یک ماه، نیاز به اضافه کردن یک حساب کاربری داشته باشید. می‌توانید طرح‌های فایربیس برای پروژه‌های بزرگتر را اینجا بررسی کنید، اگرچه اکثر کاربران عادی برای نمونه‌های اولیه، اگر مدل شما کوچک باشد و میزان استفاده کم باشد، احتمالاً از سطح رایگان فراتر نمی‌روند، بنابراین این یک روش عالی برای آزمایش و بررسی برآورده شدن نیازهای شما قبل از تعهد به یک طرح پولی در حین رشد کسب و کار یا ایده شماست.

۷. تبریک

تبریک می‌گویم، شما اولین قدم‌های خود را در استفاده از TensorFlow.js با Firebase برای ساخت و استقرار یک مدل یادگیری ماشین سفارشی برداشته‌اید تا بتوانید آن را با جهان به اشتراک بگذارید. فقط تصور کنید که می‌توانید با استفاده از این رویکرد قدرتمند و مقیاس‌پذیر، چیزهای دیگری بسازید که در صورت تمایل برای موارد استفاده در تولید آماده هستند، زیرا Firebase به طور خودکار با تقاضا مقیاس‌پذیر می‌شود، بنابراین مهم نیست که 10 یا 10000 کاربر بخواهند از این استفاده کنند، این سیستم به خوبی کار خواهد کرد.

اگر هر یک از فایل‌های خود را تغییر دادید، کافیست برنامه خود را مانند قبل با استفاده از firebase deploy مجدداً مستقر کنید و مطمئن شوید که حافظه پنهان مرورگر خود را پاک کرده‌اید تا مطمئن شوید که نسخه جدید فایل‌ها را در بارگذاری بعدی صفحه دریافت می‌کنید. اگر ابزارهای توسعه‌دهنده را باز دارید، می‌توانید در حین آزمایش موارد، این کار را در برگه شبکه اجباری کنید تا با انتخاب کادر انتخاب "غیرفعال کردن حافظه پنهان" در نزدیکی بالای این برگه، کار آسان‌تر شود:

b1e4c1bf304a4869.png

خلاصه

در این آزمایشگاه کد ما:

  1. یک مدل سفارشی TensorFlow.js را کاملاً از ابتدا تعریف و آموزش دادم تا قیمت خانه را پیش‌بینی کند.
  2. ثبت نام، پیکربندی و نصب ابزار Firebase + Firebase CLI روی دستگاه توسعه شما.
  3. یک وب‌سایت کاربردی مستقر و راه‌اندازی شد که مدل آموزش‌دیده ما را از مرحله ۱ بارگذاری می‌کند و از آن در یک برنامه وب دنیای واقعی استفاده می‌کند که می‌تواند توسط هر کسی، در هر کجای دنیا و در هر مقیاسی قابل دسترسی باشد.

بعدش چی؟

حالا که یک پایگاه کاری برای شروع دارید، چه ایده‌های خلاقانه‌ای می‌توانید برای گسترش این الگوی استقرار مدل یادگیری ماشین ارائه دهید؟

ما دوست داریم ببینیم که شما از این روش با داده‌های خودتان استفاده می‌کنید. به صنعت یا منطقه‌ای که در آن زندگی یا کار می‌کنید فکر کنید. چگونه می‌توانید با استفاده از چنین داده‌هایی آموزش ببینید تا پیش‌بینی‌هایی انجام دهید که در آینده برای شما (یا دیگران) مفید باشد؟ املاک و مستغلات تنها نمونه در اینجا نیست و ما شما را تشویق می‌کنیم که این روش را در چالش‌های خودتان نیز به کار ببرید. هک کردن مبارک!

یادتان باشد هر چیزی که با استفاده از #MadeWithTFJS می‌سازید را در صفحه ما تگ کنید (برای الهام گرفتن از ساخته‌های دیگران، روی این لینک کلیک کنید) تا شانس نمایش در رسانه‌های اجتماعی یا حتی نمایش در رویدادهای آینده TensorFlow را داشته باشید! ما دوست داریم ببینیم چه چیزی می‌سازید و البته در صورت هرگونه بازخورد یا سؤالی با نویسنده این codelab تماس بگیرید.

آزمایشگاه‌های کد TensorFlow.js بیشتر برای بررسی عمیق‌تر

وب‌سایت‌هایی برای بررسی