آموزش Ionic - ساخت iOS، Android و برنامه های وب با Ionic و Angular

سرفصل ها و درس ها

شروع شدن Getting Started

• معرفی دوره Course Introduction

• یونیک چیست؟ What Is Ionic?

• به انجمن آموزش آنلاین ما بپیوندید Join our Online Learning Community

• نگاهی دقیق تر به پلتفرم Ionic A Closer Look at the Ionic Platform

• Angular چیست؟ What is Angular?

• Node.js دانلود کنید Node.js Download

• اولین برنامه یونی ما! Our First Ionic App!

• تاریخچه یونیک The History of Ionic

• Ionic 4+ در مقابل Ionic 3 Ionic 4+ vs Ionic 3

• چگونه با Ionic برنامه های موبایل بومی بسازیم How to Build Native Mobile Apps with Ionic

• مقایسه Ionic با جایگزین Comparing Ionic to Alternatives

• طرح کلی دوره Course Outline

• چگونه از دوره بیشترین بهره را ببریم How To Get The Most Out Of The Course

• کد منبع دوره The Course Source Code

شروع شدن Getting Started

• معرفی دوره Course Introduction

• یونیک چیست؟ What Is Ionic?

• به انجمن آموزش آنلاین ما بپیوندید Join our Online Learning Community

• نگاهی دقیق تر به پلتفرم Ionic A Closer Look at the Ionic Platform

• Angular چیست؟ What is Angular?

• Node.js دانلود کنید Node.js Download

• اولین برنامه یونی ما! Our First Ionic App!

• تاریخچه یونیک The History of Ionic

• Ionic 4+ در مقابل Ionic 3 Ionic 4+ vs Ionic 3

• چگونه با Ionic برنامه های موبایل بومی بسازیم How to Build Native Mobile Apps with Ionic

• مقایسه Ionic با جایگزین Comparing Ionic to Alternatives

• طرح کلی دوره Course Outline

• چگونه از دوره بیشترین بهره را ببریم How To Get The Most Out Of The Course

• کد منبع دوره The Course Source Code

تجدید کننده زاویه ای Angular Refresher

• معرفی ماژول Module Introduction

• Angular چیست؟ What is Angular?

• Angular SPA و Ionic Angular SPAs & Ionic

• درک مولفه ها Understanding Components

• مهم: ایجاد یک پروژه Angular با CLI Important: Creating an Angular Project with the CLI

• نصب Angular با CLI Installing Angular with the CLI

• نصب IDE Installing the IDE

• آشنایی با ساختار پوشه Understanding the Folder Structure

• مؤلفه برنامه The App Component

• ایجاد اولین مؤلفه ما Creating Our First Component

• ارتباط متقابل کامپوننت با صحافی اموال Cross Component Communication with Property Binding

• درک دستورالعمل ها و درون یابی رشته ای Understanding Directives & String Interpolation

• مدیریت ورودی کاربر Handling User Input

• درک رویداد Binding Understanding Event Binding

• مراجع محلی Local References

• درک دو طرفه اتصال Understanding Two-Way-Binding

• انتقال داده در اطراف با رویدادهای سفارشی Passing Data Around with Custom Events

• پیاده سازی مسیریابی Implementing Routing

• راه اندازی سرویس ها Setting Up Services

• استفاده از خدمات با تزریق وابستگی Using Services with Dependency Injection

• کار با قلاب چرخه حیات زاویه ای Working with Angular Lifecycle Hooks

• افزودن یک شخص با خدمات Adding a Person with Services

• پیمایش بین کامپوننت ها Navigating between Components

• حذف موارد با یک کلیک Removing Items Upon a Click

• "فشار" داده ها به اطراف با موضوع "Push"ing Data Around with Subjects

• اطلاعات بیشتر در مورد RxJS & Observables More on RxJS & Observables

• ارسال درخواست Http Sending Http Requests

• نمایش یک متغیر در حین انتظار برای پاسخ Showing a Placeholder Whilst Waiting for a Response

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

تجدید کننده زاویه ای Angular Refresher

• معرفی ماژول Module Introduction

• Angular چیست؟ What is Angular?

• Angular SPA و Ionic Angular SPAs & Ionic

• درک مولفه ها Understanding Components

• مهم: ایجاد یک پروژه Angular با CLI Important: Creating an Angular Project with the CLI

• نصب Angular با CLI Installing Angular with the CLI

• نصب IDE Installing the IDE

• آشنایی با ساختار پوشه Understanding the Folder Structure

• مؤلفه برنامه The App Component

• ایجاد اولین مؤلفه ما Creating Our First Component

• ارتباط متقابل کامپوننت با صحافی اموال Cross Component Communication with Property Binding

• درک دستورالعمل ها و درون یابی رشته ای Understanding Directives & String Interpolation

• مدیریت ورودی کاربر Handling User Input

• درک رویداد Binding Understanding Event Binding

