Salar Sadeghi
Salar Sadeghi
خواندن ۵ دقیقه·۳ سال پیش

ایجاد سیستم فرم ساز؛ از 0 تا 91% در لاراول - قسمت اول

سلام مجدد

این سومین پست و دومین آموزش من در ویرگوله و میخوام 0 تا 91% ساخت یه فرم ساز در لاراول رو به اصولی ترین روش ممکن بهتون آمیزش بدم :) (این آموزش مرتبط با آموزش قبلی منه) البته با این آموزش میتونید تو دیگر زبان ها و فریمورک ها و ... هم به ساخت و ساز بپردازید و دشواری نخواهید داشت.

حالا چرا 91؛ چرا 100 نه؟ چون 9 درصد باقی مانده مربوط به ساخت فرانت کاربر و ادمین پروژه است و از شما چه پنهون حوصله کار با جی اس و سی اس اس و اچ تی ام ال رو زیاد ندارم و درست هم نیست همه چیز رو بگم! ماهی گیری رو یادتون میدم ماهی بگیرید دیگه!


طراحی دیتابیس؛ سر آغاز خلقت

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

- جداول

ما 4 جدول خواهیم داشت

?جدول نخست : forms - همانطور که از اسمش مشخصه فرم های ما رو نگه خواهد داشت

--- ساختار:

  • id
  • title - عنوان فرم (varchar)
  • is_active - فعال / غیرفعال بودن فرم (boolean)
  • is_trash - وضعیت سطل آشغال برای فرم (boolean)
  • created_at - زمان ایجاد (timestamp)
  • updated_at - زمان بروزرسانی (timestamp)


?جدول دوم: forms_meta - همانطور که از اسمش مشخصه اطلاعات جانبی فرم های ما رو نگه خواهد داشت

--- ساختار:

  • form_id - ای دی فرم (int)
  • display - فیلد ها و خصیصه های فرم (json)
  • confirmations - پیام یا اکشنی که بعد از ارسال فرم روی خواهد داد (json)
  • notifications - اعلان هایی که فرستاده خواهد شد (json)


?جدول سوم: forms_entry - همانطور که از اسمش مشخصه ورودی فرم های ما رو نگه خواهد داشت

در این جدول، میتونید فیلد های مخصوص به خودتون رو اعم از فیلد های مخصوص پرداخت و ای دی ابجکت های دیگه و ... رو اضافه کنید؛ اینجا توسعه دست خودتون هست که چی لازم دارید من خیلی ساده این بخش رو میرم جلو تا آموزش دچار پیچیدگی نشه.
  • id
  • form_id
  • is_read - برای اینکه ورودی خوانده شده یا نه (boolean)
  • ip - ای پی کاربر
  • source_url - ادرس صفحه ای که فرم سابمیت شده
  • user_agent - یوزر ایجینت
  • created_by - ایجاد شده توسط ؟ میتونه ای دی کاربر لاگین کرده باشه
  • status - وضعیت
  • created_at
  • updated_at


?جدول چهارم: forms_entry_meta - مقادیر ورودی های فرم های ما رو نگه خواهد داشت

  • form_id
  • entry_id - ای دی ورودی
  • meta_key - کلید فیلد ورودی (varchar)
  • meta_value - مقادیر فیلد ورودی (longtext)


توضیحات دیتابیسی

خب جدول هامون رو ساختیم؛ شما هم بسازید تا بریم سمت معرفی چندی از مقادیر

در جدول forms_meta ما یک ستون داشتیم با اسم display میخوام این ستون و چیزایی که توش قراره وارد بشن رو بهتون توضیح بدم مهمترین ستون هم همین ستونه

یه نمای کلی از مقادیر ستون
یه نمای کلی از مقادیر ستون


title : عنوان فرانتی فرم ما خواهد بود

description : توضیحات فرانتی فرم ما خواهد بود

button : دکمه ثبت فرم ماست که فقط متن دکمه رو نگه میداره شما میتونید خصیصه های دیگه بهش بدید مثل کلاس یا اتریبیوت های خاص

