Logo Huggin Face i OpenAI

Jak skorzystać z Hugging Face, by stworzyć swojego agenta ChataGPT?

Bardzo początkujący 
(prawie bez kodowania – jest kod ale kopiuj-wklej ;), 

UWAGA: dokumentacja zmienia się bardzo często, komendy też, więc kod po prostu może nie zadziałać za jakiś czas (ostatnie sprawdzenie 17 czerwca 2024)

Założenia:

  • Całość stworzymy korzystając z Hugging Face (to taki portal, który zapewnia zaplecze do tworzenia modeli AI – nie musisz stawiać serwera czy zainstalować lokalnie na swoim komputerze. HF udostępnia bezpłatną wersję.
  • Do tworzenia interfejsu użytkownika (czyli tego pośrednika między programem a użytkownikiem 😉 użyjemy Gradio (spokojnie, wytłumaczymy)
  • Całość połączy Python (też spokojnie, krok po kroku)
  • Mózgiem naszego projektu będzie ChatGPT. Zamiast jednak korzystać z interfejsu typowego OpenAI dostępnego pod adresem https://chatgpt.com/  spróbujemy skorzystać z API dostępnego pod adresem https://platform.openai.com/, co umożliwi korzystanie wg zużycia danego modelu zamiast comiesięcznego abonamentu (natomiast coś musimy wpłacić ;( Na marginesie – istnieje o wiele więcej modeli niż ChatGPT i wiele więcej firm niż tylko OpenAI, w tym modele bezpłatne – np. Llama tworzona przez Metę (Facebook)

Realizacja:

HuggingFace

ROZPOCZYNAMY

  • Tworzymy konto użytkownika: https://huggingface.co/join – nie ma na dziś możliwości logowania się np. Google’m, więc wymyśl hasło, podaj e-mail, potem potwierdź utworzenie konta i jest 😉
  • Zaloguj się https://huggingface.co/login
  • Nie wnikamy w szczegóły, masz do dyspozycji już różne modele, dane, przechodzimy do Spaces (miejsca na aplikacje użytkowników) – masz ochotę to poklikaj, niemniej interesuje nas stworzenie swojego miejsca, zatem “Create new Space”
  • Nadaj nazwę miejscu (aplikacji), np. MojaAplikacja, nie musisz wybierać licencji, następnie Gradio, i wybierzmy “chatbot” (gdybyśmy chcieli tworzyć aplikację od zera wybralibyśmy pustą przestrzeń – “Blank”). Po czym przestrzeń możemy zrobić dostępną dla wszystkich (Public)  lub tylko siebie (Private). I… naciśnijmy Create Space

  • I oto stworzyliśmy chata! (jeśli coś nie ruszy, naciśnij App na górze strony), najprawdopodobniej zobaczysz coś podobnego:

    1 – to Twoje polecenie dla czata
    2 – przycisk zatwierdzający, hmm, wiem, że wiesz 🙂
    3 – tutaj będzie powtórzone Twoje polecenie (prompt)
    4 – wygenerowana przez czata odpowiedź
    Poniżej masz jeszcze dodatkowe rozwijane  parametry, którymi na razie się nie zajmiemy – które charakteryzują zachowanie czata
    UWAGA: na razie korzystamy z modelu tworzonym przez społeczność Hugging Face, nie na ChatGTP/OpenAI
  • To, że wszystko wygląda tak prosto – okienko zadawania pytań, przycisk do zatwierdzenia, okienko odpowiedzi – zawdzięczamy właśnie Gradio
  • Zajrzyjmy zatem nieco za kulisy
  • w prawym górnym rogu naciśnij Files – zobaczysz pliki tworzące Twoją aplikację
    • Plik .gitattributes jest używany do definiowania ustawień dla plików w repozytorium git (kontrola wersji, kopie zapasowe)
    • Plik README.md zawiera dokumentację projektu. Jest to plik markdown (MD), który często opisuje cel projektu, instrukcje instalacji, sposób użytkowania, pomaga zrozumieć, o co chodzi w projekcie i jak go używać.
    • Plik app.py jest głównym plikiem aplikacji. W naszym przypadku zawiera kod Python dla aplikacji czatu. Ten plik uruchamia aplikację i definiuje jej zachowanie.
    • Plik requirements.txt zawiera listę zależności, które muszą być zainstalowane, aby aplikacja działała poprawnie. Jest to standardowy sposób zarządzania zależnościami w projektach Pythonowych. Zawartość tego pliku informuje system, jakie pakiety należy zainstalować.

ZMIENIAMY – 

Gradio/Python, cz. 1

  • Kliknij w plik app.py, nic się nie stanie dopóki nie klikniesz w ikonę ołówka z “edit”, wtedy będziesz mógł/mogła edytować

UWAGA: w Pythonie mają znaczenie spacje i tabulatory 🙂 

Baaaardzo ogólne informacje, o tym co (prawdopodobnie) widzisz:

  • import ….
    Importowanie bibliotek Gradio i Hugging Face Hub (to dodatkowe funkcje ułatwiające czy to komunikację z czatem czy to tworzenie np. interfejsu użytkownika)
  • client =
    Klient inference: Konfigurowanie klienta do komunikacji z modelem Hugging Face.
  • def respond(
    Funkcja respond: Przygotowuje wiadomości i wywołuje model do generowania odpowiedzi podając mu różne parametry jak kreatywność, treść poleceń użytkownika, kontekst)
  • demo = gr.ChatInterface(
    Interfejs Gradio: Tworzy interaktywny interfejs czatu z dodatkowymi kontrolkami.
  • if …. demo.launch()
    Uruchomienie aplikacji: Sprawdza, czy skrypt jest uruchamiany bezpośrednio i uruchamia aplikację Gradio.

API OpenAI, cz. 1

  • Wejdź na https://platform.openai.com/
  • Utwórz konto lub zaloguj się np. za pomocą Google
  • Kliknij w swoją ikonę w prawym górnym rogu i wybierz “Your profile”
  • Wprowadź w Billing jakąś kwotę, np. 10 USD (Add to credit balance)
  • Ustaw sobie w “limits” maksymalne wydatki i alerty, np. nie więcej niż 10 USD miesięcznie. Spokojnie, raczej nie będzie Ci to łatwo wydać.
  • W menu po lewej stwórz nowy Projekt, nadaj mu dowolną, łatwo dla Ciebie nazwę
  • Do tego samego prowadzi API keys z głównego menu
  • WAŻNE: API key to ciąg znaków – hasło, które pozwala Twoim aplikacjom dostać się do API – czyli korzystać z innych aplikacji, utworzone teraz pozwoli tworzonym aplikacjom (w Hugging Face, ale też np. w LangChain itp. na korzystanie z oprogramowania OpenAI)
  • Przypisywanie kluczy do konkretnych projektów jest dobrym zwyczajem, bo możesz pracować nad kilkoma projektami i będziesz wiedzieć, który ile zużywa
  • WAŻNE: Klucz zobaczysz tylko raz, skopiuj go w bezpieczne miejsce (ID projektu i jego nazwę będziesz ciągle można podejrzeć)
  • Dla ciekawości możesz się porozglądać o platformie, masz tam dostęp do historii użycia , ale przede wszystkim do dokumentacji, na razie na tym poprzestaniemy

HuggingFace

  • Wróć na https://huggingface.co/
  • Przejdź na swoje konto i dodaj nowe Space, jak wcześniej (można zmieniać też wcześniejsze, ale na razie tego nie robimy)
  • Przy tworzeniu zmień tylko, by projekt był “Blank”
  • Nim przejdziemy dalej dodamy do swojej przestrzeni nasz klucz API
    • Kliknij w Settings obok FIles/Community
    • Odszukaj taką sekcję:
    • Kliknij w New secret
      w pole Name wklej/wpisz: OPENAI_API_KEY
      w pole Value wklej/wpisz klucz, który stworzono w API OpenAI
    • Oczywiście zapisz
    • Gotowe, program będzie miał dostęp do API, a nikt obcy go nie podejrzy
  • Teraz edycja aplikacji 🙂
    • przejdź na zakładkę Files i otwórz requirements.txt
    • kliknij w ikonkę ołówka (Edit)
    • wpisz tam jeden pod drugim:
      • gradio (to ułatwi nam tworzenie interfejsu zamiast pisania html, css itd.)
      • openai (to umożliwi nam dostęp do API OpenAI)
    • zamknij plik

Gradio/Python, cz. 2

  • otwórz plik app.py i także go edytuj
    Na marginesie: pliki .gitattributes oraz README.md zostaną stworzone automatycznie, na razie nie ma potrzeby ich ruszać
    • Jeśli coś jest w pliku – usuń i wklej poniższy kod (poniżej go objaśnię):
import openai
from openai import OpenAI
import gradio as gr

client = OpenAI()

def chat(system_message, user_message, temperature, max_tokens, top_p, frequency_penalty, presence_penalty):

    response = client.chat.completions.create(
        model="gpt-4o",
        messages=[
     {"role": "system", "content": system_message},
            {"role": "user", "content": user_message}
        ],
        temperature=temperature,
        max_tokens=max_tokens,
        top_p=top_p,
        frequency_penalty=frequency_penalty,
        presence_penalty=presence_penalty
    )

    return response.choices[0].message.content

iface = gr.Interface(

    css="""
        #textbox_id textarea {
        background-color: #ccffcc;
        font-size: 120%!important;
        font-weight: bold !important;
        }
        """,

    fn=chat,
    inputs=[
        gr.Textbox(lines=2, placeholder="Enter system message here... Ex: You are a professional advisor with a deep understanding of business and finance. Provide detailed and accurate information in a formal tone.", label="System Message"),
        gr.Textbox(lines=4, placeholder="Enter user message here...", label="User Message", elem_id="textbox_id"),
        gr.Slider(minimum=0, maximum=1, step=0.1, value=0.7, label="Temperature"),
        gr.Slider(minimum=1, maximum=2048, step=1, value=150, label="Max Tokens"),
        gr.Slider(minimum=0, maximum=1, step=0.1, value=1, label="Top P"),
        gr.Slider(minimum=-2, maximum=2, step=0.1, value=0, label="Frequency Penalty"),
        gr.Slider(minimum=-2, maximum=2, step=0.1, value=0, label="Presence Penalty")
    ],
    outputs=gr.Textbox(lines=16, placeholder="Output will be displayed here...", label="Output"),
    title="GPT-4o Chatbot",
    description="Czat z GPT-4o przy użyciu API OpenAI"
)

if __name__ == "__main__":
    iface.launch()


Objaśnienie

MODUŁ1 (importy)

  • import openai (importuje do programu bilbiotekę, czyli funkcje, komendy modułu OpenAI
    • w zasadzie rzadko programuje się coś od zera, zwykle coś już ktoś wymyślił i my korzystamy z gotowych – większych lub mniejszych elementów – bibliotek, frameworków….
  • from openai import OpenAI
    • z tego całego modułu potrzebujemy “podgrupy” funkcji – modułu nazwanego OpenAI
  • import gradio as gr
    • do wizualnej strony aplikacji pobierzemy moduł Gradio, nazwiemy go dla uproszczenia gr (można br, zx jak chcemy, gr to proste i się kojarzy 😉

MODUŁ2 (inicjacja czata)

  • client = OpenAI()
    • tworzymy zmienną/funkcję, a w zasadzie właśnie nowego czata 🙂 – właśnie w ten sposób, słówko client może być inne, ale jest dość czytelne, tworzymy “instancję” – nowe połączenie do OpenAI API, tak jakbyśmy skopiowali np. robota 😉

MODUŁ3 (główna funkcja – to i wcześniejsze to polecenie Python)

  • def chat(system_message, user_message, temperature, max_tokens, top_p, frequency_penalty, presence_penalty):
    • definiujemy nową funkcję, którą nazwiemy sobie chat i przekażemy do niej szereg zmiennych (parametrów)
    • Definicja funkcji chat:
      • Ta funkcja przyjmuje kilka parametrów, w tym wiadomość systemową, wiadomość użytkownika oraz kilka parametrów kontrolujących zachowanie modelu (np. temperatura, max_tokens itp.).
    • Wywołanie metody (funkcji) create:
      • client.chat.completions.create: Wywołujemy metodę create na instancji klienta OpenAI. Ta metoda generuje odpowiedź na podstawie przekazanych wiadomości i parametrów.
        • model=”gpt-4″: Używamy modelu GPT-4.
        • messages: Przekazujemy listę wiadomości, które składają się na konwersację. Wiadomość systemowa ustawia kontekst i ton, a wiadomość użytkownika to pytanie lub wypowiedź, na którą model odpowie.
        • Parametry modelu: Parametry takie jak temperature, max_tokens, top_p, frequency_penalty i presence_penalty kontrolują zachowanie modelu podczas generowania odpowiedzi.
    • Zwracanie odpowiedzi: return response.choices[0].message.content
      • response.choices[0].message.content: Pobieramy wygenerowaną odpowiedź modelu z obiektu odpowiedzi.

MODUŁ4 (strona wizutalna, Gradio)

  • iface = gr.Interface(
    • jak widać korzystamy z wcześniej zdefiniowanego gr, czyli modułu Gradio, w którym przywołujemy funkcję Interfejsu, nasz programik/funckja dostanie nazwę iface
    • css=”””         #textbox_id textarea {   ….           }         „””,
      • to fragment czysto wizualny, po prostu uznałem, że moduł , w którym użytkownik wpisuje swoje polecenie powinien być zielony (tło #ccffcc ,z większą czionką i pogrubioną), usunięcie tego modułu nie zmieni działania programu
    • fn=chat,
      • odwołujemy się do wcześniej stworzonej funkcji chat
    • inputs=[ …
      • tworzymy najpierw pola tekstowe (korzystając z Gradio, stąd gr.Textbox, określając na ile linii mają być wysokie, co powinno być na nich napisane
        • to elem_id=”textbox_id” to dodatkowe pole, do którego odwołujemy się w naszym module css, dzięki id CSS wie, co ma kolorować lub zmieniać czcionkę
      • potem pola suwaków (slider), także określając ich parametry i nazwy
    • outputs=gr.Text …
      • w podobny sposób jak pola zapytania formatujemy pole odpowiedzi
    • title
      • tutuł
    • description
      • podtytuł

MODUŁ5 (uruchomienie)

  • if
    • Ten fragment kodu odpowiada za uruchomienie aplikacji, jeśli skrypt jest uruchamiany bezpośrednio. Jest to standardowa praktyka w języku Python, która pozwala na określenie, czy skrypt jest uruchamiany bezpośrednio (main) , czy jest importowany jako moduł.
    • w sumie mógłby wyglądać po prostu:
      • iface.launch()

Doszliśmy do końca :), daj znać, jak CI poszło


Komentarze

Dodaj komentarz

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *