Booking Microsite

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, add the API subscription keys in your .env.local. This file is ignored by git and should be at the root level of this project. All the API URLs for local development are located in .env.development. You should be able to get the subscription key for each API in Azure and add them to your .env.local file. Your .env.local should look something like this:

# .env.local
CHECKOUT_API_KEY=subscription_key
SHOPPING_API_KEY=subscription_key
CITYSEARCH_API_KEY=subscription_key
PRICING_API_KEY=subscription_key
COUNTRY_CODES_API_KEY=subscription_key

Click here for documentation on Next.js built-in support for loading environment variables.

As this project is pulling npm packages from the AlaskaAir npm repository anyone building the project will need to setup the environment variable ALASKA_NPM_TOKEN with the BASE64 of their personal access token. The project .npmrc file uses the enironment variable to authenticate with the itsals npm repository which contains instructions for how to generate the BASE64 personal access token.

Second, run the development server:

npm run dev
# or
yarn dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying pages/index.tsx. The page auto-updates as you edit the file.

API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.tsx.

The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.

Build The Docker Image

docker build .

Learn More

To learn more about Next.js, take a look at the following resources:

• Next.js Documentation - learn about Next.js features and API.
• Learn Next.js - an interactive Next.js tutorial.

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Kubernetes Setup

az ad sp create-for-rbac --name "booking-site" --role contributor --scopes /subscriptions/ff161cf1-49ad-472d-8ff5-b8db96aa2b0e/resourceGroups/ecommercekubernetes-test-group --sdk-auth

Image Repository

> az acr

{
  "passwords": [
    {
      "name": "password",
      "value": "R301XFitsXF+Q5HFlB29vpt7EISfQ44F"
    },
    {
      "name": "password2",
      "value": "+ngdzw9cNf5O759Q/tKzaKTiH/jPyhtz"
    }
  ],
  "username": "AlaskaAirBooking"
}

{
  "appId": "33e9739b-38a1-4840-8862-28d7940ffaab",
  "displayName": "bookingClusterService",
  "name": "33e9739b-38a1-4840-8862-28d7940ffaab",
  "password": "aMwV8.c_PXpI-hpMU208pnlyR1MDbP1oJ3",
  "tenant": "0f44c5d4-42b0-45c2-bf55-d0fea8430d33"
}

{ "appId": "33e9739b-38a1-4840-8862-28d7940ffaab", "displayName": "bookingClusterService", "name": "33e9739b-38a1-4840-8862-28d7940ffaab", "password": "aMwV8.c_PXpI-hpMU208pnlyR1MDbP1oJ3", "tenant": "0f44c5d4-42b0-45c2-bf55-d0fea8430d33" }

Redirecting to legacy alaskaair.com Confirmation page

The redirects are configured in next.config.js.

The url for legacy Confirmation page is https://www.alaskaair.com/booking/reservation-lookup?RECLOC=confirmationCode&LNAME=lastName&ISNEWRESERVATION=true

When you are making a booking, please make sure you are server picked to the correct as.com server. For example, if you made a CERT booking you need to be pointed to an as.com server pointed to CERT to be able to pull up the reservation.

• booking-site test env -> tsts as.com server
• booking-site qa env -> cert as.com server
• booking-site prod env -> res as.com server

If we are redirecting to legacy confirmation page, then we will run into a CORS issue in the Cypress tests. As a temporary workaround until we have finished the new confirmation page, we will have to disable chrome web security to allow cross-origin during the Cypress tests. Please remove this line "chromeWebSecurity": false in cypress.json when we do not need to redirect to the old legacy confirmation page.

Environment Variables

If you need to add a new environment variable, please add them to:

• .env.development
• all Kubernetes deployment.yaml files under the manifest directory

If you need to add a secret environment variable (e.g. subscription key), please do not add it to .env.development. Please follow these steps:

1. Add secret environment variable in your .env.local file and notify team members that they will also have to include it in their own .env.local file because this file is purposely ignored by git. Please see here for Next.js built-in support for loading environment variables.
2. Go to our repository in GitHub. Create the GitHub repository secret.
3. Go to our Kubernetes deployment GitHub workflow.
   • Modify secrets inputs to accept the new secret environment variable
   • Please modify the existing kubectl create secret command to reference this new secrets input and create the additional secret
4. Go to our deploy file and pass in the new GitHub repository secret for all environments.
5. Go to all Kubernetes deployment.yaml files under the manifest directory, and reference the new Kubernetes secret that you created in the Kubernetes deployment GitHub workflow.

Component Hangar

• website: https://components.alaskaair.com/
• github: https://github.com/Alaska-ECommerce/ComponentLibrary