• مراجع محلی Local References

• درک دو طرفه اتصال Understanding Two-Way-Binding

• انتقال داده در اطراف با رویدادهای سفارشی Passing Data Around with Custom Events

• پیاده سازی مسیریابی Implementing Routing

• راه اندازی سرویس ها Setting Up Services

• استفاده از خدمات با تزریق وابستگی Using Services with Dependency Injection

• کار با قلاب چرخه حیات زاویه ای Working with Angular Lifecycle Hooks

• افزودن یک شخص با خدمات Adding a Person with Services

• پیمایش بین کامپوننت ها Navigating between Components

• حذف موارد با یک کلیک Removing Items Upon a Click

• "فشار" داده ها به اطراف با موضوع "Push"ing Data Around with Subjects

• اطلاعات بیشتر در مورد RxJS & Observables More on RxJS & Observables

• ارسال درخواست Http Sending Http Requests

• نمایش یک متغیر در حین انتظار برای پاسخ Showing a Placeholder Whilst Waiting for a Response

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

مبانی اجزای یونی Ionic Component Basics

• معرفی ماژول Module Introduction

• بلوک های اصلی برنامه سازی Core App Building Blocks

• تحت پوشش اجزای یونی Under the Hood of Ionic Components

• راه اندازی یک پروژه یونی غیر زاویه ای Setting Up a Non-Angular Ionic Project

• کجا همه چیز درباره اجزای یونی بیاموزیم Where to Learn all about Ionic Components

• استفاده از اجزای اصلی یونی Using Basic Ionic Components

• اجزای اصلی بیشتر More Basic Components

• دسته بندی اجزا Component Categories

• با استفاده از شبکه یونی Using the Ionic Grid

• اضافه کردن آیکون ها و استفاده از اسلات ها Adding Icons & Using Slots

• استفاده از CSS Utility Attributes Using CSS Utility Attributes

• استفاده از عناصر یونی مانند عناصر HTML "عادی". Using Ionic Elements like "Normal" HTML Elements

• اعتبار سنجی ورودی کاربر Validating User Input

• ایجاد عناصر یونی به صورت برنامه ای Creating Ionic Elements Programmatically

• اتمام منطق پایه جاوا اسکریپت Finishing Up the Base JavaScript Logic

• نهایی کردن Layout Finalizing the Layout

• از Ionic Import مناسب استفاده کنید Use the right Ionic Import

• استفاده از اجزای کنترلر Using Controller Components

• تمرین اجزای یونی Practicing Ionic Components

• چرا انگولار؟ Why Angular?

• منابع و لینک های مفید Useful Resources & Links

مبانی اجزای یونی Ionic Component Basics

• معرفی ماژول Module Introduction

• بلوک های اصلی برنامه سازی Core App Building Blocks

• تحت پوشش اجزای یونی Under the Hood of Ionic Components

• راه اندازی یک پروژه یونی غیر زاویه ای Setting Up a Non-Angular Ionic Project

• کجا همه چیز درباره اجزای یونی بیاموزیم Where to Learn all about Ionic Components

• استفاده از اجزای اصلی یونی Using Basic Ionic Components

• اجزای اصلی بیشتر More Basic Components

• دسته بندی اجزا Component Categories

• با استفاده از شبکه یونی Using the Ionic Grid

• اضافه کردن آیکون ها و استفاده از اسلات ها Adding Icons & Using Slots

• استفاده از CSS Utility Attributes Using CSS Utility Attributes

• استفاده از عناصر یونی مانند عناصر HTML "عادی". Using Ionic Elements like "Normal" HTML Elements

• اعتبار سنجی ورودی کاربر Validating User Input

• ایجاد عناصر یونی به صورت برنامه ای Creating Ionic Elements Programmatically

• اتمام منطق پایه جاوا اسکریپت Finishing Up the Base JavaScript Logic

• نهایی کردن Layout Finalizing the Layout

• از Ionic Import مناسب استفاده کنید Use the right Ionic Import

• استفاده از اجزای کنترلر Using Controller Components

• تمرین اجزای یونی Practicing Ionic Components

• چرا انگولار؟ Why Angular?

• منابع و لینک های مفید Useful Resources & Links

زاویه ای + یونی Angular + Ionic

• معرفی ماژول Module Introduction

• چرا از Angular استفاده کنیم؟ Why Use Angular?

• مهم: ایجاد یک پروژه جدید با CLI Important: Creating a New Project with the CLI

• ایجاد یک پروژه زاویه ای یونی جدید Creating a New Ionic Angular Project

• مهم: ویژگی های CSS Utility Important: CSS Utility Attributes

• تجزیه و تحلیل پروژه ایجاد شده Analyzing the Created Project

• چگونه Angular و Ionic با هم کار می کنند How Angular & Ionic Work Together

• مهم: ماژول های مسیریابی اضافی Important: Extra Routing Modules

