# Project export: ZvezdaCardio

This document was generated by HackStack to give an AI agent context about a hackathon project. Sections are labeled with their provenance; content marked as truncated was cut to keep this document small.

## Project metadata

- Hackathon: Cal Hacks 11.0
- Tagline: ZvezdaCardio is a social fitness app using AI to create personalized workouts. Compete with friends, earn points, and redeem them for in-app items and promotions.
- Devpost: https://devpost.com/software/zvezdacardio
- GitHub: https://github.com/AltayHodo/Zvezda-Cardio
- Team: 2 GitHub contributor(s) — AyushMahale (15 commits), Altay Hodoglugil (11 commits)

## Devpost submission (written by the team)

### Inspiration

We took inspiration in using positive reinforcement to motivate workouts and fitness training. ZvezdaCardio is intended to act like a virtual fitness trainer.

### What it does

In its current iteration, ZvezdaCardio tracks steps of the user and calories burnt. It tracks these in lifetime and daily stats. This is converted into points using an algorithm. Currently points are used on the leaderboard where users can compete to see who can get the most. You are also able to set daily goals which you get additional points for completing. We have also implemented an Zvezda AI, a chatbot that can tell you proximity to your goal and with other useful fitness advice.

### How we built it

The UI and frontend was designed using Swift and React for the mobile and web applications respectively. The backend was built using Firebase.

### Challenges we ran into

Implementing Firebase across React and Swift was difficult and took a lot of time. Made us contribute more time to the mobile app since the Firebase was set up for Swift first.

### Accomplishments we're proud of

Linking both React and Swift to Firebase, since it was so difficult for us. In addition, we are proud of the Zvezda AI chatbot, since it was our first time using Gemini Generative AI.

### What we learned

It’s important to choose a tech stack that suits the project you want to build. Having a well thought out plan before building will pay dividends.

### What's next

Personalized icons/characters that you can customize with items bought from the in-game marketplace with your points. Connect with friends to do pair runs for double points, or compete with them on the contact-only leaderboard. Make the app more social through implementing a forum and a way to communicate with friends. Go beyond just tracking cardio through implementing manually input workouts. Expand the Zvezda chatbot so it can provide personalized workouts based on user requests Implement a workout calendar, which Zvezda chatbot can project recommendations onto. The user can also edit manually and invite friends to their workouts calendar.

## README (from the GitHub repository)

No README available.

## Detected evidence (automated analysis)

Indexed codebase: 34 recognized source files, 55 KB.
- CSS (language) — detected in the code
- HTML (language) — detected in the code
- JavaScript (language) — detected in the code
- React (technology) — detected in the code
- Swift (language) — detected in the code
- Firebase (technology) — claimed on Devpost, not found in the code
- Google Gemini (technology) — claimed on Devpost, not found in the code

## Codebase structure (from repository index)

### Files (58 of 58)

