دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa -جلسه معرفی دوره و پیش نمایشی از پروژه

دسته بندی: طراحی و برنامه نویسی وب
دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa
4.8 از 31 رای
  • تعداد شرکت کننده گان: 263 نفر
  • جلسات منتشر شده: 219 جلسه
  • مدت زمان دوره: 52:13:00
  • قیمت دوره: 150000 تومان
  • وضعیت دوره: تکمیل شده
  • درصد تکمیل شده: 100%
100%
توفیق حمزه‌ ئی
توفیق حمزه‌ ئی

توفیق حمزه‌ ئی

1147

دانشجو دارد

5

دوره دارد

759

جلسه منتشر کرده
دانلود این قسمت (قسمت 1 )
نصب vuex
00:16:00
EventBus
00:05:00
lazy load
00:12:00

باز تولید دوره وبلاگ - ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa

پیشنیاز این دوره اشنایی با لاراول و ویو هستش 

در صورت ارائه نسخه جدید لاراول نسخه پروژه این دوره هم اپدیت میشه

 

این دوره به صورت فولستک تدریس میشه از طراحی قالب الی انتقال بر روی سرور.

قالب با استفاده از vuetify در دوره ایجاد میکنیم که یک ui Library زیبا برای vue.js هست.

همچنین از composition api که یک شکل جدید نوشتن vue در ورژن 3 هست استفاده شده کدای vuejs از ورژن 2(optianal api) به ورژن (composition api) ریفکتور میشه ولی همچنان روش قدیمی قابل استفاده هست.

همچنین برای احراز هویت کاربران از laravel sanctum استفاده شده که به جای توکن از سشن استفاده میکنیم که برای SPAها ایمن‌تر هست.

بخش نظرات به صورت realtime و با استفاده socket.io میسازیم که نیازی به پوشر نداشته باشیم.

همچنین بخش محبوبترین نوشته های سایت از ردیس استفاده میکنیم تا بهینه تر باشه و نیازی به دیتابیس mysql نباشه.

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

همچنین بخش ادمین برای مدیریت بخش های محتلف که از data table مربوط به vuetify استفاده کردیم تا حد ممکن شخصی سازی کرده و همچنین قابلیت مرتب کردن و صفحه بندی با استفاده از لارول رو به data tableمون اضافه میکنیم.

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

بقیه فیچر ها:

  • پروفایل کاربر
  • تایید حساب کاربری
  • tiptap text editor
  • ساخت پیش نویس قبل ایجاد نوشته
  • نظرات تودرتو(مانند reddit)
  • ذخیره و لایک نوشته ها
  • دنبال کردن کاربران(follow)
  • ارسال نوتیفیکشن هنگام لایک شدن یا ارسال یک نظر در نوشته کاربر
  • ارسال ایمیل هنگام لایک شدن یا ارسال یک نظر در نوشته کاربر در صورت فعال بودن فیلدها
  • نمایش جدید ترین نوشته های دوستان
  • جستجو در بین نوشته ها

میتوان اشاره کرد.

همچنین در این دوره به روش های مختلف ریفکتور کردن کد ها هم در قسمت بک اند هم بخش فرانت اند گفته میشه و کدامون رو تا حد ممکن خوانا و بهینه میکنیم :)

تا اکنون 154 دیدگاه ارسال شده است. شما نیز دیدگاه تان را بنویسید. ارسال دیدگاه

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - عماد برزگر
عماد برزگر

سلام میخواستم بدونم ورژن ویو که داخل پروژه استفاده کردید چند هستش چون من ویو 3 رو تازه آموزش دیدم و میخوام با لاراول 8 ببینم چطور میشه استفاده کرد ممنون

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - توفیق حمزه‌ ئی
توفیق حمزه‌ ئی

سلام از ورژن 2 استفاده کردیم و فعلا قابل اپدیت نیست چون ویوتیفای از ورژن 3 پشتیبانی نمیکنه.

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - hasan
hasan

