دوره جامع و پیشرفته جاوااسکریپت

آموزش پیشرفته جاوااسکریپت در قالب 5 پروژه تدریس شده است. این دوره در بهار 1402 به صورت کامل مجددا ضبط شد.

۳۴:۰۷:۰۰
۱۸۷ جلسه
۲۶۷۷ دانشجو
۵  از  ۱۹  رای
روش دریافت: اسپات پلیر
تاریخ انتشار :۱۴۰۲/۲/۱
آخرین بروزرسانی:۱۴۰۳/۸/۳۰
پشتیبانی: دائمی تلگرام

توضیحات دوره

آموزش پیشرفته جاوااسکریپت در قالب 5 پروژه تدریس شده است. این دوره در بهار 1402 به صورت کامل مجددا ضبط شد.

جاوااسکریپت دیگه چیه ؟

آمارهای گیت هاب و سایت stack overflow نشان میده که بازارکار جاوااسکریپت چه در ایران و چه در خارج از کشور رشد چشم گیری در این چند سال اخیر داشته. تا جایی که در سال 2019، جاوااسکریپت به عنوان محبوب ترین زبان برنامه نویسی شناخته شد. یکی از دلایل محبوب زبان برنامه نویسی جاوااسکریپت، آپدیت های زبان جاوااسکریپت هست که جذابیت این زبان را بیشتر کرده است

چرا باید جاوااسکریپت رو فرا بگیریم ؟

شما تنها با فرا گرفتن جاوااسکریپت، میتوانید برنامه هایی را برای پلتفرم های مختلف توسعه دهید. به عنوان مثال با ریکت (react.js)، vue.js و انگولار (angular) میتوان فرانت سایت را توسعه داد. به کمک nodejs، denojs و express میتوان بک اند سایت و با استفاده از React Native اپلیکیشن های مختص اندروید و ios را توسعه داد.

خب وقتی فریمورک هست، چرا جاوااسکریپت لازمه ؟

وقتی میگن از فریمورک ها و کتابخانه های جاوااسکریپت استفاده زیادی میشود یعنی اینکه ما یک سری کارهایی را که به سختی با خود جاواسکریپت انجام میدهیم، به کمک این تکنولوژی ها به سادگی قابل پیاده سازی هست. اما نباید فراموش کنیم که برای تسلط کافی روی هر کدام از این فریمورک ها، درک عمیق مفاهیم زبان جاوااسکریپت لازم هست. اگر این زبان را به خوبی یاد بگیریم، سرعت پیشرفت و یادگیری شما، خیلی بیشتر می شود. متاسفانه اکثر افراد تازه کار از این مساله غافل هستند.

چرا دوره جامع و پیشرفته جاوااسکریپت آماده شد ؟

از اوایل اسفند 99 تا اواسط خرداد 1400روی این دوره وقت گذاشتم، چون بعد از کارکردن با بیش از 125 دانش پذیر که با من کوچ خصوصی داشتن، به یک مشکل پی بردم که اکثر این افراد درک درستی از مفاهیم جاوااسکریپتی نداشتن و به همین علت یادگیری ریکت (reactjs)، vuejs و فریمورک های دیگه براشون واقعا دشوار بود. این دوره آماده شد تا شما در یک قدمی بازار کار قرار بگیرید

آیا همین دوره جاوااسکریپت کافی خواهد بود؟

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

برای پشتیبانی چه برنامه ای داری ؟

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

صاحب، میشه بگی ساختار کلی دوره چطوریه ؟

