نوشته های Abolfazl mashhadi

متصل کردن پروژه به سرویس فایربیس

Abolfazl mashhadi — Tue, 22 Nov 2022 16:34:55 +0330

سلام رفقا امیدوارم حال دلتون خوب باشه، من ابوالفضلم و در حال خوندن مقاله شماره یک از سری مقالات استفاده از سرویس فایربیس هستن. امروز میخواییم پروژه رو به سرویس فایربیس متصل کنیم.اول کار یه پروژه فلاتری میسازیم و اون رو با ادیتور مورد علاقمون باز میکنیم، من از VSCODE استفاده میکنم حالا در قدم بعدی باید به سایت فایربیس بریم تا پروژه اونجا هم بسازیم .(یادتون نره که قندشکن هاتون روشن کنید ) بعد از قسمت بالاGo to console میزنیم و وارد کنسول میشیم . بعد از ورود add project رو میزنیم تا بتونیم یه پروژه جدید بسازیم مرحله شماره 1مرجله شماره 2قسمت بعدی، فایربیس از ما میخواد که یک اسم برای پروژه انتخاب کنیم .مرحله بعدی ما خاموش کردن ابزار گوگل انالیتکسی هست که فایربیس در اختیارمون قرار میده (خاموش میکنیم چون واقعا بهش نیاز نداریم و پروژه برای پروداکشن نیست ).حالا از اون پایین دکمه create project رو میزنیم. یکم صبر میکنیم که ساخته بشه وقتی که ساخته شد continue میزنیم به داشبورد پروژه میرییم.حالا نوبت اضافه کردن پروژه اندرویدیمون به فایربیس هستش ، برای این کار بخش هدر داشبورد روی ایکون اندروید کلیک میکنیم. به این صفحه ریداریکت میشیم. این صفحه 3 مرحله داره که خیلی مهم پس دقت کنید با من پیش بیاید . مرحله اول ما دادن اسم پکیج پروژه به فایربیس هستش . توی این مرحله 3 تا تکست فیلد هست مثل عکس پایین .تکست فیلد اولی package Name پروژه رو از ما میخواد. برای پیدا کردن این ادرس کافیه توی ادیتور خودتون این مسیر رو دنبال کنید و وارد فایل که اسمش پایین اوردم بشید.projectName -> android ->app ->build.gradleبعد از ورد به فایل build.gradle به خط شماره 45 میایم و جایی که مقدارش به این شکل باشه رو کپی میکنیم .(این همون دامین برعکس پروژه هستش که به صورت دیفالت با دامنه example ساخته میشه و میتونید متناسب با نیازتون تغییر بدین ).com.example.projectNameبرای من به این شکل هستش.بعد از کپی کردن این مقدار توی اولین فیلد پیست میکنیم و برای تکست فیلد بعدی اسم پروژه وارد میکنیم

استفاده از سرویس فایربیس در فلاتر

Abolfazl mashhadi — Sat, 19 Nov 2022 16:15:42 +0330

فایربیس ! یکی از سرویس های خفن گوگل که هر فلاتر کاری حداقل یکبار اسمش رو شنیده. فایربیس یک سرویس انلاین همه چی تموم برای اپلیکیشن های فلاتری هستش ( با نیتو ها هم میشه باهاش کار کرد سوتفاهم نشه). این سرویس برای ما از احراز هویت تا دیتابیس و نوتیفیکیشن و ..... دم دستمون قرار داده و عملا میشه باهاش اپلیکیشن هایی تو مقیاس بزرگ باهاش ساخت.همونطور که گفتم این سرویس برای گوگل هستش و متاسفانه گوگل کشور ایران تحریم کرده و نمیشه از داخل ایران با این سرویس کار کرد. اما تحریم بودنش باعث نمیشه که ما یادش نگیریم و از یه طرفی هم شرکت های خارجی هم هستن که از این سرویس برای پروژه هاشون استفاده میکنند. یادگرفتنش میتونه یه اپشن خوب توی رزومه خودتون باشه برای کار با خارج از کشور. از تحریم بودن و اپشن بودنش که بگذریم اصلا تجربه خیلی جالبی کار باهاش .یه سوالی پیش میاد اینه ! ما قرار چجوری این سرویس کنار هم یاد بگیریم ؟ خوب برای این مسئله من تصمیم گرفتم یه سری مقالات سریالی بنویسم که داخلش به صورت کاملا پروژه محور از این سرویس استفاده کنیم بهتون نحوه استفاده از این سرویس یاد بدم. اپلیکیشنی که قرار باهم بنویسیمش اپلیکیشن یاداشت برداری هستش که کاربر در ابتدا با استفاده از سرویس احراز هویت فایربیس یه پروفایل کاربری برای خودش میسازه و بعدش میتونه به اپلیکیشن یاداشت های خودش رو اضافه کنه یا اون ها رو ادیت یا دیلیت کنه . بهتر برای اول کار زیاد پیچیدش نکنیم تا بتونیم بهتر یادش بگیریم. این مژده رو هم بدم که رفته رفته بهش قابلیت اضافه میکنیم و بزرگ ترش میکنیم .مورد بعدی که باید بهش توجه کنیم اینکه قرار ما از چه استیت منیج و چه معماری قرار استفاده کنیم؟ برای این پروژه ما از معماری MVCS و استیت منیج Getx استفاده میکنیم تا همچیز در نهایت سادگی و قابل درک باشه و این رو هم بگم که قرار از پیکج های مختلفی استفاده کنیم که خودش کار جذاب تر میکنه .تمامی کد های این سری مقالات هم روی گیت هابم قرار میگیره .خوب تا به اینجا خواستم شما رو از تصمیمم با خبر کنم و بهتون این خبر خوب رو بهتون بدم . منتظر مقاله شماره 1 باشید که داخلش قرار درباره کانفیگ کردن پروژه با فایربیس براتون بگم راسی لینک گیتهابم هم میزارم و به زودی پروژه روش اپلود میکنم .https://github.com/Abolfazl-MI