سلام جناب جمزه ایی من تو قسمت 218 فایلهای آخر پروژه رو باز کردم - پروژه فایل ایندکس نداره، فایلها رو در اختیار ما قرار ندادین؟

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - توفیق حمزه‌ ئی
توفیق حمزه‌ ئی

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

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - m
m

من تازه این دوره رو تهیه کردم. در قسمت 3 و 4 برای استفاده از vue به مشکل خوردم. وقتی npm run watch رو میزنم این خطا میاد و اصلا vue اجرا نمیشه > development > cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules /laravel-mix/setup/webpack.config.js "--watch" [webpack-cli] Error: Unknown option '--hide-modules' [webpack-cli] Run 'webpack --help' to see available commands and options

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - توفیق حمزه‌ ئی
توفیق حمزه‌ ئی

احتمالا با دستور npm i کارتون راه بیوفته. ولی اگه از میکس جدید استفاده میکنین تنظیمات لازم خودشم داره که توی کانال تلگرامیمون اموزشش رو قرار دادم.

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - کمیل گازر
کمیل گازر

درباره pwa هم صحبت میکنین تو این آموزش ؟

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - توفیق حمزه‌ ئی
توفیق حمزه‌ ئی

سلام خیر

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - sam
sam

سلام وقتتون بخیر ببخشید بنده در قسمت نصب laravel sanctum اررور 419 دریافت میکنم درحالی که بنده با شما جلو اومدم و کار هایی که گفته شد رو انجام دادم همچنین در قسمت کنسول به 3 اخطار برخورد میکنم Cookie “XSRF-TOKEN” has been rejected for invalid domain Cookie “laravel_session” has been rejected for invalid domain Cookie “Cks1ME79NqlprJsBsnvcLDdPpqPTXhcSuXOxJwLi” has been rejected for invalid domain لطفا راهنمایی بفرمایید

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - توفیق حمزه‌ ئی
توفیق حمزه‌ ئی

سلام دو مورد باید چک بشه ۱- روی localhost تست نکنین. اگه اینجوریه برای لاراول یه دومین مجازی بسازین ۲- اگه فرانت و بک جداس باید تمام مراحلی که توی داکیومنت نوشته طی کنین و کش رو هم پاک کنین.

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - zabih
zabih

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

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - za
za

سوال دیگه اینکه در کل وقتی حذف میشه پست ها خب عکس ها توی حافظه میمونه من اینجا یکم گیج شدم ممکنه کمی توضیح بدین؟ پیشاپیش از لطف شما ممنونم

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - توفیق حمزه‌ ئی
توفیق حمزه‌ ئی

سلام راه کار اصولیش به این صورته که یه جدول مخصوص عکسا یا میدیا بسازین و وقتی عکسی ذخیره شده بگین اولا برای مدل Post هستش و دوما ایدیش مثلا ۲ هست. و وقتی پست حذف شد میتونین توی ایونت post تعریف کنین با عکسای نوشته حذف شده چیکار کنه.

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - za
za

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

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - zabih
zabih

سلام آقای حمزه ئی میخواستم بدونم نمیشد پروژه فرانت و بک رو جدا از هم میساختیم و تو یه پروژه نبود؟

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - توفیق حمزه‌ ئی
توفیق حمزه‌ ئی

سلام میتونستیم ولی این پروژه رو به صورت fullstack بردیم جلو و از مزیت هاش استفاده کردیم.

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - علی رضوی
علی رضوی

سلام در این پروژه از laravel spatie استفاده شده ؟

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - توفیق حمزه‌ ئی
توفیق حمزه‌ ئی

سلام اگه منظورتون spatie-permissions هست، خیر استفاده نشده.

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - alireza
alireza

سلام ببخشید یه سوال داشتم من هر کاری می کنم این vuetify راستچین نمیشه با rtl: true ولی توی سورسی که دادید rtl میشه. میشه منو راهنمایی کنید من با لاراول 8 و "vue": "^2.5.17" کار می کنم و دقیقا هم مثل شما رفتم ولی نمیدونم چرا اینطوری میشه. ممنون میشم منو راهنمایی کنید.

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - توفیق حمزه‌ ئی
توفیق حمزه‌ ئی

