ঝাঁকুনির জন্য ফায়ারবেস সম্পর্কে জানুন

1. আপনি শুরু করার আগে

এই codelab, আপনি বেসিক কিছু শিখবেন Firebase Android এবং iOS এর জন্য পাখির মোবাইল অ্যাপস তৈরি করুন।

পূর্বশর্ত

এই codelab অনুমান আপনি পাখির সাথে পরিচিত, এবং আপনি ইনস্টল করা আছে পাখির SDK এর , এবং একজন সম্পাদক

আপনি কি তৈরি করবেন

এই কোডল্যাবে আপনি ফ্লুটার ব্যবহার করে অ্যান্ড্রয়েড, আইওএস, ওয়েব এবং ম্যাকওএস -এ একটি ইভেন্ট আরএসভিপি এবং গেস্টবুক চ্যাট অ্যাপ তৈরি করবেন। আপনি ক্লাউড ফায়ারস্টোর ব্যবহার করে ব্যবহারকারীদের ফায়ারবেস প্রমাণীকরণ এবং সিঙ্ক ডেটা দিয়ে প্রমাণীকরণ করবেন।

আপনার যা লাগবে

আপনি নিম্নলিখিত যেকোনো ডিভাইস ব্যবহার করে এই কোডল্যাবটি চালাতে পারেন:

উপরেরগুলি ছাড়াও, আপনারও প্রয়োজন হবে:

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

2. নমুনা কোড পান

GitHub থেকে আমাদের প্রকল্পের প্রাথমিক সংস্করণ ডাউনলোড করে শুরু করা যাক।

ক্লোন GitHub সংগ্রহস্থলের কম্যান্ড লাইন থেকে:

git clone https://github.com/flutter/codelabs.git flutter-codelabs

অন্যথা, আপনি আছে যদি GitHub এর CLI টুল ইনস্টল হয়েছে:

gh repo clone flutter/codelabs flutter-codelabs

নমুনা কোড মধ্যে ক্লোন করা উচিত flutter-codelabs ডিরেক্টরি, যা codelabs একটি সংগ্রহ কোড ধারণ করে। এই codelab কোড রয়েছে flutter-codelabs/firebase-get-to-know-flutter

অধীনে ডিরেক্টরি গঠন flutter-codelabs/firebase-get-to-know-flutter যেখানে আপনি প্রতিটি নামে পদক্ষেপ শেষে হওয়া উচিত স্ন্যাপশট একটি সিরিজ। এটি ধাপ 2, তাই মিলে যাওয়া ফাইলগুলি সনাক্ত করা যতটা সহজ:

cd flutter-codelabs/firebase-get-to-know-flutter/step_02

যদি আপনি সামনের দিকে যেতে চান, অথবা একটি ধাপের পর কিছু কেমন হওয়া উচিত তা দেখতে চান, যে ধাপে আপনি আগ্রহী তার নাম অনুসারে নির্দেশিকাটি দেখুন।

স্টার্টার অ্যাপ আমদানি করুন

ওপেন বা আমদানি flutter-codelabs/firebase-get-to-know-flutter/step_02 আপনার পছন্দের আইডিই মধ্যে ডিরেক্টরি। এই ডিরেক্টরিতে কোডল্যাবের জন্য প্রারম্ভিক কোড রয়েছে যা একটি এখনও কার্যকরী ফ্লটার মিটআপ অ্যাপ নিয়ে গঠিত।

কাজ করার জন্য ফাইলগুলি সনাক্ত করুন

এই অ্যাপের কোড একাধিক ডিরেক্টরিতে ছড়িয়ে আছে। কার্যকারিতার এই বিভাজনটি কার্যকারিতা অনুসারে কোডকে গ্রুপ করে কাজ করা সহজ করার জন্য ডিজাইন করা হয়েছে।

প্রকল্পে নিম্নলিখিত ফাইলগুলি সনাক্ত করুন:

  • lib/main.dart : এই ফাইলটি প্রধান এন্ট্রি পয়েন্ট এবং আবেদন উইজেট উপস্থিত রয়েছে।
  • lib/src/widgets.dart : এই ফাইলটি আবেদন স্টাইলিং সাহায্যের STANDARDIZE উইজেট থাবা ধারণ করে। এগুলি স্টার্টার অ্যাপের স্ক্রিন কম্পোজ করতে ব্যবহৃত হয়।
  • lib/src/authentication.dart : এই ফাইলের একটি আংশিক বাস্তবায়ন রয়েছে FirebaseUI প্রমাণীকরণ উইজেট একটি সেট Firebase ইমেল ভিত্তিক প্রমাণীকরণের জন্য একটি লগইন ব্যবহারকারীর অভিজ্ঞতা তৈরি করার সুবিধা। স্বয়ংক্রিয় প্রবাহের জন্য এই উইজেটগুলি এখনও স্টার্টার অ্যাপে ব্যবহার করা হয়নি, তবে আপনি শীঘ্রই সেগুলি সংযুক্ত করবেন।

অ্যাপ্লিকেশনটির বাকি অংশ তৈরি করার জন্য আপনি প্রয়োজন অনুযায়ী অতিরিক্ত ফাইল যোগ করবেন।

পর্যালোচনা lib/main.dart ফাইল

এই অ্যাপ্লিকেশানটি সুবিধা নেয় google_fonts পুরো অ্যাপ্লিকেশন সর্বত্র তে Roboto ডিফল্ট হরফ করতে এটি আমাদের সক্রিয় করতে প্যাকেজ। উদ্দেশ্যমূলক পাঠকদের জন্য একটি ব্যায়াম অন্বেষণ করা হয় fonts.google.com এবং আপনি অ্যাপ্লিকেশন বিভিন্ন স্থানে সেখানে আবিষ্কার ফন্ট ব্যবহার করুন।

আপনি এর থেকে সাহায্যকারী উইজেট ব্যবহার করা হয় lib/src/widgets.dart আকারে Header , Paragraph এবং IconAndDetail । এই উইজেট বর্ণিত পৃষ্ঠার লেআউট মধ্যে গোলমাল কমাতে HomePage সদৃশ কোড নির্মূল করে। এটি একটি সামঞ্জস্যপূর্ণ চেহারা এবং অনুভূতি সক্ষম করার অতিরিক্ত সুবিধা রয়েছে।

অ্যান্ড্রয়েড, আইওএস, ওয়েব এবং ম্যাকওএস -এ আপনার অ্যাপটি দেখতে কেমন তা এখানে:

অ্যাপ প্রিভিউ

3. একটি Firebase প্রকল্প তৈরি করুন এবং সেট আপ করুন

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

একটি Firebase প্রকল্প তৈরি করুন

  1. সাইন ইন করুন Firebase
  2. Firebase কনসোলে, ক্লিক করুন প্রকল্প যোগ (বা একটি প্রকল্প তৈরি করুন), এবং আপনার Firebase প্রকল্পের Firebase-পাখির-Codelab নাম দিন।

4395e4e67c08043a.png

  1. প্রকল্প তৈরির বিকল্পগুলির মাধ্যমে ক্লিক করুন। অনুরোধ করা হলে Firebase শর্তাবলী গ্রহণ করুন। গুগল অ্যানালিটিক্স সেট আপ করা এড়িয়ে যান, কারণ আপনি এই অ্যাপের জন্য অ্যানালিটিক্স ব্যবহার করবেন না।

b7138cde5f2c7b61.png

Firebase প্রকল্পগুলি সম্পর্কে আরও জানতে, Firebase প্রকল্প বুঝুন

আপনি যে অ্যাপটি তৈরি করছেন তা বেশ কয়েকটি ফায়ারবেস পণ্য ব্যবহার করে যা ওয়েব অ্যাপ্লিকেশনের জন্য উপলব্ধ:

  • Firebase প্রমাণীকরণ আপনার ব্যবহারকারীদের আপনার অ্যাপ্লিকেশানে সাইন ইন করতে অনুমতি দেয়।
  • ক্লাউড Firestore মেঘ কাঠামোবদ্ধ ডেটা সংরক্ষণ এবং ডেটা পরিবর্তন ঝটপট বিজ্ঞপ্তি পাবেন।
  • Firebase সিকিউরিটি রুলস আপনার ডাটাবেস সুরক্ষিত করতে।

এই পণ্যের কিছু বিশেষ কনফিগারেশন প্রয়োজন বা Firebase কনসোল ব্যবহার করে সক্ষম করা প্রয়োজন।