نشون دادن انیمشن های خوشگل در اپلیکیشن های فلاتری

Abolfazl mashhadi — Thu, 01 Sep 2022 17:57:23 +0430

یکی از مهم ترین بخش های هر نرم افزار رابط گرافیکی اون هستش و این بخش هم معمولا با رنگ و طراحی دوستان ui / ux کارمون انجام میشه . گاها برامون پیش اومده خواستیم هنگام لودینگ یا ... یه انمیشن خاص نشون بدیم یا اینکه انمیشن هایی که خودمون یا طراح داخل افتر افکت طراحی کردیم یا طراحی شده رو نشون کاربر بدیم و اپ قشنگ تری رو داشته باشیم.امروز به سراغ پکیجی میریم که این امکان فراهم میکنه از انمیشن های که خودش در سایت خودش گذاشته یا انمیشن های که خودمون داخل افتر افکت طراحی کردیم استفاده کنیم .قدم اول استفاده از هر پکیج اضافه کردنش به پروژه هستش.بعد از اضافه کردن این پکیج به پروژه وقتش رسیده که ازش استفاده کنیم . کافیه که به جای مناسبی بریم که قرار اون انمیشن رو نشون بدیم به طور مثال من میخوام وسط صفحه اپلیکیشن یه انمیشین ۴۰۴ نشون بدم به کاربر بگم که به ارور ۴۰۴ برخورد کردیم .خوب اینجا چندتا راه برای نشون دادن این انمیشین ها داریم .۱ نشون دادن انیمیشن ها به صورت انلاین (لینک انمیشین از سایت که جلوتر ادرس میزارم)۲ از طریق assets۳ از طریق فایل و حافضه(memory)خوب به طور کلی با روش های استفاده ازش اشنا شدیم . برای استفاده از این انیمیشن ها اول یه سر به خود سایت lottie میزنیم و انیمشین مورد نظر خودمون انتخاب میکنیم .https://lottiefiles.com/خوب حالا از اون بالا دکمه دانلود رو میزنیم .اینجا برامون چندتا اپشن باز میشه برای دانلود استفاده راحت میتونیم از فرمت json استفاده کنیم و اسم اپشن که اولین اپشن لیست هم هست lottie json هستش بعداز انتخاب اون فایل جیسون شروع به دانلود میکنه .بعد از اینکه دانلود فایل تموم شد داخل فولدر assets یه فولدر به اسمlotties میسازیم و میایم فایل جیسون دانلود شده داخلش قرار میدیم.مرحله بعدی رو هم قطعا همه میدونیم و اون هم دادن مسیر فولدر جدید به فایلpubspec.yml هستش خوب دیگه تا اینجا کار های اصلی انجام دادیم و وقت استفاده از این پکیج خفن .به جایی از صفحه میریم که میخوایم این انمیشن رو نشون بدیم .کلاس این پکیج کانستراکتور هایی جداگونه برای روش های متفاوت در نظر گرفته از اونجاییی که میخواییم فایل جیسون استفاده کنیم به این شکل کدش مینویسیم.یادتون باشه این هم مثل عکس ها اگر ادرس درست ندین بهش به مشکل خواهید خورد .بهتر از پکیج های مثل fluttergen برای جنریت کردن ادرس های assets های پروژه استفاده کنید تا درصد خطا شما رو بیاره پایین.راستی بالا گفتم که میتونیم از انمیشن های طراحی افتر افک هم استفاده کنیم اما چجوری ؟ کافیه که فقط از اون انمیشن داخل نرم افزار خروجی جیسون بگیرید و مثل همین انمیشین اون به فولدر assets اضافه کنید و ازش استفاده کنید . خروجی به شکل زیر میشه (خیلی ساده زدم ولی خوب شما متناسب با نیاز خودتون باید یکسری تغییرات بدین )داشت یادم میرفت اینو که بگم چجوری انلاین ازش استفاده کنید .همون بخش که میرید برای دانلود انمیشین یه بخش داره برای لینک که میتونید لینک رو کپی کنید .کافیه بعد از کپی کردن لینک به داخل کد بیاید از کانستراکتور network استفاده کنید به شکل زیر.خوب دیدم که به همین راحتی میتونیم انیمشن های lottie استفاده کنیم و کلی اپلیکیشنمون رو خوشگل تر کنیم .امیدوارم این مقاله براتون مفید بوده باشه این مقاله و اگر چنین بود ممنون میشم که برای رفیقاتم بفرستی تا بخوننش و لایک و کامنت هم فراموش نشه تا مقاله ای دیگه به درود.

