To enable a frontend-backend separated architecture in Django, the backend must expose data via API endpoints. This involves setting up URL routing to handle API requests and creating view functions to fetch data and serialize it into JSON for the frontend.

Start by defining an API route in the main project's URL configuration. This segregates API endpoints from other application URLs.

# urls.py (Project Level)
from django.urls import path, include
from django.contrib import admin

urlpatterns = [
    path('admin/', admin.site.urls),
    # ... other existing paths ...
    path('api/blog/', include('blog.urls'))  # API route prefix
]

Within the specific app, create a URL configuration file to map subpaths to view functions responsible for API logic.

# blog/urls.py
from django.urls import path
from . import views

urlpatterns = [
    path('list/', views.fetch_article_list, name='api_article_list'),
]

The corresponding view function uses the app's models to retrieve data from the database. The JsonResponse class from Django's http module is used to serialize Python data structures into JSON format for the response.

# blog/views.py
from django.http import JsonResponse
from blog.models import Article

def fetch_article_list(request):
    """API endpoint to retrieve a list of articles."""
    # Fetch all Article objects from the database
    queryset = Article.objects.all()
    
    # Transform the QuerySet into a list of dictionaries.
    # This step extracts and formats the specific fields for the API.
    article_data = [
        {
            'id': obj.pk,
            'title': obj.title,
            'summary': obj.summary[:100] if obj.summary else ''
        }
        for obj in queryset
    ]
    
    # Structure the final JSON response.
    response_payload = {
        'status': 'success',
        'count': len(article_data),
        'articles': article_data
    }
    
    return JsonResponse(response_payload)

With the endpoint configured, the frontend application can make a HTTP GET request to the URL http://localhost:8000/api/blog/list/. Using a library like Axios, the frontend code would resemble the following:

// Frontend JavaScript (e.g., using Axios)
import axios from 'axios';

axios.get('http://localhost:8000/api/blog/list/')
  .then(response => {
    console.log('API Response:', response.data);
    // Process the 'articles' array from response.data
  })
  .catch(error => {
    console.error('API Request Failed:', error);
  });

This basic implementation demonstrates the core mechanics of serving data via an API in Django. The backend's role is strictly to manage data and logic, responding to requests with structured JSON, while the frontend is responsible for fetching this data and handling the user interface presentation.