সক্রিয় করুন ইমেল Firebase প্রমাণীকরণের জন্য সাইন-ইন

ব্যবহারকারীরা ওয়েব অ্যাপ্লিকেশন সাইন ইন করার অনুমতি দিতে, এই codelab জন্য পদ্ধতি সাইন-ইন ইমেইল / পাসওয়ার্ড ব্যবহার করব:

  1. Firebase কনসোলে, বাম প্যানেলে মেনু বিল্ড প্রসারিত।
  2. প্রমাণীকরণ ক্লিক করুন, এবং তারপর পান শুরু বোতাম, তারপর সাইন-ইন পদ্ধতি ট্যাব ক্লিক করুন (বা এখানে ক্লিক করুন সাইন-ইন পদ্ধতি ট্যাবে সরাসরি যেতে)।
  3. প্রদানকারীর সাইন-ইন তালিকায় ইমেইল / পাসওয়ার্ড ক্লিক করুন, সেট অবস্থান উপর স্যুইচটি সক্ষম করুন, এবং তারপর সংরক্ষণ ক্লিক করুন। 58e3e3e23c2f16a4.png

ক্লাউড ফায়ারস্টোর সক্ষম করুন

ওয়েব অ্যাপ্লিকেশন ব্যবহার ক্লাউড Firestore চ্যাট বার্তা সংরক্ষণ করুন এবং নতুন চ্যাট বার্তা প্রাপ্ত সদস্যতা।

ক্লাউড ফায়ারস্টোর সক্ষম করুন:

  1. Firebase কনসোলের বিল্ড বিভাগে, ক্লাউড Firestore ক্লিক করুন।
  2. ডেটাবেস তৈরি করে ক্লিক করুন। 99e8429832d23fa3.png
  1. পরীক্ষা মোডে বিকল্প স্টার্ট নির্বাচন করুন। নিরাপত্তা বিধি সম্পর্কে অস্বীকৃতি পড়ুন। পরীক্ষার মোড নিশ্চিত করে যে আপনি বিকাশের সময় ডাটাবেসে অবাধে লিখতে পারেন। পরবর্তী ক্লিক করুন। 6be00e26c72ea032.png
  1. আপনার ডাটাবেসের জন্য অবস্থান নির্বাচন করুন (আপনি শুধু ডিফল্ট ব্যবহার করতে পারেন)। মনে রাখবেন যে এই অবস্থানটি পরে পরিবর্তন করা যাবে না। 278656eefcfb0216.png
  2. সক্ষম করুন এ ক্লিক করুন।

4. ফায়ারবেস কনফিগারেশন

ফ্লটার দিয়ে ফায়ারবেস ব্যবহার করার জন্য, ফ্লটারফায়ার লাইব্রেরিগুলি সঠিকভাবে ব্যবহার করার জন্য আপনাকে ফ্লটার প্রকল্প কনফিগার করার জন্য একটি প্রক্রিয়া অনুসরণ করতে হবে:

  • আপনার প্রকল্পে FlutterFire নির্ভরতা যোগ করুন
  • ফায়ারবেস প্রকল্পে কাঙ্ক্ষিত প্ল্যাটফর্ম নিবন্ধন করুন
  • প্ল্যাটফর্ম-নির্দিষ্ট কনফিগারেশন ফাইলটি ডাউনলোড করুন এবং এটি কোডে যুক্ত করুন।

আপনার পাখির অ্যাপের টপ লেভেল ডিরেক্টরির ইন, সাবডিরেক্টরি বলা হয় ios এবং android । এই ডিরেক্টরিগুলি যথাক্রমে আইওএস এবং অ্যান্ড্রয়েডের জন্য প্ল্যাটফর্ম-নির্দিষ্ট কনফিগারেশন ফাইলগুলি ধারণ করে।

নির্ভরতা কনফিগার করুন

এই অ্যাপে আপনি যে দুটি ফায়ারবেস পণ্য ব্যবহার করছেন তার জন্য আপনাকে ফ্লটারফায়ার লাইব্রেরি যুক্ত করতে হবে - ফায়ারবেস অথ এবং ক্লাউড ফায়ারস্টোর। নিম্নোক্ত তিনটি কমান্ড চালান depencies যোগ করতে।

$ flutter pub add firebase_core
Resolving dependencies...
  async 2.8.1 (2.8.2 available)
+ firebase_core 1.6.0
+ firebase_core_platform_interface 4.0.1
+ firebase_core_web 1.1.0
+ flutter_web_plugins 0.0.0 from sdk flutter
+ js 0.6.3
  matcher 0.12.10 (0.12.11 available)
  path_provider 2.0.2 (2.0.3 available)
  platform 3.0.0 (3.0.2 available)
  test_api 0.4.2 (0.4.3 available)
  win32 2.2.5 (2.2.9 available)
Changed 5 dependencies!

firebase_core সাধারণ কোড সব Firebase পাখির প্লাগিন জন্য প্রয়োজন।

$ flutter pub add firebase_auth
Resolving dependencies...
  async 2.8.1 (2.8.2 available)
+ firebase_auth 3.1.0
+ firebase_auth_platform_interface 6.1.0
+ firebase_auth_web 3.1.0
+ intl 0.17.0
  matcher 0.12.10 (0.12.11 available)
  path_provider 2.0.2 (2.0.3 available)
  platform 3.0.0 (3.0.2 available)
  test_api 0.4.2 (0.4.3 available)
  win32 2.2.5 (2.2.9 available)
Changed 4 dependencies!

firebase_auth Firebase এর প্রমাণীকরণ সামর্থ্য সঙ্গে ইন্টিগ্রেশন সক্ষম করে।

$ flutter pub add cloud_firestore
Resolving dependencies...
  async 2.8.1 (2.8.2 available)
+ cloud_firestore 2.5.1
+ cloud_firestore_platform_interface 5.4.1
+ cloud_firestore_web 2.4.1
  matcher 0.12.10 (0.12.11 available)
  path_provider 2.0.2 (2.0.3 available)
  platform 3.0.0 (3.0.2 available)
  test_api 0.4.2 (0.4.3 available)
  win32 2.2.5 (2.2.9 available)
Changed 3 dependencies!

cloud_firestore ক্লাউড Firestore তথ্য সংগ্রহের এক্সেস দেয়।

$ flutter pub add provider
Resolving dependencies...
  async 2.8.1 (2.8.2 available)
  matcher 0.12.10 (0.12.11 available)
+ nested 1.0.0
  path_provider 2.0.2 (2.0.3 available)
  platform 3.0.0 (3.0.2 available)
+ provider 6.0.0
  test_api 0.4.2 (0.4.3 available)
  win32 2.2.5 (2.2.9 available)
Changed 2 dependencies!

যখন আপনি প্রয়োজনীয় প্যাকেজগুলি যোগ করেছেন, তখন আপনাকে ফায়ারবেসকে যথাযথভাবে ব্যবহার করার জন্য iOS, Android, macOS এবং ওয়েব রানার প্রকল্পগুলি কনফিগার করতে হবে। এছাড়াও আপনি ব্যবহার করছেন provider প্যাকেজ যে প্রদর্শন যুক্তিবিজ্ঞান থেকে বিজনেস লজিক বিচ্ছেদ সক্ষম করবে।

IOS কনফিগার করুন

  1. ইন Firebase কনসোল , বাঁদিকের ন্যাভিগেশন বারের মধ্যে প্রজেক্ট সারসংক্ষেপ নির্বাচন করুন, এবং অধীন আপনার অ্যাপ্লিকেশানে Firebase যোগ করার মাধ্যমে শুরু করুন আইওএস বাটন ক্লিক করুন।

আপনি নিম্নলিখিত ডায়ালগ দেখতে হবে:

c42139f18fb9a2ee.png

  1. প্রদান গুরুত্বপূর্ণ মান আইওএস বান্ডিল আইডি নয়। আপনি পরবর্তী তিনটি ধাপ সম্পাদন করে বান্ডেল আইডি পাবেন।
  1. কমান্ড-লাইন টুলে, আপনার ফ্লটার অ্যাপের টপ-লেভেল ডিরেক্টরিতে যান।
  2. কমান্ড সঞ্চালন করুন open ios/Runner.xcworkspace Xcode খুলুন।
  1. Xcode সালে, বাম ফলকে টপ লেভেল রানার ক্লিক তারপর লক্ষ্যগুলি অধীনে রানার নির্বাচন করুন, দেখানো হয়েছে, ডান ফলকে General ট্যাবে দেখানোর জন্য। বান্ডিল শনাক্তকারী মান কপি করুন।

