Zola: Open Source AI Chat Web App with Document Upload and Multi-Model Support

General Introduction

Zola is a free and open source AI chat application developed by Julien Thibeaut (GitHub username ibelick) and hosted on GitHub. Its best feature is that it supports a variety of AI models, such as OpenAI and Mistral, so that users can freely choose different models to have a conversation. zola's official website is zola.chat, and it's currently in beta testing. The app has a simple interface, supports light and dark mode switching, and allows users to upload files to interact with the AI. Built with Next.js, Tailwind CSS, and other technologies, it is responsive and mobile-ready. zola is not only suitable for daily chatting, but also attracts developers to participate in the open source community, contributing code and ideas.

Function List

• Supports multiple AI models (e.g., OpenAI, Mistral, etc.), and users can switch models for dialog.
• Provides light and dark mode switching, adapting to different usage environments.
• Built-in hint suggestions to help users quickly enter questions.
• Supports file uploads, so users can upload files to analyze or discuss with the AI.
• The interface is mobile-ready and works smoothly on your phone.
• Provide chat history management function, easy to view and organize conversation records.

Using Help

Zola requires the user to download the source code and run it locally. Detailed installation and usage instructions are provided below.

Installation process

The official installation instructions are at INSTALL.md document, here are the exact steps:

1. Preparing the development environment
   Ensure that your computer has Node.js (v16 or higher recommended) and npm installed. download it from the Node.js website. Once installed, at the command line, type node -v cap (a poem) npm -v Check the version.
2. Download Zola Code
   Open https://github.com/ibelick/zola, click the green "Code" button, and select "Download ZIP" to download the zip and extract it. Or use the Git command:

git clone https://github.com/ibelick/zola.git

3. Go to the project directory
   Use the command line to enter the unzipped folder. For example, the folder path is C:\zolaEnter:

cd C:\zola

4. Installation of dependency packages
   Run the following command to install the required packages:

npm install

Installation time depends on the speed of the internet and is usually completed in a few minutes.

5. Configuring Environment Variables
   In the project root directory, create a .env.local file, add the API key for the AI model. Example:

OPENAI_API_KEY=你的OpenAI密钥

The key is obtained from the model provider (e.g., the OpenAI website). For configuration, see README.mdThe

6. launch an application
   Enter the following command to start Zola:

npm run dev

Upon startup, the command line displays the local address of the http://localhost:3000The

7. Visit Zola
   Type in your browser http://localhost:3000You can see Zola's chat screen.

Main Functions

1. Chatting with AI

• Once you are in the interface, enter a question in the input box at the bottom, such as "Write me an email".
• Press Enter and the AI generates a reply, which is displayed in the dialog area.

2. Switching AI models

• Model selection options (drop-down boxes) are available at the top of the interface or in the Settings menu.
• Click to select another model, such as switching from OpenAI to Mistral.
• After the switch, the new dialog will use the new model.

3. Use of the file upload function

• There's an upload icon (probably in the shape of a paperclip) next to the input box.
• Click to select a file (e.g., PDF or image), upload it, and then enter a question, such as "Analyze this file".
• AI will respond based on the content of the document.

4. Switching between light and dark modes

• Look for a sun or moon icon in the upper right corner of the interface.
• Tap to switch modes, dark mode for night use, bright mode for daytime.

5. Viewing tips suggestions

• Suggested prompts, such as "Write a poem" or "Explain quantum mechanics" are displayed above the input box.
• Save time by clicking on a suggestion and having it automatically fill in the input box.

6. Managing chat history

• Click on the list icon in the left column to view all conversation logs.
• Select a conversation to review the content and click the trash can icon to delete it.

caveat

• Zola requires networking to use the online model, and without an API key, functionality is limited.
• Zola is a beta version, the code is subject to change, you can submit an issue on GitHub if you encounter problems.
• To support more models, you need to configure the API manually, see the official documentation for details.

With these steps, users can quickly install and use Zola to experience the fun of multi-model AI chat.

application scenario

1. Daily Questions and Answers
   Users can use Zola to ask questions about their lives, such as "how to make a cake," and the AI will give them detailed steps.
2. Content analysis of documents
   Upload a document or image and Zola's AI can summarize the content or answer related questions, suitable for students and working professionals.
3. Developer Learning and Testing
   Programmers can use Zola to test the effects of different AI models or modify the code to add new features.

QA

1. What models does Zola support?
   Currently, OpenAI, Mistral and other models are supported, for a list and configuration method, see README.mdThe
2. What are the restrictions on file uploads?
   Common formats (e.g. PDF, images) are supported, but size and type limits depend on the configured storage service (Supabase).
3. Why won't it open after startup?
   Check the command line for reported errors, possibly missing API keys or dependencies not fully installed. Retry npm install or view the log.