MemoryGame

This project is inspired by Kubowania Memory Game from this YouTube video and deployed here.

---

---

No Visual Studio Code Container

Requirements

• Node.js
• Angular CLI Gobally

Recommended

• Visual Studio Code IDE
  • Extensions
  • Live Server VS Code Extension - For GitHub Pages build mock.
  • Debugger for Chrome
• Internet browser - Not Internet Explorer.
  • Google Chrome

Getting Started

1. Clone/Fork Memory Game Repository.
2. Open repository in an IDE.
3. Open a Terminal window to the repository root.
4. Run npm i from the Terminal window to install Node Modules.

Settings and Variables

Setup environment variables.

Copy from projects/the-application/src/environments/ the file environment.sample.ts to:

• For serving environment.ts
• Optional
  • For production environment.prod.ts
  • For GitHub environment.github.ts

Configure Firebase settings. See the steps here at 8 and 9

Copy from .firebaserc.sample to .firebaserc

• Set up the <firebase-project-id> as the project id

See the Firebase -> Project Settings -> General - tab.

Serving

Using a Terminal window.

Locally - No Service Worker

Use any of the following commands to serve the project using Angular serve tools.

• npm run ng run the-application:serve
• ng run the-application:serve
• ng serve
• ng serve --project=the-application

Open the internet browser at localhost

Locally - W/Out Service Worker

Build the-application using any of the following build commands.

Without Service Worker

• ng build
• ng build --project=the-application
• npm run ng run the-application:build
• ng run the-application:build
• npm run ng run the-application:app-shell
• ng run the-application:app-shell

With Service Worker

Not GitHub Pages

• ng build --prod
• ng build --project=the-application --prod
• npm run ng run the-application:app-shell:production
• npm run ng run the-application:build:production
• ng run the-application:app-shell:production
• ng run the-application:build:production
• npm run build:shell

GitHub Pages

• ng build --configuration=github
• ng build --project=the-application --configuration=github
• npm run ng run the-application:app-shell:github
• npm run ng run the-application:build:github
• ng run the-application:app-shell:github
• ng run the-application:build:github
• npm run build:shell:github

After building the build can be served

• npm run run:server

Open the internet browser at localhost.

If built for GitHub Pages use the Live Server Go Live button after the command directly above. See the Live Server extension Start/Stop section for more details.

Debugging

• Serve the application from Serving
• Use the Run command in Visual Studio Code
• Start debugging

---

---

Visual Studio Code Container

Requirements

• Docker
• Visual Studio Code
  • Extensions
  • Docker
  • Remote - Containers

Recommended

• Visual Studio Code
  • Extensions
  • Debugger for Chrome
  • Remote - SSH
• Google Chrome

Getting Started

1. Clone/Fork Memory Game Repository.
2. Open repository in Visual Studio Code IDE.
   1. Open in remote container when asked.
3. Open a Terminal window to the repository root.
4. Run npm i from the Terminal window to install Node Modules.
   1. Should be run for you at container creation.

If you'd like Angular VSIcons and they are not appearing you can toggle them with the VS Code Command Palette >Icons: Toggle Angular Preset (Workspace Level)

Serving

Using a Terminal window.

Use any of the following commands to serve the project using Angular serve tools.

• npm run ng run the-application:serve
• ng run the-application:serve
• ng serve
• ng serve --project=the-application

Open the internet browser at localhost

Debugging

• Serve the application from Serving
• Use the Run command in Visual Studio Code
• Start debugging