آموزش بهترین دوره React Native سال 2025 (از مبتدی تا متخصص) - آخرین آپدیت

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

شروع به کار Getting Started

• پیش نیازهای دوره Course prerequisites

• React Native چیست؟ What is React Native

• Expo در مقابل React Native Expo vs React Native

• معرفی Expo Snack Introduction to Expo Snack

• راه اندازی محیط Set up environment

• ایجاد اولین برنامه Create Your First App

• شبیه ساز iOS (MacOS) iOS Simulator (MacOS)

• اجرای برنامه روی دستگاه واقعی Run App on Real Device

• شبیه ساز Android (MacOS) Android Emulator (MacOS)

• راه اندازی محیط ویندوز Setup Environment Windows

UI و کامپوننت های اصلی UI & Core Components

• توضیح کد اولیه Explain Init Code

• SafeAreaView SafeAreaView

• Text Text

• StyleSheet StyleSheet

• Images Images

• Buttons & Pressable & Touchable Buttons & Pressable & Touchable

• ScrollView ScrollView

• Platfrom Platfrom

• Loaders Loaders

• Views Views

• Margin & Padding Margin & Padding

• Flex Flex

• flex-direction flex-direction

• flexWrap flexWrap

• Positions Positions

• Dimensions Dimensions

• Responsive UI Responsive UI

• useState Hook useState Hook

• Modal Modal

• Expo Icons Expo Icons

• ImageBackground ImageBackground

• TextInput TextInput

• ایجاد کامپوننت React Create React Component

تمرین تسلط بر UI UI Mastering Practice

• مقدمه ای بر تسلط بر UI UI Mastring Introduction

• طراحی Figma Figma Design

• PNG در مقابل SVG PNG vs SVG

• صفحه معرفی Intro Screen

• آواتار کاربر User Avatar

• کامپوننت Header Header Component

• بخش Social Social Section

• کانتینر Social Social Container

• اتمام صفحه تماس با ما Finish Contact Us Screen

• Header صفحه اصلی Home Screen Header

• زبانه های بالا Top Tabs

• کامپوننت Card با پوشش تیره Card Component with Dark Overlay

• FlatList با 2 ردیف FlatList with 2 Rows

• FlatList با Props FlatList with Props

• Header صفحه پرداخت Payment Screen Header

• روش پرداخت Payment Method

• روش پرداخت انتخاب شده Payment Method Selected

• لیست پرداخت Payment List

• جعبه کارت بانکی Bank Card Box

• دکمه افزودن Add Button

• اضافه کردن انیمیشن Adding Animations

• زمان انجام وظیفه Task Time

Navigation و زبانه های پایین Navigation & Bottom Tabs

• ساخت صفحات Builds Screens

• Stack Navigation Stack Navigation

• مرور و گزینه های صفحه Recap & Screen Options

• useRoute useRoute

• BottomTabs BottomTabs

کار با API ها Working with APIs

• ایجاد برنامه جدید Create New App

• ایجاد API سفارشی (Mock Api) Create Custom API ( Mock Api )

• Axios Axios

• درخواست Get و FlatList Get Request & FlatList

• درخواست Get By Id Get By Id Request

• Try Catch Try Catch

• درخواست Delete Delete Request

• درخواست Post Post Request

• درخواست Put Put Request

• بازسازی و ایجاد صفحه اصلی برای پروژه جدید Refactor And Create Home Screen For New Project

• Book Card Book Card

• Props Props

• توابع API APIs Functions

• رندر داده ها در Flatlist Render Data In Flatlist

• حذف کتاب Delete Book

• UI دکمه افزودن و Modal Add Button UI & Modal

• CustomTextInput CustomTextInput

• دکمه ذخیره Save Button

• ایجاد کتاب Create Book

• ویرایش کتاب Edit Book

Redux و Redux Toolkit Redux & Redux Toolkit

• Redux آنقدرها هم سخت نیست Redux is not that hard

• چرا Redux مفید است؟ Why Redux Useful

• Reducer توضیح داده شد Reducer Explained

• ایجاد Store و دریافت داده ها از Global State Create Store and Get Data From Global State

• actions & useDispatch actions & useDispatch

• Payload Payload

• Combine Reducers Combine Reducers

• RootState RootState

• مرور Redux & Task Recap Redux & Task

• Redux toolkit Store Redux toolkit Store

• Redux Toolkit Reducer & Actions Redux Toolkit Reducer & Actions

