آموزش React Native: Advanced Concepts

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

راه اندازی نمایشگاه Expo Setup

• مقدمه - از اینجا شروع کنید! Introduction - Start Here!

• لینک های Github Github Links

• ایجاد React Native Apps Creating React Native Apps

• چرا اکسپو؟ Why Expo?

• ایجاد اولین برنامه ما Creating Our First App

راه اندازی نمایشگاه Expo Setup

• مقدمه - از اینجا شروع کنید! Introduction - Start Here!

• لینک های Github Github Links

• ایجاد React Native Apps Creating React Native Apps

• چرا اکسپو؟ Why Expo?

• ایجاد اولین برنامه ما Creating Our First App

انیمیشن با React Native Animations with React Native

• سیستم های انیمیشن Animation Systems

• ماژول انیمیشن The Animation Module

• انیمیشن از Square One Animation from Square One

• حرکت دادن یک توپ Moving a Ball

• انیمیشن ها چگونه کار می کنند How Animations Work

• انیمیشن از زاویه ای دیگر Animation from Another Angle

• تند تند وشدید زدن لوازم جانبی عرشه Swipe Deck Props

• دیگ بخار کامپوننت Component Boilerplate

• داده های عرشه Deck Data

• تعامل بین اجزا Interplay Between Components

• سفارشی کردن کارت های فردی Customizing Individual Cards

انیمیشن با React Native Animations with React Native

• سیستم های انیمیشن Animation Systems

• ماژول انیمیشن The Animation Module

• انیمیشن از Square One Animation from Square One

• حرکت دادن یک توپ Moving a Ball

• انیمیشن ها چگونه کار می کنند How Animations Work

• انیمیشن از زاویه ای دیگر Animation from Another Angle

• تند تند وشدید زدن لوازم جانبی عرشه Swipe Deck Props

• دیگ بخار کامپوننت Component Boilerplate

• داده های عرشه Deck Data

• تعامل بین اجزا Interplay Between Components

• سفارشی کردن کارت های فردی Customizing Individual Cards

دست زدن به ژست ها Handling Gestures

• سیستم پاسخگوی پان The Pan Responder System

• Pan Responder's Event Handlers Pan Responder's Event Handlers

• شی ژست The Gesture Object

• کشیدن یک کارت Dragging a Card

دست زدن به ژست ها Handling Gestures

• سیستم پاسخگوی پان The Pan Responder System

• Pan Responder's Event Handlers Pan Responder's Event Handlers

• شی ژست The Gesture Object

• کشیدن یک کارت Dragging a Card

استفاده از استایل انیمیشن Applying Animation Styling

• متحرک سازی کارت های تک Animating Single Cards

• نحوه چرخش عناصر How to Rotate Elements

• درون یابی مقادیر چرخش Interpolating Rotation Values

• روابط خطی با درون یابی Linear Relations with Interpolation

• محدود کردن چرخش با درون یابی Limiting Rotation with Interpolation

• بازگشت به حالت پیش فرض Springing Back to Default

• تشخیص حداقل فاصله کش رفتن Detecting Minimum Swipe Distance

• انیمیشن برنامه ای Programmatic Animation

• کش رفتن اجباری Forcing Swipes

• پاسخ به تماس در تکمیل کشیدن انگشت Callbacks on Swipe Completion

استفاده از استایل انیمیشن Applying Animation Styling

• متحرک سازی کارت های تک Animating Single Cards

• نحوه چرخش عناصر How to Rotate Elements

• درون یابی مقادیر چرخش Interpolating Rotation Values

• روابط خطی با درون یابی Linear Relations with Interpolation

• محدود کردن چرخش با درون یابی Limiting Rotation with Interpolation

• بازگشت به حالت پیش فرض Springing Back to Default

• تشخیص حداقل فاصله کش رفتن Detecting Minimum Swipe Distance

• انیمیشن برنامه ای Programmatic Animation

• کش رفتن اجباری Forcing Swipes

• پاسخ به تماس در تکمیل کشیدن انگشت Callbacks on Swipe Completion

قابلیت استفاده مجدد کامپوننت Component Reusability

