The G Spot Bar

---

What is it?

A responsive Single Page Application (SPA), written in Angular v5.2, for a home bar. The G Spot website displays a reference of karaoke songs, beer, and drinks availible. It also has a contact form to email the bar owners.

All of this data for beer, booze, and karaoke songs are stored in JSON files in ./assets/JSON/. Updating these files updates the website.

This project was generated with Angular CLI. The HTML/CSS templates utilize Bootstrap version 3.3.7 for styling. The frontend uses PrimeNG as an added UI framework.

Table of Contents

• Background
• Installation
• Development Environment
  • Code scaffolding
• Production
• Running unit tests
• Running end-to-end tests
• Further help
• TODO
• Maintainers
• Contribute
• License

Background

The G Spot is the name of my home bar, which was completed in 2017. It got it's name from my wife and I's last names. The website was setup partially as a joke, but also as a reference. The website can be used to find karaoke track #s from your phone. It can also be used by friends to see what drinks are avialiable before coming over.

Installation

1. Download and install Node.js using these instructions.

2. Download and install GitHub Desktop using these instructions

3. Clone this repository using the instructions from GitHub

   • Ensure you use command: git clone https://github.com/ZGrauer/GSpotBar.git

4. Install all dependencies by entering npm install from a terminal within the cloned folder.

5. Go to Google reCAPTCHA/ and setup your domain for reCAPTCHA V2. Record the site key and secret key.

6. Go to your project file /src/app/contact/contact.component.html, and update the siteKey value within the <p-captcha> tag on line 39.

7. Go to your project file /src/app/contact/email.service.ts, and update the private emailUrl value on line 17 with your personal email. This is where the contact form will go to.

8. Edit Angular files as needed within the ./src/app/ folder. Use the Angular CLI to add components.

Development Environment

Run ng serve in a terminal from the project directory for a dev server. The app can then be run by navigating to http://localhost:4200/. The app will automatically reload if you change any of the source files.

    $ ng serve

Code scaffolding

From a terminal run ng generate component component-name to generate a new component using the Angular CLI. You can also use ng generate directive/pipe/service/class/module.

    $ ng generate component component-name

Production

Run ng build to build the project. The build artifacts will be stored in the dist/ directory. Use the --prod --aot flag for a production build.

    $ ng build

Running unit tests

Run ng test to execute the unit tests via Karma.

    $ ng test

Running end-to-end tests

Run ng e2e to execute the end-to-end tests via Protractor. Before running the tests make sure you are serving the app via ng serve.

    $ ng e2e

Further help

To get more help on the Angular CLI use ng help or go check out the Angular CLI README.

    $ ng help

TODO

• [] Swap formspree to local PHP path in email service. Spin up server and test.

Maintainers

@ZGrauer.

Contribute

Feel free to dive in! Open an issue or submit PRs.

Customer Tracker follows the Contributor Covenant Code of Conduct.

License

GNU © Zachary Grauerholz