subscriptionsدوره آموزش فریمورک VueJS 2.0

۰ رای ۰.۰

access_time طول دوره۰ ساعت
event_seat تعداد جلسات۳۴ جلسه
people دانشجویان۱۰۱ نفر
headset_mic پشتیبانی دوره۳ ماه

قیمت : ۱۱۰ هزار تومان

schedule هر هفته 2 جلسه 10 تا 30 دقیقه ای - شروع دوره : 6 فروردین 97
list جلسات description توضیحات دوره speaker_notes دیدگاه ها
list لیست جلسات دوره
  1. آموزش VueJS : جلسه 0 - مقدمه دوره و اشنایی با ویو جی اس play_circle_outlined
  2. آموزش VueJS : جلسه 1 - نصب و راه اندازی محیط توسعه ویو جی اس ‏ play_circle_outlined
  3. آموزش VueJS : جلسه 2 - نصب و نوشتن اولین کد ویو جی اس play_circle_outlined
  4. آموزش VueJS : جلسه 3 - متدها در ویو جی اس play_circle_outlined
  5. آموزش VueJS : جلسه 4 - دیتا بایندینگ در ویو جی اس play_circle_outlined
  6. آموزش VueJS : جلسه 5 - رویدادها در vue play_circle_outlined
  7. آموزش vue JS : جلسه 6 - آشنایی و کار با Event Modifier play_circle_outlined
  8. آموزش vue JS : جلسه 7 - آشنایی و کار با keyboard event ها play_circle_outlined
  9. آموزش vue JS : جلسه 8 - آشنایی با Two way binding در Vue js play_circle_outlined
  10. آموزش vue JS : جلسه 9 - آشنایی و کار با Computed Properties و Watchers play_circle_outlined
  11. آموزش vue JS : جلسه10- داینامیک کردن کلاس ها و استایل ها play_circle_outlined
  12. آموزش vue JS : جلسه 11 - شرط ها در vue play_circle_outlined
  13. آموزش vue JS : جلسه 12 - کار با لیست و حلقه ها در vue play_circle_outlined
  14. آموزش vue JS : جلسه 13 - پروژه ساخت بازی کوپن تخفیف play_circle_outlined
  15. آموزش vue JS : جلسه 14 - آشنای با کامپوننت (component) play_circle_outlined
  16. آموزش vue JS : جلسه 15 - آشنایی و کار با vue cli و refs play_circle_outlined
  17. آموزش vue JS : جلسه 16 - کار با کامپوننت های تو در تو play_circle_outlined
  18. آموزش vue JS : جلسه 17 - آشنایی style در کامپوننت ها play_circle_outlined
  19. آموزش vue JS : جلسه 18 - پروژه TODOS قسمت اول play_circle_outlined
  20. آموزش vue JS : جلسه 19 - پروژه TODOS قسمت دوم play_circle_outlined
  21. آموزش vue JS : جلسه 20 - پروژه TODOS قسمت سوم play_circle_outlined
  22. آموزش vue JS : جلسه 21 - پروژه TODOS قسمت چهارم play_circle_outlined
  23. آموزش vue JS : جلسه 22 - آشنایی و کار با Emit و v-On play_circle_outlined
  24. آموزش vue JS : جلسه 23 - آشنایی و کار با Event Bus و vux play_circle_outlined
  25. آموزش vue JS : جلسه 24 - آشنایی و کار با Slot play_circle_outlined
  26. آموزش vue JS : جلسه 25 - Dynamic Components play_circle_outlined
  27. آموزش vue JS : جلسه 26 - (lifecycle) چرخه حیات Vue play_circle_outlined
  28. آموزش vue JS : جلسه 27 - پروژه وبلاگ قسمت اول play_circle_outlined
  29. آموزش vue JS : جلسه 28 - پروژه وبلاگ قسمت دوم (Axios) play_circle_outlined
  30. آموزش vue JS : جلسه 29 - پروژه وبلاگ قسمت سوم (Custom Directives) play_circle_outlined
  31. آموزش vue JS : جلسه 30 - پروژه وبلاگ قسمت چهارم (Mixin,Basic Routing) play_circle_outlined
  32. آموزش vue JS : جلسه 31 - پروژه وبلاگ قسمت پنجم (Vue Router) play_circle_outlined
  33. آموزش vue JS : جلسه 32 - پروژه وبلاگ قسمت ششم (FireBase) play_circle_outlined
  34. آموزش vue JS : جلسه 33 - پروژه SPA - ( لاراول + vuejs) play_circle_outlined
  35. آموزش vue JS : جلسه 34 - پروژه SPA - ( لاراول + vuejs) play_circle_outlined
  36. آموزش vue JS : جلسه 35 - پروژه SPA - ( لاراول + vuejs) play_circle_outlined