سلام اول از همه مطمئن بشید فایلا رو کامپایل کردید. اگه کامپایل شدند کش براوزر رو پاک کنید و در نهایت اگه هیچ کدوم اینا جواب نداد توی یک ریپازیتوری گیتهاب پروژتون رو اپلود کنید که من نگاه کنم.

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - sam
sam

سلام استاد وقت بخیر ببخشید بنده فونت رو به پروژه اضافه کردم اما متاسفانه اعمال نمیشه هیچ ارروری هم از npm دریافت نکردم امکانش هست راهنمایی بفرمایید؟!

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - توفیق حمزه‌ ئی
توفیق حمزه‌ ئی

با اقای نیکو Nikoo_Mohammad@ در تلگرام در ارتباط باشیدتا به من وصلتون کنن ببینم مشکلتون چیه

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - حمیدرضا خسروی
حمیدرضا خسروی

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

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - توفیق حمزه‌ ئی
توفیق حمزه‌ ئی

سلام قالب داخل خود پروژه هست و ما هرچی که نیاز داشتیم رو از اول ساختیم و از قالب اماده استفاده نشده.

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - Ali.k
Ali.k

اتصال به درگاه بانگ توضیح داده میشه به صورت عملی

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - توفیق حمزه‌ ئی
توفیق حمزه‌ ئی

دوره وبلاگ هست برای همین درگاه بانکی نداریم. میتونین دوره فروشگاه فایل رو چک کنین.

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - ممد
ممد

سلام آقای حمزه ئی عزیز خوب هستید؟ من 3 ماهه 4 ماهه لاراول رو شروع کردم و تا حدود زیادی باهاش کار کردم و اینکه این دوره مناسب من هس ک میخوام خیلی پیشرفته با لاراول کد بزنم ؟ ممنون میشم توضیح مختصری بدین ممنون

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - توفیق حمزه‌ ئی
توفیق حمزه‌ ئی

سلام دوست عزیز، اولا شما پیش نیاز این دوره رو یعنی لاراول و ویوجی اس رو باید رعایت کنین برای vue.js دوره خود من فصل اولش رایگان هست که تا حدود زیادی پیش نیاز رو پوشش میده هر چند composition api در ورژن 3 ویو تغییراتی داشته که اونا در دوره ویو بررسیش کردیم. اما برای کد نویسی پیشرفته لاراول این رو باید خودتون تصمیم بگیرین چون ما در اینجا از لاراول تقریبا به صورت api استفاده میکنیم و شاید تعریف شما از کدنویسی پیشرفته لاراول فرق کنه ولی به نظر خودم حل کردن مسایل مختلف در لاراول مهم تر از کدنوشتن پیشرفته هست. چرا؟ چون وقتی خیلی از مسائل رو حل کنین طبیعتا کم کم کدنویسی پیشرفته رو در این میان یاد میگیرید.

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - امیر حددری
امیر حددری

سلام وقت به خیر یه سوال داشتم شما در controller برای لایک پست از sync استفاده کردید و برای فالو کردن از toggle می خواستنم بپرسم چون فالو کردن فقط داره روی مدل یوزر اعمال میشه از toogle استفاده کردید یا در لایک کردن هم میشه از toggle استفاده کرد ؟ ممنون

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - توفیق حمزه‌ ئی
توفیق حمزه‌ ئی

سلام نحوه کار این دو متود فرق میکنه برای sync وقتی بهش یک لیست از id بهش بدین برای رابطه بین این دو مدل فقط اونا رو نگه میداره هرچی بین اونا نباشه حذف میشه و فقط این ایدی ها باقی میمونن البته این رفتار پیش فرض این متد هستش. و نحوه کار toggle اینه که لیست ایدی هایی که بهش پاس داده شده اگه توی رابطه نباشه، به دیتابیس اضافه میکنه و اگه توی رابطه باشه از دیتابیس حذف میکنه. toggle برای جایی به درد میخوره که برای اضافه یا حذف فقط یک api درست کنیم.

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - علیرضا
علیرضا

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

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - توفیق حمزه‌ ئی
توفیق حمزه‌ ئی