id : ای دی فرم

fields : یه آرایه از فیلد های ما رو در خودش داره

ما تو این مثال 9 تا تایپ تو ارایه fields داریم که 4 تاش فیلد نیست و به نوعی کاستوم ویو خواهند بود بنا به تایپی که دارن و بقیه فیلد خواهند بود با انواع متفاوت مثل اینپوت ها / سلکت باکس ها / فیلد های خاص سفارشی.

اینجا به طور مثال؛ ما یک ابجکت داریم که توش چندین خصیصه وجود داره

نخست type که مشخص میکنه فیلد ما تایپش چیه اینجا input قرار دادیم

دوم id که میره میشینه رو ورودی های فرم ما و name ما سمت html خواهد بود (باید یونیک باشه تو لیست خودش)

سوم label که لیبل فیلد خواهد بود

چهارم validation که وظیفه ولیدیت فیلد ها رو بر عهده داره (ولیدیشن های لاراول رو بهش میدیم)

پنجم errorMessage که پیام خطای فیلد ما رو نگه میداره

ششم formId که ای دی فرم رو نگه میداره

هفتم description که توضیحات اضافی فیلد رو نگه میداره

هشتم inputType که نوع اینپوت رو مشخص میکنه مثلا text / number

نهم cssClass که به فیلد یا به مادر فیلد کلاس سی اس اس اضافه میکنه

دهم noDuplicates که مشخص میکنه آیا ورودی این فیلد باید یونیک باشه یا نه

یازدهم defaultValue که میتونید مقدار از پیش تعین شده رو بدید

دوازدهم choices که تو تایپ select به کارمون میاد برای ایجاد option

که اینجا میتونید اون choices ها رو ببینید؛ مابقی خصیصه ها مشابه فیلد قبلیه

اینجا هم یه فیلد سفارشی هستش که قراره توش چیزای باحال بزاریم تا انتخاب کنن

ستون confirmations

یه جیسون که توش کانفیرمیشن های فرم قرار میگیره این بخش تو منیجمنت و ساخت پنل ادمین فرم ساز بدرد میخوره

id : یه ای دی یونیک

name : عنوان کانفیرمیشن

isDefault: دیفالت / غیر دیفالت بودن اگر تعیین نکرده باشن چیزی

type : نوع پاسخ که میتونه انواع مدل باشه اینجا من 2 مدل رو قرار دادم

message : پیغام نمایشی بعد از سابمیت

url: ادرس انتقال بعد از سابمیت موفقیت امیز فرم اگر تایپ ریدایرگت بود

ستون notifications

یه جیسون که توش نوتیفیکیشن های فرم قرار میگیره این بخش تو منیجمنت و ساخت پنل ادمین فرم ساز بدرد میخوره که کاربر ادمین انتخاب کنه به چه کسانی چه چیز هایی در چه ایونتی (مثلا بعد از ثبت فرم) اعلان بره به صورت ایمیلی / پیامکی یا دیگر روش ها.

خصیصه isActive مشخص میکنه که این اعلان فعاله یا نه

خصیصه to میگه به چه کسانی فرستاده بشه که اینجا متغیر گذاشتیم و قراره به ایمیل ادمین بره

خصیصه name که عنوان ناتیفیکیشن سمت مدیریته

خصیصه event که میتونید ایونت های خودتون رو داشته باشید اینجا ایونت form_submission هست که اشاره میکنه به بعد از ثبت فرم.

خصیصه toType که نوع ارسال رو مشخص میکنه که به ایمیل باشه یا چیزای دیگه که میتونید تعریف کنید و توسعه بدید

خصیصه subject که عنوان اینجا ایمیل ارسالیه

خصیصه message که چه پیغامی ارسال بشه اینجا متغییر همه فیلد ها رو گذاشتیم که همه فیلد ها حالا تو یه قالب از پیش تعین شده ارسال بشه

خب تا اینجا رو داشته باشید؛ در قسمت دوم میریم برای توسعه اپ




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