OLT is a project designed to help you easily create websites using Claude AI API and WebContainers. It provides a modern and efficient development setup with Vite, React, TypeScript, and Tailwind CSS. The goal of this project is to offer a seamless integration of AI capabilities with web development tools for building powerful web applications.
- React: A JavaScript library for building dynamic user interfaces.
- TypeScript: A superset of JavaScript that adds static types to your code, helping prevent bugs.
- Vite: A next-generation build tool that provides fast and modern development experience.
- Tailwind CSS: A utility-first CSS framework for styling your components quickly and efficiently.
- Lucide React: A collection of beautiful icons to integrate seamlessly into your application.
- Claude AI API Integration: Leverage the power of Claude AI for generating content, suggestions, or functionality within your web applications.
- WebContainers: An innovative technology to run the application directly in the browser, providing an instant cloud-based development environment.
Ensure you have the following installed on your system:
- Node.js (version 14 or higher)
- npm or yarn (your preferred package manager)
-
Clone the repository:
git clone https://github.com/jsndz/olt.git cd olt -
Install dependencies:
Using npm:
npm install
Or using yarn:
yarn install
To start the development server, run the following:
npm run devOnce the server is running, open your browser and navigate to http://localhost:3000 to view your application.
To build your application for production, run:
npm run buildThe optimized files will be output to the dist directory, ready to be deployed.
To check and fix linting issues, use the following command:
npm run lintTo preview the production build locally, run:
npm run previewThis will start a local server that serves your built application, allowing you to check it before deploying to production.
This template supports the following:
- React with JSX syntax and functional components.
- Tailwind CSS for rapid UI design using utility classes.
- Lucide React icons for beautiful and customizable icons.
- Claude AI API integration for generating content, answering queries, or adding intelligent features to your website.
- WebContainers to enable cloud-based development directly in the browser.
You can easily extend this template by adding new features, integrating more APIs, or improving the UI/UX based on your requirements.
You can use stock photos from Unsplash for any image needs by linking to valid URLs in your image tags, like:
<img src="https://source.unsplash.com/random" alt="Random Image" />We welcome contributions to improve OLT! If you have any ideas, bug fixes, or feature requests, please:
- Open an issue to report bugs or suggest new features.
- Submit a pull request for any improvements you’d like to make.
Please follow standard GitHub practices for contributions.
The project is not completely finished and cant be hosted because of claudeAPI is not free.