CrewBoard is a lightweight workforce coordination app for tracking employees, tasks, work status, and team updates. It combines a Vite + React frontend with a Django REST API and MongoDB backend.
- Employee roster management
- Employee roles: Employee and Admin
- Task creation and assignment
- Task status updates:
- Working
- Paused
- Stopped
- Task comments and progress updates
- MongoDB-backed persistence
- React dashboard interface
- Django REST API backend
- Frontend deployment on Vercel
- Backend deployment on AWS
- Frontend: React, Vite, JavaScript, CSS
- Backend: Django, Django REST Framework
- Database: MongoDB
- Frontend hosting: Vercel
- Backend hosting: AWS
crewboard/
├── frontend/
│ ├── public/
│ ├── src/
│ │ ├── App.jsx
│ │ ├── App.css
│ │ ├── index.css
│ │ └── main.jsx
│ ├── package.json
│ ├── vite.config.js
│ └── ...
├── backend/
│ ├── core/
│ │ ├── serializers.py
│ │ ├── views.py
│ │ ├── urls.py
│ │ └── mongo.py
│ ├── micromanage/
│ ├── manage.py
│ ├── requirements.txt
│ └── ...
└── README.md
- Add employees to the team roster
- Assign employee roles
- View the current employee list
- Create new tasks
- Assign tasks to team members
- View all active tasks
- Change task status
Each task can have one of the following statuses:
- Working: The task is currently in progress
- Paused: Work has temporarily stopped
- Stopped: Work has been completed or cancelled
- Add comments or suggestions to tasks
- Store updates against individual tasks
- Use updates for communication and progress tracking
cd frontend
npm install
npm run devThe frontend will usually be available at:
http://localhost:5173
cd backend
python -m venv venv
source venv/bin/activateOn Windows:
venv\Scripts\activateInstall the dependencies:
pip install -r requirements.txtRun Django:
python manage.py runserverThe backend will usually be available at:
http://localhost:8000
Configure the following backend variables:
MONGO_URI=your_mongodb_connection_string
SECRET_KEY=your_secret_key
DEBUG=TrueFor production, set:
DEBUG=FalseThe frontend uses the VITE_API_BASE environment variable to determine where API requests should be sent:
VITE_API_BASE=http://localhost:8000For production:
VITE_API_BASE=https://your-api-domain.comThe production backend must support HTTPS when the frontend is hosted on Vercel.
The current backend provides endpoints similar to:
GET /employees/
POST /employees/
GET /tasks/
POST /tasks/
PATCH /tasks/<task_id>/status/
GET /tasks/<task_id>/updates/
POST /tasks/<task_id>/updates/
The frontend can be deployed to Vercel.
Configure the following Vercel environment variable:
VITE_API_BASE=https://your-api-domain.comAfter changing environment variables, create a new deployment because Vite injects environment variables during the build process.
The Django backend can be deployed to AWS.
For production deployment:
- Use an HTTPS-enabled domain
- Configure a valid SSL certificate
- Configure CORS for the Vercel frontend domain
- Set
DEBUG=False - Use a secure
SECRET_KEY - Restrict
ALLOWED_HOSTS - Protect MongoDB credentials
- Configure AWS security groups and firewall rules
Example CORS configuration:
CORS_ALLOWED_ORIGINS = [
"https://crewboard-frontend.vercel.app",
]Do not use an HTTP backend URL from an HTTPS frontend because browsers block mixed-content requests.
The long-term vision for CrewBoard is to evolve from a traditional team management dashboard into an immersive digital workplace.
The metaverse layer will allow teams to interact with tasks, employees, projects, and meetings inside shared virtual workspaces.
- Create virtual office rooms for teams and departments
- Create dedicated project areas
- Add meeting rooms, planning areas, and collaboration zones
- Organize workspaces by company, team, or project
- Give every employee a customizable avatar
- Display employees inside the virtual workspace
- Show online, offline, busy, and focus statuses
- Allow users to move between different virtual rooms
Tasks could become interactive objects inside the virtual environment.
For example:
- A working task could glow green
- A paused task could appear dimmed
- A stopped task could appear grey
- Overdue tasks could display warning indicators
- High-priority tasks could be highlighted
Each task object could contain:
- Task title
- Assigned employee
- Current status
- Deadline
- Comments
- Progress updates
- Related project information
- Add shared collaboration rooms
- Allow users to gather around project boards
- Display task information in real time
- Enable team members to discuss project updates
- Add voice and video communication in meeting areas
Add dedicated spaces for:
- Daily stand-ups
- Sprint planning
- Project reviews
- Team retrospectives
- Client meetings
- Training sessions
Meeting rooms could include shared task boards, presentation screens, progress dashboards, and project analytics.
The platform could show where team members are and what they are working on:
- Online
- Offline
- In a meeting
- Working on a task
- Away
- Do not disturb
- Available for collaboration
This would help distributed teams understand team availability without relying only on chat messages.
Introduce rewards and achievements to improve engagement:
- XP points for completed tasks
- Team achievement badges
- Productivity streaks
- Milestone rewards
- Project completion celebrations
- Virtual office customization rewards
- Team leaderboards
Gamification should encourage healthy collaboration rather than unhealthy competition.
An AI assistant could help teams by:
- Summarizing task updates
- Detecting delayed tasks
- Suggesting task assignments
- Identifying overloaded employees
- Recommending workload distribution
- Generating meeting summaries
- Converting meeting discussions into tasks
- Predicting project risks
CrewBoard could eventually support:
- Browser-based 3D environments
- WebXR
- Virtual reality headsets
- Augmented reality workflows
- Desktop and mobile fallback experiences
The product should remain usable in a normal 2D browser, while providing an optional immersive mode for users who want a metaverse experience.
- Improve dashboard design
- Add authentication
- Add user accounts
- Add role-based permissions
- Add project management
- Add deadlines and priorities
- Improve API error handling
- Stabilize production deployment
- Real-time notifications
- Employee availability
- Activity history
- Team chat
- File attachments
- Project dashboards
- Calendar integration
- Build a 2D virtual office map
- Add departments and rooms
- Add employee avatars
- Add presence indicators
- Display tasks as workspace objects
- Shared 3D rooms
- Live user movement
- Interactive task boards
- Virtual meeting rooms
- Voice and video communication
- Real-time collaboration
- AI work assistant
- Smart task recommendations
- Productivity insights
- XP and achievement systems
- Team milestones
- Automated reports
- WebXR support
- VR workspace support
- AR task visualization
- Immersive project planning
- Cross-device collaboration
CrewBoard can become a hybrid productivity platform that combines:
- Employee management
- Task tracking
- Team communication
- Project coordination
- Real-time presence
- Virtual workspaces
- AI-powered assistance
- Immersive collaboration
The goal is to create a digital workplace where teams do not only update tasks, but actively collaborate inside a shared and interactive environment.
Before using CrewBoard in production:
- Use HTTPS for all frontend and backend traffic
- Never commit secrets to the repository
- Use environment variables for credentials
- Set
DEBUG=False - Restrict Django
ALLOWED_HOSTS - Restrict CORS to trusted frontend domains
- Secure the MongoDB connection
- Add authentication and authorization
- Validate all API input
- Add request logging and monitoring
- Configure backups for production data
CrewBoard is currently in its initial product phase, with core employee, task, status, and update functionality available. The next major direction is to expand the platform into a collaborative virtual workplace with metaverse, AI, and real-time interaction capabilities.