• نوشتن اجزای قابل استفاده مجدد Writing Reusable Components

• سیستم DefaultProps The DefaultProps System

• تنظیم مجدد موقعیت کارت Resetting Card Position

• پیشروی عرشه Advancing the Deck

• مدیریت لیست های خالی Handling Empty Lists

• گرفتن کارت ها به پشته Getting the Cards to Stack

• عیب یابی فلش تصاویر Troubleshooting Flashing Images

• لیست کارت های آبشاری Cascading Card List

• متحرک سازی کارت های پیشرفته Animating Advancing Cards

• تنظیم مجدد ایندکس Resetting the Index

• بسته بندی عرشه Deck Wrapup

قابلیت استفاده مجدد کامپوننت Component Reusability

• نوشتن اجزای قابل استفاده مجدد Writing Reusable Components

• سیستم DefaultProps The DefaultProps System

• تنظیم مجدد موقعیت کارت Resetting Card Position

• پیشروی عرشه Advancing the Deck

• مدیریت لیست های خالی Handling Empty Lists

• گرفتن کارت ها به پشته Getting the Cards to Stack

• عیب یابی فلش تصاویر Troubleshooting Flashing Images

• لیست کارت های آبشاری Cascading Card List

• متحرک سازی کارت های پیشرفته Animating Advancing Cards

• تنظیم مجدد ایندکس Resetting the Index

• بسته بندی عرشه Deck Wrapup

احراز هویت یک بار رمز عبور One Time Password Authentication

• بررسی جریان‌های تأیید مشترک Review of Common Auth Flows

• جزئیات رمزهای یک بار مصرف The Details of One Time Passwords

• Tech Stack با توابع Google Cloud Tech Stack with Google Cloud Functions

• سرورهای سنتی در مقابل توابع ابری گوگل Traditional Servers vs Google Cloud Functions

• طرح بندی توابع Google Cloud Layout of Google Cloud Functions

• راه اندازی پروژه Firebase Firebase Project Setup

• استقرار یک پروژه Firebase Deploying a Firebase Project

• تست توابع مستقر شده Testing Deployed Functions

• ساختار فایل پروژه Project File Structure

• اشیاء درخواست و پاسخ The Request and Response Objects

• ایجاد یک حساب خدمات Generating a Service Account

• پاکسازی ورودی های کاربر Sanitizing User Inputs

• ایجاد کاربران جدید Creating New Users

• تست ایجاد کاربر جدید Testing New User Creation

احراز هویت یک بار رمز عبور One Time Password Authentication

• بررسی جریان‌های تأیید مشترک Review of Common Auth Flows

• جزئیات رمزهای یک بار مصرف The Details of One Time Passwords

• Tech Stack با توابع Google Cloud Tech Stack with Google Cloud Functions

• سرورهای سنتی در مقابل توابع ابری گوگل Traditional Servers vs Google Cloud Functions

• طرح بندی توابع Google Cloud Layout of Google Cloud Functions

• راه اندازی پروژه Firebase Firebase Project Setup

• استقرار یک پروژه Firebase Deploying a Firebase Project

• تست توابع مستقر شده Testing Deployed Functions

• ساختار فایل پروژه Project File Structure

• اشیاء درخواست و پاسخ The Request and Response Objects

• ایجاد یک حساب خدمات Generating a Service Account

• پاکسازی ورودی های کاربر Sanitizing User Inputs

• ایجاد کاربران جدید Creating New Users

• تست ایجاد کاربر جدید Testing New User Creation

ادغام Twilio Twilio Integration

• ارسال پیامک از Twilio Texting from Twilio

• اعتبارنامه Twilio Twilio Credentials

• دسترسی به کاربران ذخیره شده Accessing Saved Users

• یادداشت سریع Quick Note

• ارسال متن به کاربران Sending Texts to Users

• تولید کدهای دسترسی Generating Access Codes

• تایید رمزهای یک بار مصرف Verifying One Time Passwords

• باطل کردن کدهای استفاده شده Invalidating Used Codes

• تولید JWT Generating JWT's

