Aby przekształcić swoją aplikację DApp z "ładnej statycznej strony" w "działającą zdecentralizowaną aplikację", należy wykonać wstrzyknięcie od UI (opakowanie) do logiki (dusza).
W ekosystemie ArcBlock uruchomienie DApp zazwyczaj dzieli się na cztery kluczowe kroki:
---
## ## Przegląd tematu: poprzez trylogię "dostęp tożsamości, interakcja z umowami, wdrożenie węzłów" aktywujemy statyczny UI do w pełni funkcjonalnej aplikacji Web3.
## ## Analiza treści: cztery kluczowe etapy działania DApp
### 1. Środowisko wdrożeniowe: aby strona była "online"
Najpierw twój kod HTML potrzebuje domu.
*Lokalne uruchomienie**: Użyj `blocklet dev` na swoim komputerze, co uruchomi lokalny serwer, umożliwiając dostęp przez przeglądarkę.
*Oficjalne uruchomienie**: Potrzebujesz węzła ArcBlock (ABT Node). Możesz zapakować kod jako Blocklet, a następnie zainstalować go na węźle. W ten sposób użytkownicy na całym świecie będą mogli uzyskiwać dostęp do twojej DApp za pośrednictwem URL wygenerowanego przez węzeł.
### 2. Dostęp do tożsamości: Integracja DID Connect (funkcja logowania)
Aplikacja stakowania musi wiedzieć, 'kto stakuje'.
*Operacje**: Musisz wprowadzić komponent `did-connect` ArcBlock.
*Efekt**: Kiedy użytkownik kliknie 'Connect Wallet', na stronie pojawi się kod QR. Użytkownik skanuje go za pomocą DID Wallet, a twoja DApp może bezpiecznie uzyskać adres portfela użytkownika (DID), bez tradycyjnych loginów i haseł.
### 3. Kluczowa logika: Obsługa transakcji stakowania (przepływ 'pieniędzy')
To jest najważniejszy krok. Gdy użytkownik wprowadzi kwotę i kliknie 'STAKE NOW':
*Wyzwolenie front-endu**: Kod JS zbuduje żądanie transakcji (Transaction Request).
*Podpis portfela**: Portfel mobilny użytkownika otrzyma powiadomienie, pytając 'Czy zgadzasz się na stakowanie 100 ABT?'.
*Wykonanie on-chain**: Po podpisaniu przez użytkownika transakcja jest wysyłana do blockchaina (np. Asset Chain). Inteligentne kontrakty lub maszyny stanów (State Machine) na blockchainie automatycznie odejmą ABT użytkownika i zablokują je w puli stakowania.
### 4. Feedback danych: Dynamiczne wyświetlanie zysków
Po udanej stawce strona nie może być martwa.
*Logika**: Musisz napisać krótki kod JS, aby regularnie pobierać dane z blockchaina za pomocą GraphQL lub API.
*Efekty**: Użytkownik może na bieżąco widzieć swoje 'zainwestowane środki' i 'szacowane zyski (Rewards)' w ruchu.
---
## ## Szybkie wskazówki: Jak najszybciej zobaczyć efekty?
Jeśli chcesz natychmiast zobaczyć 'działanie', spróbuj następujących ścieżek:
1. Użyj szablonu Blocklet:
Nie zaczynaj pisać backendu od zera. Wybierz szablon z serwerem (np. Express lub Koa) podczas uruchamiania `blocklet create`. Już skonfigurowano kod do interakcji z portfelem.
2. Wykorzystaj 'asystenta dewelopera':
W węźle ArcBlock znajduje się narzędzie Data Builder, które może pomóc ci szybko wygenerować interfejs do zapytań o dane on-chain, wystarczy, że połączysz te interfejsy z UI.
---
## ## Podsumowanie:
Istotą uruchomienia DApp jest 'prezentacja front-endu + autoryzacja portfela + dowód na blockchainie'. Twój UI już zakończył pierwszy krok, a następnym kluczowym krokiem jest **integracja portfela DID**, aby użytkownicy mogli naprawdę 'wrzucić' swoje zasoby na twoją stronę.