خیلی به این فکر کردم که جاوااسکریپت رو چطور برای شما قابل فهم و کاربردی بگم. بنابراین تصمیم گرفتم دوره رو به دو بخش کلی تقسیم کنم. بخش اول که شامل فصل 1 تا 6 هست. طی این شش فصل، شما به صورت کاملا کاربردی مفاهیم بیسیک زبان برنامه نویسی جاوااسکریپت مثل الگوریتم ها، عملگراها، آرایه و آبجکت و.. رو یاد میگیرید. در پایان هر فصل تمرین هایی رو گذاشتم تا بتونم مهارت حل مساله شما رو تقویت کنم. در بخش دوم، به کمک چیزایی که در بخش اول فرا گرفتیم، پروژه میزنیم. پروژه ها از ساده شروع میشه. اما این پروژه ها واقعی هستند، پس همزمان لازم میشه که مفاهیم DOM را کاربری یاد بگیریم. در ادامه مباحث پیشرفته تر مثل async Js و برنامه نویسی شی گرا گفته میشه، پس ابتدا با مساله های کوچک این مفاهیم رو یاد میگیریم و برای هر کدام پروژه میزنیم. این دوره سه تا وبینار هم داره.

راجب پروژه ها یکم بیشتر توضیح میدی ؟

تمرین ها، چالش ها و پروژه ها با نهایت حساسیت انتخاب شدن تا همه مفاهیم و چالش هایی که در طی دوره داشتیم، مجددا استفاده بشه و مطالب تثبیت بشه. به عنوان مثال، پروژه سبد خرید به کمک برنامه نویسی شی گرا (object oriented programming) پیاده شده است. این دوره فعلا 25 تا تمرین، 4 تا چالش و 5 پروژه واقعی دارد.

سه تا وبینار توی دوره جریانش چیه ؟

بعد از کار کردن با بیش از 125 دانشجو، به این تجربه رسیدم که اگه دانشجو احساس کنه، کسی کنارش هست که کل مسیر رو رفته با اطمینان خاطر بیشتری یاد میگیره، در این مسیر تجربه های خودم رو بهش میگم و نمیذارم مسیر اشتباهی بره و یادگیری براش لذت بخش خواهد شد. این دوره سه تا وبینار یک ساعته داره که در طول دوره برگزار میشه. در این وبینارها مسائل مربوط به فرایند استخدامی، رزومه سازی، نمونه کار و سوالات فنی دانشجویان جواب داده میشه.

وجه تمایز دوره ت چیه ؟

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

بخاطر مبلغ دوره، نمیخواهم در این دوره شرکت نمایم. پیشنهاد شما چیست؟

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

جلسات دوره