ادغام Twilio Twilio Integration

• ارسال پیامک از Twilio Texting from Twilio

• اعتبارنامه Twilio Twilio Credentials

• دسترسی به کاربران ذخیره شده Accessing Saved Users

• یادداشت سریع Quick Note

• ارسال متن به کاربران Sending Texts to Users

• تولید کدهای دسترسی Generating Access Codes

• تایید رمزهای یک بار مصرف Verifying One Time Passwords

• باطل کردن کدهای استفاده شده Invalidating Used Codes

• تولید JWT Generating JWT's

گذرواژه های یک بار مصرف سمت مشتری Client Side One Time Passwords

• در حال انتقال به React Native Transitioning to React Native

• برنامه Boilerplate App Boilerplate

• تعریف ویژگی های نمونه Defining Instance Properties

• فراخوانی توابع ابری Invoking Cloud Functions

• Refactoring با Async/Await Refactoring with Async/Await

• اشکال زدایی با Async/Await Debugging with Async/Await

• Async/Await on User Sign in Async/Await on User Signin

• گرفتن توکن ها Capturing Tokens

• Firebase Auth با JWT Firebase Auth with a JWT

• تنفس و بررسی Breather and Review

گذرواژه های یک بار مصرف سمت مشتری Client Side One Time Passwords

• در حال انتقال به React Native Transitioning to React Native

• برنامه Boilerplate App Boilerplate

• تعریف ویژگی های نمونه Defining Instance Properties

• فراخوانی توابع ابری Invoking Cloud Functions

• Refactoring با Async/Await Refactoring with Async/Await

• اشکال زدایی با Async/Await Debugging with Async/Await

• Async/Await on User Sign in Async/Await on User Signin

• گرفتن توکن ها Capturing Tokens

• Firebase Auth با JWT Firebase Auth with a JWT

• تنفس و بررسی Breather and Review

آوردن آن همه با هم Bringing it All Together

• نمای کلی برنامه App Overview

• بررسی صفحه نمایش Screen Walkthrough

• توضیحات بیشتر روی صفحه نمایش More Screen Walkthroughs

• چالش ها و راه حل های برنامه App Challenges and Solutions

• صفحه نمایش ها در مقابل کامپوننت ها Screens vs Components

• React Native Navigation Options React Native Navigation Options

• React Navigation در عمل React Navigation in Practice

• صفحه دیگ بخار Screen Boilerplate

• پیاده سازی First Navigator Implementing the First Navigator

• ناوبرهای تودرتو Nesting Navigators

• سیم کشی ناوبرهای پشته Wiring Up Stack Navigators

• ویژگی های کلاس در مقابل نمونه Class vs Instance Properties

• سفارشی سازی با گزینه های سرصفحه Customization with Header Options

• ناوبری برنامه ای Programmatic Navigation

• حالت دادن به نوار نوار Styling the NavBar

• صفحه خوش آمدید The Welcome Screen

• حالت دادن به صفحه خوش آمد گویی Styling the Welcome Screen

• حتی بیشتر حالت خوش آمدگویی به صفحه نمایش! Even More Welcome Screen Styling!

• پیمایش از صفحه خوش آمدید Navigation from the Welcome Screen

• اطلاعات بیشتر در مورد ناوبری صفحه خوش آمدید More on Welcome Screen Navigation

آوردن آن همه با هم Bringing it All Together

• نمای کلی برنامه App Overview

• بررسی صفحه نمایش Screen Walkthrough

• توضیحات بیشتر روی صفحه نمایش More Screen Walkthroughs

• چالش ها و راه حل های برنامه App Challenges and Solutions

• صفحه نمایش ها در مقابل کامپوننت ها Screens vs Components

• React Native Navigation Options React Native Navigation Options

• React Navigation در عمل React Navigation in Practice

• صفحه دیگ بخار Screen Boilerplate

• پیاده سازی First Navigator Implementing the First Navigator

• ناوبرهای تودرتو Nesting Navigators

• سیم کشی ناوبرهای پشته Wiring Up Stack Navigators

• ویژگی های کلاس در مقابل نمونه Class vs Instance Properties