9d67acd88c718763.png

  1. Firebase ডায়ালগ ফিরে যান, আইওএস বান্ডিল আইডি ক্ষেত্র অনুলিপি বান্ডিল শনাক্তকারী পেস্ট এবং নিবন্ধন অ্যাপ এ ক্লিক করুন।
  1. Firebase মধ্যে অব্যাহত, নির্দেশাবলী কনফিগারেশন ফাইল ডাউনলোড অনুসরণ GoogleService-Info.plist
  2. Xcode- এ ফিরে যান। লক্ষ্য করুন রানার (পূর্ববর্তী ছবিতে দেখানো) ও রানার নামে একটি subfolder রয়েছে।
  3. টেনে আনুন GoogleService-Info.plist ফাইল (যে আপনি শুধু ডাউনলোড করা) যে রানার subfolder মধ্যে।
  4. পরবর্তী ডায়লগ বক্সে Xcode মধ্যে প্রদর্শিত হবে, শেষ এ ক্লিক করুন।
  5. এই মুহুর্তে Xcode বন্ধ করতে নির্দ্বিধায়, কারণ এটি এগিয়ে যাওয়ার প্রয়োজন নেই।
  6. ফায়ারবেস কনসোলে ফিরে যান। সেটআপ পদক্ষেপে, Next বাটনে ক্লিক করুন অবশিষ্ট পদক্ষেপ এড়িয়ে যান এবং Firebase কনসোলের প্রধান পৃষ্ঠায় ফিরে যান।

আপনি iOS এর জন্য আপনার ফ্লটার অ্যাপ কনফিগার করা শেষ করেছেন। আরো বিস্তারিত জানার জন্য, দয়া করে দেখুন FlutterFire আইওএস ইনস্টলেশন ডকুমেন্টেশন

অ্যান্ড্রয়েড কনফিগার করুন

  1. ইন Firebase কনসোল , বাঁদিকের ন্যাভিগেশন বারের মধ্যে প্রজেক্ট সারসংক্ষেপ নির্বাচন করুন, এবং অধীন আপনার অ্যাপ্লিকেশানে Firebase যোগ করার মাধ্যমে শুরু করুন অ্যান্ড্রয়েড বাটন ক্লিক করুন।

আপনি নিম্নলিখিত ডায়ালগ দেখতে হবে: 8254fc299e82f528.png

  1. প্রদান গুরুত্বপূর্ণ মান অ্যান্ড্রয়েড প্যাকেজ নাম। আপনি নিম্নলিখিত দুটি ধাপ সম্পাদন করলে আপনি প্যাকেজের নাম পাবেন:
  1. আপনার পাখির অ্যাপ্লিকেশন ডিরেক্টরি সালে ফাইল খোলার android/app/src/main/AndroidManifest.xml
  2. ইন manifest উপাদান এর স্ট্রিং মান খুঁজে package অ্যাট্রিবিউট। এই মান Android প্যাকেজের নাম (ভালো কিছু হয় com.yourcompany.yourproject )। এই মানটি অনুলিপি করুন।
  3. Firebase ডায়ালগে, অ্যান্ড্রয়েড প্যাকেজের নাম ক্ষেত্রের মধ্যে কপি করা প্যাকেজের নাম পেস্ট করুন।
  4. আপনি ডিবাগ স্বাক্ষরের শংসাপত্র রয়েছে SHA-1 এই codelab জন্য প্রয়োজন হবে না। এই খালি রাখুন।
  5. নিবন্ধন অ্যাপ এ ক্লিক করুন।
  6. Firebase মধ্যে অব্যাহত, কনফিগারেশন ফাইল ডাউনলোড করতে নির্দেশাবলী অনুসরণ করুন google-services.json
  7. আপনার পাখির অ্যাপ্লিকেশন ডিরেক্টরির যান, এবং সরানো google-services.json ফাইল (যে আপনি শুধু ডাউনলোড করা) মধ্যে android/app ডিরেক্টরি।
  8. ফায়ারবেস কনসোলে ফিরে যান, বাকি ধাপগুলি এড়িয়ে যান এবং ফায়ারবেস কনসোলের মূল পৃষ্ঠায় ফিরে যান।
  9. সম্পাদনা করুন আপনার android/build.gradle যোগ করার জন্য google-services প্লাগইন নির্ভরতা:

android/build.gradle

dependencies {
        classpath 'com.android.tools.build:gradle:4.1.0'
        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
        classpath 'com.google.gms:google-services:4.3.5'  // new
}
  1. সম্পাদনা করুন আপনার android/app/build.gradle সক্ষম করতে google-services প্লাগ ইন:

android/app/build.gradle

apply plugin: 'com.android.application'
apply plugin: 'kotlin-android'
apply from: "$flutterRoot/packages/flutter_tools/gradle/flutter.gradle"
apply plugin: 'com.google.gms.google-services'  // new
  1. ফায়ারবেসকে মাল্টিডেক্স সক্ষম করতে হবে এবং এটি করার একটি উপায় হল ন্যূনতম সমর্থিত এসডিকে 21 বা তার উপরে সেট করা। সম্পাদনা করুন আপনার android/app/build.gradle আপডেট করতে minSdkVersion :

android/app/build.gradle

defaultConfig {
    applicationId "com.example.gtk_flutter"
    minSdkVersion 21  // Updated
    targetSdkVersion 30
    versionCode flutterVersionCode.toInteger()
    versionName flutterVersionName
}

অ্যান্ড্রয়েডের জন্য আপনার ফ্লটার অ্যাপ কনফিগার করা হয়ে গেছে। আরো বিস্তারিত জানার জন্য, দয়া করে দেখুন FlutterFire অ্যান্ড্রয়েড ইনস্টলেশন ডকুমেন্টেশন

ওয়েবের জন্য কনফিগার করুন

  1. ইন Firebase কনসোল , বাঁদিকের ন্যাভিগেশন বারের মধ্যে প্রজেক্ট সারসংক্ষেপ নির্বাচন করুন, এবং অধীন আপনার অ্যাপ্লিকেশানে Firebase যোগ করার মাধ্যমে শুরু করুন ওয়েব বাটন ক্লিক করুন।

25b14deff9e589ce.png

  1. এই অ্যাপটি একটি ডাকনাম দিন, এবং নিবন্ধন অ্যাপ্লিকেশন বাটনে ক্লিক করুন। আমরা এই টিউটোরিয়ালের জন্য ফায়ারবেস হোস্টিং বন্ধ রেখে চলে যাচ্ছি কারণ আমরা কেবল এটি স্থানীয়ভাবে চালাব। এখানে ফায়ারবেস হোস্টিং সম্পর্কে আরও নির্দ্বিধায় পড়ুন। 9c697cc1b309c806.png
  2. সম্পাদনা করুন আপনার শরীরের অধ্যায় web/index.html ফাইল হিসাবে অনুসরণ করে। যোগ করতে ভুলবেন না firebaseConfig পূর্ববর্তী ধাপে থেকে তথ্য।

ওয়েব/index.html

<body>
  <script>
    if ('serviceWorker' in navigator) {
      window.addEventListener('flutter-first-frame', function () {
        navigator.serviceWorker.register('flutter_service_worker.js');
      });
    }
  </script>

  <!-- Add from here -->
  <script src="https://www.gstatic.com/firebasejs/7.20.0/firebase-app.js"></script>
  <script src="https://www.gstatic.com/firebasejs/7.20.0/firebase-auth.js"></script>
  <script src="https://www.gstatic.com/firebasejs/7.20.0/firebase-firestore.js"></script>
  <script>
    // Your web app's Firebase configuration
    var firebaseConfig = {
      // Replace this with your firebaseConfig
    };
    // Initialize Firebase
    firebase.initializeApp(firebaseConfig);
  </script>
  <!-- to here. -->

  <script src="main.dart.js" type="application/javascript"></script>
</body>

আপনি ওয়েবের জন্য আপনার ফ্লটার অ্যাপ কনফিগার করা শেষ করেছেন। আরো বিস্তারিত জানার জন্য, দয়া করে দেখুন FlutterFire ওয়েব ইনস্টলেশন ডকুমেন্টেশন