• افزودن و بارگیری یک صفحه جدید Adding & Loading a New Page

• استفاده از ویژگی های زاویه ای در اجزای Ionic Using Angular Features on Ionic Components

• راه اندازی مسیرهای زاویه ای Setting Up Angular Routes

• مدیریت دولت با خدمات Managing State with Services

• استخراج و نمایش داده های پارامتر مسیر Extracting and Displaying Route Param Data

• یک اشکال بالقوه (+ رفع) A Potential Bug (+ Fix)

• پیمایش بین صفحات Navigating Between Pages

• حذف یک دستور غذا Deleting a Recipe

• یک اشکال وجود دارد! There's a Bug!

• کنترل کننده های یونی تزریقی Injecting Ionic Controllers

• کامپوننت های زاویه ای در مقابل اجزای یونی Angular Components vs Ionic Components

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

زاویه ای + یونی Angular + Ionic

• معرفی ماژول Module Introduction

• چرا از Angular استفاده کنیم؟ Why Use Angular?

• مهم: ایجاد یک پروژه جدید با CLI Important: Creating a New Project with the CLI

• ایجاد یک پروژه زاویه ای یونی جدید Creating a New Ionic Angular Project

• مهم: ویژگی های CSS Utility Important: CSS Utility Attributes

• تجزیه و تحلیل پروژه ایجاد شده Analyzing the Created Project

• چگونه Angular و Ionic با هم کار می کنند How Angular & Ionic Work Together

• مهم: ماژول های مسیریابی اضافی Important: Extra Routing Modules

• افزودن و بارگیری یک صفحه جدید Adding & Loading a New Page

• استفاده از ویژگی های زاویه ای در اجزای Ionic Using Angular Features on Ionic Components

• راه اندازی مسیرهای زاویه ای Setting Up Angular Routes

• مدیریت دولت با خدمات Managing State with Services

• استخراج و نمایش داده های پارامتر مسیر Extracting and Displaying Route Param Data

• یک اشکال بالقوه (+ رفع) A Potential Bug (+ Fix)

• پیمایش بین صفحات Navigating Between Pages

• حذف یک دستور غذا Deleting a Recipe

• یک اشکال وجود دارد! There's a Bug!

• کنترل کننده های یونی تزریقی Injecting Ionic Controllers

• کامپوننت های زاویه ای در مقابل اجزای یونی Angular Components vs Ionic Components

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

ساخت برنامه های بومی با خازن Building Native Apps with Capacitor

• معرفی ماژول Module Introduction

• اطلاعات کلی General Information

• ساخت اپلیکیشن اندروید Creating an Android App

• اجرای برنامه بر روی یک دستگاه اندروید واقعی Running the App on a Real Android Device

• ایجاد اپلیکیشن iOS Creating an iOS App

• اجرای برنامه بر روی یک دستگاه iOS واقعی Running the App on a Real iOS Device

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

ساخت برنامه های بومی با خازن Building Native Apps with Capacitor

• معرفی ماژول Module Introduction

• اطلاعات کلی General Information

• ساخت اپلیکیشن اندروید Creating an Android App

• اجرای برنامه بر روی یک دستگاه اندروید واقعی Running the App on a Real Android Device

• ایجاد اپلیکیشن iOS Creating an iOS App

• اجرای برنامه بر روی یک دستگاه iOS واقعی Running the App on a Real iOS Device

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

اشکال زدایی Debugging

• معرفی ماژول Module Introduction

• پیام های خطا و console.log() Error Messages & console.log()

• با استفاده از مرورگر DevTools & Breakpoints Using the Browser DevTools & Breakpoints

• استفاده از کد VS برای اشکال زدایی Using VS Code for Debugging

• اشکال زدایی UI و عملکرد Debugging the UI & Performance

• اشکال زدایی برنامه های اندروید Debugging Android Apps

• اشکال زدایی برنامه های iOS Debugging iOS Apps

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

اشکال زدایی Debugging

• معرفی ماژول Module Introduction

• پیام های خطا و console.log() Error Messages & console.log()

• با استفاده از مرورگر DevTools & Breakpoints Using the Browser DevTools & Breakpoints

• استفاده از کد VS برای اشکال زدایی Using VS Code for Debugging

• اشکال زدایی UI و عملکرد Debugging the UI & Performance

• اشکال زدایی برنامه های اندروید Debugging Android Apps

• اشکال زدایی برنامه های iOS Debugging iOS Apps

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

ناوبری و مسیریابی در برنامه های Ionic Navigation & Routing in Ionic Apps

• معرفی ماژول Module Introduction

• نحوه کار مسیریابی در یک برنامه Ionic + Angular How Routing Work In An Ionic + Angular App

• ذخیره‌سازی صفحه یونی و قلاب‌های چرخه حیات اضافی Ionic Page Caching & Extra Lifecycle Hooks