۱what is JavaScript ?
۱۱
۲What we need ?
۵
دانلود ویدیو
۳First code in JavaScript
۶
دانلود ویدیو
۴Variable in JavaScript
۱۰
دانلود ویدیو
۵Data types in JavaScript
۵
دانلود ویدیو
۶dynamic typing in JS
۷
دانلود ویدیو
۷const VS. let
۷
دانلود ویدیو
۸Object Data type
۱۴
دانلود ویدیو
۹Array Data type
۱۶
دانلود ویدیو
۱Arithmatic operators
۱۲
دانلود ویدیو
۲Comparison operators
۵
دانلود ویدیو
۳Equality operator
۶
دانلود ویدیو
۴Ternary operator
۶
۵Logical operator - boolean
۱۲
۶Logical operator - boolean
۹
۷Nullish coalescing
۷
۸Swap variable
۳
۹Nums of week in age challenge
۶
۱if - else
۸
دانلود ویدیو
۲switch - case
۹
۳for - loop
۷
۴while - do while
۴
۵for of - for in
۹
۶break - continue
۴
۷What is function?
۱۱
۸return in fuction
۱۶
۹max number challenge
۴
۱۰FizzBuzz challenge
۱۱
۱۱stepWise discount challenge
۱۷
۱Property and methods in object
۱۰
دانلود ویدیو
۲this keyword
۸
۳Factory function
۶
۴Constructor functions
۸
۵Built-in constructor function
۱۱
۶Dynamic nature of objects
۶
۷Primitive vs reference types
۱۱
۱Object Destructuring
۱۸
۲Template literals
۴
۳Array destructuring
۱۲
۴Spread operator
۱۷
۵Rest operator
۱۰
۶Rest operator in function
۱۰
۷Set data structure
۱۳
۸Map data structure
۱۰
۹An example of Map data type
۹
۱۰Array of objects
۸
۱۱Map and Set challenge
۵
۱Function expression and function declaration
۶
۲Arrow function
۷
۳Lexical scope
۲۴
۴Defaut parameter
۷
۵Pass primitive and reference to function
۱۱
۶First-Class function
۷
۷Higher order function - callback function
۱۷
۸Higer order functoin usage
۱۱
۹Call and apply method
۱۷
۱۰Bind method
۱۶
۱۱Closure in JavaScript
۱۸
۱Basic string methods
۱۶
۲split-join-trim methods
۸
۳Search in string challenge
۱۰
۴Check email exist challenge
۸
۵Capitalize first letter of a word challenge
۱۱
۶Capitalize first letter of all words
۱۰
۷padding in string
۱۳
۱Array basic methods
۸
۲slice, splice, concat, reverse, join and at methods
۱۴
۳Foreach methods
۱۱
۴Foreach on Map and Set data
۴
۵Map method
۱۹
۶Filter method
۱۱
۷Reduce method
۱۲
۸Calc average challenge - chain methods
۱۵
۹Find and FindIndex method
۱۵
۱۰Some and every method
۱۸
۱۱Sort method
۱۰
۱Number and Math
۱۹
۲Date and basic methods
۱۳
۳Calc date difference challenge
۹
۴Sort notes based on date challenge
۱۵
۵Local date
۱۱
۶setTimeOute and setInterval
۱۱
۷CountDown timer challenge
۱۲
۱What is DOM?
۱۳
۲Add element to DOM
۱۳
۳Remove and updage element
۸
۴Input and change event
۱۵
۵Search on products challenge
۱۵
۱Counter project section #1
۱۳
۲Counter project section #2
۱۲
۳Modal mini project
۱۰
۱TodoList project intro
۵
۲Add new todo
۱۲
۳Filter todos
۱۰
۴Delete todos
۱۰
۵Check todo
۷
۶Fix application bug
۸
۷Save todos in localtorage
۲۱
۱Why are OOP so important
۱۰
۲Prototype property and __proto
۱۹
۳Add methods on prototype
۹
۴Convert constructor function to Class
۱۰
۵Setter and getter
۱۶
۶Static method and Static property
۲۳
۷Four principle of OOP
۱۶
۸Class inheritance
۱۴
۹Class encapsulation - protected fields
۸
۱۰Private Fields - Private methods
۱۰
۱معرفی پروژه سبد خرید با OOP
۸
۲shopping-cart-required-classes
۱۹
۳shopping-cart-addToCart
۱۳
۴shopping-cart-update-cart-storage
۱۳
۵calculate-cart-total-and-items
۱۰
۶show-save-cart-items
۱۹
۷clear-cart-items-from-DOM
۱۸
۸8-increment-cart-item
۱۰
۹remove-decrement-cart-item
۱۴
۱What is async Js
۱۲
۲Callback in JavaScript
۱۰
۳Callback hell
۸
۴Promise and promise chain
۲۵
۵Async await
۱۱
۶Event loop in JavaScript and node.js
۱۸
۱What is Backe-end API
۱۴
۲How to call back-end API
۶
۳Get and post data using fetch method
۱۲
۴Error handling while using fetch mehtod
۱۴
۵Call API using axios
۱۸
۶Config axios
۲۰
۷Put, patch and delete method
۱۳
۸Set Authorization token in req header
۱۳
۱مرور پروژه سرچ و فیلتر
۲
۲app-html-css-layout
۱۸
۳render-filter-products
۱۶
۴render-filtered-products-to-DOM
۱۷
۱SPA introduction
۱۰
۲define router function
۱۴
۳Navigate function
۱۱
۴creating page content
۷
۵fix page refresh
۱۱
۶sidebar style
۱۲
۷toggle slidebar
۶
۸transform chevron
۶
۱module exports
۱۲
۲module exports 2nd method
۷
۳common Js in Browser
۹
۴ES6 module export
۱۳
۱Note app introduction
۳
۲Note app HTML CSS
۱۰
۳get all notes
۱۱
۴save and delete note
۱۴
۵NoteView Class
۲۲
۶update noteList
۱۹
۷delete note
۱۱
۸stop propagation
۳
۹active note
۱۳
۱۰refactor code : onSelect-onAdd
۱۵
۱۱edit-delete note and review app
۱۲
۱what is babel ?
۱۴
۲adding gitignore and run scripts
۵
۳compile Js with babel
۶
۴adding webpack to application
۰
۵adding webpack.config.js
۸
۶adding babel in webpack
۱۲
۷adding CSS and Style loaders
۹
۸adding webpack devServer
۷
۹minimizing and uglifying Code
۷
۱معرفی پروژه دوره
۷
۲نصب تیلویند به کمک postcss
۸
۳توسعه قسمت فرم دسته بندی
۱۵
۴توسعه قسمت فرم ایجاد محصولات
۶
۵توسعه قسمت لیست محصولات
۸
۶چه کلاس هایی نیاز داریم؟
۸
۷Storage.getAllCategories
۱۵
۸Storage.saveCategory
۸
۹Storage.getAllProducts
۶
۱۰CategoryView.addNewCagegory
۱۲
۱۱setApp - creatCetgoryList methods
۱۶
۱۲ProductView.addNewProduct
۶
۱۳ProductView.searchProducts
۶
۱۴ProductView.sortProducts
۱۰
۱۵toggle category form
۸
۱۶delete product
۱۹
۱What is Environment Variable and its usage
۹
۲Separating Env variable from source code
۷
۳Define node_env variable
۴
۴Environment variable in React.js
۵