ম্যাকওএস কনফিগার করুন

ম্যাকওএস -এর কনফিগারেশন স্টেপগুলি প্রায় আইওএস -এর অনুরূপ। আমরা পুনরায় ব্যবহার কনফিগারেশন ফাইল করতে যাচ্ছি GoogleService-Info.plist আইওএস থেকে উপরে আলোচনা করা হয়েছে।

  1. কমান্ড সঞ্চালন করুন open macos/Runner.xcworkspace Xcode খুলুন।
  1. টেনে আনুন GoogleService-Info.plist রানার subfolder মধ্যে ফাইল। এই উপরে কনফিগার আইওএস পদক্ষেপে তৈরি করা হয়েছে। c2b9229a605fd738.png
  2. ইন macos/Runner/DebugProfile.entitlements ফাইল, একটি যোগ com.apple.security.network.client এনটাইটেলমেন্ট, এবং এটি সেট true8bee5665e35d3f34.png
  3. ইন macos/Runner/Release.entitlements ফাইল, একটি যোগ com.apple.security.network.client এনটাইটেলমেন্ট, এবং এটি সেট true41e2e23b7928546a.png
  4. এই মুহুর্তে Xcode বন্ধ করতে নির্দ্বিধায়, কারণ এটি এগিয়ে যাওয়ার প্রয়োজন নেই।

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

5. ব্যবহারকারী সাইন-ইন যোগ করুন (RSVP)

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

ধাপ 2 এ আপনি যে প্রকল্পটি পুনরুদ্ধার করেছেন তাতে উইজেটগুলির একটি সেট অন্তর্ভুক্ত ছিল যা বেশিরভাগ প্রমাণীকরণ প্রবাহের জন্য ব্যবহারকারী ইন্টারফেস প্রয়োগ করে। আপনি অ্যাপ্লিকেশনটিতে ফায়ারবেস প্রমাণীকরণ সংহত করার জন্য ব্যবসায়িক যুক্তি প্রয়োগ করবেন।

প্রদানকারীর সাথে ব্যবসায়িক যুক্তি

আপনি ব্যবহার করতে যাচ্ছি provider প্যাকেজ পাখির উইজেট অ্যাপ্লিকেশানের গাছ সর্বত্র একটি কেন্দ্রীভূত আবেদন রাষ্ট্র বস্তু উপলব্ধ করতে। সঙ্গে শুরু করার জন্য, উপরের আমদানির সংশোধন lib/main.dart :

lib/main.dart

import 'package:firebase_core/firebase_core.dart'; // new
import 'package:firebase_auth/firebase_auth.dart'; // new
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:provider/provider.dart';           // new

import 'src/authentication.dart';                  // new
import 'src/widgets.dart';

import লাইন Firebase কোর এবং প্রমাণীকরণ, এ টান পরিচয় করিয়ে provider প্যাকেজ যা আপনি আবেদন রাষ্ট্র বস্তুর উইজেট গাছ মাধ্যমে উপলব্ধ করা ব্যবহার করছেন, এবং থেকে প্রমাণীকরণ উইজেটগুলি অন্তর্ভুক্ত lib/src

এই অ্যাপ্লিকেশনটি রাষ্ট্র বস্তু, ApplicationState , এই পদক্ষেপ জন্য দুটি প্রধান দায়িত্ব আছে, কিন্তু হিসাবে আপনি পরে ধাপে আবেদন আরো ক্ষমতা যোগ অতিরিক্ত দায়িত্ব লাভ করবেন। প্রথম দায়িত্ব একটি কল সঙ্গে Firebase গ্রন্থাগার আরম্ভ হয় Firebase.initializeApp() , এবং তারপর সেখানে অনুমোদন প্রবাহ হ্যান্ডলিং হয়। শেষে নিম্নলিখিত বর্গ যোগ lib/main.dart :

lib/main.dart

class ApplicationState extends ChangeNotifier {
  ApplicationState() {
    init();
  }

  Future<void> init() async {
    await Firebase.initializeApp();

    FirebaseAuth.instance.userChanges().listen((user) {
      if (user != null) {
        _loginState = ApplicationLoginState.loggedIn;
      } else {
        _loginState = ApplicationLoginState.loggedOut;
      }
      notifyListeners();
    });
  }

  ApplicationLoginState _loginState = ApplicationLoginState.loggedOut;
  ApplicationLoginState get loginState => _loginState;

  String? _email;
  String? get email => _email;

  void startLoginFlow() {
    _loginState = ApplicationLoginState.emailAddress;
    notifyListeners();
  }

  void verifyEmail(
    String email,
    void Function(FirebaseAuthException e) errorCallback,
  ) async {
    try {
      var methods =
          await FirebaseAuth.instance.fetchSignInMethodsForEmail(email);
      if (methods.contains('password')) {
        _loginState = ApplicationLoginState.password;
      } else {
        _loginState = ApplicationLoginState.register;
      }
      _email = email;
      notifyListeners();
    } on FirebaseAuthException catch (e) {
      errorCallback(e);
    }
  }

  void signInWithEmailAndPassword(
    String email,
    String password,
    void Function(FirebaseAuthException e) errorCallback,
  ) async {
    try {
      await FirebaseAuth.instance.signInWithEmailAndPassword(
        email: email,
        password: password,
      );
    } on FirebaseAuthException catch (e) {
      errorCallback(e);
    }
  }

  void cancelRegistration() {
    _loginState = ApplicationLoginState.emailAddress;
    notifyListeners();
  }

  void registerAccount(String email, String displayName, String password,
      void Function(FirebaseAuthException e) errorCallback) async {
    try {
      var credential = await FirebaseAuth.instance
          .createUserWithEmailAndPassword(email: email, password: password);
      await credential.user!.updateProfile(displayName: displayName);
    } on FirebaseAuthException catch (e) {
      errorCallback(e);
    }
  }

  void signOut() {
    FirebaseAuth.instance.signOut();
  }
}

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

এটি অবশ্যই লক্ষ্য করতে হবে যে এটি FirebaseUI Auth প্রবাহের সম্পূর্ণ বাস্তবায়ন নয়, কারণ এটি একটি বিদ্যমান অ্যাকাউন্টের ব্যবহারকারীর ক্ষেত্রে পরিচালনা করে না যার লগ ইন করতে সমস্যা হচ্ছে। এই অতিরিক্ত ক্ষমতা প্রয়োগ করা একটি ব্যায়াম হিসাবে বাকি অনুপ্রাণিত পাঠক।

প্রমাণীকরণ প্রবাহকে সংহত করা

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

lib/main.dart

void main() {
  // Modify from here
  runApp(
    ChangeNotifierProvider(
      create: (context) => ApplicationState(),
      builder: (context, _) => App(),
    ),
  );
  // to here.
}

থেকে পরিমার্জন main ফাংশন প্রদানকারী প্যাকেজ আবেদন রাষ্ট্র বস্তু শুরু করতে গিয়ে ব্যবহার করার জন্য দায়ী তোলে ChangeNotifierProvider উইজেট। আপনি এই নির্দিষ্ট প্রদানকারী বর্গ ব্যবহার করছেন কারণ আবেদন রাষ্ট্র বস্তু প্রসারিত ChangeNotifier এবং এই সম্ভব provider যখন জানতে নির্ভরশীল উইজেট আবার দেখাও প্যাকেজ। অবশেষে, সঙ্গে আবেদন রাষ্ট্র সংহত Authentication আপডেট করার মাধ্যমে HomePage এর build পদ্ধতি:

lib/main.dart

class HomePage extends StatelessWidget {
  HomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Firebase Meetup'),
      ),
      body: ListView(
        children: <Widget>[
          Image.asset('assets/codelab.png'),
          SizedBox(height: 8),
          IconAndDetail(Icons.calendar_today, 'October 30'),
          IconAndDetail(Icons.location_city, 'San Francisco'),
          // Add from here
          Consumer<ApplicationState>(
            builder: (context, appState, _) => Authentication(
              email: appState.email,
              loginState: appState.loginState,
              startLoginFlow: appState.startLoginFlow,
              verifyEmail: appState.verifyEmail,
              signInWithEmailAndPassword: appState.signInWithEmailAndPassword,
              cancelRegistration: appState.cancelRegistration,
              registerAccount: appState.registerAccount,
              signOut: appState.signOut,
            ),
          ),
          // to here
          Divider(
            height: 8,
            thickness: 1,
            indent: 8,
            endIndent: 8,
            color: Colors.grey,
          ),
          Header("What we'll be doing"),
          Paragraph(
            'Join us for a day full of Firebase Workshops and Pizza!',
          ),
        ],
      ),
    );
  }
}

