remix-nlux/docs/versioned_docs/version-1.0.15/learn/002-get-started/_003-nlux-nodejs-nlbridge-chatgpt/javascript/007-create-comp.mdx

Remix IDE NLUX integration. Remix IDE is the leading IDE for building and deploying smart contracts on Ethereum. NLUX is a JavaScript and React library for building conversational AI experiences.

Now that we have the _nlbridge_ adapter, we will create the chat component, pass the adapter to it, and mount it to the DOM.

```tsx
const aiChat = createAiChat().withAdapter(nlbridgeAdapter);

document.addEventListener('DOMContentLoaded', () => {
    const chatContainer = document.getElementById('chat-container');
    aiChat.mount(chatContainer!);
});
```

The function `createAiChat()` returns a component builder that allows you to configure the chat component
by chaining method calls. The `withAdapter()` method sets the adapter to be used by the chat component.

Note that `aiChat.mount(<domElement>)` should only be called after the DOM has been loaded.

For full documentation on how to customize the `aiChat` component, please refer to the [AiChat documentation](/reference/ui/ai-chat).