HTTP 404 Not Found

What It Means

HTTP 404 Not Found indicates that the server cannot find the requested resource. This means the URL is not recognized by the server. This could be a temporary or permanent condition.

A 404 does not indicate whether the condition is temporary or permanent. If the server knows the resource is permanently gone, it should use 410 Gone instead.

Common Causes

• Typo in the URL or incorrect path
• Resource has been deleted or moved without a redirect
• Incorrect API endpoint or version
• Case-sensitive URLs on Linux servers (e.g., /Page vs /page)
• Missing trailing slash or extra trailing slash
• Single-page app (SPA) routes not configured for server-side fallback
• Broken links from external sites

How to Fix

Check the URL

# Verify the endpoint exists
curl -I https://api.example.com/api/v2/users

# Check if it's a case sensitivity issue
curl -I https://api.example.com/api/v2/Users  # might 404 on Linux

Configure SPA fallback routing

# Nginx - Serve index.html for all SPA routes
server {
    listen 80;
    root /var/www/html;

    location / {
        try_files $uri $uri/ /index.html;
    }
}

// Express.js - SPA fallback
const path = require('path');

app.use(express.static('build'));

app.get('*', (req, res) => {
  res.sendFile(path.join(__dirname, 'build', 'index.html'));
});

Custom 404 error page (Express.js)

// Place this AFTER all other routes
app.use((req, res) => {
  res.status(404).json({
    error: 'Not Found',
    message: `The endpoint ${req.method} ${req.path} does not exist`,
    suggestion: 'Check the API documentation for available endpoints'
  });
});

API client handling

async function fetchUser(userId) {
  const response = await fetch(`/api/users/${userId}`);

  if (response.status === 404) {
    // Handle missing resource gracefully
    return null;
  }

  if (!response.ok) {
    throw new Error(`HTTP ${response.status}`);
  }

  return response.json();
}

import requests

response = requests.get(f"https://api.example.com/users/{user_id}")
if response.status_code == 404:
    print(f"User {user_id} not found")
else:
    user = response.json()

React Router catch-all

import { Routes, Route } from 'react-router-dom';

function App() {
  return (
    <Routes>
      <Route path="/" element={<Home />} />
      <Route path="/about" element={<About />} />
      <Route path="*" element={<NotFound />} />
    </Routes>
  );
}

Related Errors

• HTTP 400 - Bad Request: The request itself is malformed, not that the resource is missing.
• HTTP 403 - Forbidden: The resource exists but you lack permission to access it.