• سفارشی سازی با گزینه های سرصفحه Customization with Header Options

• ناوبری برنامه ای Programmatic Navigation

• حالت دادن به نوار نوار Styling the NavBar

• صفحه خوش آمدید The Welcome Screen

• حالت دادن به صفحه خوش آمد گویی Styling the Welcome Screen

• حتی بیشتر حالت خوش آمدگویی به صفحه نمایش! Even More Welcome Screen Styling!

• پیمایش از صفحه خوش آمدید Navigation from the Welcome Screen

• اطلاعات بیشتر در مورد ناوبری صفحه خوش آمدید More on Welcome Screen Navigation

احراز هویت فیس بوک Facebook Authentication

• جریان احراز هویت فیس بوک Facebook Auth Flow

• کنسول توسعه دهنده فیس بوک The Facebook Dev Console

• تنظیم Redux Redux Setup

• استفاده از Async Storage Using Async Storage

• Crazy Async/Await Syntax Crazy Async/Await Syntax

• ورود به سیستم با فیس بوک Logging in With Facebook

• تست جریان ورود فیس بوک Testing Facebook's Login Flow

• یادداشت سریع Quick Note

• بزرگترین گوچای جهان World's Biggest Gotcha

• Auth Reducer The Auth Reducer

• پرش از صفحه تأیید Skipping the Auth Screen

• تست جریان احراز هویت Testing Auth Flow

• پیشبرد صفحه خوش آمدید Advancing the Welcome Screen

• حل کردن صفحه بارگیری Resolving the Loading Screen

احراز هویت فیس بوک Facebook Authentication

• جریان احراز هویت فیس بوک Facebook Auth Flow

• کنسول توسعه دهنده فیس بوک The Facebook Dev Console

• تنظیم Redux Redux Setup

• استفاده از Async Storage Using Async Storage

• Crazy Async/Await Syntax Crazy Async/Await Syntax

• ورود به سیستم با فیس بوک Logging in With Facebook

• تست جریان ورود فیس بوک Testing Facebook's Login Flow

• یادداشت سریع Quick Note

• بزرگترین گوچای جهان World's Biggest Gotcha

• Auth Reducer The Auth Reducer

• پرش از صفحه تأیید Skipping the Auth Screen

• تست جریان احراز هویت Testing Auth Flow

• پیشبرد صفحه خوش آمدید Advancing the Welcome Screen

• حل کردن صفحه بارگیری Resolving the Loading Screen

MapViews در React Native MapViews on React Native

• نمایش نقشه Showing a Map

• تعامل با MapView Interacting with the MapView

• کار بر روی مشکلات MapView Working around MapView Issues

• در واقع کلید API Indeed API Key

• Indeed Jobs API The Indeed Jobs API

• عدم تطابق API مکان Location API Mismatch

• تبدیل LatLong به کد پستی Converting LatLong to Zip Code

• واکشی لیست مشاغل Fetching a List of Jobs

• صدور Action Creators از MapScreen Issuing Action Creators from MapScreen

• کاهش دهنده مشاغل The Jobs Reducer

• پیمایش از Action Creators Navigating from Action Creators

• صفحه عرشه The Deck Screen

• وارد کردن مولفه Deck Importing the Deck Component

• اعمال مولفه Swipe Applying the Swipe Component

• کارت های شغلی یک ظاهر طراحی شده Styling Job Cards

• سفارشی کردن MapViews Customizing MapViews

• سازگاری اندروید Android Compatibility

• لوازم کلید پویا Dynamic Key Props

• یکی دیگر از Swipe Deck Fix One More Swipe Deck Fix

• دوست داشتن یک شغل Liking a Job

• در نظر گرفتن فقط مشاغل منحصر به فرد Considering Only Unique Jobs

• صفحه بازبینی The Review Screen

• ارائه فهرستی از مشاغل مورد علاقه Rendering a List of Liked Jobs

• درخواست برای مشاغل Applying to Jobs

• نقشه برداری موقعیت شغلی Mapping a Jobs Location

• مدل دادن به کارت شغلی Styling the Job Card