سریالایز کردن دیتا با استفاده از پکیج json_serializable

Abolfazl mashhadi — Mon, 29 Aug 2022 14:52:43 +0430

سریالاز کردن کردن دیتا های دریافتی از api یکی از کار های متعددی هستش که ما توسعه دهنده های فلاتر بار ها بار ها انجامش دادیم، اما ! این پروسه گاهی خیلی طولانی و اذیت کننده میشه و حتی باعث یکسری اشتباهات میشه . حلا به لطف برنامه نویس های خفن یه پکیج داریم که به کمکش میتونیم فقط فیلد های مدل رو بنویسیم و بقیه کار رو به اتوماسیون و اسکریپت ها بسپاریم تا کار های تکراری و حوصله سر بر برای ما انجام بدنخوب امروز قرار بریم سراغ یکی از پکیج های معروف این ضمینه به اسم josn_serializable ببیینیم که چجوری با کمک این پکیج میتونیم مدل سازی انجام بدیمخوب در قدم اول ما باید یکسری پکیج ها رو به پروژمون اضافه کنیم ،بعد از اضافه کردن پکیج های بالا میریم که مدل که نیاز رو بسازیم ،یه نکته مهم که باید بهش توجه کنید اینکه این پکیج سریالایزر به صورت دیفالت فکر میکنه هر فیلد از کلاس شما داخل جیسونی که قرار بهش بدین قرار داره یعنی چی ؟ بیاین اول یه ریسپانس باهم ببینیم .برای این مقاله من از سایت json place holder استفاده میکنم که بهمون یه ریسپانس خوب بده.خوب ریسپانس دریافتی ما از این endpoint به این شکل خواد بود . بعد از ساختن فایل مدل در فولدر مدل هامون ما باید شروع کنیم فیلد های مدلمون بسازیم .یه نکته اساسی در مورد این پکیج هست این پکیج میاد هر فیلدی که شما تو کلاس مدل خودتون به هر نحوی اسم گذاریش کردین به عنوان کلید موجود داخل ریسپانسی که بهش پاس میدین میدونه .چجوری مثلا؟ الان ما داخل ریسپانس دریافتی یک کلید به اسم id داریم درسته؟برای دریافت مقدار اون باید شما یه فیلد داخل کلاستون با اسم id و تایپ مرتبطش بسازید تا اون مقدار براتون بگیره ولی اگر بخوایید که یه فیلد با اسم دلخواه داشته باشید که از یه کلید خواص دریافت کنه داستان کمی فرق میکنه که اون رو انتهای مقاله توضیح دادم براتون .خوب برای اینکه بتونیم از این ریسپانس استفاده کنیم یه کلاس با اسمPostمیسازیم و شامل فیلد هایی میشه که کلید های داخل جیسون هستن به این شکل .تا اینجا کار جزو کار های همیشگی ما بوده ! همون مدل سازی خودمون بر حسب نیاز و ریسپانس برگشتی از سرور قدم بعدی ما اینکه به این پکیج عزیز بگیم که اقا ما میخواییم شما باقی کارهاش انجام بدی! چجوری ؟ خیلی ساده میایم بالای کلاس یه annotation اضافه میکنیم تا متوجهش بشه این annotation عزیز هم اینشکلی هستش.@JsonSerializable() حالا قدم بعدی ما نوشتن متد های fromJson و toJson هستش با این فرق که دیگه ما نمیایم تک به تک بشینیم فیلد ها رو با دست بنویسیم فقط اسم فانکشن هارو مینویسیم و خلاص بقیش باید بسپاریم به این پکیج عزیز. نوشتن این متد ها هم فرق داره باهم به صورت پله پله میریم جلو اول از همه اینو بگم که با نوشتن این کد ها شاهد یکسری ارور ها داخل ادیتور میشد چون که هنوز فایل هاش جنریت نشده و عادی .اول از همه متد fromJson مینویسیم، کد های این متد به شکل زیر میشه .factory Post.fromJson(Mapjson)=>_$PostFromJson(json);حالا نوبت متد toJson هستش و کد های اون هم به این شکل میشه .Map toJson() => _$PostToJson(this);خوب تا الان ما حدود ۹۰ درصد کارمون انجام دادیم بعد از نوشتن این دوتا متد نوبت میرسه که به دارت بگیم که این فایل قرار بخشی از یه فایلی باشه که کد های سریالاز درونش قرار میگیره و اون فایل توسط build_runner که به پروژه اضافه کردیم قرار جنریت بشه ، برای همین منظور بیاید بالای فایل و زیر ایمپورت هاتون این که میگم رو قرار بدین تا جنریتور متوجه بشه چه فایلی باید براتون جنریت کنه part 'posts.g.dart';داخل این تیکه کد شما باید اسم فایلی که برای مدل خودتون در نظر گرفتین رو با postsجایگذین کنید و دقت کنید که g.dart رو داشته باشید پس ساختار این کد برای شما به این شکل میشه part 'fileName.g.dart';به طور کلی کلاس مدل ما به این شکل در میاد .خوب میدونم که الان ادیتور هاتون دارن داد میزنن که این فایل و این متد ها وجود نداره ، بیاین بهشون خلافش رو ثابت کنیم چجوری ؟! کافیه که دستور زیر رو داخل ترمینال ادیتور هاتون بزنید تا فایل و متد هاش رو جنریت کنید flutter pub run build_runner buildخوب خوب بعد از زدن این دستور فایل ها جنریت میشن و کارتون به اتمام میرسه:) ولی عجله نکنید یادتون گفتم فیلد هایی که شما داخل کلاس مدل میسازید باید هم نام کلید های داخل جیسون باشه ؟ حالا اگه بخوایید نباشه چی ؟ برای اون هم راه حل داریم .بیاین یه بار دیگه کلاس مدل رو ببینیم و اینسری یکی از فیلد ها رو جوری تعریف کنیم که هم نام با کلید های دریافتی نباشه مثلا من دلم نمیخواد id خالی بزارم چون با بقیه چیز ها به مشکل میخورم و میخوام که اسمش رو postId بزارم ولی کلید داخل ریسپاسنس id هستش برای اینکار کافیه که یه annotation دیگه به بالای همون فیلد اضافه کنیدخوب اول برای یاداوری مدل قبلی خودمون ببینیم حالا میایم و تغییری که میخواییم به اون فیلد مورد نظر میدیم . من برای مثل میام اون id رو به postId تغییر میدم .اما اگر دوباره این فایل رو جنریت کنم اون فیلد توسط پکیج شناسایی نمیشه که مقدارش بگیره برای همین میایم و این annotation رو هم به بالاش اضافه میکنیم @jsonKey(name:'id')یه نکته بسیار مهم که باید بهش توجه کنید این هستش که در جای nameش ما باید مقداری بهش بدید که کلید اون در بخش ریسپانس، الان اسم اون فیلد postId هستش و با این annotation این فیلد مقدارش از کلید id دریافت میکنه و درنهایت تغییرات به این شکل در میاد خوب خوب تا اینجا سعی کردم که به زبون ساده بهتون یاد بدم که چجوری از این پکیج برای کار هاتون استفاده کنید امیدوارم براتون مفید بوده باشه شایان ذکر که این تنها پکیج برای انجام این کار نیست و پکیج های دیگه مثل freezed و built_value و... شامل میشه که سعی میکنم در اینده در مورد اون ها هم براتون بنویسم .اگر که تا الان این مقاله و مقاله هاب قبلیم براتون جذاب بوده ممنون میشم که مقاله هام لایک کنید و برای بقیه دوستانتون بفرستید تا اونها هم با خوندنش بتونن استفاده کنن. خوشحال میشم به گیت هابم هم یه سر بزنید و روی ریپو هام استار بدین و کانتریبیوت کنید ممنون که تا به اینجا با من بودین تا مقاله ای دیگه به درورد

