ACM-WebcamGPT

ACM-WebcamGPT, inspired by WebcamGPT-Vision, is a lightweight web application that enables users to process images from their webcam using OpenAI's GPT-4 Vision API. The application captures images from the user's webcam, sends them to the GPT-4 Vision API, and displays the descriptive results.

Helpful Information

About Git

Git is a distributed version control system that allows multiple developers to work on a project simultaneously. It tracks changes to the codebase, enables reverting to previous states, and supports multiple branches of development.

What is Vite?

Vite is a modern frontend build tool that significantly improves the development experience. It offers fast cold starts, instant hot module replacement (HMR), and overall faster build times. Vite achieves this by leveraging JavaScript's native module system (ES Modules) and pre-bundling dependencies with esbuild.

Using TypeScript and React

This project uses TypeScript and React alongside Vite. TypeScript adds static typing to JavaScript, enhancing code quality and understandability. React is a library for building user interfaces, allowing us to create reusable UI components. Helpful video: React JS Explain In 10 Minutes

Vite provides out-of-the-box support for TypeScript and React, ensuring seamless development without the need for complex configuration. This setup allows us to leverage the full power of modern web development tools to build efficient, scalable applications.

Setting Up the Project

Cloning the Repository

To get started with this project, you'll need to clone the repository to your local machine. This requires having Git installed. If you don't have Git installed, you can download it from git-scm.com. It is recommended to create a folder on your computer to hold your git projects in one manageable place! Once setup, clone the project repository to your local machine:

git clone https://github.com/NickHaught/ACM-WebcamGPT.git

Installing Dependencies

After cloning the repository, navigate to the project's frontend directory in your terminal or command prompt:

cd ACM-WebcamGPT/WebcamGPT-frontend

Now install the project's dependencies:

npm install

This command installs all necessary dependencies, including Vite, React, and TypeScript, as specified in the package.json file.

Running the Development Server

With the dependencies installed, you can start the development server using Vite:

npm run dev

This command starts a local development server. Open your browser and navigate to the URL provided in the terminal to view your project.

Contributing

Please feel free to submit issues or pull requests.