CogniKids is revolutionizing family playtime by combining neuroscience, mental health, and child development with advanced technology. Our AI agent offers personalized, interactive play experiences that adapt in real-time to your family's needs, using everyday items for sustainable fun.

Core Dependencies

Before setting up the project, ensure you have the following core dependencies installed globally:

1. Node.js - v20.14.0 Download Node.js
2. NPM - v10.9.0 Learn about NPM
3. Firebase CLI Get Firebase CLI
4. Expo CLI Install Expo CLI

Important

Log in to All Required CLIs

• Firebase CLI: Log in to your Firebase account to ensure access to Firebase services and emulators.
• Expo CLI: Log in with your Expo account to access development builds and deployment features.

Verify Project Access for Each CLI

• Make sure your Firebase and Expo accounts have the required permissions for this project. Lack of access can prevent essential functionalities like running emulators or deploying functions.

Node Version Compatibility

• Confirm your Node.js version is compatible (v20.14.0) to avoid issues with dependencies and ensure stable project performance.

Repository Structure

Below is the organized structure of the project files and directories with sorted descriptions for each:

|
├── 📁 .github                    # GitHub workflows, issue, and PR templates
├── 📁 app                        # React Native mobile app code
├── 📁 flows                      # Firebase genkit flows
├── 📁 functions                  # Firebase functions code
├── 📁 media                      # README media
├── 📄 .firebaserc                # Firebase configuration file
├── 📄 .gitignore                 
├── 📄 biome.json                 # Code lint and format config
├── 📄 firebase.json              # Firebase service config
├── 📄 firestore.indexes.json     # Firestore index definitions
├── 📄 firestore.rules            # Firestore security rules
├── 📄 LICENSE                    
├── 📄 README.md                  # Project overview and setup
|

Contributing Guide

Thank you for contributing! Please follow these guidelines:

Tip

• Commit Message Format:
  Use Semantic Commit Messages:

  <type>(<scope>): <subject>
  

  • Examples:
    • Feature: feat(auth): add user login functionality
    • Bug Fix: fix(api): resolve 500 error on user creation

• Pull Request Title Format:
  Follow the same format as commit messages:

  <type>(<scope>): <subject>
  

  • Examples:
    • Feature: feat(auth): implement OAuth2 authentication
    • Bug Fix: fix(ui): correct layout issue in user profile

• Code Linting and Formatting:
  Before submitting, run:

  npm run lint
  
  npm run format

  This ensures your code meets our standards.

• Documentation:
  Please write documentation for your code changes in both the code (using comments) and markdown files to enhance clarity and maintainability.

Warning

Important Guidelines

• Semantic Pull Request Title is Mandatory: Using a semantic title helps GitHub Actions categorize and label PRs automatically, which also aids in generating release notes.

• Separate Pull Requests for Different Scopes: Please try to open separate PRs for different scopes. This keeps changes organized and easier to review.

Note

Pull Request Lifecycle

1. No Direct Push to main Branch: Direct pushes to the main branch are not allowed to ensure code integrity.

2. Create a Sub-Branch: Always create a new branch from the main branch for your changes. This keeps your work organized.

3. Make Your Changes: Implement your changes in the newly created branch.

4. Open a Pull Request (PR): Open a PR following the established rules (semantic title, etc.).

5. GitHub Actions Trigger:

   • A comment will be created with instructions on how to check out the branch locally.
   • Automatic labeling will be applied based on the PR title.
   • The code linting and style workflow will run to check your code quality.
   • If you make changes to the app, Expo updates will be triggered automatically, allowing maintainers to preview those changes using a development build.
   • An Expo comment will include a QR code, so there’s no need to search for the updated build. Scan the QR code to access the latest version quickly.

Getting Started

Set up and run the project locally by following each step carefully.

Clone the Repository

• Repository URL: [email protected]:amosproj/amos2024ws04-personalized-play.git

• Commands:

  git clone [email protected]:amosproj/amos2024ws04-personalized-play.git
  
  cd amos2024ws04-personalized-play
  

Set Up Environment Variables

Copy example environment files to configure your environment.

• Commands:

  cp .env.example .env
  

  • Repeat this command in directories like flows, functions, and app if they have their own .env.example files.
  • Customize each .env file as necessary for your local setup.

Install Dependencies

Navigate to each directory (flows, functions, and app) and install dependencies.

• Command:

  npm install
  

Install the Expo Developer Build

To test the mobile interface, download the Expo Developer build from Expo.dev.

Run the Project Locally

Each component has specific commands to start in development mode. Follow these steps:

Start the Flows

• Command (from the flows directory):

  npm run dev
  

  This initiates real-time compilation for Firebase Genkit flows, ideal during active development.

• Production Option:

  npm run build
  

  Use this command to build flows without real-time updates if you’re not actively developing.

Start the Functions

• Command (from the functions directory):

  npm run dev
  

  Runs Firebase functions in development mode, applying code changes immediately.

• Production Option:

  npm run build
  

  Use this command to build functions for a stable production environment.

Start Firebase Emulators

To emulate Firebase services locally, initiate the emulators.

• Command (from the root directory):

  GENKIT_ENV=dev firebase emulators:start --inspect-functions
  

  This command launches Firebase emulators, allowing you to test backend services locally without cloud deployment.

Start the Genkit Developer UI

From the flows directory, launch the Genkit Developer UI.

• Command:

  npm run genkit:start
  

  This provides a visual interface for managing and testing flows, ideal for quickly validating your configurations.

Start the Expo Dev Server

To view the project on a mobile device, start the Expo server from the app directory.

• Command:

  npm run dev
  

  This will start the Expo development server, enabling real-time updates on a connected device (e.g., Android emulator or physical device).

Creating with ❤️ CogniKids