آموزش پروژه آخر هفته: ردیاب زمان با استفاده از ReactJS و Firebase

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

شروع شدن GETTING STARTED

• نسخه ی نمایشی پروژه Project Demo

• مخزن نهایی پروژه Final Project Repository

• نمای کلی Firebase Firebase Overview

• برنامه جدید React ایجاد کنید Create new React App

• Tailwindcss را نصب کنید Install Tailwindcss

• React Router DOM را پیکربندی کنید Configure React Router DOM

• ارائه قالب ها و فایل ها Providing Templates and Files

• صفحه اصلی و پاورقی را رندر کنید Render Homepage and Footer

احراز هویت FIREBASE FIREBASE AUTHENTICATION

• رندر فرم ورود Render Login Form

• اتصال به Firebase Connect To Firebase

• ثبت نام کاربر User Registration

• ورود کاربر Login User

• نمایش بارگیری تأیید شده، خطا Display Authenticated Loading, Error

• ورود به سیستم گوگل Google Sign In

• اگر کاربر وارد سیستم شده باشد، تغییر مسیر دهید Redirect if user is login

ایجاد وظایف - FIRESTORE CREATING TASKS - FIRESTORE

• فعال کردن Firestore Enabling Firestore

• رندر ایجاد فرم وظیفه Render Create Task Form

• عملکرد ذخیره داده ها در firestore Function to save data into firestore

• ذخیره سند در فایر استور Saving Document into firestore

گزارش کار TASK REPORTING

• مولفه گزارش رندر Render Report Component

• وظایف گزارش وضعیت محلی Tasks Reporting Local State

• روش پرس و جو وظایف Tasks query method

• مسیر خصوصی Private Route

• واکشی همه وظایف Fetch All tasks

• نمایش وظایف Displaying tasks

• Tasks Dummy Handlers Tasks Dummy Handlers

• کنترل کننده دکمه های رندر Render buttons handler

• تابع برای شروع کار Function To Start Task

• وظیفه مکث را مدیریت کنید Handle Pause Task

• فرمت تاریخ و تغییر رنگ وضعیت به صورت پویا Format Date and Change Status color dynamically

• عملکرد ارائه توضیحات Function to render descriptions

• به روز رسانی Task Update Task

• مجموع زمان را در ماه ها هفته و کل محاسبه کنید Calculate Total Time in Months weeks and total

• تابع زمان قالب بندی Format Time Utility Function

• نمایش مشخصات پروفایل کاربر Display User Profile Details

• صادرات وظایف Export Tasks

• خروج Logout

• Task را حذف کنید Delete Task

• پایان THE END