About the Application

Color Closet is a simple Nuxt.js application that utilizes API calls to create, read, update, and delete student's favorite color. The information is stored in AWS DynamoDB. This application is created to pass off the BYU OIT Full-stack Training.

When you first open the application, you will be prompted to log in using your BYU Net ID and password. Once done, you will see a list of students whose favorite colors are already stored in the database.

You can add a new student along with their favorite color and name to the application. All these fields are mandatory, and you must make sure to put in a 7-digit BYU ID. Once you save it, the application will call a POST request to the endpoint and persist the new entry to the database.

You may also edit existing student's favorite color and delete them as you wish. Be very careful when deleting because there is no going back!

If you add a BYU ID after the link (such as /111222333), you will see a specific student's favorite color card. But if they have never logged their favorite color, you will see a short message.

Have fun tweaking each other's favorite color!

---

Project Setup

Initial Setup

1. Click the Green Use this template button at the top of the template repository. Then clone the repository and checkout a new branch called dev.

2. Setup GitHub secrets

   1. Use this order form to give your repo access to the secrets that will let it deploy into your AWS accounts. Fill out the form twice to give access to both your dev and prd accounts.
   2. Go to codecov.io, login with your GitHub account, find your repo and copy the token.
      1. Copy the codecov token and upload it to your github repo's secrets with the name of codecov_token
      2. (Optional) Add the Codecov badge (found under Settings->Badge in codecov for you repo) to the badge table at the top of this README. The badge copied from Codecov is only for master, but you can use the same code for the dev branch by replacing master with dev.

3. Create 2 new applications in Tyk (one in sandbox for dev and one in production for prd). The application name should be something simple and unique (maybe the name of your repo) and the callback URL should be what you put inside your app-dev.tf and app-prd.tf files for local.url variable (be sure to include the protocol and trailing slash).

   1. Enable 'Implicit Grant Type' in the 'Deprecated Options'. Be sure to set the right callback URL.

4. AWS Setup (this will create Route53 hosted zones in your aws accounts and upload SSM params)

   1. Create 2 terraform variable files (these files are gitignored) in /terraform/dev/setup/dev.tfvars (use the dev client_id and callback from step #6) and /terraform/prd/setup/prd.tfvars (use the prd client_id and callback from step #6):

      client_id = "<CLIENT_ID>"
      callback_url = "<CALLBACK_URL>"
      // custom_domain = "custom-domain.byu.edu" // OPTIONAL. Only required if you want a custom domain name.
      // app_dynamics_key = "<APP_DYNAMICS_KEY>" // OPTIONAL. See the "AppDynamics Setup" for instructions how to get the key.

   2. Update the TODO items in /terraform/dev/setup/setup-dev.tf and /terraform/dev/setup/setup-prd.tf
   3. Run terraform to setup the DEV environment
      1. Run awslogin and login to the dev account you want to deploy to.
      2. Run setup which uploads SSM parameters:

         cd terraform/dev/setup
         terraform init
         terraform apply -var-file=dev.tfvars

      3. Use this order form to request having your dev subdomain added to BYU's DNS servers. Add yourself as the technical contact, select Cname, and list the NS records found in Route 53 (from above step) in the "Aliases" field.
   4. Run terraform to setup the PRD environment
      1. Run awslogin and login to the prd account you want to deploy to.
      2. Run setup which uploads SSM parameters:

         cd ../../prd/setup
         terraform init
         terraform apply -var-file=prd.tfvars

      3. NOTE if you're transferring an existing URL to a new Account see the instructions below instead
      4. Use this order form to request having your dev subdomain added to BYU's DNS servers. Add yourself as the technical contact, select Cname, and list the NS records found in Route 53 (from above step) in the "Aliases" field.

5. Now we have to wait for the order forms to be completed by the networking team. While waiting you can update the code in the repo:

   1. Customize this README.
   2. Change the Name, Description, and Author in package.json.
   3. Cycle through the TODOs to update (any TODOs that don't talk about replacing can be deleted. They are TODOs for this template only.)
      • <APP_NAME> - typically your repo name (keep it short if you can, there tends to be issues with longer names with some AWS resources)
      • <REPO_NAME> - The full URL of the project's repository.
      • <DEV_AWS_ACCT_NUM> - the AWS account number for your dev account
      • <PRD_AWS_ACCT_NUM> - the AWS account number for your prd account
      • <GITHUB_AWS_DEV_KEY_NAME> - the name of the GitHub secret for dev AWS key (i.e. byu_oit_customapps_dev_key)
      • <GITHUB_AWS_DEV_SECRET_NAME> - the name of the GitHub secret for dev AWS secret (i.e. byu_oit_customapps_dev_secret)
      • <GITHUB_AWS_PRD_KEY_NAME> - the name of the GitHub secret for prd AWS key (i.e. byu_oit_customapps_prd_key)
      • <GITHUB_AWS_PRD_SECRET_NAME> - the name of the GitHub secret for prd AWS secret (i.e. byu_oit_customapps_prd_secret)
      • <STD_CHANGE_TEMPLATE_ID> - WHEN READY FOR PRODUCTION: In ServiceNow, create a new standard change template and be sure to give it an alias, put that alias here
      • the page/site title
      • the dependabot config.yml file

6. Wait until the order forms are completed and DNS is routed to your AWS hosted zones. This could take a few hours to a day.

7. Push your changes to your GitHub repo master branch (and dev branch)

   • this should start the pipeline worklfows (dev and prd), which will each take 15-30 minutes to spin up the CloudFront distributions

8. If all was successful, your site should be available at both dev and prd URLs