# CourseWorx Development Guidelines ## ๐Ÿ“‹ Document Information - **Version**: 1.0.0 - **Last Updated**: 2024-12-19 - **Author**: AI Assistant - **Status**: Draft - Ready for Review ## ๐ŸŽฏ Development Philosophy CourseWorx development follows these core principles: - **Quality First**: Code quality over speed - **Test-Driven Development**: Write tests before implementation - **Documentation**: Every change must be documented - **Impact Analysis**: Understand system impact before changes - **Code Reviews**: All changes require peer review ## ๐Ÿ”„ Development Workflow ### 1. Feature Development Process ``` 1. Issue Creation โ†’ GitHub Issue with proper template 2. Impact Analysis โ†’ Understand affected components/APIs 3. Design Review โ†’ Architecture and approach validation 4. Branch Creation โ†’ Feature branch from main 5. Implementation โ†’ Code with tests 6. Testing โ†’ Unit, integration, and manual testing 7. Documentation โ†’ Update relevant docs 8. Code Review โ†’ Peer review process 9. Merge โ†’ After approval and testing 10. Deployment โ†’ Staged deployment with monitoring ``` ### 2. Branch Strategy ``` main (production-ready) โ”œโ”€โ”€ develop (integration branch) โ”‚ โ”œโ”€โ”€ feature/user-management โ”‚ โ”œโ”€โ”€ feature/course-creation โ”‚ โ””โ”€โ”€ bugfix/login-validation โ”œโ”€โ”€ hotfix/critical-security-fix โ””โ”€โ”€ release/v1.1.0 ``` ### 3. Commit Message Format ``` type(scope): brief description Detailed explanation of the change - What was changed - Why it was changed - Any breaking changes - Related issue numbers Examples: feat(auth): add password reset functionality fix(courses): resolve duplicate course creation bug docs(api): update authentication endpoint documentation refactor(components): split CourseContent into smaller components ``` ## ๐Ÿงช Testing Strategy ### 1. Testing Pyramid ``` E2E Tests (5%) โ”œโ”€โ”€ Critical user journeys โ”œโ”€โ”€ Authentication flows โ””โ”€โ”€ Course creation/enrollment Integration Tests (25%) โ”œโ”€โ”€ API endpoint testing โ”œโ”€โ”€ Database integration โ””โ”€โ”€ Component integration Unit Tests (70%) โ”œโ”€โ”€ Component logic โ”œโ”€โ”€ Utility functions โ”œโ”€โ”€ API service methods โ””โ”€โ”€ Business logic ``` ### 2. Testing Requirements - **New Features**: 80% code coverage minimum - **Bug Fixes**: Add regression tests - **Refactoring**: Maintain existing test coverage - **API Changes**: Update contract tests ### 3. Testing Tools ``` Frontend Testing: โ”œโ”€โ”€ Jest (Test runner) โ”œโ”€โ”€ React Testing Library (Component testing) โ”œโ”€โ”€ MSW (API mocking) โ””โ”€โ”€ Cypress (E2E testing) Backend Testing: โ”œโ”€โ”€ Jest (Test runner) โ”œโ”€โ”€ Supertest (API testing) โ”œโ”€โ”€ Factory-bot (Test data) โ””โ”€โ”€ Test database (Isolated testing) ``` ## ๐Ÿ“ Code Standards ### 1. JavaScript/React Standards ```javascript // Use functional components with hooks const UserList = ({ users, onUserSelect }) => { const [selectedUser, setSelectedUser] = useState(null); // Use descriptive variable names const activeUsers = users.filter(user => user.isActive); // Extract complex logic to custom hooks const { loading, error, refetch } = useUserData(); // Use early returns to reduce nesting if (loading) return ; if (error) return ; return (
{activeUsers.map(user => ( ))}
); }; ``` ### 2. Component Guidelines - **Single Responsibility**: One purpose per component - **Max 300 lines**: Split larger components - **Props Interface**: Define clear prop types - **Error Boundaries**: Handle component errors gracefully ### 3. API Development Standards ```javascript // Controller structure const createUser = async (req, res) => { try { // 1. Input validation const validationErrors = validationResult(req); if (!validationErrors.isEmpty()) { return res.status(400).json({ error: 'Validation Error', details: validationErrors.array() }); } // 2. Business logic const userData = req.body; const user = await UserService.createUser(userData); // 3. Success response res.status(201).json({ message: 'User created successfully', data: user }); } catch (error) { // 4. Error handling console.error('User creation error:', error); res.status(500).json({ error: 'Internal Server Error', message: 'Failed to create user' }); } }; ``` ## ๐Ÿ—‚๏ธ File Organization ### 1. Frontend Structure ``` frontend/src/ โ”œโ”€โ”€ components/ โ”‚ โ”œโ”€โ”€ common/ # Reusable components โ”‚ โ”œโ”€โ”€ forms/ # Form components โ”‚ โ””โ”€โ”€ ui/ # UI elements โ”œโ”€โ”€ pages/ โ”‚ โ”œโ”€โ”€ auth/ # Authentication pages โ”‚ โ”œโ”€โ”€ courses/ # Course-related pages โ”‚ โ””โ”€โ”€ admin/ # Admin pages โ”œโ”€โ”€ hooks/ # Custom hooks โ”œโ”€โ”€ services/ # API services โ”œโ”€โ”€ utils/ # Utility functions โ”œโ”€โ”€ constants/ # Application constants โ””โ”€โ”€ types/ # TypeScript types (future) ``` ### 2. Backend Structure ``` backend/ โ”œโ”€โ”€ controllers/ # Route handlers โ”œโ”€โ”€ services/ # Business logic โ”œโ”€โ”€ models/ # Database models โ”œโ”€โ”€ middleware/ # Express middleware โ”œโ”€โ”€ routes/ # Route definitions โ”œโ”€โ”€ utils/ # Utility functions โ”œโ”€โ”€ validators/ # Input validation โ””โ”€โ”€ tests/ # Test files ``` ## ๐Ÿ”’ Security Guidelines ### 1. Input Validation - **Server-side validation**: Always validate on backend - **Client-side validation**: For UX only, not security - **Sanitization**: Clean all user inputs - **SQL Injection**: Use parameterized queries (Sequelize ORM) ### 2. Authentication & Authorization - **JWT Security**: Secure token storage and transmission - **Role-based Access**: Verify permissions on every request - **Password Security**: bcrypt with appropriate salt rounds - **Session Management**: Proper token expiration ### 3. File Upload Security ```javascript // File upload validation const validateFileUpload = (req, res, next) => { const allowedTypes = ['image/jpeg', 'image/png', 'application/pdf']; const maxSize = 10 * 1024 * 1024; // 10MB if (!allowedTypes.includes(req.file.mimetype)) { return res.status(400).json({ error: 'Invalid file type' }); } if (req.file.size > maxSize) { return res.status(400).json({ error: 'File too large' }); } next(); }; ``` ## ๐Ÿ“Š Performance Guidelines ### 1. Frontend Performance - **Code Splitting**: Lazy load large components - **Image Optimization**: Compress and resize images - **Bundle Analysis**: Monitor bundle size - **Memoization**: Use React.memo for expensive components ### 2. Backend Performance - **Database Queries**: Optimize with proper indexes - **Caching**: Implement Redis for frequently accessed data - **Connection Pooling**: Efficient database connections - **Response Compression**: Gzip compression for API responses ### 3. Database Performance ```sql -- Create indexes for frequently queried columns CREATE INDEX idx_users_email ON users(email); CREATE INDEX idx_courses_trainer_id ON courses(trainer_id); CREATE INDEX idx_enrollments_user_course ON enrollments(user_id, course_id); -- Optimize queries with proper JOINs SELECT u.first_name, u.last_name, c.title FROM users u JOIN enrollments e ON u.id = e.user_id JOIN courses c ON e.course_id = c.id WHERE u.role = 'trainee' AND e.status = 'enrolled'; ``` ## ๐Ÿ› Error Handling ### 1. Frontend Error Handling ```javascript // Error boundary for component errors class ErrorBoundary extends React.Component { constructor(props) { super(props); this.state = { hasError: false }; } static getDerivedStateFromError(error) { return { hasError: true }; } componentDidCatch(error, errorInfo) { console.error('Component error:', error, errorInfo); // Send to error reporting service } render() { if (this.state.hasError) { return ; } return this.props.children; } } // API error handling const handleApiError = (error) => { if (error.response?.status === 401) { // Redirect to login window.location.href = '/login'; } else if (error.response?.status >= 500) { // Show generic error message toast.error('Server error. Please try again later.'); } else { // Show specific error message toast.error(error.response?.data?.message || 'An error occurred'); } }; ``` ### 2. Backend Error Handling ```javascript // Global error handler const errorHandler = (err, req, res, next) => { console.error('Error:', err); // Validation errors if (err.name === 'ValidationError') { return res.status(400).json({ error: 'Validation Error', message: err.message }); } // Database errors if (err.name === 'SequelizeValidationError') { return res.status(400).json({ error: 'Database Validation Error', details: err.errors.map(e => ({ field: e.path, message: e.message })) }); } // Default error res.status(500).json({ error: 'Internal Server Error', message: process.env.NODE_ENV === 'development' ? err.message : 'Something went wrong' }); }; ``` ## ๐Ÿ“š Documentation Requirements ### 1. Code Documentation - **Function Documentation**: JSDoc for all functions - **Component Documentation**: Props, usage examples - **API Documentation**: OpenAPI/Swagger specs - **README Files**: Setup and usage instructions ### 2. Change Documentation - **Pull Request Templates**: Standardized PR descriptions - **Changelog**: Track all changes with semantic versioning - **Migration Guides**: For breaking changes - **Version.txt Updates**: Required for all changes ## ๐Ÿ” Code Review Process ### 1. Review Checklist - [ ] Code follows style guidelines - [ ] Tests are included and passing - [ ] Documentation is updated - [ ] No security vulnerabilities - [ ] Performance impact considered - [ ] Breaking changes documented ### 2. Review Guidelines - **Be Constructive**: Provide helpful feedback - **Ask Questions**: Understand the reasoning - **Suggest Improvements**: Offer better solutions - **Approve Quickly**: Don't block unnecessarily ## ๐Ÿš€ Deployment Guidelines ### 1. Staging Deployment - **Automated Testing**: All tests must pass - **Manual Testing**: User acceptance testing - **Performance Testing**: Load and stress testing - **Security Scanning**: Automated security checks ### 2. Production Deployment - **Blue-Green Deployment**: Zero-downtime deployments - **Database Migrations**: Backward-compatible changes - **Rollback Plan**: Quick rollback procedures - **Monitoring**: Post-deployment monitoring --- **Next Steps**: 1. Review and approve development guidelines 2. Set up development tools and templates 3. Train team on new processes 4. Implement code quality gates