• برنامه ریزی پروژه دوره Planning the Course Project

• ایجاد صفحات برنامه ما Creating Our App Pages

• باید بخوانید: Ionic 5 و Routing/Lazy Loading MUST READ: Ionic 5 and Routing / Lazy Loading

• تنظیم پیکربندی مسیریابی اصلی ما Adjusting Our Main Routing Configuration

• آشنایی با زبانه های یونی Understanding Ionic Tabs

• افزودن برگه ها به برنامه Adding Tabs to the App

• آماده سازی داده ها و خدمات برای پروژه Preparing Data & Services for the Project

• خروجی "مکان ها" Outputting "Places"

• اضافه کردن مسیریابی به جلو Adding Forward Navigation

• بازگشت با NavController Going Back with NavController

• تمرین Ionic + Angular Practicing Ionic + Angular

• پیمایش از طریق دکمه های نوار ابزار Navigating via Toolbar Buttons

• یک اشکال با Ionic A Bug with Ionic

• استخراج شناسه مکان های بارگذاری شده Extracting the ID of Loaded Places

• تمرین بیشتر! More Practicing!

• اختیاری: کد راه حل تکلیف Optional: Assignment Solution Code

• افزودن دراور کناری Adding a SideDrawer

• باز کردن + بستن SideDrawer Opening + Closing the SideDrawer

• افزودن پیوندها و تغییر صفحات Adding Links & Switching Pages

• افزودن سرویس Auth Adding the Auth Service

• اضافه کردن یک محافظ تایید Adding an Auth Guard

• باز کردن یک مدال Opening a Modal

• بستن Modal & Passing Data Closing the Modal & Passing Data

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

ناوبری و مسیریابی در برنامه های Ionic Navigation & Routing in Ionic Apps

• معرفی ماژول Module Introduction

• نحوه کار مسیریابی در یک برنامه Ionic + Angular How Routing Work In An Ionic + Angular App

• ذخیره‌سازی صفحه یونی و قلاب‌های چرخه حیات اضافی Ionic Page Caching & Extra Lifecycle Hooks

• برنامه ریزی پروژه دوره Planning the Course Project

• ایجاد صفحات برنامه ما Creating Our App Pages

• باید بخوانید: Ionic 5 و Routing/Lazy Loading MUST READ: Ionic 5 and Routing / Lazy Loading

• تنظیم پیکربندی مسیریابی اصلی ما Adjusting Our Main Routing Configuration

• آشنایی با زبانه های یونی Understanding Ionic Tabs

• افزودن برگه ها به برنامه Adding Tabs to the App

• آماده سازی داده ها و خدمات برای پروژه Preparing Data & Services for the Project

• خروجی "مکان ها" Outputting "Places"

• اضافه کردن مسیریابی به جلو Adding Forward Navigation

• بازگشت با NavController Going Back with NavController

• تمرین Ionic + Angular Practicing Ionic + Angular

• پیمایش از طریق دکمه های نوار ابزار Navigating via Toolbar Buttons

• یک اشکال با Ionic A Bug with Ionic

• استخراج شناسه مکان های بارگذاری شده Extracting the ID of Loaded Places

• تمرین بیشتر! More Practicing!

• اختیاری: کد راه حل تکلیف Optional: Assignment Solution Code

• افزودن دراور کناری Adding a SideDrawer

• باز کردن + بستن SideDrawer Opening + Closing the SideDrawer

• افزودن پیوندها و تغییر صفحات Adding Links & Switching Pages

• افزودن سرویس Auth Adding the Auth Service

• اضافه کردن یک محافظ تایید Adding an Auth Guard

• باز کردن یک مدال Opening a Modal

• بستن Modal & Passing Data Closing the Modal & Passing Data

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

بررسی اجمالی اجزای یونی Ionic Components Overview

• معرفی ماژول Module Introduction

• ویژگی ها و شکاف ها Attributes & Slots

• مبانی شبکه یونی Ionic Grid Basics

• کنترل اندازه ستون های شبکه Controlling Grid Column Sizes

• کنترل تراز شبکه Controlling Grid Alignment

• اندازه شبکه پاسخگو Responsive Grid Sizing

• خلاصه گرید Grid Summary

• لیست یونی در مقابل شبکه یونی ion-list vs ion-grid

• برچسب یونی و آیتم یونی ion-label & ion-item

• متن یونی ion-text

• موارد فهرست قابل کشیدن Swipeable List Items

• رزروهای قابل کشیدن Swipeable Bookings

• آشنایی با پیمایش مجازی Understanding Virtual Scrolling

• پیاده سازی پیمایش مجازی Implementing Virtual Scrolling

• اشکالات پیمایش مجازی Virtual Scrolling Bugs

• افزودن عناصر تصویر Adding Image Elements

• دکمه های تقسیم بندی شده Segmented Buttons

• اضافه کردن اسپینر Adding a Spinner

