CodeBox

CodeBox is an AI-powered coding assistant that supercharges your development workflow with real-time code suggestions, smart error detection, multi-language support, and more. Built with Next.js and TypeScript, CodeBox delivers a modern, responsive, and intuitive experience for developers. This project is submitted for the Pulumi Hackathon Static website category. and showcases industry-standard UI/UX and robust functionality. This is jsut a website of a typical application. No backend involved

Table of Contents

• Features
• Tech Stack
• Installation
• Usage
• Project Structure
• Contributing
• License
• Contact

---

Features

• AI-Powered Suggestions: Get intelligent code suggestions in real time.
• Multi-Language Support: Works with multiple programming languages and frameworks.
• Smart Error Detection: Detect and fix common coding errors before runtime.
• Interactive Code Search: Quickly search and navigate your codebase.
• Auto-Formatting: Consistent code formatting with a single click.
• Chat with AI: Ask coding questions and receive instant, helpful answers.
• Responsive Design: A mobile-first approach ensuring a seamless experience across devices.
• Industry-Standard UI Components: Built using shadcn/ui for a polished and consistent look.
• Animated Pricing Toggle: Smooth, count-up animations for monthly and annual pricing plans.
• FAQ & Newsletter Sections: Comprehensive information and subscription options for staying updated.

---

Tech Stack

• Framework: Next.js
• Language: TypeScript
• Styling: Tailwind CSS
• UI Components: shadcn/ui
• Icons: Lucide React
• Animations: react-countup
• Scrolling: react-scroll
• Deployment & Infrastructure: Pulumi (for infrastructure as code in your hackathon project)

---

Installation

Prerequisites

• Node.js (v14 or above)
• npm or yarn

Steps

1. Clone the Repository:

   git clone https://github.com/fisayo-dev/codebox_ai_assistant
   cd codebox_ai_assistant
   

2. Install Dependencies:

   npm install
   # or
   yarn install
   

3. Setup Pulumi (if applicable): Follow the Pulumi Getting Started guide to configure your cloud provider and deploy infrastructure.

4. Run the Development Server:

   npm run dev
   # or
   yarn dev
   

5. Build for Production:

   npm run build
   npm start
   # or
   yarn build && yarn start

Usage

• Home: A landing page introducing CodeBox.
• Features: Explore the key functionalities of CodeBox.
• Pricing: Check out our flexible pricing plans with a dynamic toggle for monthly/annual pricing.
• FAQ: Find answers to common questions about CodeBox.
• Newsletter: Subscribe to receive the latest updates and insights.
• Footer: Contains quick links and social media connections to stay engaged with CodeBox.

Project Stucture

```bash
/codebox
├── components
│   ├── Header.tsx
│   ├── Features.tsx
│   ├── Pricing.tsx
│   ├── Newsletter.tsx
│   ├── Faq.tsx
│   └── Footer.tsx
├── pages
│   ├── index.tsx
│   └── _app.tsx
├── public
├── styles
│   └── globals.css
├── pulumi (optional)
│   └── Pulumi.yaml
├── package.json
└── README.md

Contributing

Contributions are welcome! Feel free to open issues or submit pull requests for any improvements or bug fixes. Please follow the standard GitHub Flow for contributions.

Liscence

This project is licensed under the MIT License.

Contact

For questions, feedback, or collaboration opportunities, please contact me, Fisayo Obadina at olufisayobadina@gmail.com or connect with me on Twitter.

Happing Coding 😎🚀

This README should provide a clear, detailed overview of your project, installation instructions, and tech stack details, making it ideal for hackathon submissions and professional presentations.