আপনি instantiate Authentication উইজেট, এবং একটি মধ্যে এটি মোড়ানো Consumer উইজেট। উপভোক্তা স্বাভাবিক ভাবেই উইজেট যে provider প্যাকেজ গাছ যখন আবেদন রাষ্ট্র পরিবর্তনের অংশ পুনর্নির্মাণের ব্যবহার করা যাবে। Authentication উইজেট প্রমাণীকরণ UI 'তে যে আপনি এখন পরিক্ষা করবে।

প্রমাণীকরণ প্রবাহ পরীক্ষা করা হচ্ছে

cdf2d25e436bd48d.png

এখানে প্রমাণীকরণ প্রবাহের শুরু, যেখানে ব্যবহারকারী RSVP বোতামে টোকা দিতে পারেন, ইমেল ফর্মটি শুরু করতে।

2a2cd6d69d172369.png

ইমেইলে প্রবেশ করার পর, সিস্টেম নিশ্চিত করে যে ব্যবহারকারী ইতিমধ্যেই নিবন্ধিত কিনা, সেক্ষেত্রে ব্যবহারকারীকে পাসওয়ার্ডের জন্য অনুরোধ করা হয়, বিকল্পভাবে যদি ব্যবহারকারী নিবন্ধিত না হয়, তাহলে তারা নিবন্ধন ফর্মের মধ্য দিয়ে যায়।

e5e65065dba36b54.png

ত্রুটি হ্যান্ডলিং প্রবাহ পরীক্ষা করতে একটি ছোট পাসওয়ার্ড (ছয় অক্ষরের কম) প্রবেশ করার চেষ্টা করুন। যদি ব্যবহারকারী নিবন্ধিত হয়, তারা পরিবর্তে পাসওয়ার্ড দেখতে পাবে।

fbb3ea35fb4f67a.png

এই পৃষ্ঠায় ভুল পাসওয়ার্ড লিখতে ভুলবেন না। অবশেষে, একবার ব্যবহারকারী লগ ইন করলে, আপনি লগ ইন অভিজ্ঞতা দেখতে পাবেন যা ব্যবহারকারীকে আবার লগ আউট করার ক্ষমতা প্রদান করে।

4ed811a25b0cf816.png

এবং এর সাথে, আপনি একটি প্রমাণীকরণ প্রবাহ বাস্তবায়ন করেছেন। অভিনন্দন!

6. ক্লাউড ফায়ারস্টোরে বার্তা লিখুন

ব্যবহারকারীরা আসছে জেনেও দারুণ, কিন্তু আসুন অতিথিদের অ্যাপে অন্য কিছু করার সুযোগ দেওয়া যাক। যদি তারা একটি অতিথি বইতে বার্তা ছেড়ে দিতে পারে? তারা কেন আসার জন্য উচ্ছ্বসিত বা যাদের সাথে দেখা করার আশা তারা শেয়ার করতে পারে।

বার্তা ব্যবহারকারীরা অ্যাপ্লিকেশানে লিখতে চ্যাট সংরক্ষণ করতে, আপনাকে ব্যবহার করব ক্লাউড Firestore

তথ্য মডেল

ক্লাউড ফায়ারস্টোর একটি NoSQL ডাটাবেস, এবং ডাটাবেসে সংরক্ষিত ডেটা সংগ্রহ, নথি, ক্ষেত্র এবং উপ -সংগ্রহগুলিতে বিভক্ত। আপনি একটি টপ লেভেল সংগ্রহ নামক একটি নথি হিসাবে চ্যাট প্রত্যেক বার্তার সংরক্ষণ করবে guestbook

7c20dc8424bb1d84.png

ফায়ারস্টোরে বার্তা যোগ করুন

এই বিভাগে, আপনি ব্যবহারকারীদের ডাটাবেসে নতুন বার্তা লেখার কার্যকারিতা যোগ করবেন। প্রথমে, আপনি UI উপাদানগুলি যোগ করুন (ফর্ম ক্ষেত্র এবং পাঠান বোতাম), এবং তারপরে আপনি সেই কোডটি যুক্ত করুন যা এই উপাদানগুলিকে ডাটাবেসে যুক্ত করে।

প্রথমত, জন্য আমদানি যোগ cloud_firestore প্যাকেজ এবং dart:async

lib/main.dart

import 'dart:async';                                    // new
import 'package:cloud_firestore/cloud_firestore.dart';  // new
import 'package:firebase_core/firebase_core.dart';
import 'package:firebase_auth/firebase_auth.dart';
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:provider/provider.dart';

import 'src/authentication.dart';
import 'src/widgets.dart';

কে একটি বার্তা ক্ষেত্র এবং একটি সেন্ড বাটন এর UI উপাদান গঠন করা, উইজেট একটি নতুন stateful যোগ GuestBook নীচে lib/main.dart

lib/main.dart

class GuestBook extends StatefulWidget {
  GuestBook({required this.addMessage});
  final FutureOr<void> Function(String message) addMessage;

  @override
  _GuestBookState createState() => _GuestBookState();
}