اگه این دوره ها کمترین کمک رو هم بهتون کرده باشن باز هم خیلی خوشحال میشم و بازم سعی میکنم کیفیت دوره‌ها رو بالاتر ببرم D:

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - امیر حددری
امیر حددری

سلام وقت به خیر من تنظیمات laravel-echo رو مطابق آموزش انجام دادم و سرورم میتونه event ها رو listen کنه ولی تو فرانت callback متد listen اصلا اجرا نمیشه و حتی یه رشته رو هم console نمی کنه توی تلسکوپ هم همه چی اوکیه و هم event و هم redis با موفقیت اجرا میشند ممنون میشم کمکم کنید

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - توفیق حمزه‌ ئی
توفیق حمزه‌ ئی

سلام دوست عزیز خیلی خوب شد این کامنت رو گذاشتین چون بقیه هم میتونن متوجه بشن چرا این کار نمیکنه. در حال حاضر laravel/echo با ورژن جدید socket.io-client یعنی ورژن 3 سازگار نیست اگه به فایل package.json پروژه من هم نگاه بندازین میبینین ورژنش برابره با 2 هست در حال حاظر باید داونگرید کنین به یه ورژن پایین تر و همچنین به این لینک هم نیم نگاهی داشته باشین https://github.com/laravel/echo/issues/290 که اگه این مشکل برطرف شد میتونین با خیال راحت از جدیدترین نسخه هم استفاده کنین.

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - امیر حددری
امیر حددری

سلام تو قسمت 80 موقع ریفکتورینگ به ویو3 تو کامپوننت tiptapEditor کامپوننت drop-zone-modal رو ایمپورت شده بهش یه ref دادید تا بتونید متد های داخلش رو کال کنید سوال من اینه چرا ref ، dropzone رو به عنوان reactive دیتا تعریف کردید ؟ من خودم از به setup پارامتر refs رو پاس دادم و refs.dropzone.showModal(imageCommand) ولی undefined می گیرم ولی با روش شما درسته

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - توفیق حمزه‌ ئی
توفیق حمزه‌ ئی

سلام تنها این روشی که نوشتم در vue 3 وجود خواهد داشت کمی فرق میکنه با نحوه استفاده از ref در ورژن قبلی برای همین اگه refs رو از setupContext دریافت کردم بدونین برای اشنایی بهتر شما بوده و در نظر بگیرین همچنین روشی در vue 3 در بخش composition api وجود نخواهد داشت.

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - امیر حددری
امیر حددری

سلام وقت به خیر می خواستم بپرسم تفاوت this.$store و این که store رو ایمپورت کنیم و بعد استفاده کنیم در چیه ؟

دوره ساخت وب سایت مشابه Virgool.io با Vue.js و Laravel به صورت spa - توفیق حمزه‌ ئی
توفیق حمزه‌ ئی

سلام. فرق خاصی وجود نداره با this.$store میتونین مستقیم از vue با vuex ارتباط برقرار کنین اما این ماله Option api هست توی composition api باید از طریق context با store ارتباط برقرار کرد که توی ویدیو ها هم هردو رو پوشش دادم. اما حتی توی ورژن های قبلی هم میشد که vuex رو ایمپورت کرد و توی جایی که لازم داریم با vuex خیلی راحت میتونیم ارتباط داشته باشیم

سون لرن

سون لرن,چت مشهد,مشتی چت,شرق چت

سون لرن آموزش برنامه نویسی

سون لرن,دوره php,دوره ری اکت جی اس,دوره پروژه محور ری اکت

سون لرن,وب اموز,دوره php,دوره ری اکت جی اس,دوره پروژه php

کلمات سایتی : دیجی کالا , فرادرس , فرانش , تاپ لرن , ویرگول , کوئرا , کلیک سایت , سون لرن , ایران سرور