• با استفاده از Loading Controller Using the Loading Controller

• با استفاده از کنترلر ActionSheet Using the ActionSheet Controller

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

بررسی اجمالی اجزای یونی Ionic Components Overview

• معرفی ماژول Module Introduction

• ویژگی ها و شکاف ها Attributes & Slots

• مبانی شبکه یونی Ionic Grid Basics

• کنترل اندازه ستون های شبکه Controlling Grid Column Sizes

• کنترل تراز شبکه Controlling Grid Alignment

• اندازه شبکه پاسخگو Responsive Grid Sizing

• خلاصه گرید Grid Summary

• لیست یونی در مقابل شبکه یونی ion-list vs ion-grid

• برچسب یونی و آیتم یونی ion-label & ion-item

• متن یونی ion-text

• موارد فهرست قابل کشیدن Swipeable List Items

• رزروهای قابل کشیدن Swipeable Bookings

• آشنایی با پیمایش مجازی Understanding Virtual Scrolling

• پیاده سازی پیمایش مجازی Implementing Virtual Scrolling

• اشکالات پیمایش مجازی Virtual Scrolling Bugs

• افزودن عناصر تصویر Adding Image Elements

• دکمه های تقسیم بندی شده Segmented Buttons

• اضافه کردن اسپینر Adding a Spinner

• با استفاده از Loading Controller Using the Loading Controller

• با استفاده از کنترلر ActionSheet Using the ActionSheet Controller

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

استایل و طرح‌بندی برنامه‌های Ionic Styling & Theming Ionic Apps

• معرفی ماژول Module Introduction

• نحوه عملکرد استایل و طرح زمینه در برنامه های Ionic How Styling & Theming Works in Ionic Apps

• اسناد و ویژگی‌های ابزار Docs & Utility Attributes

• تنظیم متغیرهای تم جهانی Setting Global Theme Variables

• تنظیم سبک های جهانی Setting Global Styles

• تنظیم همه رنگ ها در یک زمان Setting All Colors at Once

• تنظیم سبک های خاص پلت فرم Setting Platform-Specific Styles

• یک ظاهر طراحی اجزای اصلی با متغیرها Styling Core Components with Variables

• آیکون های iOS از دست رفته است Missing iOS Icons

• اضافه کردن قوانین CSS سفارشی Adding Custom CSS Rules

• متغیرهای CSS خاص جزء Component-specific CSS Variables

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

استایل و طرح‌بندی برنامه‌های Ionic Styling & Theming Ionic Apps

• معرفی ماژول Module Introduction

• نحوه عملکرد استایل و طرح زمینه در برنامه های Ionic How Styling & Theming Works in Ionic Apps

• اسناد و ویژگی‌های ابزار Docs & Utility Attributes

• تنظیم متغیرهای تم جهانی Setting Global Theme Variables

• تنظیم سبک های جهانی Setting Global Styles

• تنظیم همه رنگ ها در یک زمان Setting All Colors at Once

• تنظیم سبک های خاص پلت فرم Setting Platform-Specific Styles

• یک ظاهر طراحی اجزای اصلی با متغیرها Styling Core Components with Variables

• آیکون های iOS از دست رفته است Missing iOS Icons

• اضافه کردن قوانین CSS سفارشی Adding Custom CSS Rules

• متغیرهای CSS خاص جزء Component-specific CSS Variables

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

مدیریت ورودی کاربر Handling User Input

• معرفی ماژول Module Introduction

• الزامات ورودی کاربر User Input Requirements

• راه اندازی یک قالب فرم Setting Up a Form Template

• Angular 8 و @ViewChild() Angular 8 & @ViewChild()

• افزودن یک فرم مبتنی بر الگو Adding a Template-driven Form

• اعتبار سنجی Handling Validation

• جابجایی بین حالت های Auth Switching Between Auth Modes

• تکمیل فرم Auth Finishing the Auth Form

• شروع کار بر روی یک فرم پیشنهاد جدید Starting Work on a New Offer Form

• تکمیل الگوی فرم پیشنهاد Finishing the Offer Form Template

• ایجاد یک فرم واکنشی Creating a Reactive Form

• همگام سازی فرم با الگو Syncing the Form to the Template

• تکمیل فرم پیشنهاد جدید Finishing the New Offer Form

• چالش فرم را ویرایش کنید Edit Form Challenge

• افزودن فرم ویرایش پیشنهاد Adding the Edit Offer Form

• با فرم رزرو شروع کنید Starting with the Booking Form

• کار بر روی قالب Book Place Working on the Book Place Template

• Ionic 6 و کنترل تاریخ Ionic 6 & Date Controls

• پیکربندی کنترل های تاریخ Configuring the Date Controls

• اجتناب از خطاها Avoid Errors

• اعتبارسنجی و ارسال فرم Validating & Submitting the Form

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

مدیریت ورودی کاربر Handling User Input

