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.
- client.chat.completions.create: Wywołujemy metodę create na instancji klienta OpenAI. Ta metoda generuje odpowiedź na podstawie przekazanych wiadomości i parametrów.
- 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
- 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
- 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


Dodaj komentarz