开发最佳实践

// ✅ 好的做法 - 一致的命名和格式
const getUserProfile = async (userId) => {
  try {
    const response = await fetch(`/api/users/${userId}`);
    const userData = await response.json();
    return userData;
  } catch (error) {
    console.error('Failed to fetch user profile:', error);
    throw error;
  }
};

// ❌ 避免的做法 - 不一致的风格
const get_user_profile=async(user_id)=>{
try{
const resp=await fetch(`/api/users/${user_id}`)
const data=await resp.json()
return data
}catch(e){
console.log(e)
throw e
}}

/**
 * 计算用户的年龄
 * @param {string} birthDate - 出生日期 (YYYY-MM-DD 格式)
 * @returns {number} 用户年龄
 * @throws {Error} 当日期格式无效时抛出错误
 */
function calculateAge(birthDate) {
  if (!birthDate || !/^\d{4}-\d{2}-\d{2}$/.test(birthDate)) {
    throw new Error('Invalid date format. Expected YYYY-MM-DD');
  }
  
  const today = new Date();
  const birth = new Date(birthDate);
  
  // 计算年龄差
  let age = today.getFullYear() - birth.getFullYear();
  const monthDiff = today.getMonth() - birth.getMonth();
  
  // 如果还没到生日，年龄减1
  if (monthDiff < 0 || (monthDiff === 0 && today.getDate() < birth.getDate())) {
    age--;
  }
  
  return age;
}

// 错误类型定义
class AppError extends Error {
  constructor(message, statusCode, isOperational = true) {
    super(message);
    this.statusCode = statusCode;
    this.isOperational = isOperational;
    this.name = this.constructor.name;
    
    Error.captureStackTrace(this, this.constructor);
  }
}

// 全局错误处理中间件
const errorHandler = (error, req, res, next) => {
  let { statusCode = 500, message } = error;
  
  if (!error.isOperational) {
    statusCode = 500;
    message = 'Something went wrong';
  }
  
  res.status(statusCode).json({
    status: 'error',
    statusCode,
    message,
    ...(process.env.NODE_ENV === 'development' && { stack: error.stack })
  });
};

// 异步错误捕获包装器
const catchAsync = (fn) => {
  return (req, res, next) => {
    fn(req, res, next).catch(next);
  };
};

src/
├── components/          # 可复用组件
│   ├── ui/             # 基础UI组件
│   ├── forms/          # 表单组件
│   └── layout/         # 布局组件
├── pages/              # 页面组件
├── hooks/              # 自定义Hooks
├── utils/              # 工具函数
├── services/           # API服务
├── store/              # 状态管理
├── types/              # TypeScript类型定义
├── styles/             # 样式文件
└── __tests__/          # 测试文件

src/
├── controllers/        # 控制器
├── services/          # 业务逻辑
├── models/            # 数据模型
├── middleware/        # 中间件
├── routes/            # 路由定义
├── utils/             # 工具函数
├── config/            # 配置文件
├── validators/        # 数据验证
└── __tests__/         # 测试文件

// config/index.js
const config = {
  development: {
    database: {
      host: process.env.DB_HOST || 'localhost',
      port: process.env.DB_PORT || 5432,
      name: process.env.DB_NAME || 'dev_db'
    },
    redis: {
      host: process.env.REDIS_HOST || 'localhost',
      port: process.env.REDIS_PORT || 6379
    },
    jwt: {
      secret: process.env.JWT_SECRET || 'dev-secret',
      expiresIn: '7d'
    }
  },
  production: {
    database: {
      host: process.env.DB_HOST,
      port: process.env.DB_PORT,
      name: process.env.DB_NAME
    },
    redis: {
      host: process.env.REDIS_HOST,
      port: process.env.REDIS_PORT
    },
    jwt: {
      secret: process.env.JWT_SECRET,
      expiresIn: '1d'
    }
  }
};

module.exports = config[process.env.NODE_ENV || 'development'];

// React 组件懒加载
import { lazy, Suspense } from 'react';

const LazyComponent = lazy(() => import('./HeavyComponent'));

function App() {
  return (
    <Suspense fallback={<div>Loading...</div>}>
      <LazyComponent />
    </Suspense>
  );
}

// 路由级别的代码分割
const routes = [
  {
    path: '/dashboard',
    component: lazy(() => import('../pages/Dashboard'))
  },
  {
    path: '/profile',
    component: lazy(() => import('../pages/Profile'))
  }
];

// Next.js 图片优化
import Image from 'next/image';

function OptimizedImage({ src, alt, ...props }) {
  return (
    <Image
      src={src}
      alt={alt}
      loading="lazy"
      placeholder="blur"
      blurDataURL="data:image/jpeg;base64,..."
      sizes="(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw"
      {...props}
    />
  );
}

// ✅ 好的做法 - 使用索引和限制查询
const getUsers = async (page = 1, limit = 10) => {
  const offset = (page - 1) * limit;
  
  return await User.findAndCountAll({
    attributes: ['id', 'name', 'email'], // 只选择需要的字段
    where: {
      active: true
    },
    limit,
    offset,
    order: [['createdAt', 'DESC']],
    include: [{
      model: Profile,
      attributes: ['avatar', 'bio']
    }]
  });
};

