https://github.com/ansrivas/angular2-flask

Simple angular2 app with python-flask backend ( Learning Angular2 )
https://github.com/ansrivas/angular2-flask

angular2 angular2-flask flask flask-backend frontend python

Last synced: 1 day ago
JSON representation

Simple angular2 app with python-flask backend ( Learning Angular2 )

• Host: GitHub
• URL: https://github.com/ansrivas/angular2-flask
• Owner: ansrivas
• License: mit
• Created: 2016-03-26T20:57:51.000Z (over 9 years ago)
• Default Branch: master
• Last Pushed: 2023-03-06T05:26:34.000Z (over 2 years ago)
• Last Synced: 2025-05-08T23:45:47.053Z (about 2 months ago)
• Topics: angular2, angular2-flask, flask, flask-backend, frontend, python
• Language: JavaScript
• Homepage:
• Size: 2.93 MB
• Stars: 152
• Watchers: 11
• Forks: 46
• Open Issues: 33
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# angular2-flask

---

| `Backend`        | `Frontend`           |

| :-------------: |:-------------:|

|[![DockerPulls](https://img.shields.io/docker/pulls/ansrivas/flask-backend.svg)](https://registry.hub.docker.com/u/ansrivas/flask-backend/)    | [![DockerPulls](https://img.shields.io/docker/pulls/ansrivas/angular2-frontend.svg)](https://registry.hub.docker.com/u/ansrivas/angular2-frontend/)      |

| [![Docker Build Statu](https://img.shields.io/docker/build/ansrivas/flask-backend.svg)]()     | [![Docker Build Statu](https://img.shields.io/docker/build/ansrivas/angular2-frontend.svg)]()|  

Simple angular2 app with python-flask backend (for learning angular2)

## Dockerized version:

---

The current build is using `nginx` to serve static files.

1. In project root directory execute `docker-compose up`

2. Navigate to `http://localhost:3000` and login using `admin:admin`

## Info

---

1.  `backend` directory contains the flask backend with simple authentication methods

2.  `front` directory contains the angular2 frontend based on [angular-webpack-starter](https://github.com/AngularClass/angular2-webpack-starter)

## Usage

---

1.  Clone the repo

    ```bash

    git clone --depth 1 https://github.com/ansrivas/angular2-flask.git

    cd angular2-flask

    ```

2.  Install the backend related requirements and run. The following will start a flask-server on `localhost:8080`

    ```bash

    cd backend

    sudo pip install -r requirements.txt

    python run.py

    ```

3.  Install frontend related dependencies

    -   Easiest way to handle node related dependencies is to install [nvm](https://github.com/creationix/nvm)

    -   Once you have node installed, install the project's dependencies

    ```bash

    cd front

    # install global dependencies

    npm install webpack-dev-server rimraf webpack typescript -g

    # install project related dependencies

    npm install

    # run server

    npm run server:dev:hmr

    ```

4.  Now navigate to `http://localhost:3000` and login using default credential : `admin:admin`

5.  Extra Note: To create a production build

    ```bash

    cd front

    npm install webpack-dev-server rimraf webpack typescript -g

    npm install

    npm run build:prod

    # Serves on http://localhost:5000

    npm run server:prod

    ```