### Nginx Configuration for Next.js
Source: https://github.com/querateam/django-nextjs/blob/main/README.md
Example Nginx configuration to serve Next.js static files and proxy requests to the Next.js development server. This setup is crucial for production environments to efficiently handle Next.js assets and dynamic content.
```nginx
location /_next/static/ {
alias NEXTJS_PATH/.next/static/;
expires max;
add_header Cache-Control "public";
}
location /_next/ {
proxy_pass http://127.0.0.1:3000;
proxy_set_header Host $http_host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
}
location /next/ {
alias NEXTJS_PATH/public/next/;
expires max;
add_header Cache-Control "public";
}
```
--------------------------------
### Install django-nextjs
Source: https://github.com/querateam/django-nextjs/blob/main/README.md
Installs the latest version of the django-nextjs package using pip.
```shell
pip install django-nextjs
```
--------------------------------
### Django URL with Custom Next.js Template
Source: https://github.com/querateam/django-nextjs/blob/main/README.md
Example of configuring a Django URL pattern to use a custom Next.js template for rendering. This is achieved by passing the `template_name` argument to the `nextjs_page` view.
```python
from django_nextjs.views import nextjs_page
urlpatterns = [
path("/my/page", nextjs_page(template_name="path/to/template.html"), name="my_page"),
]
```
--------------------------------
### Django URL Patterns for Next.js Pages
Source: https://github.com/querateam/django-nextjs/blob/main/README.md
Defines Django URL patterns to render Next.js pages using the `nextjs_page` view. It shows how to map specific URLs to Next.js pages and includes an example for enabling streaming with the App Router.
```python
from django_nextjs.views import nextjs_page
urlpatterns = [
path("/my/page", nextjs_page(), name="my_page"),
# With App Router streaming (recommended)
path("/other/page", nextjs_page(stream=True), name="other_page"),
]
```
--------------------------------
### Django Template for Next.js Customization
Source: https://github.com/querateam/django-nextjs/blob/main/README.md
A Django template example that extends `django_nextjs/document_base.html` to customize the head and body sections of the HTML response. This allows for injecting custom content like navigation bars and footers from Django templates.
```django
{% extends "django_nextjs/document_base.html" %}
{% block head %}
{{ block.super }}
{% endblock %}
{% block body %}
... the content you want to place at the beginning of "body" tag ...
... e.g. include the navbar template ...
{{ block.super }}
... the content you want to place at the end of "body" tag ...
... e.g. include the footer template ...
{% endblock %}
```
--------------------------------
### Next.js _document.jsx Customization
Source: https://github.com/querateam/django-nextjs/blob/main/README.md
Example of customizing the Next.js `_document.jsx` file to integrate with Django. This involves adding specific IDs to the body tag to allow Django to inject content, such as navbars and footers.
```jsx
// pages/_document.jsx (or .tsx)
...
...
```
--------------------------------
### Configure NextJsMiddleware with Django Channels (ASGI)
Source: https://github.com/querateam/django-nextjs/blob/main/README.md
Shows how to use NextJsMiddleware with Django Channels by wrapping the ProtocolTypeRouter.
```python
application = NextJsMiddleware(
ProtocolTypeRouter(
{
"http": django_asgi_app,
"websocket": my_websocket_handler,
# ...
}
)
)
```
--------------------------------
### Configure NextJsMiddleware in asgi.py (ASGI)
Source: https://github.com/querateam/django-nextjs/blob/main/README.md
Integrates NextJsMiddleware into the Django ASGI application to handle Next.js routing, assets, and WebSocket connections for fast refresh.
```python
import os
from django.core.asgi import get_asgi_application
os.environ.setdefault("DJANGO_SETTINGS_MODULE", "myproject.settings")
django_asgi_app = get_asgi_application()
from django_nextjs.asgi import NextJsMiddleware
application = NextJsMiddleware(django_asgi_app)
```
--------------------------------
### Add django_nextjs to INSTALLED_APPS
Source: https://github.com/querateam/django-nextjs/blob/main/README.md
Configures the Django project to use the django-nextjs application by adding it to the INSTALLED_APPS setting.
```python
INSTALLED_APPS = [
...
"django_nextjs",
]
```
--------------------------------
### Django Next.js Settings Configuration
Source: https://github.com/querateam/django-nextjs/blob/main/README.md
Configures the django-nextjs package by defining the NEXTJS_SETTINGS dictionary in Django's settings.py. This includes the Next.js server URL, CSRF token enforcement, and the public subdirectory path.
```Python
NEXTJS_SETTINGS = {
"nextjs_server_url": "http://127.0.0.1:3000",
"ensure_csrf_token": True,
"public_subdirectory": "/next",
}
```
--------------------------------
### Include django_nextjs URLs in urls.py (Non-ASGI)
Source: https://github.com/querateam/django-nextjs/blob/main/README.md
Includes the django_nextjs URL patterns in the project's main urls.py for projects not using ASGI.
```python
from django.urls import path, include
urlpatterns = [
path("", include("django_nextjs.urls")),
...
]
```
--------------------------------
### CSRF Token Generation for Next.js
Source: https://github.com/querateam/django-nextjs/blob/main/README.md
Ensures a CSRF token is generated and included in requests to the Next.js server when `ensure_csrf_token` is enabled. This is crucial for handling initial requests in Next.js `getServerSideProps` when using GraphQL POST requests.
```Python
from django.middleware.csrf import get_token
# ... in your view or middleware ...
csrf_token = get_token(request)
```
=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.