Categorize Django + AngularJS real world examples

Question

I am working on a project with Django and AngularJS. I am a bit experienced with both, but I never integrated one into the other, and I have difficulties finding real world examples, (apart from tutorials, libraries and starter kits), that would help bring me to the next level.

I would like to read code to see all the tools used (building assets, deployment,…), the project layout, the answer to specific problems, etc. As I think I've reach a point where reading tutorials isn't enough.

I want to read other people's code while I build my app.

I have found good entry points with the doc from Django-Angular, the "two scoops of Django" book and a good seed, but to build real project this is not enough.

I would love to see examples with the following information:

• Assets build system: (Django-pipeline, Grunt, Gulp, other ?)
  • Javascript, Coffee, Rapyd, Pure, other ?
  • Html, Jade, other ?
  • Bootstrap, no framework, other ?
• REST api: (Django-Rest-Framework, other ?)
• 3 way data-binding: (yes/no)
• Uses Djangular/Django-angular: (yes/no)
• Many Django apps: (yes/no)
• Deployment automation: (yes, main tools/no)
• Running on production: Visible demo ?
• Own documentation : (yes/no)
• Django and Angular versions
• other characteristics

I'll give an example answer with the aforementioned seed, which isn't satisfactory because it is just a seed.

Thanks !

Answer 1

Django, Angular, Bootstrap, Gulp - Cookiecutter seed

• Project: https://github.com/bearstech/cookiecutter-Django-bootstrap-angular/
• Assets build system: gulp and javascript, html, bootstrap
• REST api: No
• 3 way data-binding: No
• Uses djangular: No
• Many Django apps: No
• Deployment automation: No
• Running on production: No
• Own documentation: Scarce (Setup instructions only)
• Django and Angular versions: Django 1.7, and 'latest' JS libraries
• Other characteristics : Cookiecutter seed example

Taiga

Taiga is a management tool with scrum in mind (free accounts). It is divided into multiple parts, where the backend is written with Django, the front-end, with AngularJS. Also includes a ncurses client.

• Project: https://github.com/taigaio/taiga-back and https://github.com/taigaio/taiga-front
• Front-end technos : Coffee, Jade, SASS; Gulp
• REST api: Yes (Django Rest Framework)
• Uses Djangular: No
• On production: Yes
• Own documentation: Yes (Sphinx. Not complete.)
• Django and Angular versions: 1.7 & 1.2
• Other: The Angular front-end is served by Ruby-on-Rails O_o

Real World - full stack Medium.com clone with many stacks (of which Django, Angularjs, Angular2, Vuejs,…)

• Project: https://github.com/gothinkster/realworld
• rest api: yes, all backends and frontends consume the same api.
• documentation: tutorials for each stack

Pootle (Django + Backbone)

Pootle is a community localization server. It is an online tool that makes the process of translating so much simpler. It allows crowd-sourced translations, easy volunteer contribution and gives statistics about the ongoing work.

The backend is written in Django, the front-end in Backbone (sorry, small entorse to this post !).

Answer 2

I use both AngualarJS and Django tools in one project, but both tools are unrelated since they don't adress the same cases.

When you say "integrated one into the other", I'm not sure what you're trying to do, but here is one way to make them work together:

• You create a Django app, and write a REST API (using DRF, Tastypie, Restless, etc..).
• You create a AngularJS app, and you call the webservices of your server, using $http

EDIT :

If you want to avoid duplicating code with for example data validation, you can make your validation at a "server level", not at the "form" level. Let me explain:

When you're doing form validation in Django, your kind of making the validation in the "client side" (which is not technically true but nevermind). So if you have another app in AngularJS, of course you won't be able to reuse the validation logic that you put in Django.

However, if you decide to process the validation in the models, as a part of your business logic, and that you use webservices for angularJS clients, here what's happens:

• When you try to submit a form with a Django page, the business logic is called
• When you try to submit a POST request with your data to your server API using AngularJS, the same business logic will be called.

This way you have one business logic for your both "clients".

But if you want to perform frontend validation, of course you will need to write N verifications for N clients.