4 ms·

Any resources/examples you'd recommend for a Vue frontend w/django? I've been pretty firmly in backend land for a while and would to experiment with the other h

Any resources/examples you'd recommend for a Vue frontend w/django? I've been pretty firmly in backend land for a while and would to experiment with the other half of the puzzle!

jmduke 3y ago
I'll preface all of this with a couple esoteric design goals that I had in mind: 1. I actually _want_ an SPA. You might not need an SPA, if you don't need one then Vue/React/etc are overkill, etc. 2. I want to power as much of the SPA as I can using the same REST API as my core product, both for dogfooding reasons and for consolidation. Many people might argue that this is a bad idea. --- With that in mind, some specific packages that I highly recommend: 1. Django-vite (https://github.com/MrBin99/django-vite https://github.com/MrBin99/django-vite). This makes it very easy to serve an SPA from the actual django response/request model 2. Some sort of way to get type information (if you're using TypeScript) into the frontend. I use a frankensteined system of the OpenAPI spec that django-ninja generates + openapi-typescript (https://github.com/drwpow/openapi-typescript https://github.com/drwpow/openapi-typescript). This means when I add, say, a new field to a response in Django, I immediately get typechecking for it in Vue — which has been _tremendously_ useful. 3. Django-typescript-routes (a package I extracted and open-sourced!: https://github.com/buttondown-email/django-typescript-routes https://github.com/buttondown-email/django-typescript-routes) which gives your front-end routing information based on the Django router.
zelphirkalt 3y ago
If you really need VueJs in the frontend, consider, that you can simple serve the VueJs on any page where it is actually needed. VueJs does not necessarily mean you must create a SPA. VueJs can be delivered like any other script and this is often the easiest way without having to commit to build a full blown SPA.

Any resources/examples you'd recommend for a Vue frontend w/django? I've been pretty firmly in backend land for a while and would to experiment with the other half of the puzzle!

jmduke 3y ago

I'll preface all of this with a couple esoteric design goals that I had in mind: 1. I actually _want_ an SPA. You might not need an SPA, if you don't need one then Vue/React/etc are overkill, etc. 2. I want to power as much of the SPA as I can using the same REST API as my core product, both for dogfooding reasons and for consolidation. Many people might argue that this is a bad idea. --- With that in mind, some specific packages that I highly recommend: 1. Django-vite (https://github.com/MrBin99/django-vite https://github.com/MrBin99/django-vite). This makes it very easy to serve an SPA from the actual django response/request model 2. Some sort of way to get type information (if you're using TypeScript) into the frontend. I use a frankensteined system of the OpenAPI spec that django-ninja generates + openapi-typescript (https://github.com/drwpow/openapi-typescript https://github.com/drwpow/openapi-typescript). This means when I add, say, a new field to a response in Django, I immediately get typechecking for it in Vue — which has been _tremendously_ useful. 3. Django-typescript-routes (a package I extracted and open-sourced!: https://github.com/buttondown-email/django-typescript-routes https://github.com/buttondown-email/django-typescript-routes) which gives your front-end routing information based on the Django router.

zelphirkalt 3y ago

If you really need VueJs in the frontend, consider, that you can simple serve the VueJs on any page where it is actually needed. VueJs does not necessarily mean you must create a SPA. VueJs can be delivered like any other script and this is often the easiest way without having to commit to build a full blown SPA.