• پاک کردن مشاغل مورد علاقه Clearing Liked Jobs

• تغییر مسیر بازگشت به نقشه Redirecting Back to the Map

• پاسخ به تماس گوچا Callback Gotcha

• نمادهای نوار برگه Tab Bar Icons

• پیکربندی نوار برگه Tab Bar Config

• اصلاحات خاص اندروید Android Specific Fixes

MapViews در React Native MapViews on React Native

• نمایش نقشه Showing a Map

• تعامل با MapView Interacting with the MapView

• کار بر روی مشکلات MapView Working around MapView Issues

• در واقع کلید API Indeed API Key

• Indeed Jobs API The Indeed Jobs API

• عدم تطابق API مکان Location API Mismatch

• تبدیل LatLong به کد پستی Converting LatLong to Zip Code

• واکشی لیست مشاغل Fetching a List of Jobs

• صدور Action Creators از MapScreen Issuing Action Creators from MapScreen

• کاهش دهنده مشاغل The Jobs Reducer

• پیمایش از Action Creators Navigating from Action Creators

• صفحه عرشه The Deck Screen

• وارد کردن مولفه Deck Importing the Deck Component

• اعمال مولفه Swipe Applying the Swipe Component

• کارت های شغلی یک ظاهر طراحی شده Styling Job Cards

• سفارشی کردن MapViews Customizing MapViews

• سازگاری اندروید Android Compatibility

• لوازم کلید پویا Dynamic Key Props

• یکی دیگر از Swipe Deck Fix One More Swipe Deck Fix

• دوست داشتن یک شغل Liking a Job

• در نظر گرفتن فقط مشاغل منحصر به فرد Considering Only Unique Jobs

• صفحه بازبینی The Review Screen

• ارائه فهرستی از مشاغل مورد علاقه Rendering a List of Liked Jobs

• درخواست برای مشاغل Applying to Jobs

• نقشه برداری موقعیت شغلی Mapping a Jobs Location

• مدل دادن به کارت شغلی Styling the Job Card

• پاک کردن مشاغل مورد علاقه Clearing Liked Jobs

• تغییر مسیر بازگشت به نقشه Redirecting Back to the Map

• پاسخ به تماس گوچا Callback Gotcha

• نمادهای نوار برگه Tab Bar Icons

• پیکربندی نوار برگه Tab Bar Config

• اصلاحات خاص اندروید Android Specific Fixes

ماندگاری داده آفلاین Offline Data Persistence

• اعلان های فشاری و ماندگاری داده ها Push Notifications and Data Persistence

• وضعیت برنامه مداوم Persisting Application State

• سیم کشی Redux Persist Wiring Up Redux Persist

• Redux Persist چگونه کار می کند How Redux Persist Works

• Redux Persist - Gotcha عظیم! Redux Persist - Huge Gotcha!

ماندگاری داده آفلاین Offline Data Persistence

• اعلان های فشاری و ماندگاری داده ها Push Notifications and Data Persistence

• وضعیت برنامه مداوم Persisting Application State

• سیم کشی Redux Persist Wiring Up Redux Persist

• Redux Persist چگونه کار می کند How Redux Persist Works

• Redux Persist - Gotcha عظیم! Redux Persist - Huge Gotcha!

Push Notifications Push Notifications

• بررسی اجمالی اعلان فشار Push Notification Overview

• ثبت نام برای Push Notifications Registering For Push Notifications

• تولید Push Tokens Generating Push Tokens

• اعلان های تست Testing Notifications

• اطلاعات بیشتر در مورد اعلان ها و جمع بندی More on Notifications and Wrapup

Push Notifications Push Notifications

• بررسی اجمالی اعلان فشار Push Notification Overview

• ثبت نام برای Push Notifications Registering For Push Notifications

• تولید Push Tokens Generating Push Tokens

• اعلان های تست Testing Notifications

• اطلاعات بیشتر در مورد اعلان ها و جمع بندی More on Notifications and Wrapup

جایزه! Bonus!

• جایزه! Bonus!

جایزه! Bonus!

• جایزه! Bonus!