آموزش تسلط بر React Native، React Native Skia و Reanimated - آخرین آپدیت

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

مقدمه Introduction

• مقدمه Introduction

• لینک‌های نصب Installation Links

• مخزن گیت‌هاب Github Repo

• قالب فیگما Figma Template

راه‌اندازی Setup

• بررسی فیگما Figma Walkthrough

• پکیج‌ها برای راه‌اندازی پروژه Packages for Project Setup

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

• راه‌اندازی اپلیکیشن Application Setup

• راه‌اندازی اپلیکیشن 2. Skia! Application Setup 2. Skia!

• Expo Go Expo Go

• EAS Build/Development Build EAS Build/Development Build

• پیکربندی اندروید Android Configuration

• راه‌اندازی ساختار پوشه‌ها Folder Structure Setup

• پوشه‌های شروع Starter Folders

بخش 1: صفحه اصلی Part 1: Home Page

• پس‌زمینه صفحه اصلی - گرادیان خطی Home Background - Linear Gradient

• پس‌زمینه صفحه اصلی - گرادیان خطی قسمت 2 Home Background - Linear Gradient Part 2

• پس‌زمینه صفحه اصلی - تصویر پس‌زمینه Home Background - Background Image

• پس‌زمینه صفحه اصلی - تصویر خانه Home Background - House Image

• پس‌زمینه صفحه اصلی - تصویر خانه 2 Home Background - House Image 2

• پس‌زمینه صفحه اصلی - تصویر خانه 3 Home Background - House Image 3

• پس‌زمینه صفحه اصلی - افکت دود - 1 Home Background - Smoke Effect - 1

• پس‌زمینه صفحه اصلی - افکت دود - 2 Home Background - Smoke Effect - 2

• پس‌زمینه صفحه اصلی - افکت دود - 3 Home Background - Smoke Effect - 3

• پس‌زمینه صفحه اصلی - افکت دود - 4 Home Background - Smoke Effect - 4

• نوار تب - قسمت 1 - ساخت نوار تب Tab Bar - Part 1 - Building the Tabbar

• نوار تب - قسمت 2 - موقعیت‌دهی نوار تب Tab Bar - Part 2 - Position the Tabbar

• نوار تب - قسمت 3 - ساخت قوس Tab Bar - Part 3 - Build the Arc

• نوار تب - قسمت 4 Tab Bar - Part 4

• نوار تب - قسمت 5 - گرادیان خطی Tab Bar - Part 5 - Linear Gradient

• نوار تب قسمت 6 - Border Stroke Tab Bar Part 6 - Border Stroke

• نوار تب قسمت 7 - آیکون‌ها Tab Bar Part 7 - Icons

• نوار تب قسمت 8 - موقعیت‌ها Tab Bar Part 8 - Positions

• نوار تب قسمت 9 - دکمه وسط Tab Bar Part 9 - Middle Button

• نوار تب قسمت 10 - مقیاس‌بندی Tab Bar Part 10 - Scaling

• نوار تب قسمت 11 - دکمه دایره‌ای Tab Bar Part 11 - Circle Button

• نوار تب قسمت 12 - علامت به اضافه Tab Bar Part 12 - Plus Sign

• نوار تب قسمت 13 - موقعیت Tab Bar Part 13 - Position

• نوار تب قسمت 14 - دکمه قابل فشردن Tab Bar Part 14 - Pressable Button

• نوار تب قسمت 15 - رفع مشکل Tab Bar Part 15 - Fix issue

• بخش آب و هوا قسمت 1 Weather Section Part 1

• بخش آب و هوا قسمت 2 Weather Section Part 2

• بخش آب و هوا قسمت 3 Weather Section Part 3

• بخش آب و هوا قسمت 4 Weather Section Part 4

• نوار تب پایین قسمت 1 Bottom Tab Bar Part 1

• نوار تب پایین قسمت 2 - نیازمندی‌های Bottom Sheet Bottom Tab Bar Part 2 - Bottom Sheet Reqs

• نوار تب پایین قسمت 3 - دستگیره نشانگر Bottom Tab Bar Part 3 - Handle Indicator

• نوار تب پایین قسمت 4 - پس‌زمینه Bottom Tab Bar Part 4 - Background

• نوار تب پایین قسمت 5 - Blur View! Bottom Tab Bar Part 5 - Blur View!

• نوار تب پایین قسمت 6 - سایه‌ها! Bottom Tab Bar Part 6 - Shadows!