سوالات متداول

هیچ پیش نیازی از دانش برنامه نویسی نیازی نیست، فقط آشنایی با html css پیش نیاز این دوره هست.

همه ی دوره های فرانت هوکس آپدیت میشه و آپدیت ها به صورت رایگان به پنل شما اضافه میشه

بله همه ی آموزش ها بر اساس پروژه توضیح داده میشه. سه تا از پروژه ها هم بر اساس OOP تدریس می شود.

بله، پشتیبانی و دسترسی به محتوای دوره هیچ محدودیت زمانی ندارد.

مشکلی که خیلی از برنامه نویسان فرانت اند دارند اینه که از قدرت CSS خبر ندارن و از همون ابتدا سراغ فریمورک های آماده میرن که در دراز مدت بهشون ضربه بزرگی میزنه. طبیعتا یادگیری فریمورک ها خوبه ، اما هیچ وقت فریمورک هایی مثل بوتسترپ (Bootstrap)، تیلویند (TailwindCSS) و چیزای دیگه ما رو از یادگیری مفاهیم اصلی و بشدت کاربردی مثل Flex – Grid – Responsive design بی نیاز نمی کنن. یادگیری اصولی مفاهیم، بین برنامه نویس خوب و بد، تمایز ایجاد میکنه. بنابراین، تمام تمرکز من هم روی تدریس دقیق مفاهیم کاربردی HTML و CSS در طی پیاده کردن پروژه ها بوده.

۱,۸۲۹,۰۰۰
% ۴۰
۱,۰۹۷,۰۰۰
صاحب محمدی

صاحب محمدی

مدرس دوره

داستان برنامه نویس شدن من برمیگرده به سال 93. همون موقع که برای پروژه های دانشگاه (رشته مهندسی نفت) برنامه نویسی میکردم. کم کم با MATLAB آشنا شدم و بعدا وارد حوزه برنامه نویسی وب شدم و الان حدود 7 ساله که شغل تخصصی من برنامه نویسی وب هست. علاقه من جاوااسکریپت و خاندانش است. به همین دلیل فرانت هوکس رو بنا کردم تا تجربه چند ساله رو در قالب دوره های پروژه محور به علاقه مندان این حوزه انتقال بدم ☘️🤍.

میتوانید دیدگاه خود را ثبت کنید