ALC 4 Phase II Cloud Challenge using A Github Repository

  • GCP: Google Cloud Platform
  • Repo: Repository


  1. Install nodejs on Windows or Linux.
  2. Windows Professional version.
  3. Setup GCP Cloud SDK on your local machine.
  4. Install docker and enable the settings to use Linux containers (not needed for Linux users) rather than Windows version as the latter are more expensive to deploy on gcp (note: that this settings can be changed after installing, if you enabled it).
  5. Github account.
  6. Set up google container credential helper in docker so you can push the created image to your google container registry.
  • Install the helper using the commands from a powershell window:
gcloud components install docker-credential-gcr
  • Configure the helper:
docker-credential-gcr configure-docker
docker login --username <enter_docker_username>
npm install -g yarn
  1. Install the react app tool:
yarn add global create-react-app
yarn create-react-app win-build
Structure of your created files and folders in vscode
FROM node as build-deps
WORKDIR /usr/src/app
COPY package.json yarn.lock ./
RUN yarn
COPY . ./
RUN yarn build
FROM nginx:1.12-alpine
COPY --from=build-deps /usr/src/app/build /usr/share/nginx/html
CMD ["nginx", "-g", "daemon off;"]
  1. Draw in the node docker image and copy your package.json and yarn.lock files into that image and run yarn then once again copy the entire contents of your current location in the image and use yarn to build.
  2. Draw in the “nginx” image from docker and “ — from=build-deps” in the step 1 above copy the “build” folder into the “/usr/share/nginx/html” location in the image we are pulling in. Windows users “remember” we are using a linux container hence the “/usr/…”. We now expose port 80 and run the nginx command in the container in none daemon mode.
docker build . -t udoyen/win-challengeapp
docker run -p 8080:80 --name win-docker udoyen/win-challengeapp
  1. Create a github repository
  2. Add the remote url to your local git repository
git add remote origin
git push -u origin master
Structure of your created files and folders in vscode



Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
george udosen

george udosen


DevOps | FullStack developer | Python::Flask | GCP Cloud Certified | AWS & AZURE Cloud Savy | Linux Sysadmin | Google IT Support