Giter Club home page Giter Club logo

angular2-django-movies's Introduction

Angular2 Django | Movies

Build Status License

Angular 2 Django demo
View Demo

A sample Angular 2 app paired with a Django API to explore:

  • user registration and uthentication
  • form validation
  • protected routes
  • jwt tokens
  • django implementations
  • mysql implementation

Getting Started & Initial Setup

Cloning the repo

  • fork this repo
  • clone your fork

Setting up Angular 2 client

Install these globals with npm install --global:

  • webpack (npm install --global webpack)
  • webpack-dev-server (npm install --global webpack-dev-server)
  • yarn (npm install --global yarn)

Then, from inside the angular2-client folder run:

  • yarn or npm install to install all dependencies

Setting up Django server

In order to setup the Django server you need at least python 3.4. It is suggested to create a virtual environment to install all the dependencies: Install virtualvenv if you don't have it

$ pip install virtualenv

create a new virtual environment

$ virtualenv venv

activate the virtual environment that can be later deactivated with deactivate

$ source venv/bin/activate

Then you can install all the required dependencies:

$ pip install -r ./django-server/requirements.txt

Setting up MySQL

The user registration, movie comments and ratings are stored in a MySQL database, if you don't have one already installed I suggest to follow the following quick tutorial (for Linux): https://www.digitalocean.com/community/tutorials/how-to-install-mysql-on-ubuntu-16-04 You may also need to install these additional packages:

$ sudo apt-get install python-dev mysql-server libmysqlclient-dev

Configuration

  1. Create a .env file in the /angular2-client directory with the following line SERVER_LOCATION=local. This will set the appropriate env variable needed to address the api calls to localhost:8000.
  2. Customize the DATABASES variable in /django-server/server/settings.py with the database name, host, user and password.
  3. Create the database tables by running python manage.py makemigrations movies from the /django-server folder to create the migrations first, and then python manage.py migrate to apply them.

Running the app

  • To start the server run python manage.py runserver from the /django-server folder. Server will be running on http://localhost:8000/
  • To start the client run npm start from the /angular2-client folder. Client will be running on http://localhost:3000/

License

MIT © damnko

angular2-django-movies's People

Contributors

damnko avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.