```
.DS_Store
.gitignore
babel.config.js
MobileUI/.DS_Store
MobileUI/ZvezdaCardio.xcodeproj/project.pbxproj
MobileUI/ZvezdaCardio.xcodeproj/project.xcworkspace/contents.xcworkspacedata
MobileUI/ZvezdaCardio.xcodeproj/project.xcworkspace/xcshareddata/swiftpm/Package.resolved
MobileUI/ZvezdaCardio.xcodeproj/project.xcworkspace/xcuserdata/ayush.xcuserdatad/UserInterfaceState.xcuserstate
MobileUI/ZvezdaCardio.xcodeproj/xcshareddata/xcschemes/ZvezdaCardio.xcscheme
MobileUI/ZvezdaCardio.xcodeproj/xcuserdata/ayush.xcuserdatad/xcdebugger/Breakpoints_v2.xcbkptlist
MobileUI/ZvezdaCardio.xcodeproj/xcuserdata/ayush.xcuserdatad/xcschemes/xcschememanagement.plist
MobileUI/ZvezdaCardio/.DS_Store
MobileUI/ZvezdaCardio/AppDelegate.swift
MobileUI/ZvezdaCardio/Assets.xcassets/.DS_Store
MobileUI/ZvezdaCardio/Assets.xcassets/AccentColor.colorset/Contents.json
MobileUI/ZvezdaCardio/Assets.xcassets/AppIcon.appiconset/Contents.json
MobileUI/ZvezdaCardio/Assets.xcassets/Contents.json
MobileUI/ZvezdaCardio/Assets.xcassets/Homescreen.imageset/Contents.json
MobileUI/ZvezdaCardio/Base.lproj/LaunchScreen.storyboard
MobileUI/ZvezdaCardio/Base.lproj/Main.storyboard
MobileUI/ZvezdaCardio/Controllers/HomeViewController.swift
MobileUI/ZvezdaCardio/Controllers/LeaderboardViewController.swift
MobileUI/ZvezdaCardio/Controllers/LocationViewController.swift
MobileUI/ZvezdaCardio/Controllers/LoginViewController.swift
MobileUI/ZvezdaCardio/Controllers/SignupViewController.swift
MobileUI/ZvezdaCardio/Controllers/StatsViewController.swift
MobileUI/ZvezdaCardio/Controllers/ViewController.swift
MobileUI/ZvezdaCardio/Controllers/ZvezdaChatBot.swift
MobileUI/ZvezdaCardio/Extensions/LeaderboardCell.swift
MobileUI/ZvezdaCardio/Extensions/LeaderboardCell.xib
MobileUI/ZvezdaCardio/Extensions/LeaderboardRow.swift
MobileUI/ZvezdaCardio/Extensions/Utilities.swift
MobileUI/ZvezdaCardio/Gemini.plist
MobileUI/ZvezdaCardio/GoogleService-Info.plist
MobileUI/ZvezdaCardio/Info.plist
MobileUI/ZvezdaCardio/SceneDelegate.swift
MobileUI/ZvezdaCardio/ZvezdaCardio.entitlements
MobileUI/ZvezdaCardioTests/ZvezdaCardioTests.swift
MobileUI/ZvezdaCardioUITests/ZvezdaCardioUITests.swift
MobileUI/ZvezdaCardioUITests/ZvezdaCardioUITestsLaunchTests.swift
package.json
src/components/HomePage.js
src/components/Leaderboard.js
src/components/LogInPage.js
src/components/SignUpPage.js
src/components/StatsPage.js
src/FirebaseConfig.js
src/index.html
src/index.js
src/styles/General.css
src/styles/HomePage.css
src/styles/Leaderboard.css
src/styles/SignUpPage.css
src/styles/StatsPage.css
src/UserContext.js
webpack.common.js
webpack.dev.js
webpack.prod.js
```

### Dependencies

- package.json: @babel/core@^7.25.8, @babel/preset-env@^7.25.8, @babel/preset-react@^7.25.7, babel-loader@^9.2.1, css-loader@^7.1.2, html-webpack-plugin@^5.6.2, react@^18.3.1, react-dom@^18.3.1, react-router-dom@^6.27.0, style-loader@^4.0.0, webpack@^5.95.0, webpack-cli@^5.1.4, webpack-dev-server@^5.1.0, webpack-merge@^6.0.1

### Recent commits (newest first)

- updated reinforced feedback loop in ZvezdaChatBot.swift
- Merge branch 'main' of github.com:AltayHodo/Zvezda-Cardio
- finished
- Merge branch 'main' of github.com:AltayHodo/Zvezda-Cardio
- add stuff
- Merge branch 'main' of github.com:AltayHodo/Zvezda-Cardio
- integrated AI
- add homepage, leaderboard, and statspage styles
- Merge branch 'main' of github.com:AltayHodo/Zvezda-Cardio
- update StatsPage to display lifetime stats
- Merge branch 'main' of github.com:AltayHodo/Zvezda-Cardio
- chat bot has error
- Add stats and home page
- Merge branch 'main' of github.com:AltayHodo/Zvezda-Cardio
- Integrate firebase into web
- making leaderboard
- make xib cells next
- STEPS WORKING CORRECTLY
- added steps tracker
- got coordinates

## Key source files (fetched from GitHub, selected and truncated for size)

### package.json

```
{
  "name": "zvezda-cardio",
  "version": "1.0.0",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "webpack serve --open --config webpack.dev.js",
    "build": "webpack --config webpack.prod.js"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "description": "",
  "dependencies": {
    "react": "^18.3.1",
    "react-dom": "^18.3.1",
    "react-router-dom": "^6.27.0",
    "webpack-cli": "^5.1.4"
  },
  "devDependencies": {
    "@babel/core": "^7.25.8",
    "@babel/preset-env": "^7.25.8",
    "@babel/preset-react": "^7.25.7",
    "babel-loader": "^9.2.1",
    "css-loader": "^7.1.2",
    "html-webpack-plugin": "^5.6.2",
    "style-loader": "^4.0.0",
    "webpack": "^5.95.0",
    "webpack-dev-server": "^5.1.0",
    "webpack-merge": "^6.0.1"
  }
}

```