دوره VueJS 2.0

اگر شخصی به زبان برنامه نویسی جاوا اسکریپت مسلط باشد قطعا در بازار کار، مشکل شغلی نخواهد داشت. محبوبیت جاوا اسکریپت باعث شده است تا برنامه نویسان و توسعه دهندگان زیادی در سراسر دنیا نسبت به یادگیری زبان جاوا اسکریپت بپردازند. هر روزه پروژه های مختلفی با استفاده از زبان جاوا اسکریپت در سطح وب اجرا می گردد که نتایج خوبی برای کاربران خواهد داشت. در این میان توسعه دهندگان زبان های برنامه نویسی سعی داشته اند که با استفاده از فریم ورک ها ( فریم ورک vue.js ، angular js ، ReactJs و ...( کار را برای برنامه نویسان و عاشقان یادگیری راحت تر نمایند. برای مثال فریم ورک ویو جی اس (vue.js) یکی از محبوب ترین فریم ورک های تحت زبان برنامه نویسی جاوااسکریپت است. حتما سوال شما نیز الان باید vue.js چیست باشد؛ پس با ادامه متن همراه باشید تا پاسخ سوالات خود را دریافت نمایید. یکی از کاربرد های فریم ورک vue js این است که کاربران قادر خواهند بود کد های خود را راحتر، سریع تر و از همه مهم تر کوتاه تر اجرا نمایند. فریم ورک ها (از جمله فریم ورک ( vue js وظایف کلی و مشخصی دارند. به صورت خلاصه وظایف فریم ورک ها یا اسلوب کاری آن ها را می توان در خلاصه نویسی کد ها ،سریع نویسی کد و به اصطلاح دولوپر فرندلی دانست. در این میان یادگیری تکنولوژی های روز دنیا همواره یکی از دغدغه افراد بوده است. یکی از بهترین روش های آموزشی در دنیا، استفاده از آموزش ویدیویی است. آموزش ویدیویی ویو جی اس را در نظر بگیرید و فرض کنید که آموزش تصویری vue js را در در اختیار شماست. درباره vue js چقدر می دانید؟ آیا آموزش فارسی vue js وجود دارد؟ فیلم آموزش vue js را چطور می توان تهیه نمود. قوی ترین پکیج آموزشی در این حوزه را چگونه می توان تهیه نمود؟ خوشبختانه بهترین آموزش vuejs در حال حاضر توسط گروه سون لرن برای جامعه برنامه نویسان کشورمان تهیه شده است که کاربران می توانند با استفاده از فیلم آموزش vue js ، در این قسمت مهارت خود را قوی نموده و وارد بازار کار شوند. ما در این دوره سعی کردیم بسیار پروژه محور عمل کنیم و بعد از هر چند جلسه یک پروژه با مباحث جلسه های گذشته بنویسیم تا هم شما مباحث را کامل یاد بگیرید و هم اینکه با روش های حل مسئله در پروژه های تمرینی آشنا بشوید وهمچنین در آخر دوره یک پروژه کاربردی با لاراول و ویو جی اس خواهیم داشت که تمامی موارد گفته شده را به صورت حرفه‌ای بیاموزید.

فصل یک: آشنایی با مفاهیم و ساختار

  • معرفی و آشنایی با Vue
  • انتخاب و آماده سازی ویرایشگر متن برای کار با Vue
  • نصب و راه‌ اندازی Vue
  • نحوه کار با Vue Instance
  • نحوه کار باِData و  Methods
  • معرفی و توضیح Data Binding
  • نحوه کار با (رویدادها)Events
  • نحوه کار با Event Modifiers
  • نحوه کار با Keyboard Events
  • معرفی و توضیح Two-Way Data Binding
  • نحوه کار با Watch Properties
  • نحوه کار با Computed Properties
  • اموزش نصب و کار با vue devtools
  • داینامیک کردن کلاس های CSS
  • معرفی و توضیح Directives
  • نحوه کار با شرط ها
  • نحوه کار با حلقه
  • ساخت یک بازی تحت وب با ویو
  • نمونه سازی چند گانه با ویو جی اس
  • شروع کار با کامپوننت ها
  • معرفی Refs
  • نحوه کار با   Vue CLI
  • معرفی ساختار فایل ها در Vue
  • کار با کامپوننت ها تو در تو
  • کار با css در کامپوننت ها
  • یک پروژه برای درک بهتر کامپوننت های تو در تو
  • معرفی و توضیح Props
  • Primitive در مقابل Reference Types
  • کار با ایونت ها (والد و فرزند)
  • ساخت گذرگاهی برای رویداد ها(ٍEvent Bus)
  • چرخه حیات در ویو
  • معرفی Slots
  • کار با کامپوننت های پویا
 

فصل دوم: ساخت یک وبلاگ بلادرنگ(RealTime)

  • ساخت فرم ها  - input binding
  • ساخت فرم ها  - CheckBox Binding
  • ساخت فرم ها  - Select Box Binding
  • نحوه کار با درخواست های Http از نوع post
  • نحوه کار با درخواست های Http از نوع get
  • ساخت دایرکتیو های سفارشی
  • نحوه کار با Filters
  • ساخت یک جستجوگر سفارشی
  • نحوه کار با Mixin
  • معرفی و Vue router
  • توضیح انواع Route
  • نحوه افزودن Router Links
  • نحوه کار با پارامتر های Route
  • نحوه ارسال داده به Firebase
  • نحوه دریافت داده از Firebase
 

فصل سه : پروژه نهایی  استفاده از لارول و Vue

  • موضوع این پروژه را دانشجو های این دوره انتخاب خواهند کرد.
 

فصل آخر

  • کد بزن و شکوفا شو . . .
مجید حاجبی

سلام اقای نجاری .ممنون از اموزش جامعتون
من وقتی از استفاده میکنم این وارنینگ توی کنسولم نمایش میده و کامپوننتم لود نمیشه
([vue-router[ Route with name ‘posts’ does not exist) چه کاری باید انجام بدم؟
ممنون

محمد نجاری

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

مجید زارعی هوشیار

سلام….آقای نجاری خسته نباشید ممنون از آموزش خوبتون…..خیلی جلسه کاربردی بود……واقعا لذت بردم…….خدا خیرتون بده

محمد نجاری

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

با سلام
من دو جلسه مربوط به vue router رو دیدم اما موردی که متوجه نشدم چطور باید هندل کنم مبحث مربوط به ورودی های کامپوننت و emit هایی بود که روی اونها ست کرده بودم کامپوننت های مثالی شما نه ورودی داشت و نه خروجی اما تو این حالت باید چکار کرد ؟
الان من کامپوننت ها رو حذف کردم و بجاش از استفاده کردم ولی کامپوننت ها کاملا از کار افتاد

<preview :post="post"></preview>
<build-post @create-post="addToPosts"></build-post>
Ali Zahedi

من یکسری کامپوننتی دارم که روی اونها props و emit تعریف کردم حالا میخوام روی این کامپوننت ها مسیر دهی داشته باشم توسط vue router چطوری باید اینکارو انجام بدم ؟

محمد نجاری

اصولا مسیرشما باید بخوره به روت پدر و در این صورت مشکلی با emit وprops نخواید. داشت و اگر دیتا خاصی دارید میتونید از طریق params به کامپوننت فوق ارسال کنید.

محمد نجاری

سلام .متاسفانه متوجه نشدم مشکلتون رو لطفا بیشتر توضیح بدید

sepehr

سلام . ممنون از دوره خوبه شما . میخواستم بپرسم بحث authentication و login رو باید چطور پیاده سازی کرد . و اگر ممکنه آموزش بدید .

مجید زارعی هوشیار

سلام….خدمت اقای نجاری عزیز
یه سوالی برام پیش اومده؟….ما اگه بخواهیم در کامپوننت های vue و در قسمت template ها از کد های کد های php استفاده کنیم….ایا شدنی هستش؟
مثلا بخواهیم ویژگی href تگ a رو با استفاده از تابع route مقدار دهی بکنیم….
آیا میشه داخل قسمت template به صورت مستقیم بنویسیم یا که باید این قسمت رو با blade ها هندل کنیم……؟؟؟

محمد نجاری

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

sepehr soltani

سلام ممنون از دوره خوبی که تدارک دیدید.
قسمت بعدی کی آماده میشه ؟

محمد نجاری

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

Ali Zahedi

با سلام
من دو کامپوننت دارم مثلا A > B که A کامپوننت پدر و B کامپوننت پسر هستش حالا از داخل کامپوننت B فرضا یک textbox دارم که کاربر یه موردی رو داخلش تایپ می کنه و مقدار این رو همون لحظه می خوام به کامپوننت A پاس بدم من برای اینکار روی رویداد keydown المنت کامپوننت B یک emit تعریف کردم و داخل کامپوننت A اون رو دریافت می کنم و تاحدودی داره کار میکنه ولی مشکلم اینه که مقداری که در کامپوننت A دارم با کامپوننت B کمی متفاوته و عقب جلو میشه دلیلش چیه ؟ کد من اشتباهه و اینکه باید جور دیگه ای این قضیه رو هندل می کردم ؟
ممنون

Component B:
 <template>
      <div class="form-group">
        <label class="col-md-4 control-label" for=" lastName">محتوای نوشته:</label>
        <div class="col-md-4">
            <textarea rows="8" type="text" v-model="content"
             @keypress="$emit(‘content’,content)"
             placeholder="محتوا را وارد کنید" class="form-control input-md"></textarea>
        </div>
      </div>
</template>

<script>
export default {
  name: "body",
  data() {
    return {
      content: ""
    };
  }
};
</script>

<style>
</style>


Component A:
 <template>
    <div>
        <title-section @blog-title="updateTitle"></title-section>
        <body-section @content="updateContent"></body-section>
        <categories-section @selected-categories="updateSelectedCategories"></categories-section>
        <author-section @selected-author="updateSelectedAuthor"></author-section>
        <div class="form-group">
            <div class="col-md-4">
                <button id="singlebutton" name="singlebutton" class="btn btn-primary">ارسال درخواست</button>
            </div>
        </div>
    </div>
</template>

<script>
import TitleSection from "./sections/title";
import BodySection from "./sections/body";
import CategoriesSection from "./sections/categories";
import AuthorSection from "./sections/author";

export default {
  name: "build-post",
  components: { TitleSection, BodySection, CategoriesSection, AuthorSection },
  data() {
    return {
      selectedCategories: [],
      selectedAuthor: {},
      content: "",
      title: ""
    };
  },
  methods: {
    updateSelectedCategories(categories) {
      this.selectedCategories = categories;
    },
    updateSelectedAuthor(author) {
      this.selectedAuthor = author;
    },
    updateContent(content) {
      this.content = content;
    },
    updateTitle(title) {
      this.title = title;
    }
  }
};
</script>

<style>
</style>
Ali Zahedi

خیلی ممنون بله باید بعد از اتمام این دوره حتما سراغ vuex برم البته این مشکل از vuedevtools بود که دیتاها رو بد نمایش میداد و خروجی نهایی کار اکی بود

محمد نجاری

سلام مشکلات از این دست را نمیشود صرفا با دو سورس کد کامپوننت بررسی کرد و نیاز به دیتای بیشتری هست و زمان زیادی میگیرد. همچنین اگر شما نیاز به $emit های زیادی دارید میتونید از Event Bus استفاده کنید که خیلی کار رو راحت تر و دیباگ رو ساده تر میکنه و اگر خیلی نیاز به $emit پیدا میکنید و یا به صورت تو در تو نیاز از $emit استفاده میکنید . شما میتونید از Vux استفاده کنید که صرفا برای راحتی همین کار است.

Ali Zahedi

با سلام
من پروژه وبلاگ رو تازه شروع کردم ونمیدونم راجع به مبحث فایل ها تا آخر صحبتی شده یا نه ولی اگه نشده ممنون میشم در پروژه spa که تازه استارت زدید راجع به آپلود فایل هم مطالبی گفته بشه ممنون

محمد نجاری

سلام . . .
در ویدیو های پیش رو آپلود فایل هم داریم٫

در ابتدا ویدیو به این اشاره شد که ما سمت لاراول را با ساده ترین حالت پیش خواهیم برد تا عزیزان دچار مشکل نشوند.در مورد تعریف layout فرقی با این حالت ندارد و فقط مثلا منو کناری را از یک سکشن فرخوانی میکنیم و این در اصل ماجرا تغییری ایجاد نخواهد کرد.

خیلی ممنون.
فقط یه خواهشی داشتم..
تو ویدیو اخر شما blade رو تقسیم بندی نکرده بودین.
میخواستم اگر میشه یه توضیح کوتاهی در مورد اینکه اگر بخوایم layout تعریف کنیم یا section بندی کنیم چجوری میشه از کامپوننت های ویو استفاده کرد.
ممنونم.

نیاز به لاگین

برای ارسال دیدگاه و یا پرسیدن سوال خود در این قسمت، باید در سایت لاگین شوید.
1 2 3 7
مدرس و آمار دوره
Course-Teacher
محمد نجاری
کارشناس و فارغ التحصیل مهندسی نرم افزار، برنامه نویس BackEnd سون‌لرن، 5 سال سابقه برنامه‌نویسی فرانت اند و بک اند، مسلط به زبان های Ruby, php, java, javascript ; علاقه مند به Clean Code و مقیاس‌پذیری وب
library_books
۳۶ مقاله تخصصی
school
۱ دوره برگزار شده
۱۱۱ علاقمندfavorite
۱۰۱ دانشجوpeople
۰ رایstar
پیشنیاز های دوره
آشنایی با HTML و CSS و جاوا اسکریپت پیشنیازهای این دوره می باشد.
پشتیبانی فنی دوره
مدرس دوره و تیم پشتیبانی سون لرن به مدت 3 ماه پس از خرید دوره در سامانه پشتیبانی مخصوص دانشجویان (برای دوره های حضوری)، پاسخگوی تمامی سوالات و ابهامات شما در مورد این دوره خواهند بود. همچنین پس از خرید هر کدام از دوره های حضوری و یا مجازی سون لرن، شماره تماس و ایمیل مدرس در اختیار دانشجویان دوره قرار خواهد گرفت تا به سرعت پاسخ سوالات خود را دریافت نمایند.

contact_phone اطلاعات تماس با مدرس :
email mr.n********@*****.***
phone ۰۹۳۶*******
access_time شنبه تا پنجشنبه، ۱۸ الی ۲۳ عصر
info اطلاعات کامل تماس با مدرس، برای دانشجویان دوره در دسترس می باشد.
مشاوره پیش از خرید
در صورتی که در مورد هر کدام از دوره های سون لرن سوال و یا ابهامی در ذهن شما هست، می توانید همین حالا با ما در تماس باشید و از مشاوره رایگان قبل از خرید دوره ها استفاده نمایید.
contact_phone شماره تماس : ۰۲۱۶۶۴۵۲۴۶۹
email ایمیل : support@7Learn.com