استفاده از dartz برای ارور هندلینگ در فلاتر

Abolfazl mashhadi — Mon, 22 Aug 2022 22:07:16 +0430

به عنوان یه توسعه دهنده فلاتر تاحالا براتون پیش اومده خواسته باشید ارور ها داخل اپلیکیشن خودتون کنترل کنید و بعضی هاش به کاربر نشون بدین یا بخوایید در صورت رخداد اون ارور یه فانکشن دیگه رو صدا بزنید یا کار دگیه رو انجام بدید.همونجوری که همه ما میدونیم برای انجام یه کار تو برنامه نویسی هزار تا روش هست، امروزمن میخوام بهتون بگم که چجوری از یه پکیج جالب به اسم dartz برای هندل کردن ارور ها استفاده کنید امیدوارم که براتون مفید واقع بشه. خوب کارمون رو با اضافه کردن پکیج به پروژمون شروع میکنیم .flutter pub add dartzخوب برای ادامه کار نیاز داریم که یه مدل برای ارور هایی که بهشون بر میخوریم بسازیم این مدل هم معمولا چیز انچنانی هم نداره،بریم برای ساختن مدل ارور قدم بعدی ما تایین مدل اصلی که ما ازش دیتا رو میگیرم و داخل سرتا سر اپلیکیشن استفاده میکنیم،اینجا دیگه مرتبط میشه به اپلکیشین خودتون و دیتا هایی که باهاش در ارتباط هستید. اینجا شما متناسب بادیتاهایی که میگیرید یک کلاس مدل میسازید.اینجا اسم کلاس مدل من Note هستش.خوب تا اینجا ما تمامی موارد موردنیاز خودمون رو ساختیم، وقتشه که بریم سرغ اصل مطلب از این پکیج استفاده کنیم.خوب اینجا باید بگم که استفاده از این پکیج صرفا برای روش خاصی نیست و شما میتونید ازش برای ارتباط با سرور یا دیتابیس داخلی استفاده کنید .برای استفاده از این پکیج شما در اول تایین مقدار برگشتی تابع خودتون که به صورت جنریک میدین باید از تایپ Either استفاده کنید ،زمانی که شما این تایپ رو بنویسید از شما میخواد که دوباره ۲ تا مقدار به صورت جنریک به خود این Either بدین که اولی باید مدل اروری که ساختیم رو بدین و دومی مدل کلاس اصلی مدل هستش به صورت زیر خوب حالا اینجا شما باید کد های مربوط به عملیات مورد نظر خودتون بنویسید و مثل همیشه همونtry و catch قدیمی خودمون میزاریم . اینجا برای همه ما سوال پیش میاد خوب الان این فانکشن داره ۲ تا تایپ بر میگردونه از کجا بدونیم که کدوم باید کجا برگرده و ازشون استفاده کنیم ؟صبر کنید ! نردبون پله پله خوب فرض کنید که کد شما در قسمت try عملیات به صورت کامل اجرا شده و همچیز درست و شما میتونید مقدار اصلی مدل رو برگردونید و هیچ اروری نیست، برای برگردوندن مقدار برگشتی درست ما از Right استفاده میکنیم برای مقدار برگشتی ارور ما Left رو برمیگردونیم. حالا این right و left چی هستن ؟ دقت کنید که ما در جنریک اول Either ما مدل ارور رو دادیم و جنریک دوم مدل اپلیکیشن اگه دقت کنید میبینید که Left به معنی چپ اشاره به مدل ارور داره و right هم به مدل اصلی اشاره داره خوب تا اینجا ما فانکشن رو با استفاده از dartz پیاده کردیم حالا وقت استفاده ازش داخل کد هامون رسید.سوال بعدی که برامون پیش میاد اینه اقا چجوری میتونیم تشخیص بدیم که این فانکشن که صدا زدیم مقدار right برگردونده یاleft ??خوب اول بیاید از این کدی که نوشتیم استفاده کنیم تا بعد بهتون نشون بدم چجوری ازش استفاده کنید.خوب تا اینجا فقط ازش استفاده کردیم ،برای دریافت مقدار های برگشتی از این فانکشن ما از متد flod استفاده میکنیم. این متد زمانی بنویسید به شما به صورت پوزیشنال ۲ تا فانکشن با مقدار های برگشتی یکی مدل ارور و یکی مدل اصلی میده ، اگر فانکشنی که ما بالا صدا زدیم به ارور بخورد فانکشن برگشتی با مدل ارور صدا زده میشه و کد های داخل اون صدا زده میشه اگر هم مقدار برگشتی درست باشه (right) فانکشنی صدا زده میشه که مدل اصلی برمیگردونه و کد های داخل اون فانکشن صدا زده میشه .خوب اینجا ما ارور ها رو هندل کردیم و خیلی شیک تونستیم اونها رو کنترل کنیم و از اینجا به بعدش به خودوتن بستگی داره که چجوری از مقدار های برگشتی استفاده کنید لذتش ببرید ، برای درک بیشتر از این پکیج و نحوه استفاده ازش بهتر چند بار مقاله رو بخونید و طبق مراحل پیش برید ازش نهایت لذت ببریدخوب به پایان آمد این دفتر ولی مقاله های ابوالفضل همچنان ادامه داره.امیدوارم براتون جذاب بوده باشه و مفید، اگر اینطور بوده یادتون نره مقاله رو لایک کنید و برای بقیه دوستاتون هم بفرستید تا اینجوری هم حمایتی از من کرده باشید .دمتون گرم ،خدا نگهدار