• معرفی ماژول Module Introduction

• الزامات ورودی کاربر User Input Requirements

• راه اندازی یک قالب فرم Setting Up a Form Template

• Angular 8 و @ViewChild() Angular 8 & @ViewChild()

• افزودن یک فرم مبتنی بر الگو Adding a Template-driven Form

• اعتبار سنجی Handling Validation

• جابجایی بین حالت های Auth Switching Between Auth Modes

• تکمیل فرم Auth Finishing the Auth Form

• شروع کار بر روی یک فرم پیشنهاد جدید Starting Work on a New Offer Form

• تکمیل الگوی فرم پیشنهاد Finishing the Offer Form Template

• ایجاد یک فرم واکنشی Creating a Reactive Form

• همگام سازی فرم با الگو Syncing the Form to the Template

• تکمیل فرم پیشنهاد جدید Finishing the New Offer Form

• چالش فرم را ویرایش کنید Edit Form Challenge

• افزودن فرم ویرایش پیشنهاد Adding the Edit Offer Form

• با فرم رزرو شروع کنید Starting with the Booking Form

• کار بر روی قالب Book Place Working on the Book Place Template

• Ionic 6 و کنترل تاریخ Ionic 6 & Date Controls

• پیکربندی کنترل های تاریخ Configuring the Date Controls

• اجتناب از خطاها Avoid Errors

• اعتبارسنجی و ارسال فرم Validating & Submitting the Form

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

دولت مدیریت Managing State

• معرفی ماژول Module Introduction

• ایالت چیست؟ What is State?

• افزودن مکان های جدید Adding New Places

• استفاده از موضوعات RxJS برای مدیریت دولتی Using RxJS Subjects for State Management

• انتقال داده ها از طریق موضوعات و اشتراک ها Passing Data via Subjects & Subscriptions

• وضعیت رابط کاربری در عمل UI State in Action

• به روز رسانی مکان ها Updating Places

• حالت رابط کاربری با مکان‌های قابل رزرو UI State with Bookable Places

• فیلتر کردن و ناوبری Filtering & Navigation

• رزرو مکان ها Booking Places

• رفع اشکال Fixing a Bug

• لغو رزروها Canceling Bookings

• پایان کار Finishing Touches

• منابع و لینک های مفید Useful Resources & Links

دولت مدیریت Managing State

• معرفی ماژول Module Introduction

• ایالت چیست؟ What is State?

• افزودن مکان های جدید Adding New Places

• استفاده از موضوعات RxJS برای مدیریت دولتی Using RxJS Subjects for State Management

• انتقال داده ها از طریق موضوعات و اشتراک ها Passing Data via Subjects & Subscriptions

• وضعیت رابط کاربری در عمل UI State in Action

• به روز رسانی مکان ها Updating Places

• حالت رابط کاربری با مکان‌های قابل رزرو UI State with Bookable Places

• فیلتر کردن و ناوبری Filtering & Navigation

• رزرو مکان ها Booking Places

• رفع اشکال Fixing a Bug

• لغو رزروها Canceling Bookings

• پایان کار Finishing Touches

• منابع و لینک های مفید Useful Resources & Links

ارسال درخواست Http Sending Http Requests

• معرفی ماژول Module Introduction

• نحوه اتصال به Backend How To Connect to a Backend

• راه اندازی Firebase Setting Up Firebase

• ارسال اطلاعات از طریق Http Sending Data via Http

• استفاده از داده های پاسخ Using Response Data

• واکشی و نمایش داده ها Fetching & Displaying Data

• به روز رسانی مکان ها Updating Places

• واکشی داده ها در مکان های مختلف Fetching Data in Multiple Places

• بارگیری داده ها در یک مکان واحد Loading Data in a Single Place

• به‌روزرسانی مکان‌ها به درستی Updating Places Correctly

• رسیدگی به خطا Error Handling

• واکشی مکان های مجرد Fetching Single Places

• افزودن یک رزرو Adding a Booking

• واکشی رزروها توسط کاربر Fetching Bookings By User

• حذف رزروها Deleting Bookings

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

ارسال درخواست Http Sending Http Requests

• معرفی ماژول Module Introduction

• نحوه اتصال به Backend How To Connect to a Backend

• راه اندازی Firebase Setting Up Firebase

• ارسال اطلاعات از طریق Http Sending Data via Http

• استفاده از داده های پاسخ Using Response Data

• واکشی و نمایش داده ها Fetching & Displaying Data

• به روز رسانی مکان ها Updating Places

• واکشی داده ها در مکان های مختلف Fetching Data in Multiple Places

• بارگیری داده ها در یک مکان واحد Loading Data in a Single Place

• به‌روزرسانی مکان‌ها به درستی Updating Places Correctly

• رسیدگی به خطا Error Handling

• واکشی مکان های مجرد Fetching Single Places

• افزودن یک رزرو Adding a Booking

