How to Start with FrontLLM

FrontLLM is your safe front-end gateway to LLMs. Request LLM directly from your front-end code. No backend needed. FrontLLM supports rate limiting, usage tracking, and more. It works with any front-end framework, including React, Vue, and Angular.

To start working with FrontLLM you need to create a new account, then create a new LLM gateway and configure it for your needs. After creating the gateway, you will receive a gateway ID that you need to pass to the FrontLLM SDK. This ID should be kept secret but it can be exposed in the front-end code since FrontLLM provides built-in security features. You can restrict access to your gateway by setting up allowed domains, rate limits, and usage quotas etc.

Live Demos

• 🪟 CodeMirror AI Autocomplete Demo
• 🇲🇨 Monaco Editor AI Autocomplete Demo

Installation

NPM

To use FrontLLM in your project, you can install it via npm:

npm install frontllm

Now you can import the library and create an instance of the gateway with your specific gateway ID:

import { frontLLM } from 'frontllm';
const gateway = frontLLM('<gateway_id>');

CDN

To use FrontLLM via CDN, you can include the following script tag in your HTML file:

<script src="https://cdn.jsdelivr.net/npm/frontllm@0.2.0/dist/index.umd.js"></script>

This will expose the frontLLM function globally, which you can use to create an instance of the gateway:

<script>
	const gateway = frontLLM('<gateway_id>');
	// ...
</script>

What's Next?

Now you can start making requests to your LLM gateway. Check out the Request LLM Model from Front-End to learn more about how to make requests and handle responses.