### src/index.js

```javascript
import React from 'react';
import ReactDOM from 'react-dom/client';
import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
import './styles/General.css';
import SignUpPage from './components/SignUpPage';
import LogInPage from './components/LogInPage';
import HomePage from './components/HomePage';
import StatsPage from './components/StatsPage';
import Leaderboard from './components/Leaderboard';
import { UserProvider } from './UserContext';  

const App = () => {
  return (
    <UserProvider>
      <Router>
        <Routes>
          <Route path="/signup" element={<SignUpPage />} />
          <Route path="/login" element={<LogInPage />} />
          <Route path="/home" element={<HomePage />} />
          <Route path="/stats" element={<StatsPage />} />
          <Route path="/leaderboard" element={<Leaderboard />} />
          <Route path="*" element={<SignUpPage />} />  {/* Default route */}
        </Routes>
      </Router>
    </UserProvider>
  );
};

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<App />);

```

### babel.config.js

```javascript
module.exports = {
  presets: ['@babel/preset-env', '@babel/preset-react']
  };
```

### webpack.prod.js

```javascript
const { merge } = require('webpack-merge');
const common = require('./webpack.common.js');

module.exports = merge(common, {
  mode: 'production',
});
```

### webpack.dev.js

```javascript
const { merge } = require('webpack-merge');
const common = require('./webpack.common.js');

module.exports = merge(common, {
  mode: 'development',
  devtool: 'inline-source-map',
  devServer: {
    static: './dist',
    historyApiFallback: true,
  },
});
```

### webpack.common.js

```javascript
const HtmlWebpackPlugin = require('html-webpack-plugin');
const path = require('path');

module.exports = {
  entry: {
    app: './src/index.js',
  },
  output: {
	  filename: '[name].bundle.js',
	  path: path.resolve(__dirname, 'dist'),
	  clean: true,
	},
  module: {
    rules: [
      {
        test: /\.css$/i,
        use: ['style-loader', 'css-loader'],
      },
      {
	      test: /\.js$/,
        exclude: /node_modules/,
        use: 'babel-loader',
      },
      {
        test: /\.(png|jpg|jpeg|gif|svg)$/i,
        type: 'asset/resource',
      },
    ],
  },
  plugins: [
    new HtmlWebpackPlugin({
      template: './src/index.html'
    })
  ],
};
```

### src/index.html

```html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Zvezda Cardio</title>
</head>
<body>
  <div id="root"></div>
</body>
</html>
```

### src/FirebaseConfig.js

```javascript
import { initializeApp } from 'firebase/app';
import { getAuth } from 'firebase/auth';
import { getFirestore } from 'firebase/firestore';

const firebaseConfig = {
  apiKey: 'AIzaSyCRxFGLqM5tYoGHY9tvFwV1L9E75hb_Ens',
  authDomain: 'zvezda-cardio.firebaseapp.com',
  projectId: 'zvezda-cardio',
  storageBucket: 'zvezda-cardio.appspot.com',
  messagingSenderId: '325007941136',
  appId: '1:325007941136:ios:76d9c3a80b579f6d897495',
};

const app = initializeApp(firebaseConfig);
export const auth = getAuth(app);
export const db = getFirestore(app);
```

### src/UserContext.js

```javascript
import React, { createContext, useState, useEffect } from 'react';

export const UserContext = createContext();

export const UserProvider = ({ children }) => {
  const [user, setUser] = useState(null);

  // Load user data from localStorage on component mount
  useEffect(() => {
    const storedUser = localStorage.getItem('user');
    if (storedUser) {
      setUser(JSON.parse(storedUser));
    }
  }, []);

  // Save user data to localStorage whenever it changes
  useEffect(() => {
    if (user) {
      localStorage.setItem('user', JSON.stringify(user));
    } else {
      localStorage.removeItem('user');  // Remove if user is null
    }
  }, [user]);

  return (
    <UserContext.Provider value={{ user, setUser }}>
      {children}
    </UserContext.Provider>
  );
};

```

### src/styles/General.css

```css
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

:root {
  --main-bg-color: rgb(28, 32, 59);
  --orange: rgb(253, 142, 7);
  --yellow: rgb(255, 202, 39);
}

body {
  background-color: var(--main-bg-color);
}

```

[25 more indexed source files omitted to keep this export small. The full file list is in the Codebase structure section above.]