• واکشی رزروها توسط کاربر Fetching Bookings By User

• حذف رزروها Deleting Bookings

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

افزودن نقشه های گوگل Adding Google Maps

• معرفی ماژول Module Introduction

• راه اندازی API API Setup

• Angular 8 و @ViewChild() Angular 8 & @ViewChild()

• افزودن یک مؤلفه LocationPicker Adding a LocationPicker Component

• باز کردن Map Modal Opening the Map Modal

• افزودن Google Maps SDK Adding the Google Maps SDK

• رندر کردن نقشه Rendering a Map

• انتخاب مکان ها از طریق کلیک بر روی نقشه Picking Locations via a Click on the Map

• پیدا کردن آدرس برای یک مکان Finding the Address for a Place

• واکشی URL تصویر ثابت Fetching a Static Image URL

• نمایش پیش نمایش مکان Displaying a Place Preview

• تغییر انتخاب Changing the Selection

• حذف کلیک شنونده Removing the Click Listener

• ارسال مکان Submitting the Location

• خروجی آدرس و نقشه Outputting Address & Map

• استفاده مجدد از Maps Modal Re-using the Maps Modal

• منابع و لینک های مفید Useful Resources & Links

افزودن نقشه های گوگل Adding Google Maps

• معرفی ماژول Module Introduction

• راه اندازی API API Setup

• Angular 8 و @ViewChild() Angular 8 & @ViewChild()

• افزودن یک مؤلفه LocationPicker Adding a LocationPicker Component

• باز کردن Map Modal Opening the Map Modal

• افزودن Google Maps SDK Adding the Google Maps SDK

• رندر کردن نقشه Rendering a Map

• انتخاب مکان ها از طریق کلیک بر روی نقشه Picking Locations via a Click on the Map

• پیدا کردن آدرس برای یک مکان Finding the Address for a Place

• واکشی URL تصویر ثابت Fetching a Static Image URL

• نمایش پیش نمایش مکان Displaying a Place Preview

• تغییر انتخاب Changing the Selection

• حذف کلیک شنونده Removing the Click Listener

• ارسال مکان Submitting the Location

• خروجی آدرس و نقشه Outputting Address & Map

• استفاده مجدد از Maps Modal Re-using the Maps Modal

• منابع و لینک های مفید Useful Resources & Links

استفاده از ویژگی های دستگاه بومی (دوربین و مکان) Using Native Device Features (Camera & Location)

• معرفی ماژول Module Introduction

• درک خازن و کوردووا Understanding Capacitor & Cordova

• با استفاده از Docs Using the Docs

• با استفاده از خازن نسخه 3 Using Capacitor v3

• استفاده از پلاگین های خازن Using Capacitor Plugins

• دریافت مکان کاربر Getting the User Location

• تست ویژگی مکان Testing the Location Feature

• Angular 8 و @ViewChild() Angular 8 & @ViewChild()

• شروع با انتخابگر تصویر Starting With the Image Picker

• عکس گرفتن Taking Pictures

• از تصاویر تحریف شده خودداری کنید Avoid Distorted Pictures

• تشخیص درست پلتفرم Detecting the Platform Correctly

• افزودن یک فایل پیکر بازگشتی Adding a Filepicker Fallback

• دریافت تصویر انتخاب شده Getting the Picked Image

• تبدیل رشته تصویر به فایل Converting the Image String to a File

• ذخیره تصویر در فرم Storing the Image in the Form

• خازن v1 و عناصر PWA Capacitor v1 & PWA Elements

• استفاده از عناصر PWA Using PWA Elements

• بهبود مؤلفه ImagePicker Improving the ImagePicker Component

• باید بخوانید: صورتحساب عملکردهای ابری Firebase MUST READ: Firebase Cloud Functions Billing

• افزودن کد آپلود تصویر سمت سرور Adding Server-side Image Uploading Code

• اضافه کردن آپلود تصویر Adding Image Upload

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

استفاده از ویژگی های دستگاه بومی (دوربین و مکان) Using Native Device Features (Camera & Location)

• معرفی ماژول Module Introduction

• درک خازن و کوردووا Understanding Capacitor & Cordova

• با استفاده از Docs Using the Docs

• با استفاده از خازن نسخه 3 Using Capacitor v3

• استفاده از پلاگین های خازن Using Capacitor Plugins

• دریافت مکان کاربر Getting the User Location

• تست ویژگی مکان Testing the Location Feature

• Angular 8 و @ViewChild() Angular 8 & @ViewChild()

• شروع با انتخابگر تصویر Starting With the Image Picker

• عکس گرفتن Taking Pictures

• از تصاویر تحریف شده خودداری کنید Avoid Distorted Pictures

• تشخیص درست پلتفرم Detecting the Platform Correctly

• افزودن یک فایل پیکر بازگشتی Adding a Filepicker Fallback