ساختار فولدر در اپ های فلاتری

Abolfazl mashhadi — Fri, 07 Jan 2022 06:58:59 +0330

امروز تو این مقاله در باره فولدراستراکچرصحبت کنیم و بیایم بگیم اقا ما باید چجوری اپ رو سروسامون بدیم که به مشکل نخوریم ! ?ساختار فولدر ها بستگی بسیار زیاد به معماری و استیت منیجی که استفاده میکنید داره و این موارد رابطه نزدیکی به هم دارند، حالا یه سوال ؟ اصلا چرا فولدر استراکچر ؟ چرا معماری ؟ (در مورد این مقاله های جداگانه خواهیم داشتدر ابتدای مقاله لازم به ذکر که ما اصلا کاری به نوع معماری نداریم و موارد کلی و عامیانه ان را مورد برسی قرار میدهیم و برای معماری ها و فولدر استراکچر انها در اینده مورد برسی قرار میدهیمجواب خیلی سادس ! فرض کنید به عنوان یه توسعه دهنده اپ های موبایل یه پروژه ای رو زدین و کار میکنه و مشکلی نداره اما کار فرما تصمیم به اپدیت میگیره و میخواد که شما براشون یه سری قابلیت هایی پیاده کنی و به اپ اضافه کنید و از زمانی که شما ان اپ را ساخته اید یک سالی میگذر و سطح شما نسبت به ان زمان که اپ توسعه دادید بسیار بالاتر رفته و حالا وقتی که سورس که خودتان با دست های خودتان تایپ کردین باز میکنید و زمانی که شروع به خواندن ان میکنید یه همچین حالتی برایتان پیش می ایدبرای اینکه این حالت بهتان دست ندهد باید به گونه ای کد بزنید که اگر توسعه دهنده دیگری اون سورس را باز کرد بتواند از ان سر در بیارد یکی از مواردی که به این داستان کمک می کن استفاده از یک ساختار مشخص است که به شما کمک بسازایی میکند تا دفعه بعد که کد را باز میکنید یا اینکه کسی دیگر ان را باز میکند بتوانید از نوع کارکرد ان سر در بیاورید همانطور که گفتم ساختار فولدر ها ارتباط بسیار نزدیکی به معماری که استفاده میکنید دارد و انشالله در مقاله های دیگه به مبحث معماری می پردازیم و انهارا مفصل برسی میکینمبریم سراغ اصل مطلب در این مقاله قرار نیست باهم کد بزنیم و فقط به ساختار میپردازیم ، در ساختار بندی معمولا به دید توسعه دهنده مربوط میشود که چگونه ساختاری ایحاد کند ابتدا به سراغ مواردی میرویم که اکثرا افراد از ان استفاده میکنند و مشترک است !کی از موارد مشترک هست که معمولا درون انها کد هایی استفاده میشود که قرارا است همه جا تکرار بشن و همیشه const رو پسوند خودشون داشته باشن، به طور مثال مسیر و نویگیشن ها(اگه دوس داری مثل حرفه ای ها نویگیشن یاد بگیری این مقاله منو بخون ) که نام انها را در این قسمت مینوسند و یا رنگ های خارجی مورد استفاده که بیلت این وجود ندارند یکی از موارد پیشنهادی من این است که یک کلاس برای این موارد بسازید و موارد ان را استاتیک قرار بدهید تا بتوانید به انها جامع و کامل دست رسی داشته باشد به طور مثال نمونه کد و نمونه فولدر دقت کنید برای مشخص کردن این موارد بهتر از یک حرف برای انها به عنوان امضا استفاده کنید به طور مثال برای کانستنت ها (constant)از حرفk استفاده کنید به عکس توجه کنید فولدر کانستنت در lib یا میتوانید ان را خارج از ان بسازید این هم نمونه کد کلاس کانستنت در اینجا ما از تکرار نوشتن یکسری کانستنت ها جلوگیری کردیم و باعث شد بدانیم که کد های فونت و کانستنت ها کجا قرار دارد و حتی شما میتوانید برای بهتر کردن بیاید و فولدر کانستنت را به فولدرهای زیر مجموعه هر بخش تقسیم کنید و فایل های هر بخش را در فولدر خودش قرار بدهیبد یعنی اگر کانستنت هایی برای ورود و ثبت نام دارید بیایید یه فولدر به نام authConstans در اون بخش باز کنید و کد های ان را انجا قرار دهید این روش که من بیان کردم باعث جدایی مواردی میشود که میتوانند از هم جدا باشند و ضاهر و خوانایی کد بالا برود قدم بعدی ما جدا سازی ویجت های پر تکراری هستند که کد های بسیار زیادی برای ساخت یک دونه از انها می برد و اگر در مکانی بخواهیم از ان ویجت ها تعداد بسیار زیادی بسازیم به شدت میزان خط کد را بالا میبریم و خوانایی ان را پایین ! این موضوع که گفتم خیلی به خوانایی کد و تمیزی کمک میکند برای این موضوع ما برای قسمت های پر تکرار یک کلاس جداگانه میسازیم و کد های ان را در این فایل میسازیم و هرجا که نیاز به ان ویجت داشتیم نام کلاس صدا میزنیم و فقط نمونع سازی میکنیم :)به طور مثال قطعه کد زیر برای فقط برای یه تکست فیلد است که کد های ان را درون یک کلاس گذاشتم و مقادیر که هر دفه قرار به ست کردن ان بود را به سازنده دادم و فقط درجا هایی که میخوام اون کلاس صدا میزنم و مقدار ها ست میشوند دیگر نیاز به نوشتن همه این ها نیست :) عاین هم نوع ساختار بندیش خوب خوب الان وقتشه که بریم سراغ یه بخش دیگه و اونجا رو جدا کنیم تا خوانایی و زیبایی کد رو افزایش بدیم و اونجا جایی جز assets نیست:) فولدر assets جزو یکی از بخش هایی که شامل چیز هایی که دولوپر به برنامه اضافه میکنه و اگر مدیریتش نکنیم عین این میمونه که 1 کیلو عدس بریزیم قاطی نخود ها و لپه و بخواییم بیایم یه پیمونه عدس ورداریم و میبیند که اذیت کنندس و باید بشینید یکی جدا کنید فولدر assetsهم باید بخش بخش کنیم چجوری؟خوب معمولا ما ایکون ها و عکس ها و فونت ها و حتی گاهن فایل های صوتی و تصویری قرار میدم و بخش بندی ما فولدر استس رو به بخش های image و fonts و medias تقسیم میکنیم و فایل های مربوطه رو میزاریم اونجا و حالا فولدر استس ما هم بخش بخش شده به شکل زیر درمیاد خوب دوستان امیدوارم که تا اینجای مقاله براتون خوش ایند بوده باشه و برای اینکه مطالب این بخش زیاده و حوصله شما سر نره بقیه رو میزاریم برای قسمت دوم این مقاله که داخل اون به ساختار lib میپردازیم که یه بحث مفصل داره که بعدا برسیش میکنیم برای اینکه دلگرمی بهم بدین لایک و کامنت فراموش نشه و اگه نظری داشتین میتونید از طریق اینستاگرام بهم بگید و خوش حال میشم که شما موضوع سری بعدی مقاله رو مشخص کنید تا مقاله دیگر به درود