class _GuestBookState extends State<GuestBook> {
  final _formKey = GlobalKey<FormState>(debugLabel: '_GuestBookState');
  final _controller = TextEditingController();

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(8.0),
      child: Form(
        key: _formKey,
        child: Row(
          children: [
            Expanded(
              child: TextFormField(
                controller: _controller,
                decoration: const InputDecoration(
                  hintText: 'Leave a message',
                ),
                validator: (value) {
                  if (value == null || value.isEmpty) {
                    return 'Enter your message to continue';
                  }
                  return null;
                },
              ),
            ),
            SizedBox(width: 8),
            StyledButton(
              onPressed: () async {
                if (_formKey.currentState!.validate()) {
                  await widget.addMessage(_controller.text);
                  _controller.clear();
                }
              },
              child: Row(
                children: [
                  Icon(Icons.send),
                  SizedBox(width: 4),
                  Text('SEND'),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}

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

এছাড়াও পথ উইজেট পরিপূর্ণ হয় মনে রাখবেন, আপনি একটি আছে Row একটি সঙ্গে, TextFormField এবং StyledButton , যা নিজেই একটি রয়েছে Row । এছাড়াও মনে রাখবেন TextFormField একটি জড়িয়ে রাখা হয়েছে Expanded উইজেট, এই বাহিনী TextFormField সারিতে কোনো অতিরিক্ত জায়গা নিয়ে করা। ভালোভাবে বুঝতে এই কেন প্রয়োজন হয়, মাধ্যমে পড়া দয়া বোঝাপড়া সীমাবদ্ধতার

এখন আপনার কাছে একটি উইজেট আছে যা ব্যবহারকারীকে অতিথি বইতে কিছু পাঠ্য প্রবেশ করতে সক্ষম করে, আপনাকে এটি স্ক্রিনে পেতে হবে। এটা করার জন্য, সম্পাদন করা লাশ HomePage নীচে নিম্নলিখিত দুই লাইন যোগ করার জন্য ListView এর সন্তান

Header("What we'll be doing"),
Paragraph(
  'Join us for a day full of Firebase Workshops and Pizza!',
),
// Add the following two lines.
Header('Discussion'),
GuestBook(addMessage: (String message) => print(message)),

যদিও এই উইজেটটি প্রদর্শন করার জন্য এটি যথেষ্ট, এটি দরকারী কিছু করার জন্য যথেষ্ট নয়। আপনি এই কোডটি কার্যকরী করতে শীঘ্রই আপডেট করবেন।

অ্যাপ প্রিভিউ

পাঠান বাটন ক্লিক একজন ব্যবহারকারী নিচের কোড স্নিপেট আরম্ভ হবে। এটা তোলে বার্তা ইনপুট ক্ষেত্র বিষয়বস্তু যোগ guestbook ডেটাবেসের সংগ্রহ। বিশেষ করে, addMessageToGuestBook পদ্ধতি বার্তাটি একটি নতুন দস্তাবেজে (একটি স্বয়ংক্রিয়ভাবে উত্পন্ন আইডি দিয়ে) এর বিষয়বস্তু যোগ guestbook সংগ্রহ।

মনে রাখবেন যে, FirebaseAuth.instance.currentUser.uid স্বয়ংক্রিয়ভাবে তৈরি অনন্য আইডি একটি রেফারেন্স যে Firebase প্রমাণীকরণের জন্য সব লগ-ইন করা ব্যবহারকারীরা দেয়।

আরেকটি ইতিবাচক পরিবর্তন আনুন lib/main.dart ফাইল। যোগ addMessageToGuestBook পদ্ধতি। আপনি পরবর্তী ধাপে ব্যবহারকারী ইন্টারফেস এবং এই ক্ষমতা একসঙ্গে তারের হবে।

lib/main.dart

class ApplicationState extends ChangeNotifier {

  // Current content of ApplicationState elided ...

  // Add from here
  Future<DocumentReference> addMessageToGuestBook(String message) {
    if (_loginState != ApplicationLoginState.loggedIn) {
      throw Exception('Must be logged in');
    }

    return FirebaseFirestore.instance.collection('guestbook').add(<String, dynamic>{
      'text': message,
      'timestamp': DateTime.now().millisecondsSinceEpoch,
      'name': FirebaseAuth.instance.currentUser!.displayName,
      'userId': FirebaseAuth.instance.currentUser!.uid,
    });
  }
  // To here
}

ডাটাবেসে ইউআই সংযুক্ত করা

আপনার একটি UI আছে যেখানে ব্যবহারকারী পাঠ্যটি প্রবেশ করতে পারেন যা তারা অতিথি বইতে যোগ করতে চান এবং আপনার কাছে ক্লাউড ফায়ারস্টোরে এন্ট্রি যুক্ত করার কোড আছে। এখন আপনাকে যা করতে হবে তা হল দুজনকে একসাথে সংযুক্ত করা। ইন lib/main.dart নিম্নলিখিত পরিবর্তন করতে HomePage উইজেট।

lib/main.dart

class HomePage extends StatelessWidget {
  HomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Firebase Meetup'),
      ),
      body: ListView(
        children: <Widget>[
          Image.asset('assets/codelab.png'),
          SizedBox(height: 8),
          IconAndDetail(Icons.calendar_today, 'October 30'),
          IconAndDetail(Icons.location_city, 'San Francisco'),
          Consumer<ApplicationState>(
            builder: (context, appState, _) => Authentication(
              email: appState.email,
              loginState: appState.loginState,
              startLoginFlow: appState.startLoginFlow,
              verifyEmail: appState.verifyEmail,
              signInWithEmailAndPassword: appState.signInWithEmailAndPassword,
              cancelRegistration: appState.cancelRegistration,
              registerAccount: appState.registerAccount,
              signOut: appState.signOut,
            ),
          ),
          Divider(
            height: 8,
            thickness: 1,
            indent: 8,
            endIndent: 8,
            color: Colors.grey,
          ),
          Header("What we'll be doing"),
          Paragraph(
            'Join us for a day full of Firebase Workshops and Pizza!',
          ),
          // Modify from here
          Consumer<ApplicationState>(
            builder: (context, appState, _) => Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                if (appState.loginState == ApplicationLoginState.loggedIn) ...[
                  Header('Discussion'),
                  GuestBook(
                    addMessage: (String message) =>
                        appState.addMessageToGuestBook(message),
                  ),
                ],
              ],
            ),
          ),
          // To here.
        ],
      ),
    );
  }
}

আপনি এই পদক্ষেপের শুরুতে সম্পূর্ণ বাস্তবায়নের সাথে যোগ করা দুটি লাইন প্রতিস্থাপন করেছেন। আপনি আবার ব্যবহার করছেন Consumer<ApplicationState> আবেদন রাষ্ট্র গাছ আপনি রেন্ডারিং করছে অংশ উপলব্ধ করতে। এটি আপনাকে UI- এ যে কেউ বার্তা প্রবেশ করছে তার প্রতি প্রতিক্রিয়া জানাতে এবং এটি ডাটাবেসে প্রকাশ করতে সক্ষম করে। পরবর্তী অংশে আপনি পরীক্ষা করবেন যদি যোগ করা বার্তাগুলি ডাটাবেসে প্রকাশিত হয়।

বার্তা পাঠানোর পরীক্ষা করুন

  1. আপনি অ্যাপে সাইন ইন করেছেন তা নিশ্চিত করুন।
  2. যেমন "আরে!" যেমন একটি বার্তা লিখুন, এবং তারপর সেন্ড ক্লিক করুন।

এই ক্রিয়াটি আপনার ক্লাউড ফায়ারস্টোর ডাটাবেসে বার্তাটি লিখে দেয়। যাইহোক, আপনি এখনও আপনার আসল ফ্লটার অ্যাপে বার্তাটি দেখতে পাবেন না কারণ আপনাকে এখনও ডেটা পুনরুদ্ধার করতে হবে। আপনি পরবর্তী ধাপে এটি করবেন।

কিন্তু আপনি Firebase কনসোলে নতুন যোগ করা বার্তা দেখতে পারেন।

Firebase কনসোলে, এ ডাটাবেজ ড্যাশবোর্ড , আপনি দেখতে পাবেন guestbook আপনার নতুন যোগ বার্তা সঙ্গে সংগ্রহ। আপনি যদি বার্তা পাঠাতে থাকেন, আপনার গেস্টবুক সংগ্রহে অনেক নথি থাকবে, যেমন:

ফায়ারবেস কনসোল

713870af0b3b63c.png

7. বার্তা পড়ুন

অতিথিরা ডাটাবেসে বার্তা লিখতে পারেন, কিন্তু তারা এখনও অ্যাপে তাদের দেখতে পারে না। আসুন এটি ঠিক করি!

বার্তাগুলি সিঙ্ক্রোনাইজ করুন

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

শুধুমাত্র উপরের GuestBook নিম্নলিখিত মান বর্গ উইজেট। এই ক্লাসটি ক্লাউড ফায়ারস্টোরে আপনার সঞ্চয় করা ডেটার একটি কাঠামোগত দৃশ্য প্রকাশ করে।

lib/main.dart

class GuestBookMessage {
  GuestBookMessage({required this.name, required this.message});
  final String name;
  final String message;
}

বিভাগে ApplicationState যেখানে আপনি রাষ্ট্র এবং getters নির্ধারণ করুন, নতুন লাইন নিম্নলিখিত যোগ করুন:

lib/main.dart

  ApplicationLoginState _loginState = ApplicationLoginState.loggedOut;
  ApplicationLoginState get loginState => _loginState;

  String? _email;
  String? get email => _email;

  // Add from here
  StreamSubscription<QuerySnapshot>? _guestBookSubscription;
  List<GuestBookMessage> _guestBookMessages = [];
  List<GuestBookMessage> get guestBookMessages => _guestBookMessages;
  // to here.

এবং পরিশেষে, আরম্ভের বিভাগে ApplicationState , ডকুমেন্ট সংগ্রহ উপর একটি ক্যোয়ারী সাবস্ক্রাইব করার জন্য যখন কোনো ব্যবহারকারী লগ, এবং আনসাবস্ক্রাইব যখন তারা লগ আউট নিম্নলিখিত যোগ করুন।

lib/main.dart

  Future<void> init() async {
    await Firebase.initializeApp();

    FirebaseAuth.instance.userChanges().listen((user) {
      if (user != null) {
        _loginState = ApplicationLoginState.loggedIn;
        // Add from here
        _guestBookSubscription = FirebaseFirestore.instance
            .collection('guestbook')
            .orderBy('timestamp', descending: true)
            .snapshots()
            .listen((snapshot) {
          _guestBookMessages = [];
          snapshot.docs.forEach((document) {
            _guestBookMessages.add(
              GuestBookMessage(
                name: document.data()['name'],
                message: document.data()['text'],
              ),
            );
          });
          notifyListeners();
        });
        // to here.
      } else {
        _loginState = ApplicationLoginState.loggedOut;
        // Add from here
        _guestBookMessages = [];
        _guestBookSubscription?.cancel();
        // to here.
      }
      notifyListeners();
    });
  }

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

আরো তথ্যের জন্য, দেখুন ক্লাউড Firestore ডকুমেন্টেশন

ইন GuestBook আপনি ব্যবহারকারীর ইন্টারফেসে পরিবর্তন রাষ্ট্র সংযোগ করতে হবে উইজেট। আপনি উইজেটটি কনফিগারেশনের অংশ হিসাবে বার্তাগুলির একটি তালিকা যোগ করে পরিবর্তন করেন।

lib/main.dart

class GuestBook extends StatefulWidget {
  // Modify the following line
  GuestBook({required this.addMessage, required this.messages});
  final FutureOr<void> Function(String message) addMessage;
  final List<GuestBookMessage> messages; // new

