Search code examples
javascriptpythonangularjsdjangoserve

How to run django and angularJS into a single development server?


I have a project where I am using Angular js to consume the API that I built with Django-Framework. Currently I have to start up the django api using django development server e.g., python manage.py runserver 192.168.0.185:8080' and then I have to start up the angular (this is my webclient) js server using 'python manage.py runserver 192.168.0.185:8000 ' Is there any way I can setup my django project to to run and web client so that i will no longer be seperating the development server of api and web client . That when i run api server it will also include the web client. Any idea? . Thank you.


Solution

  • it should be straight forward,

    1. In url.py , create a mapping

      url(r'^$', views.index, name='index'),

    2. In views.py

    create a function (example):

    @csrf_protect
    @requires_csrf_token
    def index(request):
        return render(request, 'index.html', content_type="text/html")
    
    1. In index.html , put ng-app and call the angular.js CDN and js files.

    That should do the work.

    Make sure to use {% verbatim %} and {% endverbatim %} if you want to use {{ }} for angularJS variable interpolation. Because, Django also has the same symbol ( i.e : {{ }}) to render the variable on it's template files.