ECE366 - Lesson 11

Hosting on the Cloud (continued), Testing

Instructor: Professor Hong

Review & Questions

## Hosting a React App
## Create a New React App ``` npx create-react-app myapp cd myapp npm install npm start ```
## Dockerfile ``` FROM node:16.13.1-alpine as build RUN npm install -g serve # A simple webserver WORKDIR /usr/src/app COPY package*.json ./ RUN npm install COPY . . RUN npm run build EXPOSE 80 CMD ["serve", "-s", "build", "-l", "80"] ```
## Docker-compose.yaml ``` version: '3' services: ui: build: . image: samplereactacr.azurecr.io/ui container_name: samplereact ports: - "80:80" ``` ``` docker compose build docker compose up ``` Note: We're using port 80
## Create Azure Parts - Create an Azure Resource Group - Create an Azure Container Registry - Create an Azure Container Instance docker context ``` az login --use-device-code az acr login --name samplereactacr docker context create aci samplereactaci docker context ls ```
## Push to Azure and Run Container Instances ``` docker-compose push docker context use samplereactaci docker compose up docker ps ```
## Azure With Docker Compose
## RPS - Removed firebase authentication for simplicity ``` curl localhost:8080/api/getUsers ``` Dockerfile ``` FROM maven:3.8.7-eclipse-temurin-19 AS build ADD . /project WORKDIR /project RUN mvn -e package FROM eclipse-temurin:latest COPY --from=build /project/target/rps-0.0.1-SNAPSHOT.jar /app/rps.jar ENTRYPOINT ["java","-jar","/app/rps.jar"] ```
## Create Azure Parts - Create an Azure Resource Group - Create an Azure Container Registry - Create an Azure Container Instance docker context ``` az login --use-device-code az acr login --name rpsacr docker context create aci rpsaci docker context ls ```
## docker-compose.yaml ``` services: db: build: db image: rpsacr.azurecr.io/db container_name: db environment: - POSTGRES_DB=postgres - POSTGRES_PASSWORD=password expose: - 5432:5432 ports: - 5432:5432 restart: always app: build: server/rps image: rpsacr.azurecr.io/app container_name: app ports: - 8080:8080 environment: - POSTGRES_DB=postgres - POSTGRES_PASSWORD=password depends_on: - db ```
## Push to Azure and Run Container Instances ``` docker-compose push docker context use rpsaci docker compose up docker ps ```
## Check db and server - Check dbeaver - host: IP address - port: 5432 - database: rps - username/password: postgres/password - Curl the IP address and API ``` curl 4.156.198.75:8080/api/getUsers ```
## Adding the React UI Separately Dockerfile ``` FROM node:16.13.1-alpine as build RUN npm install -g serve # A simple webserver WORKDIR /usr/src/app COPY package*.json ./ RUN npm install COPY . . RUN npm run build EXPOSE 80 CMD ["serve", "-s", "build", "-l", "80"] ``` - Update IP address of server
## Adding the React UI Separately docker-compose.yaml ``` version: '3' services: ui: build: . image: rpsacr.azurecr.io/ui container_name: uitest ports: - "80:80" ```
## Push to Azure and Run Container Instances ``` docker compose build docker-compose push docker context use rpsaci docker compose up docker ps ```
## Testing
## Make a basic spring boot project - [https://start.spring.io/](https://start.spring.io/)
## Add Sample Class ``` package com.example.demo; public class Calculator { public int multiplyByTwo(int x) { return 2*x; } } ```
## Add Sample Tests ``` package com.example.demo; import org.junit.jupiter.api.Test; import org.springframework.boot.test.context.SpringBootTest; import static org.junit.jupiter.api.Assertions.assertEquals; @SpringBootTest class DemoApplicationTests { @Test void contextLoads() { } @Test void testMultiplyByTwo() { Calculator c = new Calculator(); int result = c.multiplyByTwo(2); assertEquals(4, result); } } ```
## Testing Resources [https://medium.com/capital-one-tech/improve-java-code-with-unit-tests-and-jacoco-b342643736ed](https://medium.com/capital-one-tech/improve-java-code-with-unit-tests-and-jacoco-b342643736ed) [https://www.jetbrains.com/help/idea/running-test-with-coverage.html#run-config-with-coverage](https://www.jetbrains.com/help/idea/running-test-with-coverage.html#run-config-with-coverage)