  @override
  _GuestBookState createState() => _GuestBookState();
}

এর পরে, আমরা এই নতুন কনফিগারেশন এক্সপোজ _GuestBookState পরিবর্তন করে build পদ্ধতি নিম্নরূপ।

lib/main.dart

class _GuestBookState extends State<GuestBook> {
  final _formKey = GlobalKey<FormState>(debugLabel: '_GuestBookState');
  final _controller = TextEditingController();

  @override
  // Modify from here
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        // to here.
        Padding(
          padding: const EdgeInsets.all(8.0),
          child: Form(
            key: _formKey,
            child: Row(
              children: [
                Expanded(
                  child: TextFormField(
                    controller: _controller,
                    decoration: const InputDecoration(
                      hintText: 'Leave a message',
                    ),
                    validator: (value) {
                      if (value == null || value.isEmpty) {
                        return 'Enter your message to continue';
                      }
                      return null;
                    },
                  ),
                ),
                SizedBox(width: 8),
                StyledButton(
                  onPressed: () async {
                    if (_formKey.currentState!.validate()) {
                      await widget.addMessage(_controller.text);
                      _controller.clear();
                    }
                  },
                  child: Row(
                    children: [
                      Icon(Icons.send),
                      SizedBox(width: 4),
                      Text('SEND'),
                    ],
                  ),
                ),
              ],
            ),
          ),
        ),
        // Modify from here
        SizedBox(height: 8),
        for (var message in widget.messages)
          Paragraph('${message.name}: ${message.message}'),
        SizedBox(height: 8),
        // to here.
      ],
    );
  }
}

আপনি একটি সঙ্গে বিল্ড পদ্ধতি পূর্ববর্তী বিষয়বস্তু মোড়ানো Column এর লেঙ্গুড় এ উইজেট, এবং তারপর Column এর শিশু আপনি একটি যোগ সংগ্রহের জন্য একটি নতুন জেনারেট করতে Paragraph বার্তা তালিকার প্রতিটি বার্তার জন্য।

অবশেষে, আপনি এখন লাশ আপডেট করা দরকার HomePage সঠিকভাবে গঠন করা GuestBook নতুন messages প্যারামিটার।

lib/main.dart

Consumer<ApplicationState>(
  builder: (context, appState, _) => Column(
    crossAxisAlignment: CrossAxisAlignment.start,
    children: [
      if (appState.loginState == ApplicationLoginState.loggedIn) ...[
        Header('Discussion'),
        GuestBook(
          addMessage: (String message) =>
              appState.addMessageToGuestBook(message),
          messages: appState.guestBookMessages, // new
        ),
      ],
    ],
  ),
),

সিঙ্ক্রোনাইজ করা বার্তাগুলি পরীক্ষা করুন

ক্লাউড ফায়ারস্টোর স্বয়ংক্রিয়ভাবে এবং তাত্ক্ষণিকভাবে ডেটাবেজে সাবস্ক্রাইব করা ক্লায়েন্টদের সাথে ডেটা সিঙ্ক্রোনাইজ করে।

  1. ডাটাবেসে আপনি আগে যে বার্তাগুলি তৈরি করেছিলেন তা অ্যাপে প্রদর্শিত হওয়া উচিত। নির্দ্বিধায় নতুন বার্তা লিখুন; তাদের তাত্ক্ষণিকভাবে উপস্থিত হওয়া উচিত।
  2. আপনি যদি একাধিক উইন্ডো বা ট্যাবে আপনার কর্মক্ষেত্র খুলেন, তাহলে বার্তাগুলি রিয়েল টাইমে ট্যাব জুড়ে সিঙ্ক হবে।
  3. (ঐচ্ছিক) আপনি নিজে, মুছে ফেলা পরিবর্তন, বা Firebase কনসোলের ডাটাবেস বিভাগে সরাসরি নতুন বার্তা যোগ করার চেষ্টা করতে পারেন; কোন পরিবর্তন UI এ উপস্থিত হওয়া উচিত।

অভিনন্দন! আপনি আপনার অ্যাপে ক্লাউড ফায়ারস্টোর ডকুমেন্ট পড়ছেন!

অ্যাপ পি পর্যালোচনা

8. মৌলিক নিরাপত্তা নিয়ম সেট আপ করুন

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

সুরক্ষা বিধিগুলি আপনাকে আপনার ডাটাবেসে নথি এবং সংগ্রহগুলিতে অ্যাক্সেস নিয়ন্ত্রণ করতে দেয়। নমনীয় নিয়ম সিনট্যাক্স আপনাকে এমন একটি নিয়ম তৈরি করতে দেয় যা সমস্ত লেখার থেকে সম্পূর্ণ ডাটাবেস থেকে নির্দিষ্ট ডকুমেন্টের ক্রিয়াকলাপের সাথে মেলে।

আপনি ফায়ারবেস কনসোলে ক্লাউড ফায়ারস্টোরের নিরাপত্তার নিয়ম লিখতে পারেন:

  1. Firebase কনসোলের বিকাশ বিভাগে, ডাটাবেজ ক্লিক করুন, এবং তারপর বিধি ট্যাব নির্বাচন করুন (অথবা এখানে ক্লিক করুন বিধি ট্যাবে সরাসরি যেতে)।
  2. নিয়মগুলি সর্বজনীন হওয়ার বিষয়ে সতর্কতা সহ আপনাকে নিম্নলিখিত ডিফল্ট সুরক্ষা বিধিগুলি দেখতে হবে।

7767a2d2e64e7275.png

সংগ্রহগুলি চিহ্নিত করুন

প্রথমে, সেই সংগ্রহগুলি চিহ্নিত করুন যেখানে অ্যাপ ডেটা লিখে।

ইন match /databases/{database}/documents , সংগ্রহ আপনি নিরাপদ করার জন্য চাই যে চিহ্নিত:

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    match /guestbook/{entry} {
     // You'll add rules here in the next step.
  }
}

নিরাপত্তা বিধি যোগ করুন

যেহেতু আপনি প্রতিটি গেস্টবুক ডকুমেন্টে একটি ফিল্ড হিসাবে প্রমাণীকরণ ইউআইডি ব্যবহার করেছেন, তাই আপনি প্রমাণীকরণ ইউআইডি পেতে পারেন এবং যাচাই করতে পারেন যে ডকুমেন্টে কেউ লেখার চেষ্টা করছে তার সাথে একটি প্রমাণীকরণ ইউআইডি আছে।

নীচে দেখানো হিসাবে আপনার নিয়ম সেট পড়ার এবং লেখার নিয়ম যোগ করুন:

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    match /guestbook/{entry} {
      allow read: if request.auth.uid != null;
      allow write:
        if request.auth.uid == request.resource.data.userId;
    }
  }
}

এখন, গেস্টবুকের জন্য, শুধুমাত্র সাইন-ইন করা ব্যবহারকারীরা বার্তা পড়তে পারে (যে কোন বার্তা!), কিন্তু শুধুমাত্র একটি বার্তার লেখক একটি বার্তা সম্পাদনা করতে পারে।

বৈধতা নিয়ম যোগ করুন

সমস্ত প্রত্যাশিত ক্ষেত্র নথিতে উপস্থিত রয়েছে তা নিশ্চিত করতে ডেটা যাচাইকরণ যুক্ত করুন:

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    match /guestbook/{entry} {
      allow read: if request.auth.uid != null;
      allow write:
      if request.auth.uid == request.resource.data.userId
          && "name" in request.resource.data
          && "text" in request.resource.data
          && "timestamp" in request.resource.data;
    }
  }
}

9. বোনাস ধাপ: আপনি যা শিখেছেন তা অনুশীলন করুন

একজন অংশগ্রহণকারীর RSVP স্ট্যাটাস রেকর্ড করুন

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

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

ইন lib/main.dart , এই রাষ্ট্র সাথে যোগাযোগ করার জন্য UI 'তে কোড সক্ষম করতে accessors বিভাগে নিম্নলিখিত যোগ করুন:

