Udagram is a simple cloud application developed alongside the Udacity Cloud Engineering Nanodegree. It allows users to register and log into a web client, post photos to the feed, and process photos using an image filtering microservice.
The project is split into three parts:
- The Simple Frontend A basic Ionic client web application that consumes the RestAPI Backend.
- The RestAPI Feed Backend, a Node-Express feed microservice.
- The RestAPI User Backend, a Node-Express user microservice.
This project depends on Nodejs and Node Package Manager (NPM). Before continuing, you must download and install Node (NPM is included) from https://nodejs.com/en/download.
The Ionic Command Line Interface is required to serve and build the frontend. Instructions for installing the CLI can be found in the Ionic Framework Docs.
This project uses NPM to manage software dependencies. NPM Relies on the package.json file located in the root of this repository. After cloning, open your terminal and run:
npm installtip: npm i is shorthand for npm install
You'll need to create a new node server. Open a new terminal within the project directory and run:
- Initialize a new project:
npm init - Install express:
npm i express --save - Install typescript dependencies:
npm i ts-node-dev tslint typescript @types/bluebird @types/express @types/node --save-dev - Look at the
package.jsonfile from the RestAPI repo and copy thescriptsblock into the auto-generatedpackage.jsonin this project. This will allow you to use shorthand commands likenpm run dev
Ionic uses environment files located in ./src/environments/enviornment.*.ts to load configuration variables at runtime. By default environment.ts is used for development and enviornment.prod.ts is used for production. The apiHost variable should be set to your server URL either locally or in the cloud.
Ionic CLI provides an easy-to-use development server to run and auto-reload the frontend. This allows you to make quick changes and see them in real-time in your browser. To run the development server, open the terminal and run:
ionic serveIonic CLI can build the frontend into static HTML/CSS/JavaScript files. These files can be uploaded to a host to be consumed by users on the web. Build artifacts are located in ./www. To build from source, open terminal and run:
ionic buildSteps 1 - 3 are one-time-only steps.
- Set the appropriate values for the below environment variables:
export POSTGRESS_USERNAME=<postgress database username>
export POSTGRESS_PASSWORD=<postgress database password>
export POSTGRESS_DB=<postgress database name>
export POSTGRESS_HOST=<postgress database instance hostname>
export AWS_REGION=<aws region where bucket and database are located>
export AWS_PROFILE=<aws profile for credentials>
export AWS_BUCKET=<aws bucket name for storing images>
export JWT_SECRET=<secret string for encoding passwords>
-
Install docker desktop: https://docs.docker.com/get-docker/
-
Install docker-compose: https://docs.docker.com/compose/install/
-
Build Images -
docker-compose -f udagram-deployment/docker/docker-compose-build.yaml build --parallel -
Verify Images -
docker images -
Push images -
This step is optional for running the app as a docker container.
docker push <dockerhubusername>/udagram-restapi-feed:latest
docker push <dockerhubusername>/udagram-restapi-user:latest
docker push <dockerhubusername>/udagram-frontend:local
docker push <dockerhubusername>/udagram-reverseproxy:latest
If you don't want to do this step. Change the line that says imagePullPolicy: Always to imagePullPolicy: Never in all *-deployment.yaml files in udacity-c3-deployment/k8s/. This is required to run the app on a local Kubernetes cluster.
-
Run app -
cd udagram-deployment/docker/ && docker-compose up -
Verify application :
Open localhost:8100 in browser.
- Stop app -
cd udagram-deployment/docker/ && docker-compose down
If you have already followed steps for deploying as a docker container then you can follow the steps below. If not, then follow steps 1-6 from the previous section and then continue from here.
- Enable Kubernetes on docker desktop.
Docker desktop app > Preferences(Settings on windows) > Kubernetes > Check "Enable Kubernetes"
This will take a few minutes to setup and download the CLI.
Verify running the below command on terminal
kubectl cluster-info
- Setup additional environment variables.
export AWS_CREDENTIALS=<base64 encoded AWS credentials file>
export POSTGRESS_USERNAME=<base64 encoded POSTGRESS username>
export POSTGRESS_PASSWORD=<base64 encoded POSTGRESS password>
- Verify :
kubectl get all
This should show
- deployments for backend-user, backend-feeds, reverseproxy, frontend.
- pods for backend-user, backend-feeds, reverseproxy, frontend.
- services for backend-user, backend-feeds, reverseproxy, frontend.
- Setup port forwarding :
kubectl port-forward services/reverseproxy 8080:8080 &
kubectl port-forward services/frontend 8100:8100 &
- Verify application :
Open localhost:8100 in browser.
The repo has travis ci build instructions in .travisci.yaml. Follow the below steps to create a build plan.
- Integrate GIT with Travis CI - https://travis-ci.org/
- On Travis CI setup the following env variables for the repo/branch.
DOCKER_USERNAME=<dockerhub username>
DOCKER_PASSWORD=<dockerhub password>
AWS_CREDENTIALS=<base64 encoded AWS IAM credentials with adequate policy>
POSTGRESS_USERNAME=<base64 encoded PostgreSQL db username>
POSTGRESS_PASSWORD=<base64 encoded PostgreSQL db password>
AWS_BUCKET=<aws bucket name for storing app images>
AWS_PROFILE=<aws profile>
AWS_REGION=<aws region>
JWT_SECRET=<secret string for encrypting app passwords>
POSTGRESS_DB=<postgress db name>
POSTGRESS_HOST=<postgress db instance hostname>
- Trigger a build from the Travis CI dashboard.
- Javascript - The programming language used
- Node.js® - The JavaScript runtime used
- Express.js® - The web application framework used
- PostgreSQL - Relational Database used
- AWS Elastic Beanstalk - AWS deployment and scaling service used
- Docker - The container engine used
- Travis CI - The continuous integration service used
- Pemberai Sweto - Initial work - Udagram Image Filtering Microservice
- This project is licensed under the MIT License - see the LICENSE.md file for details
- Copyright 2020 © Pemberai Sweto.