آموزش پروژه آخر هفته: ردیاب زمان با استفاده از ReactJS و Firebase
Weekend Project: Time Tracker Using ReactJS and Firebase
با دوره جامع آخر هفته ما در مورد ردیاب زمان با استفاده از ReactJS و Firebase استاد کدنویسی کارآمد شوید. این دوره عملی به‌ویژه برای کسانی طراحی شده است که می‌خواهند مهارت‌های توسعه کامل خود را ارتقا دهند و درک خود را از مدیریت زمان بهبود بخشند.
در طول این سفر همهجانبه آخر هفته، یک برنامه ردیابی زمان کاملاً کاربردی، با عملیات CRUD (ایجاد، خواندن، به‌روزرسانی، حذف) با استفاده از Firebase ایجاد خواهید کرد. از راه‌اندازی محیط Firebase تا دستکاری داده‌ها در زمان واقعی، در مدیریت عملیات پایگاه داده مهارت کسب خواهید کرد و نحوه پیاده‌سازی آنها در یک پروژه عملی را درک خواهید کرد.
یکی از عناصر کلیدی این دوره، اجرای احراز هویت Firebase است. شما یاد خواهید گرفت که چگونه برنامه خود را ایمن کنید، و تنها به کاربران تأیید شده اجازه می دهید تا اقدامات را انجام دهند. این مهارت حیاتی نه تنها برای پروژه ردیاب زمان ضروری است، بلکه یک جنبه حیاتی از هر برنامه وب مدرن است.
رویکرد مبتنی بر پروژه ما تضمین می‌کند که هر وظیفه در برنامه به کاربر خاصی مرتبط است، زمینه دنیای واقعی را ارائه می‌دهد و درک شما از توسعه متمرکز بر کاربر را افزایش می‌دهد.
این دوره همچنین شما را از طریق ایجاد گزارش‌های زمانی جامع راهنمایی می‌کند، که کاربران می‌توانند به صورت هفتگی، ماهانه یا کل مشاهده کنند. این جنبه از دوره توانایی شما را برای کار با تاریخ و زمان، ارائه و مرتب‌سازی داده‌ها و ایجاد گزارش‌های جذاب بصری تقویت می‌کند.
چه یک توسعه‌دهنده مشتاق تمام پشته باشید که به دنبال تقویت مهارت‌های خود هستید یا یک حرفه‌ای باتجربه که به دنبال درک پیاده‌سازی عملی ReactJS و Firebase هستید، این دوره آخر هفته ترکیبی از تئوری، تجربه عملی و برنامه‌های کاربردی در دنیای واقعی را ارائه می‌دهد. توسعه. در پایان این دوره، شما نه تنها یک برنامه ردیاب زمان کاملاً عملیاتی در اختیار خواهید داشت، بلکه درک محکمی از مدیریت و توسعه پروژه‌ها با استفاده از 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
Udemy (یودمی)
یودمی یکی از بزرگ‌ترین پلتفرم‌های آموزشی آنلاین است که به میلیون‌ها کاربر در سراسر جهان امکان دسترسی به دوره‌های متنوع و کاربردی را فراهم می‌کند. این پلتفرم امکان آموزش در زمینه‌های مختلف از فناوری اطلاعات و برنامه‌نویسی گرفته تا زبان‌های خارجی، مدیریت، و هنر را به کاربران ارائه می‌دهد. با استفاده از یودمی، کاربران می‌توانند به صورت انعطاف‌پذیر و بهینه، مهارت‌های جدیدی را یاد بگیرند و خود را برای بازار کار آماده کنند.
یکی از ویژگی‌های برجسته یودمی، کیفیت بالای دوره‌ها و حضور استادان مجرب و با تجربه در هر حوزه است. این امر به کاربران اعتماد می‌دهد که در حال دریافت آموزش از منابع قابل اعتماد و معتبر هستند و می‌توانند به بهترین شکل ممکن از آموزش‌ها بهره ببرند. به طور خلاصه، یودمی به عنوان یکی از معتبرترین و موثرترین پلتفرم‌های آموزشی آنلاین، به افراد امکان می‌دهد تا به راحتی و با کیفیت، مهارت‌های مورد نیاز خود را ارتقا دهند و به دنبال رشد و پیشرفت شغلی خود باشند.
https://donyad.com/d/a949fa
iNovotek Academy
یک مهندس نرم افزار ارشد با بیش از 7 سال تجربه برنامه نویسی در Node js ، Express js ، React Js ، Redux ، Javascript ، MongoDB/Mongoose برای ایجاد برنامه های بزرگ تجاری برای شرکت ها. شروع یادگیری چیز جدیدی می تواند چالش برانگیز باشد و منابع بسیار زیادی در دسترس است که می تواند بسیار زیاد باشد. به همین دلیل ، من از تمام مهارت هایی که دارم برای ایجاد پروژه های با کیفیت بالا استفاده می کنم که ارزش واقعی را به نمونه کارهای دانش آموزان اضافه می کند و شغل آنها را در توسعه وب شروع می کند.
Pretty Akyeremu Akyeremu
خیابان کدینگ
نمایش نظرات