نویگیشن به روش حرفه ای ها در اپ های فلاتری

Abolfazl mashhadi — Fri, 31 Dec 2021 17:35:26 +0330

سلام به همه فلاتری های عزیز امیدوارم که حالتون خوب باشه و گردل هاتون بدون هیچ مشکلی براتون خروجی بگیرنقرار تو این مقاله راجع به یه روش دیگه از نویگیشن صحبت کنیم که خیلی فرق داره با بقیه نویگیشن ها اگه میخوایی بدونی این روش چیه تا آخر این مقاله با دقت بخون که اشتباه نکنی و یادت نره تمرین و استقاده کنینویگیشن ها می توانند به دو صورت انجام شوند ، مسیر های نام گذاری شده (NAMED ROUTES)یا با پوش کردن مسیر ها به صورت مستقیم (pushing Routes explicitly)با نمونه سازی از صفحه قرار است به ان مراجعه کنیم وبا پاس دادن ان به Navigatorپوش کردن این مسیر ها میتواند گیج کننده باشد و اشتراک گذاری اطلاعات بین ها سخت بشود یا منطق ها مانند چک کردن اینکه ایا یوزر احراز هویت شده است یا خیر برای نشان دادن ویو های مختلف با ان میتواند سخت شود ، در این پست ما به ستاپ کردن مسیر (Route) برای فلاتر خواهیم پرداخت که فلاتر چگونه به ما اجازه میدهد که named Routes استفاده کنیم و بتوانیم بین انها اطلاعات جابجا کنیم و این کار ها با یه پارامتر که این قابلیت ها را داراست انجام میدهیم خیلی از نظر استراکچر و معماری به ما کمک میکنددیگه بریم سراغ کد و حرف زدن بسه :)ما 2 ویو خواهیم ساخت تا بتونیم با انها کار کنیم و شما حتی می توانید اان ها را در فایل main دارت خود قرار بدهیداین کدهای ۲ ویو بالا که گفتم بریم برای نوشتن مسیر ها و ادامه کار...متریال اپ برای شما یه پارامتری به نام onGenrateRouteفراهم میکند که جایی است که شما یه فانکش بهش میدهید مقدار بازگشتی از این فانکشن ازنوع Route می باشد و یک routeSetting میگیرد این همان چیزی است که استفاده خواهیم کرد از ان تا کد های ما تمیز بماند و برای این منظور ما یه کلاس به نام Routeخواهیم ساخت و داخل ان یک فانکشن استاتیک میسازیم تا بتوانیم بدون نمونه سازی به این فانکشن دست رسی داشته باشیم و کار های را که در بالا گفتیم در یه فایل جداگانه به نام router میریزیم به عکس نگاه کنید :تنضیمات موجود که شامل اطلاعات مسیر های درخواست شده میشود و ان برای ما 2 کلید فراهم خواهد کرد ، اسم یا nameو ارگومان های ان. ما استفاده خواهیم کرد از این نام ها تا مشخص کنیم کدام ویو به کدام اسم ربط دارد تا انرا برایمان برگرداند , همانطور که میبینید این تنظیمات تو ورودی فانکشن نوشته شده , فانکشن بالا را مطابق کد زیر اپدیت کنیددر این قسمت منظور ما از استفاده از name به همراه مقدار "/" چیست؟ زمانی که اسم ما برابر با این مقدار میشود صفحه اصلی را نشان خواهد داد و زمانی کهfeed/بشود به ما صفحه feed را نشان خواهد داد و برای جلوگیری از هرگونه اشتباه تایپی و باگ بهتر از نام صفحات را در فایل کانستنت خود به روش زیر بنویسید تا همه جا مورد استفاده باشد و بدور از اشتباه باشد و حالا سویچ هایی که نوشته بودیم را طبق کد زیر اپدیت کنید تا بتوانید از اون متغییر ها استفاده کنیمحالا وقت ان است که تو اپ خودمان مشخص کنیم که ان فانکشم کجا هست و باید به کدام پارامتر بدیم این پارامتر در متریال اپ هست که نام فانکشن را به پارامتر onGenratedRoute پاس میدهیم و مشخص میکنیم که صفحه اصلی اپ ما کدام صفحه است و برای این کار به جای ست کردن home در متریال اپ ان را به پروپرتی میدهیم و نام ان initalRouteاست.حالا به یکی دیگه از مهم ترین بخش های این مقاله میرسیمو حالا وقتی است که بین صفحات جابجا بشوید و فقط شما این را به این شکل مینویسیداین شما را به ویو feed میبرد و اگر خواستید که مقادیر یا پارامتر هایی به این ویو هنگام جابجایی پاس بدهید باید یه تغییر ریز بدید تا بتوانید موارد را جابجا کنید به عنوان مثال اینجا کلاس feed یه مقدار استرینگ کوچکی میگیرد به عنوان پارامتر کاسنتراکتور که کد های ما به این شکل در می اید هدف ما این است که یه فلوتینگ اکشن باتن بزاریم تا با ان به این صفحه feed از homeجابجا شویم و یک مقداری را به این صفه منتقل کنیم کلاس feed ما به شکل زیر قرار میگیردفلوتینگ اکشن باتن را را به هوم پیج می افزاییم و و در روی onpressed ما نویگیشن خود را فرا میخوانیم و دیتا را به صورت زیر پاس میدهیم (این داده هر نوعی از دیتا تایپ ها میتوند باشد )حالا به سراغ ان تنضیمات میرویم و باید ضمینه دریافت اطلاعات ارسالی را فراهم کنیم و ان دیتا دریافتی را به کانستراکتور کلاس feed بدهیم و کار را تمام کنیممانند عکس زیر میتوانید دیتا را دریافت کنید یادتون بمونه که همه نوعی ارسال میتونید بکنید فقط کست(cast)ان فراموش نکنیدحالا با زدن اون دکمه اون مقدار به صفحه دیگه سند میشه:)...اگه از این مقالعه خوشتون اومد حتمی لایک کنید و با نظراتتون و با اشتراک گذاری این مقاله بهم دل گرمی بدین تا هرهفته یه دونه مقاله کاربردی براتون بنویسم و یا حتی اگه مقاله خارجی در نظر داشتید برام تو کامنت ها لینکش رو بزارید تا براتون به فارسیش اینجا بزارمتا مقاله ای دیگه خدا نکهدار

