این پروژه یک برنامه کامل برای مدیریت وظایف است که شامل یک API بک‌اند قدرتمند با استفاده از Laravel و یک رابط کاربری مدرن و واکنش‌گرا با استفاده از Vue.js می‌باشد. این برنامه به کاربران امکان می‌دهد تا وظایف خود را سازماندهی کنند، با تیم همکاری کنند، مهلت تعیین کنند و پیشرفت کارها را به صورت بصری پیگیری نمایند.
- بخش بک‌اند (Laravel API)
- بخش فرانت‌اند (Vue Dashboard)
- توضیحات فرانت‌اند
- پیش‌نیازهای فرانت‌اند
- نصب فرانت‌اند
- پیکربندی محیط فرانت‌اند
- اجرای سرور توسعه فرانت‌اند
- ساخت برای تولید فرانت‌اند
- ساختار پروژه فرانت‌اند
- مسیریابی فرانت‌اند
- مدیریت وضعیت فرانت‌اند
- تعامل با API بک‌اند
- کامپوننت‌های فرانت‌اند
- تست‌های فرانت‌اند
- مشارکت در توسعه فرانت‌اند
- لایسنس فرانت‌اند
- استقرار فرانت‌اند
این بخش شامل API بک‌اند برنامه مدیریت وظایف است که با استفاده از فریم‌ورک Laravel و برای مدیریت داده‌ها و ارائه خدمات به فرانت‌اند ایجاد شده است. از Laravel Sanctum برای احراز هویت API استفاده می‌کند.
- PHP: نسخه 8.1 یا بالاتر
- Composer: آخرین نسخه
- MySQL (نسخه 5.7 یا بالاتر) یا هر پایگاه داده دیگری که Laravel پشتیبانی می‌کند.
- Node.js و npm (در صورت نیاز به اجرای تست‌های جاوااسکریپت یا استفاده از Vite برای دارایی‌ها)
-
کلون کردن ریپازیتوری:
git clone https://github.com/gcorp-llc/Task-Management cd core -
نصب وابستگی‌ها با Composer:
composer install
-
کپی کردن فایل
.env.exampleبه.envو پیکربندی:cp .env.example .env
فایل
.envرا باز کنید و تنظیمات مربوط به پایگاه داده، ایمیل و سایر متغیرهای محیطی را پیکربندی کنید. -
تولید کلید برنامه:
php artisan key:generate
-
اجرای مایگریشن‌های پایگاه داده:
php artisan migrate
-
(اختیاری) اجرای سیدرهای پایگاه داده:
php artisan db:seed
فایل .env حاوی تنظیمات محیطی برنامه بک‌اند شما است. تنظیمات مهم شامل نام برنامه، محیط، حالت اشکال‌زدایی، URL برنامه و تنظیمات پایگاه داده می‌باشد.
برای اجرای سرور توسعه Laravel، از دستور زیر استفاده کنید:
php artisan serveبه طور پیش‌فرض، API شما بر روی آدرس http://localhost:8000 در دسترس خواهد بود.
| Endpoint | متد | توضیحات | پارامترهای درخواست (در صورت وجود) |
|---|---|---|---|
/api/register |
POST | ثبت نام کاربر جدید | name, email, password, password_confirmation |
/api/login |
POST | ورود کاربر و دریافت توکن احراز هویت | email, password |
/api/logout |
POST | خروج کاربر و باطل کردن توکن احراز هویت (نیاز به احراز هویت) | - |
/api/tasks |
GET | دریافت لیست تسک‌های کاربر احراز هویت شده با قابلیت فیلتر و صفحه‌بندی | status (pending, in_progress, completed), priority (low, medium, high), sortBy (title, created_at, due_date), sortDirection (asc, desc), search |
/api/tasks |
POST | ایجاد تسک جدید برای کاربر احراز هویت شده | title (required), description, status (optional), priority (optional), due_date (optional) |
/api/tasks/{task} |
GET | دریافت جزئیات یک تسک خاص (نیاز به احراز هویت) | - |
/api/tasks/{task} |
PUT | به‌روزرسانی یک تسک خاص (نیاز به احراز هویت) | title, description, status, priority, due_date |
/api/tasks/{task} |
DELETE | حذف یک تسک خاص (نیاز به احراز هویت) | - |
/api/tasks/{task}/comments |
GET | دریافت لیست کامنت‌های مربوط به یک تسک خاص با صفحه‌بندی (نیاز به احراز هویت) | - |
/api/tasks/{task}/comments |
POST | ایجاد کامنت جدید برای یک تسک (نیاز به احراز هویت) | body (required) |
/api/comments/{comment} |
PUT | به‌روزرسانی یک کامنت خاص (نیاز به احراز هویت) | body (required) |
/api/comments/{comment} |
DELETE | حذف یک کامنت خاص (نیاز به احراز هویت) | - |
این API از Laravel Sanctum برای احراز هویت استفاده می‌کند. کاربران می‌توانند ثبت نام کنند، وارد سیستم شوند و یک توکن برای دسترسی به نقاط پایانی محافظت شده دریافت کنند. توکن باید در هدر Authorization با فرمت Bearer {your_token} ارسال شود.
ساختار دایرکتوری اصلی پروژه Laravel در بخش قبلی توضیح داده شده است. کنترلرهای API در app/Http/Controllers/Api و مدل‌های Eloquent در app/Models قرار دارند.
برای اجرای تست‌های بک‌اند با استفاده از Pest، از دستور زیر استفاده کنید:
./vendor/bin/pestقبل از اجرای تست‌ها، مطمئن شوید که فایل .env.testing به درستی پیکربندی شده و پایگاه داده تست شما migrate شده است.
برای مشارکت در توسعه بک‌اند، لطفاً ابتدا یک issue ایجاد کنید و سپس یک pull request با تغییرات خود ارسال نمایید.
این بخش شامل رابط کاربری برنامه مدیریت وظایف است که با استفاده از فریم‌ورک Vue.js (با Composition API و <script setup>) و کتابخانه Tailwind CSS توسعه داده شده است.
- Node.js: نسخه 18 یا بالاتر
- npm: نسخه 9 یا بالاتر یا yarn: نسخه 1.22 یا بالاتر
- Git: برای کنترل نسخه
-
کلون کردن ریپازیتوری:
git clone https://github.com/gcorp-llc/Task-Management cd front -
نصب وابستگی‌ها:
npm install
یا
yarn install
فایل .env.local را در ریشه پروژه Vue ایجاد کرده و VITE_API_BASE_URL را با آدرس URL پایه API بک‌اند تنظیم کنید.
VITE_API_BASE_URL=http://localhost:8000/api
npm run devیا
yarn devبرنامه شما معمولاً بر روی http://localhost:3000 در دسترس خواهد بود.
npm run buildیا
yarn buildفایل‌های نهایی در دایرکتوری dist قرار می‌گیرند.
ساختار دایرکتوری پروژه Vue در بخش قبلی توضیح داده شده است.
برنامه از vue-router برای مدیریت مسیرها استفاده می‌کند. تنظیمات در src/router/index.js قرار دارد.
از pinia برای مدیریت وضعیت سراسری برنامه استفاده شده است. استورها در src/stores قرار دارند.