Debugging Containerized Applications

Framework-specific Debugging Techniques

React

Debugging React applications in containers:

• React Developer Tools: Browser extension works with containerized apps
• React Error Boundaries: Capture errors in components
• Debug Props/State: Use React DevTools to inspect component state

// React Error Boundary example
class ErrorBoundary extends React.Component {
  constructor(props) {
    super(props);
    this.state = { hasError: false, error: null, errorInfo: null };
  }
  
  componentDidCatch(error, errorInfo) {
    this.setState({
      hasError: true,
      error: error,
      errorInfo: errorInfo
    });
    // Log the error
    console.error("Error caught by boundary:", error, errorInfo);
  }
  
  render() {
    if (this.state.hasError) {
      return (
        <div className="error-container">
          <h2>Something went wrong.</h2>
          <details>
            <summary>Error Details</summary>
            <p>{this.state.error && this.state.error.toString()}</p>
            <p>Component Stack: {this.state.errorInfo.componentStack}</p>
          </details>
        </div>
      );
    }
    return this.props.children;
  }
}

Express.js

Debugging Express applications:

• Debug Module: Use the debug module for selective logging
• Express Error Handlers: Implement comprehensive error handling
• Middleware Debugging: Trace request flow through middleware

// Using debug module
const debug = require('debug')('app:routes');

app.get('/users', (req, res) => {
  debug('GET /users called with query:', req.query);
  // Route handler code
});

// Error handling middleware
app.use((err, req, res, next) => {
  console.error('Error:', err);
  
  // Log details only in development
  if (process.env.NODE_ENV === 'development') {
    res.status(500).json({
      error: err.message,
      stack: err.stack,
      details: err
    });
  } else {
    // In production, return minimal error info
    res.status(500).json({
      error: 'Internal Server Error'
    });
  }
});

MongoDB

Debugging MongoDB interactions:

// Enable Mongoose debug mode
mongoose.set('debug', process.env.NODE_ENV === 'development');

// Detailed connection logging
mongoose.connect(uri, {
  useNewUrlParser: true,
  useUnifiedTopology: true
})
.then(() => console.log('MongoDB connected'))
.catch(err => {
  console.error('MongoDB connection error:', err);
  process.exit(1);
});

// Log slow queries
const UserSchema = new mongoose.Schema({
  // Schema definition
});

// Add query logging
if (process.env.NODE_ENV === 'development') {
  UserSchema.pre('find', function() {
    console.time(`User.find execution time`);
    this._startTime = Date.now();
  });
  
  UserSchema.post('find', function() {
    console.timeEnd(`User.find execution time`);
    console.log(`User.find took ${Date.now() - this._startTime}ms`);
  });
}

PostgreSQL

Debugging PostgreSQL interactions:

// Node.js with pg module
const { Pool } = require('pg');

const pool = new Pool({
  host: process.env.DB_HOST,
  user: process.env.DB_USER,
  password: process.env.DB_PASSWORD,
  database: process.env.DB_NAME,
  // Add query logging in development
  ...(process.env.NODE_ENV === 'development' ? {
    log: (msg) => console.log(msg),
    query_timeout: 10000  // Longer timeout for debugging
  } : {})
});

// Wrap query with timing
async function queryWithLogging(text, params) {
  const start = Date.now();
  try {
    const res = await pool.query(text, params);
    const duration = Date.now() - start;
    
    if (duration > 100) {  // Log slow queries
      console.log('Slow query:', { text, duration, rows: res.rowCount });
    }
    
    return res;
  } catch (e) {
    console.error('Query error:', e);
    console.error('Query was:', text, params);
    throw e;
  }
}