• دریافت تصویر انتخاب شده Getting the Picked Image

• تبدیل رشته تصویر به فایل Converting the Image String to a File

• ذخیره تصویر در فرم Storing the Image in the Form

• خازن v1 و عناصر PWA Capacitor v1 & PWA Elements

• استفاده از عناصر PWA Using PWA Elements

• بهبود مؤلفه ImagePicker Improving the ImagePicker Component

• باید بخوانید: صورتحساب عملکردهای ابری Firebase MUST READ: Firebase Cloud Functions Billing

• افزودن کد آپلود تصویر سمت سرور Adding Server-side Image Uploading Code

• اضافه کردن آپلود تصویر Adding Image Upload

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

افزودن احراز هویت Adding Authentication

• معرفی ماژول Module Introduction

• احراز هویت چگونه کار می کند How Authentication Works

• کلید API Firebase Firebase API Key

• اضافه کردن ثبت نام کاربر Adding User Signup

• بازسازی کد احراز هویت Refactoring the Authentication Code

• افزودن ورود کاربر Adding User Login

• مدیریت کاربر با موضوع Managing the User with a Subject

• ذخیره توکن در حافظه Storing the Token in Memory

• استفاده صحیح از شناسه قابل مشاهده Using the ID Observable Correctly

• استفاده بیشتر از شناسه کاربر More userId Usage

• رفع اشتراک Fixing the Subscription

• استفاده از userId Everywhere Using the userId Everywhere

• ذخیره داده های Auth در Device Storag Storing Auth Data in Device Storag

• اضافه کردن Autologin Adding Autologin

• با استفاده از Autologin Using Autologin

• افزودن سیستم خروج واکنشی Adding a Reactive Logout System

• افزودن Autologout Adding Autologout

• نیاز به Auth Token در Backend Requiring the Auth Token on the Backend

• ارسال رمز تأیید به Backend Sending the Auth Token to the Backend

• استفاده بیشتر توکن More Token Usage

• اختیاری: وضعیت تأیید اعتبار زمانی که برنامه از سر گرفته می‌شود را بررسی کنید Optional: Check Auth State When App Resumes

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

افزودن احراز هویت Adding Authentication

• معرفی ماژول Module Introduction

• احراز هویت چگونه کار می کند How Authentication Works

• کلید API Firebase Firebase API Key

• اضافه کردن ثبت نام کاربر Adding User Signup

• بازسازی کد احراز هویت Refactoring the Authentication Code

• افزودن ورود کاربر Adding User Login

• مدیریت کاربر با موضوع Managing the User with a Subject

• ذخیره توکن در حافظه Storing the Token in Memory

• استفاده صحیح از شناسه قابل مشاهده Using the ID Observable Correctly

• استفاده بیشتر از شناسه کاربر More userId Usage

• رفع اشتراک Fixing the Subscription

• استفاده از userId Everywhere Using the userId Everywhere

• ذخیره داده های Auth در Device Storag Storing Auth Data in Device Storag

• اضافه کردن Autologin Adding Autologin

• با استفاده از Autologin Using Autologin

• افزودن سیستم خروج واکنشی Adding a Reactive Logout System

• افزودن Autologout Adding Autologout

• نیاز به Auth Token در Backend Requiring the Auth Token on the Backend

• ارسال رمز تأیید به Backend Sending the Auth Token to the Backend

• استفاده بیشتر توکن More Token Usage

• اختیاری: وضعیت تأیید اعتبار زمانی که برنامه از سر گرفته می‌شود را بررسی کنید Optional: Check Auth State When App Resumes

• بسته شدن Wrap Up

• منابع و لینک های مفید Useful Resources & Links

انتشار برنامه ها Publishing the Apps

• معرفی ماژول Module Introduction

• آماده سازی تنظیمات برنامه Preparing App Configs

• نمادهای سفارشی و صفحه نمایش چلپ چلوپ Custom Icons & Splash Screens

• استقرار اندروید Android Deployment

• استقرار iOS iOS Deployment

• توسعه وب Web Development

• منابع و لینک های مفید Useful Resources & Links

انتشار برنامه ها Publishing the Apps

• معرفی ماژول Module Introduction

• آماده سازی تنظیمات برنامه Preparing App Configs

• نمادهای سفارشی و صفحه نمایش چلپ چلوپ Custom Icons & Splash Screens

• استقرار اندروید Android Deployment

• استقرار iOS iOS Deployment

• توسعه وب Web Development

• منابع و لینک های مفید Useful Resources & Links

جمع بندی Roundup

• با تشکر از حضور در دوره! Thanks for being part of the course!

جمع بندی Roundup

• با تشکر از حضور در دوره! Thanks for being part of the course!

محتوای جایزه Bonus Content

• امتیاز: محتوای بیشتر! Bonus: More Content!

محتوای جایزه Bonus Content

• امتیاز: محتوای بیشتر! Bonus: More Content!