Artefakty - Generatywny interfejs użytkownika

Odkryj rewolucyjną funkcję Artifacts w LibreChat, umożliwiającą błyskawiczne tworzenie komponentów React, kodu HTML oraz diagramów Mermaid.

Generative UI: Twórz komponenty React, kod HTML oraz diagramy Mermaid
Elastyczna integracja: Użyj dowolnego modelu, który masz skonfigurowany
Iterative Design: Szybkie ulepszanie i dopracowywanie wygenerowanych wyników
Integracja agentów: Skonfiguruj artefakty na poziomie agenta (zalecane podejście)

Uwaga: Preferowanym sposobem korzystania z artefaktów jest obecnie funkcja Agentów, która pozwala na bardziej szczegółową kontrolę poprzez włączanie/wyłączanie artefaktów na poziomie agenta, zamiast w całej aplikacji.

Kluczowe funkcje Code Artifacts w LibreChat:

Błyskawiczne prototypowanie stron internetowych i interfejsów użytkownika za pomocą generatywnej sztucznej inteligencji
Łatwe tworzenie dynamicznych, responsywnych układów
Interaktywne środowisko edukacyjne dla React i HTML
Wizualizacja złożonych pomysłów za pomocą diagramów Mermaid
Intuicyjne, zorientowane na użytkownika iteracje projektowe wspierane przez AI
Darmowa i otwartoźródłowa alternatywa dla płatnych narzędzi AI

Doświadcz przyszłości projektowania i rozwoju UI/UX dzięki możliwościom generatywnym LibreChat. Wcielaj swoje pomysły w życie szybciej niż kiedykolwiek wcześniej!

Content-Security-Policy

Może być konieczna aktualizacja nagłówka Content-Security-Policy Twojego serwera WWW, aby uwzględnić frame-src 'self' https://*.codesandbox.io w celu ładowania wygenerowanych aplikacji HTML w panelu Artifacts. Jest to zależność biblioteki sandpack.

Samodzielne hostowanie bundlera Sandpack

Artefakty w LibreChat wykorzystują bibliotekę Sandpack od CodeSandbox do bezpiecznego renderowania kodu HTML/JS. Domyślnie LibreChat łączy się z publiczną siecią CDN CodeSandbox, która może również przesyłać telemetrię dotyczącą jej użycia.

Aby zapewnić zwiększoną prywatność, zgodność z wymogami bezpieczeństwa lub w przypadku odizolowanych środowisk sieciowych, możesz samodzielnie hostować bundler.

Dlaczego warto samodzielnie hostować Sandpack Bundler?

Self-hosting the bundler zapewnia kilka korzyści:

Prywatność i bezpieczeństwo: Utrzymuj wykonywanie kodu we własnej infrastrukturze
Niezawodność: Usuń zależność od usług zewnętrznych
Wydajność: Zmniejsz opóźnienia, hostując bundler w swojej sieci
Zgodność: Spełnienie wymagań organizacyjnych dotyczących przetwarzania danych
Kontrola: Skonfiguruj i dostosuj do swoich konkretnych potrzeb

Konfiguracja

Gdy masz już skonfigurowany własny bundler, po prostu skonfiguruj LibreChat, aby z niego korzystał, ustawiając zmienną środowiskową:

# `.env` file
SANDPACK_BUNDLER_URL=http://your-bundler-url

Ogólne uwagi

Samodzielne hostowanie bundlera wprowadza dodatkowy narzut:

Konfiguracja CORS: Będziesz musiał zarządzać politykami współdzielenia zasobów między źródłami (cross-origin resource sharing)
Zarządzanie bezpieczeństwem: Stajesz się odpowiedzialny za bezpieczeństwo usługi bundlera
Konserwacja: Aktualizacje i poprawki będą musiały być stosowane ręcznie
Wymagania dotyczące zasobów: Do hostowania bundlera będą potrzebne dodatkowe zasoby serwerowe

Szczegółowe instrukcje dotyczące konfiguracji i utrzymania własnego bundlera znajdują się w forku repozytorium CodeSandbox dostosowanym do wdrożenia LibreChat, w tym usunięcia telemetrii z Sandpack.

Aktualności AI 2024: Oryginalna i NAJLEPSZA platforma czatu AI typu open-source, LibreChat, udostępnia Code Artifacts! To narzędzie Generative UI potrafi błyskawicznie generować React, HTML i diagramy z pojedynczego promptu w Twojej przeglądarce przy użyciu dowolnego LLM, OpenAI, Anthropic, LLAMA, Mistral, DeepSeek Coder i innych, dzięki integracji z OLLAMA.

#AINews2024 #OpenSourceAI #GenerativeUI #CodeArtifacts #WebDevelopment #ReactJS #LLM #AIPrototyping #DevTools #OLLAMA #LibreChat