UI اپلیکیشن فروشگاه آنلاین هوشمند | قسمت 1 Smart E-Commerce App UI | Part 1

• ایجاد پروژه Create Project

• ساختار پوشه Folder Structure

• AppText AppText

• App Colors App Colors

• AppSafeView AppSafeView

• Flash Message Flash Message

• AppButton AppButton

• AppTextInput AppTextInput

• صفحه ورود Sign In Screen

• صفحه ثبت نام Sign Up Screen

• Stack Navigation Stack Navigation

• Bottom Tabs & Main App Stack Bottom Tabs & Main App Stack

• Style Bottom Tabs Style Bottom Tabs

• App Header App Header

• App Custom Fonts App Custom Fonts

• آماده سازی داده ها Prepare Data

• Product Card Product Card

• دکمه افزودن به سبد خرید Add To Cart Button

• Shadow Shadow

• Props Props

• رندر داده ها در FlatList Render Data in FlatList

• Empty Cart Component Empty Cart Component

• Cart Item Cart Item

• دکمه های افزایش/کاهش Increase Decrease Buttons

• Cart Item Props Cart Item Props

• Totals View Totals View

• Cart Screen Cart Screen

• Checkout Screen Checkout Screen

• Profile Screen Profile Screen

• My Orders Screen My Orders Screen

مدیریت وضعیت سبد خرید (Redux Toolkit) Cart State Management (Redux Toolkit)

• ایجاد Store Create Store

• cartSlice cartSlice

• افزودن آیتم به سبد خرید Add Item To Cart

• حذف آیتم از سبد خرید Remove Item From Cart

• حذف محصول Delete Product

• اتمام صفحه سبد خرید Finish Cart Screen

کار با فرم ها Forms Handling

• کار با فرم ها با استفاده از useState Handling Forms using useState

• AppTextInputCotroller AppTextInputCotroller

• Style Error Message Style Error Message

• Yup & Validation Schemas Yup & Validation Schemas

• Add Typescript Add Typescript

• Auth Validation Task Auth Validation Task

احراز هویت و پایگاه داده Firebase Authentication & Firebase Database

• Firebase Init Firebase Init

• ورود کاربران Sign in users

• Handling Errors Handling Errors

• ثبت نام کاربران جدید Register new users

• Firestore Database Firestore Database

• دریافت داده ها از پایگاه داده Get data from database

• ذخیره داده های کاربر در Global State Save User Data In Global State

• Place Orders Place Orders

• Fix redux warning & duplicate orders Fix redux warning & duplicate orders

• Get users order Get users order

• Handling orders date Handling orders date

بومی سازی Localization

• Localization Introduction Localization Introduction

• How to create Bottom Sheet How to create Bottom Sheet

• How to create radio button How to create radio button

• Setup localization Setup localization

• Get Translation Get Translation

• Adding English Translation Adding English Translation

• Finish All Translation Files Finish All Translation Files

• Handle Change Lang Handle Change Lang

فضای ذخیره سازی محلی Local Storage

• Introduction to Async Storage Introduction to Async Storage

• Save Data In Local Storage Save Data In Local Storage

• Get Data From Local Storage Get Data From Local Storage

• Clear Data Clear Data

• Save Logged in State in Local Storage Save Logged in State in Local Storage

• Logout & Auth State Loading Logout & Auth State Loading

• App Loading App Loading

• Firebase Change Auth State Firebase Change Auth State

• Better Auth Approach Better Auth Approach

• Saving User Language in Local Storage Saving User Language in Local Storage

• Redux Persist Redux Persist

استقرار Deployment

• تغییر آیکن و نام برنامه Change App Icon & Name

• App Splash Screen App Splash Screen

• EAS EAS

• Generate Build ( APK ) Generate Build ( APK )

• Generate Build ( AAB ) Generate Build ( AAB )

• How to Create & Verify a Google Play Developer Account ( Optional ) How to Create & Verify a Google Play Developer Account ( Optional )

• How to Publish an Android App to Google Play ( Optional ) How to Publish an Android App to Google Play ( Optional )

• How to Create your Apple Developer Account ( Optional ) How to Create your Apple Developer Account ( Optional )

• How to Publish an iOS App to App Store ( Optional ) How to Publish an iOS App to App Store ( Optional )

معرفی React Native CLI Introduction to React Native CLI

• React Native CLI React Native CLI

• How Expo and CLI share a lot together How Expo and CLI share a lot together

• Mac IOS Environment Setup Mac IOS Environment Setup

• Mac Android Environment Setup Mac Android Environment Setup

