Skip to content

OSU-App-Club/beavsAI-frontend

Repository files navigation

BeavsAI - Frontend Hub

Description

BeavsAI allows you to have conversations with any course.

The AI assistant will be able to answer course-specific questions about the course. We use syllabi from here to make our AI assistants.

Simply add a course from our vector store and start chatting with your new AI assistant!

Note: Unfortunately, BeavsAI can only answer questions about courses that are in our vector store. We are working on adding more courses to our vector store.

Additionally, only OSU students can use BeavsAI.

Table of Contents

Contributors

Installation

  1. Clone the repository
git clone https://github.com/OSU-App-Club/beavsAI-frontend.git
  1. Install dependencies
npm install
  1. Start the server
npm run dev

Usage

  1. Navigate to localhost:5173 in your browser
  2. Click the Login link in the top right corner
  3. Login with your ONID credentials
  4. Click the Add Course button
  5. Search for a course
  6. Click the Add button
  7. Start chatting with your new AI assistant!

Screenshots

Hero Dark

Hero-dark

Hero Light

Hero-light

Mockup 1 Dark

mockup1-dark

Mockup 1 Light

mockup1-light

Mockup 2 Light

mockup2

How to Dark

how-to-dark

How to Mobile / Light

how-to-light

Footer Light

Footer

Tech Stack

Frontend

  • React - JavaScript library for building user interfaces
  • React Router - Declarative routing for React.js
  • React Query - Hooks for fetching, caching, and updating data
  • Tailwind CSS - Utility-first CSS framework
  • Zustand - State management for React

Build Tools

  • Vite - Fast frontend development server and bundler
  • TypeScript - Typed superset of JavaScript
  • ESLint - Pluggable linting utility for JavaScript and TypeScript
  • Tailwind CSS - Utility-first CSS framework

Libraries and Utilities

  • Axios - Promise-based HTTP client for the browser and Node.js
  • clsx - Tiny utility for constructing class names

Miscellaneous

  • UUID - UUID library for JavaScript

Clerk (Authentication)

TypeScript

Code Quality

  • ESLint - Pluggable linting utility for JavaScript and TypeScript

License

MIT License