This is an AI-powered text editor whose design is inspired by medium. If you're already familiar with medium, you'll feel right at home.
Note: medium-ai is an independent project and is not affliated with medium.com in any way.
Apart from the regular features that rich text editors have, medium-ai supports the following AI features:
As soon as you start typing into the editor, the article context is taken and passed onto the LLM which predicts any possible ideas that might be written. If you don't like the current suggestion, press ctrl + space
to generate a new one. Moreover, you can select different models from the top right corner of the menu to experiment with different suggestions.
To edit text, select it and enter the desired instruction in the toolbar's text field. The editor will then automatically execute the instruction and update the selected text with the result.
- Clone the repository.
git clone https://github.com/wingedrasengan927/medium-ai
- Access the project directory.
cd medium-ai
-
Access the frontend directory
cd frontend
-
Install dependencies.
npm install
-
Start dev server with hot reload at http://localhost:5173.
npm run dev
The frontend will run in itself, however if you would want to save the data and access AI features, the backend must be running.
Before running the backend, you need to create an openai API key from here. Follow the below steps next:
-
Copy the key, create a file called
.env
inside thebackend/app/config
folder, and paste the API key like so:OPENAI_KEY=si-IAx6f6cWlgqJ69RVwFKxT3BlbkFJI15IMe23MVM6GVLgjuSD
Folder Structure: - medium-ai -- frontend -- backend --- app ---- config ----- .env
-
Next, it's preferable to install an anaconda virtual environment. You can install the anaconda distribution from here. After installation, you can create a new virtual environment and activate it using the following command:
conda create -n medium-ai python==3.9 anaconda conda activate medium-ai
-
Next, you need to access the
backend
folder and install the requirements using the following command:cd backend pip install -r requirements.txt
-
Make sure you're inside the
backend
directory and run the following command to start the server running on port8080
.python main.py
-
Finally, refresh the browser and the frontend will automatically pick up the saved data (if any) stored at
backend/app/data/editor_state.json
If you're looking for a template-free, open-source, AI-powered text editor, medium-ai is the right choice.
However, it is still in its early days and has some unnoticed bugs. I will keep on improving it with time. If you find any bugs or have any suggestions, please raise an issue. Also, if you want to contribute to the project, please check out the GitHub repository.
Note: It's important to take backup of your articles frequently and store it elsewhere just in case something goes wrong.
- medium-ai is built using Lexical - a text editor framework developed by Meta. Most of the plugins are taken from the lexical playground and have been modified slightly.
- DaisyUI has been used to create most of the UI components.
Thanks to lexical core members and the amazing community for all the help.
This project is licensed under the MIT License.