AngularJS یک فریم ورک محصول شرکت Google است که ساخت اپلیکیشن های تک صفحه مانند Gamil را برای ما ممکن می سازد. در حال حاضر سرویس "بام" بانک ملی ایران و چندین سایت پر بازدید ایرانی از این ابزار قدرتمند برای سرویس دهی به کاربرانشان استفاده می کنند و این موضوع قدرت و ضریب نفوذ AngularJS را نشان می دهد چرا که AngularJS تجربه بسیاری دلچسبی را برای کاربران نهایی به ارمغان می آورد. در این فرادرس از ساختار فریم ورک تا دیباگ کردن با استفاده از Dump به صورت کامل آموزش داده می شود.
آموزش مقدماتی AngularJS برای ساخت اپلیکیشن های تک صفحه ای
توضیحات تکمیلی
در گذشته برنامه نویسی سمت کاربر با استفاده از جاوا اسکریپت بسیار ساده و کم دردسر بود، تا اینکه اپلیکیشن های تحت وب پا به عرصه اینترنت گذاشتند و هر روز بزرگ تر شدند. آن زمان بود که نیاز به ابزارهای قدرتمند برای پاسخ گویی به کارهای پیچیده هر اپلیکیشن حس شد. AngularJS هم یکی از این ابزارها است که این اجازه را به ما می دهد که با استفاده از استایل برنامه نویسی MVC به تولید اپلیکشن های تک صفحه بپردازیم که بدون نیاز به بارگذاری مجدد صفحات وب، محتوای مورد نظر را به سرعت به ما نمایش دهد.
AngularJS یک فریم ورک محصول شرکت Google است که ساخت اپلیکیشن های تک صفحه مانند Gmail را برای ما ممکن می سازد. در حال حاضر سرویس "بام" بانک ملی ایران و چندین سایت پر بازدید ایرانی از این ابزار قدرتمند برای سرویس دهی به کاربرانشان استفاده می کنند و این موضوع قدرت و ضریب نفوذ AngularJS را نشان می دهد چرا که AngularJS تجربه بسیار دلچسبی را برای کاربران نهایی به ارمغان می آورد.
فهرست سرفصل ها و رئوس مطالب مطرح شده در این مجموعه آموزشی، در ادامه آمده است:
- درس یکم: مقدمه ای بر AngularJS
- ساختار AngularJS
- ساخت دموی سلام دنیا در AngularJS
- معرفی اپلیکیشن EventReg در AngularJS
- نسخه های AngularJS و ابزارهای مورد نیاز
- AngularJS Seed
- درس دوم: Controller و Markup
- ساخت دمو برای Controllers
- ساخت دمو برای نمایش اطلاعات تکرار شونده
- ساخت دمو برای رسیدگی به Event ها
- Directives های داخلی
- Event Directives ها
- Directives های دیگر بخش 1
- Directives های دیگر بخش 2
- محدودیت های IE
- اصطلاحات
- فیلترها
- فیلترهای داخلی
- نوشتن فیلترهای سفارشی
- اتصال دو طرفه
- ساخت دمو برای اتصال دو طرفه
- اعتبار سنجی
- درس سوم: ساخت و استفاده از سرویس ها
- مقدمه ای بر سرویس ها
- ساخت اولین سرویس سفارشی شما
- مثالی دیگر از یک سرویس سفارشی
- مقدمه ای بر سرویس های داخلی AngularJS
- دموی استفاده از سرویس های $http و $q به صورت همزمان
- دموی استفاده از سرویس های $resource و $q به صورت همزمان
- دموی استفاده از سرویس
- $anchorScroll
- $cacheFactory
- $compile
- $parse
- $locale
- $timeout
- $exceptionHandler
- $filter
- $cookieStore
- مروری بر سرویس های کم اهمیت تر
- درس چهارم: مسیر یابی
- مقدمه ای بر مسیر یابی
- وب سایت های قدیمی
- اپلیکیشن های تک صفحه ای
- دموی اضافه کردن اولین مسیریاب
- دموی مسیر یابی بیشتر و تاریخچه مرورگر
- دموی ساخت مسیر پیش فرض
- دموی دسترسی به پارامترها از طریق مسیریاب
- دموی استفاده از سرویس $route
- دموی فعال سازی مسیریابی HTML5
- دموی قالب و حل و فصل خواص
- دموی استفاده از سرویس $location
- درس پنجم: ساخت Directive های سفارشی
- مقدمه ای بر Directive ها
- ساخت اولین Directive
- حوزه زبان خاص با عناصر سفارشی
- بررسی Scope Binding های ایزوله
- ایزوله کردن Scope Directive
- رسیدگی به Event ها با استفاده از Directive ها
- مشاهده و پاسخ به تغییرات
- استفاده از Controller ها داخل Directive ها
- اشتراک گذاری کنترلر های Directive با Require
- اولویت بندی Directive ها و استفاده از ترمینال
- استفاده از Require در Directive های تو در تو
- درک Transclusion
- استفاده از Compile برای تغییر DOM
- صریح تر کردن jQuery با استفاده از Directive ها
- درس ششم: Testing
- مقدمه ای بر Jasmin
- مقدمه ای بر Karma
- استفاده از Karma
- تعریف منطق داده های فیلم ها
- استفاده از تابع Module
- استفاده از تابع Inject
- ساخت ماژول MODB و Refactor کردن آن
- دیباگ کردن با استفاده از Dump
آنچه در این آموزش خواهید دید:
نرم افزارهای مرتبط با آموزش
پیش نمایش‌ها
۱.
مقدمه ای بر AngularJS
توجه: اگر به خاطر سرعت اینترنت، کیفیت نمایش پایین‌تر از کیفیت HD ویدئو اصلی باشد؛ می‌توانید ویدئو را دانلود و مشاهده کنید (دانلود پیش‌نمایش - حجم: ۴۳ مگابایت -- (کلیک کنید +))
۲.
Controller و Markup
توجه: اگر به خاطر سرعت اینترنت، کیفیت نمایش پایین‌تر از کیفیت HD ویدئو اصلی باشد؛ می‌توانید ویدئو را دانلود و مشاهده کنید (دانلود پیش‌نمایش - حجم: ۲۱ مگابایت -- (کلیک کنید +))
۳.
ساخت و استفاده از سرویس ها
توجه: اگر به خاطر سرعت اینترنت، کیفیت نمایش پایین‌تر از کیفیت HD ویدئو اصلی باشد؛ می‌توانید ویدئو را دانلود و مشاهده کنید (دانلود پیش‌نمایش - حجم: ۳۱ مگابایت -- (کلیک کنید +))
۴.
مسیر یابی
مشاهده این پیش‌نمایش، نیازمند عضویت و ورود به سایت
(+) است.
۵.
ساخت Directive های سفارشی
مشاهده این پیش‌نمایش، نیازمند عضویت و ورود به سایت
(+) است.
۶.
Testing
مشاهده این پیش‌نمایش، نیازمند عضویت و ورود به سایت
(+) است.
راهنمای سفارش آموزشها
.svg)
در مورد این آموزش یا نحوه تهیه آن سوالی دارید؟
- با شماره تلفن واحد مخاطبین ۵۷۹۱۶۰۰۰ (پیش شماره ۰۲۱) تماس بگیرید. - تمام ساعات اداری
- با ما مکاتبه ایمیلی داشته باشید (این لینک). - میانگین زمان پاسخ دهی: ۳۰ دقیقه
اطلاعات تکمیلی
| نام آموزش | آموزش مقدماتی AngularJS برای ساخت اپلیکیشن های تک صفحه ای |
|---|---|
| ناشر | فرادرس |
| شناسه اثر | ۸–۱۲۴۵۲–۰۵۶۴۵۷ (ثبت شده در مرکز رسانه‌های دیجیتال وزارت ارشاد) |
| کد آموزش | FVWB9502 |
| مدت زمان | ۶ ساعت و ۲۲ دقیقه |
| زبان | فارسی |
| نوع آموزش | آموزش ویدئویی (لینک دانلود) |
| حجم دانلود | ۷۴۳ مگابایت (کیفیت ویدئو HD با فشرده سازی انحصاری فرادرس) |
نظرات
احمد خانزاده
ضمن عرض سلام و خسته نباشید خدمت مجموعه ی فرادرس و همه ی دوستان
من این آموزش رو دیدم و یه سری نکات رو به نظرم رسید که به کل داستان اضافه کنم
اول باید بگم کیفیت تدریس مدرس خوبه ولی یه مشکل هست اونم اینه که اگه قبل از این طراحی فرانت وب سایت ( با استفاده از html وcss تو یه پروژه ی واقعی با کد ادیتور های حرفه ای ) رو انجام نداده باشین تقریبا امکان نداره که چیزی از انگیولار بفهمین
با وجودی که انگیولار داره از جاوااسکریپت استفاده می کنه اگه فقط به مباحث پایه ی جاوااسکریپت تسلط داشته باشید براتون کافیه ( مباحث مربوط به خود کار با انگیولار هستش)
حالا این بالایی هایی که گفتم راهنمایی بود برای دوستانی که می خوان تازه این آموزش رو شروع کنن
ولی
ایرادی که به نظر من وجود داشت دو تا مسئله بود
۱)مدرس در ابتدا داشت پروژه ای که در نهایت قراره زده بشه رو نشون می داد که این کار خوبی بود ولی باید بیشتر به این که این پروژه قراره که چه کاری انجام بده صحبت می کرد( مثلا می گفت که می خواد هر کدوم از ایونت ها هم قابلیت بررسی بر اساس میزان سختی داشته باشن هم یک فکری برای طبقه بندی اونا توسط مخاطب در نظر بگیریم و هم این که یک قابلیت امتیاز دهی توسط کاربر می خوایم بزنیم. بخش ورود اطلاعات توسط کاربر می خوایم این شکلی باشه و ..... به شکل خلاصه تر بگم بهتر بود که UI/UX رو ابتدا به مخاطب نشون می داد نکته دوم که من حداقل باهاش مشکل زیاد خوردم و برای برطرف کردن اون سرچ زیاد باید می کردم این بود که ایشون چون سیستمش از قبل برای کار با انگیولار آماده شده بود خیلی از نیاز ها رو تو سیستمشون داشتن و ما باید می رفتیم اینا رو نصب می کردیم. تو چند جا هم باید با ترمینال برای دفعه ی اول دستور اجرا شدن یه سری برنامه رو می نوشتیم تا از دفعات بعدی راحت بتونیم کار کنیم. مثلا من اون اول تا با این که چی کار باید کاملا انجام بشه آشنا بشم مجبور بودم بنویسم Online Angular Compiler خب این مشکلش این بود که اون بوت استرپ که داشتیم از اون استفاده می کردیم رو نمی تونست ازمون بگیره( حالا با یه سری cdn می تونستیم یه سری از این کمبود ها رو به کد ها تزریق کنیم ولی یه چیزایی کاملا پیاده نمیشن) اینم به دوستای عزیز بگم که اگه با فریمورک بوت استرپ آشنایی ندارین قبلش برین ویدئو ی اون رو ببینین. انگیولار برای شروع کردن مناسب نیست.
شقایق
نسبتا راضی بودم و یه سری نکته به اون نکاتی که بلد بودم اضافه کرد.
فرناز
تسلط استاد روی مباحث مشخصه، اما این رو درنظر نگرفتن که، منی که دارم این ویدئو رو میبینم، همچین تسلطی ندارم و انگار مدرس از روی بعضی مباحث سریع رد میشه تا زودتر تمام بشه و من دیگه نمیدونم دارن راجع به چی صحبت میکنن و نمیتونم ادامه صحبت هاشون رو درک کنم.
ضمن اینکه از زمان ضبط این آموزش تا الان که بنده اون رو تهیه کردم خود angular تغییرات زیادی داشته ولی آموزش آپدیت نشده و تفاوت ها انقدر زیاد شده که نمیشه از روی آموزش تمرینی انجام داد.
درکل میتونست خیلی بهتر باشه
علیرضا
این آموزش رو تهیه کردم ولی خوب نبود! به چند دلیل، یکی این که مباحث به طور کامل توضیح داده نمی شد و مدرس یک عجله خاصی برای بیان مطالب داره، دوم یکسری از برنامه ها به دلیل آپدیت های انگولار به شیوه ای که مدرس توضیح میده دیگه اجرا نمی شد. سوم اینکه در آموزش های اینچنینی نباید از کد های از پیش تهیه شده استفاده کرد یا اگر هم استفاده میشه باید کامل توضیح داده بشه که این مورد اصلا رعایت نشده بود.
به نظرم این دوره باید یک بازنگری روش انجام بشه.
با تشکر
مهدی
بنده در حال دانلود این مجموعه هستم،به نظرم مفید و خوب است.
محمد
خوب بود و من راضی بودم. ممنون از شما
ولی
آموزش خوبی بود ولی به نظرم جا داشت با سطح بالاتری ارائه بشه تسلط مدرس از 100 نمره میتونم 80 بدم
آرش
از نظر زمانبندی و محتوایی تقریبا میتونم بگم عالی بود
رضا
آموزش مشکلی نداشت فقط صدا یه مقدار مشکل داشت و کیفیت مناسبی نداشت.
پیشنهاد دیگه ایی که دارم اینکه AngularJS به Angular ارتقاء بدید.
مجید
بیان و انتقال مفاهیم خیلی خوب بود.
تنها موردی که وجود داشت تو برخی از آموزش ها یه مقدار کیفیت صدا و تصویر پایین هست این مورد پیگیری کنید
hnaseri
باسلام
آموزش ها واقعاً مفید هستن ولی توی این آموزش و یا آموزش های دیگه شاهد هستیم که از یک ویدیو به ویدیوی بعدی کلی کد اضافه شده توی آموزش که هیچ توضیحی بابتش داده نشده بود و منی که مبتدی هستم از کجا باید این تغییرات رو اضافه کنم ممنون میشم اگر آموزش ها به ترتیب پیش بره نه اینکه هر ویدیو با ویدیوی قبلیش کلی اختلاف داشته باشه
میلاد
باسلام،لطفا آموزش پیشرفته رو هم تدریس و منتشر کنید...واقعا اینگونه آموزشها برای بازار کار مفید میباشند