اگر برنامه نویسی باید...باشی! ۲

Abolfazl mashhadi — Tue, 24 Aug 2021 22:20:24 +0430

خوب خوب سلام به همه دوستای عزیزم امیدوارم که حالتون مثل همیشه عالی باشه با قسمت دوم این از نوشته اومدم قرار که دوتا دیگه از موارد سمی و افکار غلط رو مورد برسی قرار بدیم و اگر هم قسمت اول ندیدید برید حتما ببینیدش :)شما باید همه چیز را یاد بگیرید و حفظ باشید !این یکی از پر رنگ ترین باور های غلط بین کسانی هست که تازه کار هستند یا تازه شروع کردند وجود داره که باید همه چیز را بلد بشند و از همچی بدونند که به چه شکلی استفاده کنند . شما هیچ وقت نمیتوانید همه چیز را حفظ کنید و اینکار فقط باعث میشه که انگیزه و علاقتون بیاره پایین و مجبورتون کنه که همه چیز رو حفظ کنید و این باعث میشه که شما نتونید کاربرد اون متد یا پراپرتی یا.. درک کنید.شما میتونید با درک کردن بیشتر یاد بگیرید اگر متوجه نشیدید دوست همیشگی ما گوگل و استک اورفلو هستند تا به ما کمک کنند پس نگران این نباشید که مثلا کاربرد یه متد روی یک لیست رو متوجه نشدید و میتونید درباره اون سرچ کنید ویدو ببینید و مساله حل کنید تا راه بیفتید و بیشتر درکش کنید باید بیست و چهاری کد بزنم !و اما این باور غلط باوری که اکثرا همه برنامه نویس ها دارند و باید اصلاحش بکنند این هستش: که باید ۲۴ ساعت کد بزنند و پیشروی داشته باشند,من خودم فلاتر دارم یادمیگیرم و هیچ ادعایی تو حوزه برنامه نویسی ندارم این فکر رو داشتم که خیلی اذیت میکرد , به عنوان کسی که داره یاد میگیره میدونم یادگرفتن و کد زدن چیز های جدید و پیاده سازی ایده ها خیلی لدت بخشه اما هر چیزی یه حدی داره و اگه به قول معروف شورش دربیاد در اومده و باعث ضرر و زیان میشه . حتی خوردن بیش از حد اب هم ضرر داره پس بهتره که در کنار برنامه نویسی از تفریح و بقیه چیز ها دور نشید چون باعث اشباح شد شما از اون موضوع میشه و باعث میشه ازش زده بشید به طور مثال میتونید برنامه ریزی ساده بکنید و تعداد ساعتی که قرار است کد بزنید را مشخص کنید و از تفریح ما بین ان نیز هم غافل نشید در اینده به چندتا روشی که خودم تو برنامه نویسی .برای یادگیری و یا ... پیاده میکنم و خیلی حواب میگیرم براتون خواهم گذاشت خوب تا به اینجا هم ۲ تا دیگه از باور های غلط رو برسی کردیم و امیدوارم که مفید باشه و شما رو از این افکار سمی اگاه کرده باشم و در ادامه هم قسمت های بیشتری خواهم گذاشت و از تجربیات خودم براتون مینویسم چرا که تجربه از توضیح های شفاهی و کتابی ۱۰۰برار بهتر هستش مثل همیشه برای حمایت از من لایک یادتون نره اگه اشتباه های بیشتری میشناسید کامنت کنید تا در سری های بعدی هم بزارم براتون

اگه برنامه نویسی باید...باشی !

Abolfazl mashhadi — Mon, 23 Aug 2021 21:44:19 +0430

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