lib/main.dart

int _attendees = 0;
int get attendees => _attendees;

Attending _attending = Attending.unknown;
StreamSubscription<DocumentSnapshot>? _attendingSubscription;
Attending get attending => _attending;
set attending(Attending attending) {
  final userDoc = FirebaseFirestore.instance
      .collection('attendees')
      .doc(FirebaseAuth.instance.currentUser!.uid);
  if (attending == Attending.yes) {
    userDoc.set({'attending': true});
  } else {
    userDoc.set({'attending': false});
  }
}

আপডেট ApplicationState এর init পদ্ধতি নিম্নরূপ:

lib/main.dart

  Future<void> init() async {
    await Firebase.initializeApp();

    // Add from here
    FirebaseFirestore.instance
        .collection('attendees')
        .where('attending', isEqualTo: true)
        .snapshots()
        .listen((snapshot) {
      _attendees = snapshot.docs.length;
      notifyListeners();
    });
    // To here

    FirebaseAuth.instance.userChanges().listen((user) {
      if (user != null) {
        _loginState = ApplicationLoginState.loggedIn;
        _guestBookSubscription = FirebaseFirestore.instance
            .collection('guestbook')
            .orderBy('timestamp', descending: true)
            .snapshots()
            .listen((snapshot) {
          _guestBookMessages = [];
          snapshot.docs.forEach((document) {
            _guestBookMessages.add(
              GuestBookMessage(
                name: document.data()['name'],
                message: document.data()['text'],
              ),
            );
          });
          notifyListeners();
        });
        // Add from here
        _attendingSubscription = FirebaseFirestore.instance
            .collection('attendees')
            .doc(user.uid)
            .snapshots()
            .listen((snapshot) {
          if (snapshot.data() != null) {
            if (snapshot.data()!['attending']) {
              _attending = Attending.yes;
            } else {
              _attending = Attending.no;
            }
          } else {
            _attending = Attending.unknown;
          }
          notifyListeners();
        });
        // to here
      } else {
        _loginState = ApplicationLoginState.loggedOut;
        _guestBookMessages = [];
        _guestBookSubscription?.cancel();
        _attendingSubscription?.cancel(); // new
      }
      notifyListeners();
    });
  }

উপরের অংশগ্রহনকারীর সংখ্যা খুঁজে বের করার জন্য একটি সর্বদা সাবস্ক্রাইব করা ক্যোয়ারী যোগ করে, এবং একটি দ্বিতীয় ক্যোয়ারী যা শুধুমাত্র ব্যবহারকারী লগ ইন করার সময় ব্যবহারকারী উপস্থিত হয় কিনা তা জানতে সক্রিয় থাকে। এর পরে, পরে নিম্নলিখিত শুমার যোগ GuestBookMessage ঘোষণা:

lib/main.dart

enum Attending { yes, no, unknown }

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

lib/main.dart

class YesNoSelection extends StatelessWidget {
  const YesNoSelection({required this.state, required this.onSelection});
  final Attending state;
  final void Function(Attending selection) onSelection;

  @override
  Widget build(BuildContext context) {
    switch (state) {
      case Attending.yes:
        return Padding(
          padding: EdgeInsets.all(8.0),
          child: Row(
            children: [
              ElevatedButton(
                style: ElevatedButton.styleFrom(elevation: 0),
                onPressed: () => onSelection(Attending.yes),
                child: Text('YES'),
              ),
              SizedBox(width: 8),
              TextButton(
                onPressed: () => onSelection(Attending.no),
                child: Text('NO'),
              ),
            ],
          ),
        );
      case Attending.no:
        return Padding(
          padding: EdgeInsets.all(8.0),
          child: Row(
            children: [
              TextButton(
                onPressed: () => onSelection(Attending.yes),
                child: Text('YES'),
              ),
              SizedBox(width: 8),
              ElevatedButton(
                style: ElevatedButton.styleFrom(elevation: 0),
                onPressed: () => onSelection(Attending.no),
                child: Text('NO'),
              ),
            ],
          ),
        );
      default:
        return Padding(
          padding: EdgeInsets.all(8.0),
          child: Row(
            children: [
              StyledButton(
                onPressed: () => onSelection(Attending.yes),
                child: Text('YES'),
              ),
              SizedBox(width: 8),
              StyledButton(
                onPressed: () => onSelection(Attending.no),
                child: Text('NO'),
              ),
            ],
          ),
        );
    }
  }
}

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

lib/main.dart

Consumer<ApplicationState>(
  builder: (context, appState, _) => Column(
    crossAxisAlignment: CrossAxisAlignment.start,
    children: [
      // Add from here
      if (appState.attendees >= 2)
        Paragraph('${appState.attendees} people going')
      else if (appState.attendees == 1)
        Paragraph('1 person going')
      else
        Paragraph('No one going'),
      // To here.
      if (appState.loginState == ApplicationLoginState.loggedIn) ...[
        // Add from here
        YesNoSelection(
          state: appState.attending,
          onSelection: (attending) => appState.attending = attending,
        ),
        // To here.
        Header('Discussion'),
        GuestBook(
          addMessage: (String message) =>
              appState.addMessageToGuestBook(message),
          messages: appState.guestBookMessages,
        ),
      ],
    ],
  ),
),

নিয়ম যোগ করুন

যেহেতু আপনি ইতিমধ্যে কিছু নিয়ম সেট আপ করেছেন, আপনি বোতামগুলির সাথে যে নতুন ডেটা যুক্ত করছেন তা প্রত্যাখ্যাত হতে চলেছে। আপনি নিয়মটি আপডেট করার জন্য যোগ করার জন্য প্রয়োজন হবে attendees সংগ্রহ।

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

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    // ... //
    match /attendees/{userId} {
      allow read: if true;
      allow write: if request.auth.uid == userId;
    }
  }
}

বৈধতা নিয়ম যোগ করুন

সমস্ত প্রত্যাশিত ক্ষেত্র নথিতে উপস্থিত রয়েছে তা নিশ্চিত করতে ডেটা যাচাইকরণ যুক্ত করুন:

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    // ... //
    match /attendees/{userId} {
      allow read: if true;
      allow write: if request.auth.uid == userId
          && "attending" in request.resource.data;

    }
  }
}

(ঐচ্ছিক) আপনি এখন বোতাম ক্লিক ফলাফল দেখতে পারেন। ফায়ারবেস কনসোলে আপনার ক্লাউড ফায়ারস্টোর ড্যাশবোর্ডে যান।

অ্যাপ প্রিভিউ

10. অভিনন্দন!

আপনি একটি ইন্টারেক্টিভ, রিয়েল-টাইম ওয়েব অ্যাপ্লিকেশন তৈরি করতে Firebase ব্যবহার করেছেন!

যা আমরা েকে রেখেছি

  • ফায়ারবেস প্রমাণীকরণ
  • ক্লাউড ফায়ারস্টোর
  • ফায়ারবেস নিরাপত্তা বিধি

পরবর্তী পদক্ষেপ

  • অন্যান্য Firebase পণ্য সম্পর্কে আরো জানতে চান? হয়তো আপনি ব্যবহারকারীদের আপলোড করা ইমেজ ফাইল সংরক্ষণ করতে চান? অথবা আপনার ব্যবহারকারীদের বিজ্ঞপ্তি পাঠান? পরীক্ষা করে দেখুন Firebase ডকুমেন্টেশন । ফায়ারবেসের জন্য ফ্লটার প্লাগইন সম্পর্কে আরও জানতে চান? পরীক্ষা করে দেখুন FlutterFire আরও তথ্যের জন্য।
  • ক্লাউড ফায়ারস্টোর সম্পর্কে আরো জানতে চান? হয়তো আপনি উপ -সংগ্রহ এবং লেনদেন সম্পর্কে জানতে চান? উপর আগাইয়া ক্লাউড Firestore ওয়েব codelab একটি codelab হল ক্লাউড Firestore উপর আরো গভীরতা মধ্যে যায় জন্য। অথবা এই খুঁজে বার করো ইউটিউব সিরিজ জানেন যে মেঘ Firestore পেতে !

আরো জানুন

কেমন যাচ্ছে?

আমরা আপনার প্রতিক্রিয়া চাই! একটি (খুব) শর্ট ফর্মটি পূরণ করুন এখানে