از Pista Academy حمایت کنید
خلاصه آموزشی
مرور سریع مفاهیم اصلی پیش از تماشای کامل یا برای جمعبندی بعد از آموزش.
در جلسه 74 آموزش فلاتر، مدرس به معرفی بک اند و اهمیت اتصال اپلیکیشنها به آن پرداخته میشود. اپلیکیشنهایی که تا کنون ساخته شدهاند، دیتا را به صورت محلی ذخیره میکنند که باعث از بین رفتن دیتا در صورت پاک کردن اپلیکیشن میشود. بنابراین، نیاز به اتصال به یک بک اند برای ذخیره، خواندن و تغییر دیتا وجود دارد. در این جلسه، از فایوس (Firebase) به عنوان یکی از روشهای اتصال استفاده میشود، اما به دلیل محدودیتهای فایوس در ایران، گزینههای دیگری مانند پاکت بیس (PocketBase) و سرویسهای دیگر نیز معرفی میشوند. همچنین، به ایمپورت پکیج اچتی تیپی (http) برای ارسال ریکوستهای پست به بک اند پرداخته میشود. در بخش بعدی، مدرس به نحوی ارائه میدهد که برای ارسال داده به سرور، نیاز است یک URL مشخص شود و هدر محتوای ارسالی به صورت JSON تنظیم شود. همچنین، دادهها باید به صورت JSON تبدیل شوند و در نهایت، یک تست ارسال داده به سرور انجام میشود. در نهایت، مشکلی در اتصال امولاتور به اینترنت اشاره شده است که در جلسه بعدی حل خواهد شد.
نکات کلیدی
اهمیت اتصال اپلیکیشن به بک اند برای ذخیره و مدیریت دیتا
استفاده از فایوس و گزینههای دیگر مانند پاکت بیس برای اتصال به بک اند
نیاز به تنظیم URL و هدر محتوای JSON برای ارسال داده به سرور
دادهها باید به صورت JSON تبدیل شوند و در نهایت یک تست ارسال داده انجام میشود
متن ویدیو
متن زمانبندیشده این جلسه برای مرور، جستجو و دسترسی سریعتر.
سلام عرض میکنم خدمت دوستان عزیز. بریم سراغ
فصل جدید در حقیقت دورهم از امروز و
میخوایم اپلیکیشنهایی که تا الان ساختیم
رو بریم متصل بکنیم به یک بک اندی.
اصلاً چرا باید این کارو بکنیم؟ یعنی ما
چرا باید اپلیکیشنمون متصل باشه به یک بک
ان هندی؟ اپلیکیشنی که ما تا الان درست
کردیم یه ایراد بزرگ دارن. ایرادشون چیه؟
اینه که اگر دیتایی داخلشون ذخیره شده اون
دیتا صرفاً رو همین جا ذخیره شده.
خب و من اپلیکیشنو پاک کنم یا ببندم و
اینا دیتای من از بین خواهد رفت.
در صورتی که خب اپلیکیشنهایی که تو دنیای
واقعی کار میکنن به این شکل نیستن.
دیتاشون رو دارن از یه جایی دریافت
میکنن.
اصطلاحاً اون اپلیکیشنا دارن ریکوست
میزنن به یک جایی یک سروری یا اکندی و
دیتا و اطلاعاتی که نیاز دارند رو از طریق
اینترنت از اون دقیقاً سرویسه دریافت
میکنن.
ما قراره یه همچین چیزیو یاد بگیریم که
چهجوری بتونیم اپلیکیشنامون رو در متصل
بکنیم به یه بک اندی و ریکوست بزنیم حالا
یا دیتا رو بخوایم ذخیره بکنیم یا دیتا رو
بخوایم بخونیم یا دیتا رو بخوایم تغییر
بدیم و هر چیز دیگهای
خب برای بکد
انتخاب زیادی بچهها وجود داره ما قراره
از فایوس استفاده بکنیم توی این فصل یعنی
قراره بریم سراغ فایوس محصول خود گوگل
اما خب یه محدودیتهایی بابت فایوسرس تو
ایران وجود داره شما میتونید از سرویسهای
دیگه هم استفاده بکنید خب مثل مثلاً برید
سراغ پاکت بیس من با پاکت بیس خیلی کار
کردم و اپلیکیشن زیادی روش بالا بردم
استفاده ازشم راحته شما
سورس آب پاکت بیسو میگیرید از تو گیتهاب
رو هر هاستی که دوست داشتید رو هر سروری
که دوست داشتید میتونید اینو بیارید بالا
باهاش کار بکنید یا یه کار راحتترم هست
برید تو سایت لیارا یه قسمتی هست به نام
برنامههای آماده
اینجا پاکت هست
توی
بک ان هندشه باید باشه اجازه بدید اینا
اینو نصبش بکنی یه نصب خیلی سریع و آسونی
داره یه هزینه خیلی کمی مثلاً در حد روزی
فکر کنم ۱۰ ۱۵ هزار تومن ۲۰ تومن اینا
مثلاً میدید و باهاش کار میکنید.
داکومنتشم کامل هست. یعنی از چت جی بیتی
هم داکومنتشو بگیرید بهتون میده و و چیزای
دیگه و خیلی کار کرد باهاش راحته. یعنی
میتونید اپلیکیشنی زیادی رو روش بالا
بیارید و یه بک اند آماده داشته باشید.
اگه میخواید تستی یه بک اند ساده داشته
باشید یه سایتی هست به نام موکi.
اینم خیلی باحاله یه سری دیتابیسهای ساده
باحال بهتون میده برای کار کردن تستی.
خیلی هم کاری کردن باهاش راحته.
حرفهایتر میخواید کار بکنید د تا سرویس
هست به نام سوپا بیس که ماهی تقریباً دو
سه میلیون هزینهشه
و باز یه بک اند کامل به شما میده و کلی
امکانات دیگه مثل آتنتیکیشن و استورج و
اینا بهتون میده. پاکت بیسم اینا رو بهتون
میده بچهها هم آتنتیکیشن بهتون میده هم
استورج بهتون میده و و کل اطلاعات دیگه.
اپرایتم هست. این ارزونتر از سوپاویسه
تقریباً شبیه همونه. همون امکاناتو داره و
قیمتش پایینتره و قیمتشم بچهها متناسب
با میزان مصرفتونه. یعنی یه قیمت پایه
داره فکر کنم ۱۵ دلار در ماه به اضافه
حالا مصرفون که بره بالاتر هزینههاشم
میره بالاتر
ولی پیشنهاد من پاکت چون خیلی ارزونتره
مثلاً با یه هزینه تقریباً ۵۰۰ ۶۰۰ تومن
در ماه کارتون راه میفته و میتونید کلی
اپلیکیشن روش بالا بیارید
خب بریم سراغ ماهم در نهایت بچهها خیلی
از اپلیکیشنامونو با پاکت بیس بالا میاریم
و اگه نخوایم بک اند براش بنویسیم که خب
نیازی داره که شما دانششو داشته باشید.
نکته بعدی اینکه ما قراره رو همون
اپلیکیشن جلسه قبلمون کار بکنیم. لینک از
این لینک بچهها این بالا هم هست میتونید
اپلیکیشنی که تا جلسه قبل نوشته شده رو
دریافت بکنید و با همدیگه بریم جلو. حالا
این لینک توضیحات ویدیو تو یوتیوب هم هست.
بریم شروع بکنیم کارمونو.
بیایم تو اپلیکیشنمون.
ما تو اپلیکیشن معین
البته قبلش بذار بریم تو فایوس این گ تو
کنسولو که بزنید قبلش باید با یه جیمیلی
لاگین باشید حتماً خب برید اینجا
یه پروژهای رو درست بکنید هر اسمی دوست دارید براش بذارید
اینو بزنید یه اسم براش بذارید مثلاً من
میذارم
فلاتر یا فلاتر مثلاً
اسم کانالمونو بعدش میذارم داش پیستا خب اینم میزنم
کاری با این ندارم نمیخوام ولش کن کانتینیوم
جمنی رو نمیخوام اصلا کاری باهاش ندارم
کانتینیو
آنالیتیکسم لازم ندارم اینم بسته
و پروژه الان جنریت میشه
این صدایی هم که او من نتیف گوگلم بود که فاست بالا اومدن
خب کانتینیو رو میزنم و وارد محیط فایس
میشم
اینجا
میرم تو قسمت
یه قسمت دار به نام ریل تایم در حقیقت
دیتابیس من خیلی وقت با فلاتر کار ن با
فایبرس کار نکردم محیطش خیلی عق شده اینجا
یه قسمت داره به نام فایر استور نه ریل
تایم دیتابیس من اینو میخوام میخوام یه
دیتابیسی درست کنم
اوکی اگرم میخواستید داکیومنت فلات در حقیقت
فایر بیسو بخونید یه همچین چیزیرو تو گوگل
سرچ کنید
یه همچین چیزیو فاست ریل تایم دیتابس رست همین لینک اولی که میاد باز بکنید
کل داکومنتش هست برای اینکه ریکوستای گتو
بزنید
پوت پست پچ دیلیت و همه چیزا کامل داکومنتش رو توضیح داده مثلاً میگه یوآرلی
که شما باید ریکوست بزنید یه همچین شکل و
شمریلی داره این پروجکت آیدیمون همون اسمی
بود که گذاشتیم من گذاشتم شم فلاتر دش
پیستا مینویسم اینجا فلاتر دشپا ادامش
این آدرس دقیق این دیتابیسمه و حالا نحوه
ریکوست زدنم ادامه گفته که ما الان توی
خود کار بهتون خواهیم
خب پس ما دیتابیسمونو ساختیم
از نه دیتابیسو نساختیم
اومدم تو یه دیتابیس بسازیم که یه دیتابیس
نیست
این منطقه رو انتخاب کنید خیلی مهم نیست بچهها حالا ما هم رو آمریکا میذاریم
باشه یا میتونیم بذاریم برژیک که مثلاً
آب اروپاست
رو حالت تست باشید چون ما قراره تست بکنیم
خیلی محیط پروداکشن مهم نیست برامون
اوکی میرید تو این صفحه بچهها اگه فایر بیس رو چون فکر کن فیلتر تره خب
اگه مشکل داشتید باهاش برید سراغ
سرویسهایی که بالاتر گفتم و با اونا کار
بکنید عادت بکنید هر جا یه مشکل داشتید چت
جی بیتی سؤال بپرسید بهتون میگه راه حلش
چیه اصلاً چیز سختی نیست خب
این یوآرl منه همون یوآرلی که دنبالش بودم
ولی فعلاً باهاش کاری ندارم میام توی
پروژم
توی پروژم من یه جایی به نام یه چیز داشتم
به نام نیو آیتم اینجا یادتون باشه اینجا
سیو میکرد بعد منو هدایت میکرد به صفحه
دیگهای کارمو اینجا باید انجام بدم. یعنی
من دیتا رو باید اینجا ریکوست بدم بره سمت
بک اندم و ذخیره بشه.
خب اولین کاری که میکنم باید یه پکیجی رو
من نصب بکنم. برای اینکه بخوام ریکوست
اچتی تیتی پی بفرستم سمت بک اند من باید
یه پکیجیو توی فلاتر نصب بکنم. پکیج اسمش
از اچیتی پی.
خب میایم اینجا همین فلاتر اچتی پی سرچ بکنید همین اولی رو که باز کنید
برید تو اینستالش
اینو کپی کنید بیاید اینجا محیط ترمینال
نصبو بزنید
خب این شد حالا فقط کافیه که چیکار کنید ایمپورتش
کنید این بالا
یعنی بیاد اچتی تیپی رو ایمپورت کنید و
بریم سراغش که ازش استفاده کنیم ایمپورتشم
مثل برقست کاری نداره
پکیج درخته اچیتی پی اسلش
‏http. فقط یه اسم براش بذارم خب اسمشو میذارم
اچ تیتی پی
ای اس مخفف الیاسه یه اس براش گذاشتید
میگید من هر جایی گفتم اچ تیتی پی منظورم
کل این پکیج هست
خب حالا میایم پایین
من اچتی تیتی پی رو آوردم تو پروژهم حالا
بریم ریکوست بزنیم بهش و باهاش کار بکنیم
شما وقتی میخواید اچتی تیپی ریکوست بزنید
باید ریکوستتون اول تایپش رو مشخص خص
بکنید که من قراره چه ریکوستی بزنم گت
بزنم پست بزنم ما اینجا قراره پست بزنیم
چرا چون قراره دیتایی رو بفرستیم سمت بکن
ان و این ذخیره بشه خب پس
میام اینجا
اینجا بعد از این سیوه
میگم که برو داخل اچتی تیپی یه ریکوست پست
قراره بزنم
پست قراره به یک آدرسی زده بشه یه یوآرلی
زده بشه اول بیم یوآر درست درست بکنیم
میام همین جا میگم فاینال یار مساویه
میگم یوآرآیت
خب من قراره یالمو بسازم با این بچهها یوآر من یادتون باشه چه شکلی بود خب
همین جا کپی کنیم میتونید کپی کنید از
اینجا
گوش اینا اینو کپی کنید
روش کلیک کنید فکر کنم کپی میشه کپی شد
اینو بیارید اینجا بنذارید
فقط اولشو بردارید
این آخرشو بردارید
این اچیتی پی اس اولشم بردارید چون به لطف
این اچتیتی پی اسه خودشم این کارو انجام
میده
آها این یوآرLل بچهها یه پرانتزشو باید
برداد اوکی
من الان یوآرالم داره ساخته میشه فقط این
یوآرالم هنوز یه سری کارا داره انتهاش من
باید اصطلاحاً پتشو مشخص بکنم پت میشه اون
چیزی که بعد از اسلش میاد خب اینجا یه
ویلگور میزنم مثلاً اسمشو میذارم
اون پتشو میذارم شاپینگ لیست.
یه اسمی گذاشته داد جیسون خب ایناش ما هم اینجا اسمشو گذاشتیم شاپینگ لیست
بریم جلو پس یآرالمونو ساختیم حالا
میتونیم به این یوآرlل ریکوست بزنیم
زمانی که داریم ریکوستو پست میزنیم ما
باید یه سری چیزای دیگه رو هم ست بکنیم خب
باید
و یوآرالمون یعنی هر ریکوست پستی که ما
اینجا میخوایم بزنیم
الان یوآرlلشو مشخص کردم بذار من اینو
اینجوری بنویسم اینجا بزنم یه یوآرL داره
برای ریکوست پست
یه هدر داره
که هدر خود شامل چیزای مختلفه چیزی که ما
اینجا لازم داریم یه کانتنت تایپه
تایپ دو نقطه از جنس
اپلیکیشن جیسون
بعد بادیمونو باید مشخص بکنیم اون دیتایی که قراره بفرستیم دیتایی که قراره بفرستیم
باید با فرمت جیسون باشه یعنی من باید
اینو تبدیلش کنم به جیسون اینو کپی
میکنم. یه چیزی داریم به نام جیسون.
خب این بالا از اینجا میاد بچهها از
کانورت دارت میاد. جیسون.
انکود
میگه چی رو تبدیل کنم به جنس فرمت جیسون میگم اینو.
فقط باید اینا رو ببرم داخل
اوکی پس میگم اینو تبدیل کن به یه فرمت جیسون فقط اینم بچهها بذارین تایتلشو من
میخوام کل آبجکتشو نمیخوام بعداً از
طریق تایتل میتونم به کلش دسترسی پیدا
بکنم بزنم دست پیدا کنم دیگه نه اینو لازم
ندارید میتونید پاک کنید.
فقط میخوایم دیتا رو ببریم سمت بکنن ذخیره کنیم. فعلاً کاری با اینکه بعدش
میخواد چی بشه نداریم. بریم یه تست بکنیم
اینو
خب اپ من اومد بالا. پلاسو میزنم یه اسم براش میذارم مثلاً اسمشو میذارم
تست فعلاً کوانتیتی هم مثلاً ۱۰ تا اینم
میذارم مثلاً روی میت خب اینجا هیچ
اتفاقی نمیفته اوکیه فقط ببینیم دیتام
اینور ذخیره شد یا نه تو دیتابیسمون
یه
اینجا یه رفرش بدم چرا رفرش ندارم
آدرسم میگه با این فرمته بذار من اینو اینو کپی کنم یه لحظه
نه بس این یه تیکهشو این مدلی بزنیم ببینیم
خب بچهها من یه حرکتی زدم پروژه رو پاک کردم تو فایبیس. خب
یه باری که از اول درستش کردم پروژمو
پاک کردنشم کاری نداره. این تنظیماتو شما
بزنید بعد بیاید توی پراجکت ستینگ تو این
پایین یه دونه دیلیت پراجکت داره اینو
بزنید پاک میشه خب یه بار دیگه بیم یه
دیتابیس جدید بسازم
خب
میذارم این دفعه رو همون یونایتد استیت بمونه نمیبرمش جای دیگه تست
این که اولشو برمیدارم خب این باشه اینجا یه بار دیگه اپلیکیشنو
ران کنیم ببینیم چی میشه
خب بازم نشد فقط یه چیزی من الان یادم گرفت توی رولز
اینو بکنید ترو
که از همه بتونن ریکوست بدن یعنی محدودیتی نباشه اصلاً نمی نمیدونم مربوط به اینه
یا نه ولی
شاید از این باشه.
ش خیلی عجیبه
دیگه گیل چیه
خب دوستان مشکلی که هست سمت امولاتور منه این امولاتور من اصلاً به
اینترنت اکسز نداره مشکل اینجاست خب من
اول باید این مشکلو حل بکنم چرا این
امولاتور من به اینترنت اکسز چون باید به
صورت پیشفرض از اینترنت سیستم من استفاده
بکنه ولی خب خب این کارو نمیکنه. اینو
اجازه بید چک کنم بعد جلسه بعدی مشکلشو که
حل کردم بهتون خواهم گفت. فعلاً خداحافظ.
پرسشهای رایج
پاسخ کوتاه و مستقیم به پرسشهایی که معمولاً هنگام یادگیری این موضوع مطرح میشوند.
برای ذخیره، خواندن و تغییر دیتا به صورت دائمی و جلوگیری از از بین رفتن دیتا در صورت پاک کردن اپلیکیشن.
فایوس (Firebase)، پاکت بیس (PocketBase) و سرویسهای دیگر.
نیاز به یک URL مشخص و تنظیم هدر محتوای ارسالی به صورت JSON.
دادهها باید به صورت JSON تبدیل شوند.
آخرین بهروزرسانی محتوای متنی:
در این دوره جامع و پروژهمحور با فلاتر و دارت از صفر تا صد آشنا میشوید و با ساخت هشت اپلیکیشن واقعی که هر کدام نکات کلیدی و پرکاربرد فلاتر را پوشش میدهد، مهارتهای خود را به سطح بعدی میبرید. آنچه در این دوره یاد میگیرید: مقدمه و نصب ابزارها: آشنایی با فلاتر، دارت و راهاندازی محیط توسعه مبانی دارت و فلاتر: یادگیری سینتکس دارت و ساخت ویجتهای پایه با اپ «تاسانداز (Roll Dice)» غوطهوری در فلاتر: پیادهسازی اپ «کوئیز (Quiz)» برای مسلط شدن بر ساختار و چرخه حیات ویجتها دیباگ و رفع اشکال: تکنیکهای عیبیابی و ابزارهای Flutter DevTools واکنشگرایی و تمینگ: ساخت «Expense Tracker» برای یادگیری ویجتهای تعاملی، موضوعبندی (Theming) و طراحی ریسپانسیو مدیریت وضعیت (State Management): از Provider تا روشهای داخلی دارت با اپ «TODO» و «Meals» مسیریابی بین صفحات: ناوبری پیشرفته با «Meals App» و انتقال داده بین صفحات انیمیشنها و جلوههای بصری: افزودن حرکات پویا و تراکیب انیمیشنی در «Meals App» فرمها و ورودی کاربر: دریافت و اعتبارسنجی اطلاعات با «Shopping List» ارتباط با سرور: ارسال و دریافت HTTP، کار با JSON و REST API در «Shopping List» دسترسی به امکانات بومی دستگاه: استفاده از دوربین و ذخیرهسازی در «Favorite Places» فراخوانی پوش نوتیفیکیشن و چت زنده: ترکیب فلاتر با Firebase برای ساخت اپ چت با اعلان لحظهای بهروزرسانیها و چشمانداز آینده: نکات پایانی، منابع پیشرفته و مسیر یادگیری ادامهدار چرا این دوره؟ پروژهمحور و گامبهگام، مناسب برای تازهکارها و افراد با تجربه متوسط پوشش تمام جنبههای کلیدی: از طراحی رابط کاربری و انیمیشن تا اتصال به سرور و مدیریت وضعیت پیادهسازی چندین اپلیکیشن واقعی که میتوانید به سادگی برای نمونهکار شخصی یا پروژههای شغلی استفاده کنید لینک گیت هاب دوره جهت دسترسی به کد پروژه های هر فصل https://github.com/pistaacademy/flutter 🔔 همین حالا سابسکرایب کنید تا ویدیوهای آینده را از دست ندهید و یادگیری فلاتر را با هم شروع کنیم!