• نوار تب پایین قسمت 7 - کنترل پیش‌بینی Bottom Tab Bar Part 7 - Forecast Control

• نوار تب پایین قسمت 8 - بخش کنترل Bottom Tab Bar Part 8 - Control Segment

• نوار تب پایین قسمت 9 - لایه زیرخط Bottom Tab Bar Part 9 - Underline Layer

• نوار تب پایین قسمت 10 - کپسول Bottom Tab Bar Part 10 - Capsule

• نوار تب پایین قسمت 11 - داده! Bottom Tab Bar Part 11 - Data !

• نوار تب پایین قسمت 12 Bottom Tab Bar Part 12

• نوار تب پایین قسمت 13 - کپسول‌ها! Bottom Tab Bar Part 13 - Capsules!

• نوار تب پایین قسمت 14 - شفافیت Bottom Tab Bar Part 14 - Opacity

• نوار تب پایین قسمت 15 - پیش‌بینی هفتگی Bottom Tab Bar Part 15 - Weekly Forecast

• نوار تب پایین قسمت 16 - ابزارهای کمکی تاریخ! Bottom Tab Bar Part 16 - Date Helpers!

• نوار تب پایین قسمت 17 - ویجت‌ها Bottom Tab Bar Part 17 - Widgets

• نوار تب پایین قسمت 18 - خانه‌تکانی Bottom Tab Bar Part 18 - House Cleaning

بخش 2: انیمیشن‌ها Part 2: Animations

• انیمیشن‌ها قسمت 1 Animations Part 1

• انیمیشن‌ها قسمت 2 - انیمیشن‌های پایه Animations Part 2 - Basic Animations

• انیمیشن‌ها قسمت 3 - انیمیشن‌های ساده! Animations Part 3 - Simple Animations!

• انیمیشن‌ها قسمت 4 Animations Part 4

• انیمیشن‌ها قسمت 5 - بازگشت به اپلیکیشن ما! Animations Part 5 - Back to Our App!

• انیمیشن‌ها قسمت 6 - نرمال‌سازی مقادیر Animations Part 6 - Normalize Values

• انیمیشن‌ها قسمت 7 - Prop Drilling؟ Animations Part 7 - Prop Drilling?

• انیمیشن‌ها قسمت 8 Animations Part 8

• انیمیشن‌ها قسمت 9 - Canvas متحرک و تصویر Animations Part 9 - Animated Canvas & Img

• انیمیشن‌ها قسمت 10 - مشکلات گرادیان Animations Part 10 - Gradient Issues

• انیمیشن‌ها قسمت 11 - مشکل اندروید؟ Animations Part 11 - Android Issue?

• انیمیشن‌ها قسمت 12 - انیمیشن‌های نوار تب Animations Part 12 - Tab bar animations

• انیمیشن‌ها قسمت 13 - انیمیشن‌های بخش آب و هوا Animations Part 13 - Weather Section Animations

• انیمیشن‌ها قسمت 14 Animations Part 14

• انیمیشن‌ها قسمت 15 Animations Part 15

• انیمیشن‌ها قسمت 16 - انیمیشن‌های پیش‌بینی Animations Part 16 - Forecast Animations

بخش 3: صفحه جزئیات Part 3 : Details Page

• صفحه جزئیات قسمت 1 Details Page Part 1

• صفحه جزئیات قسمت 2 Details Page Part 2

• صفحه جزئیات قسمت 3 - هدر Details Page Part 3 - Header

• صفحه جزئیات قسمت 4 - نوار جستجو! Details Page Part 4 - Search Bar!

• صفحه جزئیات قسمت 5 - مسیر 1 Details Page Part 5 - Path 1

• صفحه جزئیات قسمت 6 - مسیر 2 Details Page Part 6 - Path 2

• صفحه جزئیات قسمت 7 - داده‌های پیش‌بینی! Details Page Part 7 - Forecast Data!

• صفحه جزئیات قسمت 8 - چرخش Details Page Part 8 - Rotation

بخش 4: داده‌های ایستا به پویا Part 4 : Static to Dynamic Data

• API قسمت 1 API Part 1

• API قسمت 2 - بررسی اجمالی API Part 2 - Overview

• دارایی‌ها برای API آب و هوا Assets for the Weather API

• API قسمت 3 - Context؟ API part 3 - Context?

• API قسمت 4 API Part 4

• API قسمت 5 API Part 5

• API قسمت 6 - جمع‌بندی! API Part 6 - Wrapping up!

• API قسمت 7 - متشکرم! API Part 7 - Thank you!

• متشکرم! Thank you!