# :icon-code: CodeArc: Programming‑Centric AI Chatbot Companion

![React](https://img.shields.io/badge/React-20232a?style=for-the-badge&logoColor=white&labelColor=000000&color=000000&logo=react&logoColor=61DAFB) ![TypeScript](https://img.shields.io/badge/TypeScript-007ACC?style=for-the-badge&logoColor=white&labelColor=000000&color=000000&logo=typescript&logoColor=white) ![Capacitor](https://img.shields.io/badge/Capacitor-119EFF?style=for-the-badge&logoColor=white&labelColor=000000&color=000000&logo=capacitor&logoColor=white) ![License](https://img.shields.io/github/license/0xarchit/CodeArc?style=for-the-badge&logoColor=white&labelColor=000000&color=000000)    
![Stars](https://img.shields.io/github/stars/0xarchit/CodeArc?style=for-the-badge&logoColor=white&labelColor=000000&color=000000&logo=github) ![Repo Size](https://img.shields.io/github/repo-size/0xarchit/CodeArc?style=for-the-badge&logoColor=white&labelColor=000000&color=000000&logo=github) ![Forks](https://img.shields.io/github/forks/0xarchit/CodeArc?style=for-the-badge&logoColor=white&labelColor=000000&color=000000&logo=github) [![Website](https://img.shields.io/website?url=https://codearc.pages.dev&style=for-the-badge&logoColor=white&labelColor=000000&color=000000&logo=html5)](https://codearc.pages.dev){target="_blank"}

:icon-mark-github: **GitHub**: [0xarchit/CodeArc](https://github.com/0xarchit/CodeArc){target="_blank"}

## :icon-device-desktop: Overview

CodeArc is a programming-focused chatbot designed to explain concepts and help you learn, just like a knowledgeable friend. It offers an intuitive and feature-packed experience across both mobile and web platforms.

## :icon-package: Get Started
- **Download the App**: [CodeArc Releases](https://github.com/0xarchit/codearc/releases){target="_blank"}
- **Try the Web Version**: [CodeArc Website](https://codearc.pages.dev){target="_blank"}
---

## :icon-rocket: Key Features
- **Local Storage for History and Context**: Access your previous chats directly on your device (browser for the web version) without relying on external servers.
- **Custom API Keys**: Configure your own API keys for a personalized and secure experience.
- **Cross-Platform Compatibility**: Available for both mobile apps and websites, ensuring you can code and learn on the go.
- **Easy Chat Management**: Effortlessly delete chats whenever needed.
- **Powered By Gemini**: CodeArc is proudly powered by Gemini 2.0 Flash, bringing cutting-edge AI to your fingertips for a smarter and friendlier chatbot experience.

---

## :icon-tools: Tech Stack
CodeArc is built using cutting-edge technologies to deliver a seamless and efficient experience:
- **React**: For crafting an interactive and responsive user interface.
- **TypeScript**: Ensuring type safety and a smoother development process.
- **@google/generative-ai**: Integrating advanced AI-driven features.
- **Capacitor**: Enabling hybrid app development for cross-platform functionality.
- **Zustand**: Simplifying state management with a lightweight and intuitive approach.
- **react-loading-indicators**: Adding polished loading visuals for an enhanced user experience.

---

## :icon-lock: Privacy First
Your chat history is stored locally on your device or browser, giving you complete control over your data.

---

+++ :icon-device-desktop: First Screen
![First Screen](Public\CodeArc\MainScreen.png)

+++ :icon-comment-discussion: Chat Window

![Chat Window](Public\CodeArc\ChatWindow.png)
+++

---

## :icon-download: Before Downloading
### How to Get Your API Key?

1. **Visit** [Google AI Studio](https://aistudio.google.com/app/apikey){target="_blank"}.
2. **Sign in** with your Google account.
3. **Click** on the **"Create API key"** button.
4. **Copy** your new API key.

> [!NOTE]
> This api key is upto you only we dont collect or store them

## :icon-rocket: Upcoming Features

- [ ] **Download Chat as PDF**: Soon, you'll be able to save your chat conversations as PDF files for easy sharing and offline access.  
- [ ] **Update Notification Fix**: Automatic update notifications in the app for a seamless user experience.
