Przegląd edytora kodu

Przeglad edytora kodu

Dla uzytkownikow, ktorzy chca miec wieksza kontrole, Promake oferuje wbudowany edytor kodu. Przegladaj i edytuj kod zrodlowy swojej strony, jak profesjonalny programista.

Czym jest edytor kodu?

Edytor kodu daje Ci bezposredni dostep do plikow strony:

• HTML – Struktura i tresc
• CSS – Style i wyglad
• JavaScript – Funkcjonalnosc i interakcje
• React/JSX – Kod komponentow
• Pliki konfiguracyjne – Ustawienia projektu

Dla kogo jest przeznaczony?

👤 Poczatkujacy

Nawet jesli nie znasz kodu, edytor pozwala:

• Zobaczyc, jak zbudowana jest Twoja strona
• Wprowadzac drobne zmiany tekstowe bezposrednio
• Pobrac kod jako kopie zapasowa

👨‍💻 Uzytkownicy sredniozaawansowani

Z pewna wiedza o kodowaniu:

• Szybkie poprawki bez pytania AI
• Precyzyjne dostosowanie wartosci
• Nauka poprzez analize kodu

🧑‍💻 Zaawansowani uzytkownicy

Doswiadczeni programisci moga:

• Pelna kontrola nad calym kodem
• Implementacja niestandardowych rozwiazań
• Integracja z procesami developerskimi

Dostep do edytora kodu

Z panelu podgladu

1. Otworz swoj projekt
2. Spojrz na pasek narzedzi podgladu
3. Kliknij ikone Kod
4. Edytor otworzy sie w miejscu podgladu

Przelaczanie widokow

Przelaczaj miedzy:

• Podglad – Zobacz swoja strone
• Kod – Edytuj pliki

Interfejs edytora

Eksplorator plikow (lewy panel)

• Struktura folderow projektu
• Kliknij pliki, aby je otworzyc
• Zorganizowane wedlug typow (komponenty, style itp.)

Obszar kodu (glowny panel)

• Kolorowanie skladni
• Numery linii
• Przestrzen do edycji kodu

Pasek narzedzi (gora)

• Przycisk zapisu
• Opcje pobierania
• Informacje o pliku

Podstawowe uzytkowanie

Otwieranie pliku

1. Nawiguj w eksploratorze plikow
2. Kliknij na plik, ktory chcesz wyswietlic
3. Zawartosc pliku pojawi sie w edytorze

Edycja kodu

1. Kliknij w obszarze kodu
2. Wprowadz zmiany
3. Kliknij Zapisz lub nacisnij Ctrl/Cmd + S
4. Zmiany zostana zastosowane w projekcie

Zapisywanie zmian

Zmiany sa zapisywane, gdy:

• Klikniesz przycisk Zapisz
• Nacisniesz Ctrl/Cmd + S
• Podglad zostanie zaktualizowany, aby odzwierciedlic zmiany

Co mozesz edytowac?

Bezpiecznie do edycji ✅

• Tresc tekstowa w komponentach
• Kolory i wartosci CSS
• Wartosci konfiguracyjne
• Proste zmiany HTML

Edytuj ostroznie ⚠️

• Strukture komponentow
• Logike JavaScript
• Instrukcje importu
• Zlozony zagniezdzony kod

Unikaj, chyba ze jestes ekspertem ❌

• Konfiguracje budowania
• Zaleznosci pakietow
• Glowne pliki frameworka

Funkcje edytora kodu

Kolorowanie skladni

Rozne elementy kodu sa kolorowane dla latwiejszego czytania:

• Slowa kluczowe na niebiesko
• Lancuchy znakow na zielono
• Komentarze na szaro
• I wiecej

Numery linii

Kazda linia jest numerowana dla latwego odniesienia.

Autouzupelnianie

Zacznij pisac i otrzymuj sugestie.

Skroty klawiszowe

| Skrot | Akcja | | -------------------- | ------ | | Ctrl/Cmd + S | Zapisz | | Ctrl/Cmd + F | Znajdz| | Ctrl/Cmd + Z | Cofnij | | Ctrl/Cmd + Shift + Z | Ponow |

Czeste zadania

Wyszukiwanie tekstu

1. Nacisnij Ctrl/Cmd + F
2. Wpisz to, czego szukasz
3. Nawiguj miedzy wynikami

Zmiana tekstu

1. Znajdz plik zawierajacy tekst
2. Zlokalizuj tekst w kodzie
3. Edytuj bezposrednio
4. Zapisz

Zmiana kolorow

1. Znajdz plik CSS lub styli
2. Zlokalizuj wartosci kolorow (np. #FF5733)
3. Zastap wybranym kolorem
4. Zapisz

Wskazowki dla poczatkujacych

Zacznij od malych zmian

Wprowadzaj jedna mala zmiane naraz i zapisuj, aby zobaczyc efekt.

Uzywaj wyszukiwania

Uzyj Ctrl/Cmd + F do wyszukiwania konkretnego tekstu zamiast przegladania plikow.

Nie panikuj

Jesli cos sie zepsuje:

1. Uzyj Cofnij (Ctrl/Cmd + Z)
2. Lub przywroc z Historii wersji
3. Lub popros AI o naprawe

Ucz sie przez eksploracje

Przegladanie kodu jest edukacyjne, nawet jesli go nie edytujesz.

Kiedy uzywac czatu a kiedy edytora kodu

Uzyj czatu do:

• Dodawania nowych funkcji
• Duzych zmian
• Rzeczy, ktorych nie wiesz jak zakodowac
• Zlozonych modyfikacji

Uzyj edytora kodu do:

• Szybkich poprawek tekstu
• Korekty kolorow
• Nauki jak dzialaja poszczegolne elementy
• Pobierania kodu