Skip to main content

Django-NextJS Isomorphic UI dev with Decorator pattern

Project description

Isomorphic UI Development with Decorator pattern for Django with:

  • nextjs out of the box experience for frontend development,

  • rendering of nextjs pages with context in Django with NextJS template engine.

For fun & profit

Run the example project

Run this commands as non root:

git clone https://git.yourlabs.org/oss/djnext
cd djnext
pip install --user --editable .[dev]
yarn install
djnext djnext  # required for yarn dev to run
yarn dev  # run localhost:3000
djnext dev  # run localhost:8000

Choose NextJS page template in Django

Example project lives in src/djnext_example, see src/djnext_example/artist/urls.py:

CreateView.as_view(
    model=Artist,
    fields=['name'],
    success_url=reverse_lazy('artist_list'),
    template_name='create.js',
)

The template backend you added will make a request to the nextjs server you have on port 3000 with yarn dev.

Djnext command

Run your manage.py djnext or yourproject djnext if your project has an entrypoint.

This will watch static/pages directories of all apps in INSTALLED_APPS, and build the pages/ directory, so that yarn dev will find it.

On port 8000 we don’t yet have auto frontend code reload, but you have it on port 3000 with djnext command running at the same time.

Install in your project

Add to ‘djnext’ to INSTALLED_APPS, add dict(BACKEND='djnext.Backend') to TEMPLATES.

With LOVE from POITOU CHARENTE

Credit

Thanks to frontend engineer Thomas Binetruy for participating

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

djnext-0.0.2.tar.gz (4.7 kB view details)

Uploaded Source

File details

Details for the file djnext-0.0.2.tar.gz.

File metadata

  • Download URL: djnext-0.0.2.tar.gz
  • Upload date:
  • Size: 4.7 kB
  • Tags: Source
  • Uploaded using Trusted Publishing? No

File hashes

Hashes for djnext-0.0.2.tar.gz
Algorithm Hash digest
SHA256 616b65104e2b45c65a051a2b3c34278b77628d037cdff047969bf1455564177c
MD5 b6e2424b5ff55c1140211932a2860229
BLAKE2b-256 d7d264ad44a76cffcaf669760ccd945f9d0a20be43253c3d3fd042801072f448

See more details on using hashes here.

Supported by

AWS AWS Cloud computing and Security Sponsor Datadog Datadog Monitoring Fastly Fastly CDN Google Google Download Analytics Microsoft Microsoft PSF Sponsor Pingdom Pingdom Monitoring Sentry Sentry Error logging StatusPage StatusPage Status page