• Run app on IOS & Android Run app on IOS & Android

• Run App on Real Android Device Run App on Real Android Device

• Run App on Real iPhone Device Run App on Real iPhone Device

• Introduction to Yarn Introduction to Yarn

Firebase با React Native CLI Firebase with React Native CLI

• Change Bundle ID Change Bundle ID

• Integrate Firebase with Android Integrate Firebase with Android

• Integrate Firebase with IOS Integrate Firebase with IOS

• Push Notifications Android Push Notifications Android

• Foreground Notifications Foreground Notifications

• Social Login | Google Gmail Login with Android Social Login | Google Gmail Login with Android

• Social Login | Google Gmail Login with iOS Social Login | Google Gmail Login with iOS

• Source Code Of This Section Source Code Of This Section

کد Native & Native Modules Native Code & Native Modules

• Open Gallery And Camera To Pick Images Open Gallery And Camera To Pick Images

• Change App Name Change App Name

• Change App Icon iOS Change App Icon iOS

• Chane App Icon Android Chane App Icon Android

• Splash Screen Android Splash Screen Android

• Splash Screen iOS Splash Screen iOS

• Integrate Google Maps & iOS Maps in React Native App Integrate Google Maps & iOS Maps in React Native App

• Display Google Map in App. Display Google Map in App.

• Adding Markers to MapView Adding Markers to MapView

• Source Code Of This Section Source Code Of This Section

• React Native Vector Icons React Native Vector Icons

• How to use SVGs with React Native How to use SVGs with React Native

برنامه چت هوش مصنوعی | ساختار پوشه AI Chat App | Folder Structure

• App Init Structures App Init Structures

• Useful Scripts Useful Scripts

• Integrate with Reactotron Integrate with Reactotron

برنامه چت هوش مصنوعی | UI & Integration برنامه AI Chat App | App UI & Integration

• App Header App Header

• Sent Message Card Sent Message Card

• Response Message Card Response Message Card

• Put Messages In FlatList Put Messages In FlatList

• Adding Typescript Adding Typescript

• Chat Input Chat Input

• KeyboardAvoidingView KeyboardAvoidingView

• ChatInput Props ChatInput Props

• Send Messages Send Messages

• Receive Messages Receive Messages

• Adding Typing Effect Adding Typing Effect

• Empty Chat Screen Empty Chat Screen

• Auto Scroll To Bottom in FlatList Auto Scroll To Bottom in FlatList

• Keyboard State Keyboard State

• Create Hugging Face Access Token Create Hugging Face Access Token

• Connect App With Hugging ( GPT2 ) Connect App With Hugging ( GPT2 )

• Display Hugging Face ( GPT2 ) Response Display Hugging Face ( GPT2 ) Response

• Create OpenAI Key Create OpenAI Key

• Connect with OpenAI And Get Smarter Answers Connect with OpenAI And Get Smarter Answers

• Fix Input Padding Bottom Fix Input Padding Bottom

• Adding try catch Adding try catch

• Adding Thinking Loading Adding Thinking Loading

• Fix Typing Effect Issue Fix Typing Effect Issue

• Task Time Task Time

• Source Code Of Section Source Code Of Section

استقرار React Native CLI React Native CLI Deployment

• Generate APK & AAB for Android Generate APK & AAB for Android

• Publish your React Native CLI app to Apple App Store ( Optional ) Publish your React Native CLI app to Apple App Store ( Optional )

• OTA Updates Android OTA Updates Android

• OTA Updates iOS OTA Updates iOS

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

• Moving Elements Horizontally Moving Elements Horizontally

• Moving Elements Horizontally Multiple Times Moving Elements Horizontally Multiple Times

• Move Elements Vertically Move Elements Vertically

• Task Time - Task 1 Task Time - Task 1

• Animation Sequence Animation Sequence

• Fade Animation Fade Animation

• Task Time - Task 2 Task Time - Task 2

• This Section is Not End Yet This Section is Not End Yet

دوره فشرده JavaScript (اختیاری) JavaScript Crash Course ( Optional )

• Logging Logging

• Comments Comments

• Data Types Data Types

• Variables Rules Variables Rules

• var let const var let const

• Statements Statements

• Arithmetic Operators Arithmetic Operators

• Strings Strings

• String Templates String Templates

• String Methods String Methods

• Objects Objects

• Arrays Arrays

• Boolean Boolean

• Comparison Comparison

• Logical Operator Logical Operator

• if else if else

• functions functions