Konfiguracja środowiska programistycznego
Skonfiguruj środowisko programistyczne do tworzenia rozszerzeń Chrome i Edge, w tym przeglądarkę oraz podstawowe narzędzia.
Konfiguracja środowiska programistycznego to bezpłatna lekcja Browser Extensions Development (Chrome & Edge) na CoddyKit. To lekcja 2 z 4. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej Browser Extensions Development (Chrome & Edge), a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs Browser Extensions Development (Chrome & Edge) zawiera 4 lekcji w sumie.
Części tej lekcji nie zostały jeszcze przetłumaczone i są wyświetlane po angielsku.
Get Ready to Build!
Before building, set up your workspace — prepping tools first makes coding smoother and lets you test your extensions efficiently.
Your Browser is Your Lab
Your browser is your lab. Chrome and Edge have built-in dev features; the first step is flipping on their special "Developer Mode."
Switch On Developer Mode
Enable Developer Mode: open chrome://extensions and toggle the switch in the top-right. That unlocks loading and testing your own extensions.
Your Extension's Home
Each extension needs its own folder for all its files. Make an empty one — say my-first-extension — where we'll drop the manifest and code.
The Essential Manifest File
The manifest.json is your extension's blueprint — it tells the browser the key details. Start with a minimal one in your folder.
Pick a Code Editor
Any editor works, but a real code editor adds highlighting, autocomplete, and debugging. VS Code is the free, popular pick — grab it if needed.
Load Your Unpacked Extension
With Developer Mode on, click Load unpacked and select your folder. Your extension should appear in the list, maybe with an icon in the toolbar.
Refresh for Updates
After editing files, the browser won't see changes until you reload — hit the refresh icon on your extension's card in chrome://extensions.
Debug with DevTools
Debug extensions with DevTools, just like web pages. Each card links to its background "service worker" or popup inspector for digging in.
Development Environment Check
You've learned the essential steps to prepare your browser and load your first extension. Let's test your understanding!
Which of the following actions is necessary to see changes in your extension after modifying its files?
Setup Complete!
Your environment is set: Developer Mode on, a folder with manifest.json, loading and reloading unpacked, and DevTools for debugging. Onward!
Często zadawane pytania
Czy lekcja „Konfiguracja środowiska programistycznego” jest bezpłatna?
Tak — pełny tekst „Konfiguracja środowiska programistycznego” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu Browser Extensions Development (Chrome & Edge), przejdź na CoddyKit PRO. Kurs Browser Extensions Development (Chrome & Edge) zawiera 4 lekcji w sumie.
Co nauczysz się w „Konfiguracja środowiska programistycznego”?
Skonfiguruj środowisko programistyczne do tworzenia rozszerzeń Chrome i Edge, w tym przeglądarkę oraz podstawowe narzędzia. Ćwiczysz Browser Extensions Development (Chrome & Edge) z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.
Czy potrzebuję doświadczenia, aby zacząć Browser Extensions Development (Chrome & Edge)?
Nie wymagamy żadnego doświadczenia. Browser Extensions Development (Chrome & Edge) w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 2 z 4.
Ile czasu zajmuje lekcja „Konfiguracja środowiska programistycznego”?
Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.
Czy mogę pisać i uruchamiać kod w tej lekcji Browser Extensions Development (Chrome & Edge)?
Tak. Każda lekcja Browser Extensions Development (Chrome & Edge) zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.
Wszystkie lekcje w tym kursie
- Czym są rozszerzenia przeglądarki
- Konfiguracja środowiska programistycznego
- Pierwsze rozszerzenie „Hello World”
- Anatomia projektu rozszerzenia