Startup

To startup a development server,

npm i
npm run dev

Alternatively, you may use pnpm as a drop-in replacement for npm

To build:

npm run build

/src/app/config.ts

Configuration for frontend

• .serverOrigin: (string) URL address of BrainBroomAI's backend (e.g. "http://localhost:8000", no leading forward slash)
• .authTokenHeaderKeyName: (string) name of authorisation header accepted by BrainBroomAI's backend to pass in authentication token
• speechServiceURL: (string) server origin of Speech Service server (e.g. "localhost:3001")
• speechServiceRecongitionProtocol: (string) protocol for speech service's recognition (e.g. "ws")
• speechServiceRecognitionNamespace: (string) name space for speech service's recognition (e.g. "recognition")
• speechServiceSynthesisProtocol: (string) protocol for speech service's synthesis (e.g. "http")
• speechServiceSynthesisNamespace: (string) name space for speech service's synthesis (e.g. "synthesis")
• .GameTheme
  • .background: (string) hexadecimal color code for the background of the game page
  • .responseIndicator: (string[]) hexadecimal color codes for the response indicators mapped to [OKAY, NOT OKAY], modifies the color of the response text as indicators

.env.local

Only one variable is used to maintain sessions

• SECRET_KEY: (string) 32 byte base64 encoded key
• GOOGLE_APPLICATION_CREDENTIALS : (string) points to serviceAccountKey.json path (e.g. "./serviceAccountKey.json")

serviceAccountKey.json

Contains the Google Cloud's service account key

Dependencies

• next.js: web framework with React
• jose: JWT tokens support
• react-hook-form: 3rd party reactive form elements
• hookform/resolvers: react-hook-form's built-in resolver for zod schemas
• zod: 3rd party schema declaration and validation
• axios: HTTP client to send API calls to BrainBloomAI's own backend
• socket.io-client: web socket application on the client side, to interact with Speech Service

Resources

• Icons sourced from Phosphor Icons
• Bing sound effect from orangefreesounds

©️ 2024 BrainBloomAI Team. All rights reserved.