/jokes-ui

UI Demo for Chuck Norris Jokes

Primary LanguageTypeScript

Modification for Demo purposes

Current repo is the modification of the repo made by by John Papa to demonstrate the consume of another one external rest services.

The best way to test the app is to build and run a docker image. The current one can be obtained from docker.io:

 docker pull itasgmbhde/jokes-ui

Building the app

  docker build -t itasgmbhde/jokes-ui .

Running the app

docker run -it --rm -p 8080:80 -e "APPSETTING_cosmosPort=10255"  -e "APPSETTING_dbName=<databaseName>" -e "APPSETTING_key=<databasekey>" -e "APPSETTING_useProxy=<true|false>"  itasgmbhde/jokes-ui

Environment Variables

Variables are prefixed by APPSETTING_ because the naming conventions of Azure Webapps

Variable Usage Sample value
cosmosPort Port 10255
dbName Cosmos DB/MongoDB Collection heroes
key Database Password / Secret xYzasfwewe12334==
useProxy Should node act as proxy to serve /jokes path? if true, it routes to localhost:8080, only for development true

See also https://github.com/itasgmbh/jokes for correspondig jokes microservice

=======

=======

Angular Cosmos DB

by John Papa

You can watch me build the app as part of my series here

You can view all videos together here

Learn more about developing Node.js apps with Azure's cloud services here

Docker

Create the Docker image and run it locally

dockerImage=angular-cosmosdb
docker build -t $dockerImage .
docker run -d -p 3000:80 $dockerImage

Requirements

  1. Install the Angular CLI

    npm install -g @angular/cli

  2. Install the Azure CLI

Getting Started

  1. Clone this repository

    git clone https://github.com/johnpapa/angular-cosmosdb.git
cd angular-cosmosdb

  2. Install the npm packages

    npm i

  3. Configure Cosmos DB server settings

    Rename the example-environment.js file to environment.js in the server/env/ folder and update it with your Cosmos DB settings. Replace the database name key, and port with your specific configuration.

    // server/env/environment.js
const cosmosPort = 1234; // replace with your port
const dbName = 'your-cosmos-db-name-goes-here';
const key = 'your-key-goes-here';

module.exports = {
  cosmosPort,
  dbName,
  key
};

Running the app

  1. Build the Angular app

    ng build

  2. Launch the server

    node src/server/index.js

  3. Open the browser to http://localhost:3000

Problems or Suggestions

Open an issue here