// ❌ 避免的做法 - N+1 查询问题
const getUsersWithProfiles = async () => {
  const users = await User.findAll();
  
  for (const user of users) {
    user.profile = await Profile.findOne({ where: { userId: user.id } });
  }
  
  return users;
};

// Redis 缓存实现
class CacheService {
  static async get(key) {
    try {
      const cached = await redis.get(key);
      return cached ? JSON.parse(cached) : null;
    } catch (error) {
      console.error('Cache get error:', error);
      return null;
    }
  }
  
  static async set(key, value, ttl = 3600) {
    try {
      await redis.setex(key, ttl, JSON.stringify(value));
    } catch (error) {
      console.error('Cache set error:', error);
    }
  }
  
  static async del(key) {
    try {
      await redis.del(key);
    } catch (error) {
      console.error('Cache delete error:', error);
    }
  }
}

// 使用缓存的服务
const getUserProfile = async (userId) => {
  const cacheKey = `user:${userId}`;
  
  // 尝试从缓存获取
  let user = await CacheService.get(cacheKey);
  
  if (!user) {
    // 从数据库获取
    user = await User.findByPk(userId, {
      include: [Profile]
    });
    
    // 缓存结果
    if (user) {
      await CacheService.set(cacheKey, user, 1800); // 30分钟
    }
  }
  
  return user;
};

// 使用 Joi 进行数据验证
const Joi = require('joi');

const userSchema = Joi.object({
  name: Joi.string().min(2).max(50).required(),
  email: Joi.string().email().required(),
  password: Joi.string().min(8).pattern(new RegExp('^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#\$%\^&\*])')).required(),
  age: Joi.number().integer().min(18).max(120)
});

const validateUser = (req, res, next) => {
  const { error } = userSchema.validate(req.body);
  
  if (error) {
    return res.status(400).json({
      status: 'error',
      message: error.details[0].message
    });
  }
  
  next();
};

// JWT 工具函数
const jwt = require('jsonwebtoken');

const generateToken = (payload) => {
  return jwt.sign(payload, process.env.JWT_SECRET, {
    expiresIn: process.env.JWT_EXPIRES_IN
  });
};

const verifyToken = (token) => {
  return jwt.verify(token, process.env.JWT_SECRET);
};

// 认证中间件
const authenticate = async (req, res, next) => {
  try {
    const token = req.headers.authorization?.split(' ')[1];
    
    if (!token) {
      return res.status(401).json({
        status: 'error',
        message: 'Access token required'
      });
    }
    
    const decoded = verifyToken(token);
    const user = await User.findByPk(decoded.id);
    
    if (!user) {
      return res.status(401).json({
        status: 'error',
        message: 'User not found'
      });
    }
    
    req.user = user;
    next();
  } catch (error) {
    return res.status(401).json({
      status: 'error',
      message: 'Invalid token'
    });
  }
};

// 使用 Jest 进行单元测试
describe('calculateAge', () => {
  test('should calculate correct age', () => {
    const birthDate = '1990-01-01';
    const age = calculateAge(birthDate);
    
    expect(age).toBeGreaterThan(30);
  });
  
  test('should throw error for invalid date format', () => {
    expect(() => {
      calculateAge('invalid-date');
    }).toThrow('Invalid date format');
  });
});

// API 集成测试
describe('User API', () => {
  test('POST /api/users should create new user', async () => {
    const userData = {
      name: 'John Doe',
      email: 'john@example.com',
      password: 'SecurePass123!'
    };
    
    const response = await request(app)
      .post('/api/users')
      .send(userData)
      .expect(201);
    
    expect(response.body.data.name).toBe(userData.name);
    expect(response.body.data.email).toBe(userData.email);
    expect(response.body.data.password).toBeUndefined();
  });
});

// jest.config.js
module.exports = {
  collectCoverage: true,
  coverageDirectory: 'coverage',
  coverageReporters: ['text', 'lcov', 'html'],
  coverageThreshold: {
    global: {
      branches: 80,
      functions: 80,
      lines: 80,
      statements: 80
    }
  },
  testMatch: [
    '**/__tests__/**/*.test.js',
    '**/?(*.)+(spec|test).js'
  ]
};

# .github/workflows/ci.yml
name: CI/CD Pipeline

on:
  push:
    branches: [main, develop]
  pull_request:
    branches: [main]

jobs:
  test:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
      - uses: actions/setup-node@v3
        with:
          node-version: '18'
          cache: 'npm'
      
      - run: npm ci
      - run: npm run lint
      - run: npm run test:coverage
      - run: npm run build
      
      - name: Upload coverage to Codecov
        uses: codecov/codecov-action@v3

// 健康检查端点
app.get('/health', (req, res) => {
  const healthCheck = {
    uptime: process.uptime(),
    message: 'OK',
    timestamp: Date.now(),
    checks: {
      database: 'OK',
      redis: 'OK',
      memory: process.memoryUsage()
    }
  };
  
  res.status(200).json(healthCheck);
});

// 错误监控
const Sentry = require('@sentry/node');

Sentry.init({
  dsn: process.env.SENTRY_DSN,
  environment: process.env.NODE_ENV
});

app.use(Sentry.Handlers.errorHandler());