Zarówno dla początkujących, którzy chcą się uczyć, jak i dla doświadczonych profesjonalistów, istnieje kilka stron internetowych, które pozwalają wypróbować wiersze kodu i zobaczyć wynik w podglądzie i prawie w czasie rzeczywistym. Są to prawdziwe aplikacje z ekranem podzielonym na dwie części, w których z jednej strony piszesz kod, którym może być HTML, CSS, PHP, JavaScript lub inny, z drugiej strony, po naciśnięciu klawisza, aby wykonać, faktycznie widzisz, jak to wygląda, jeśli ten kod był w witrynie internetowej.
Nie są to proste edytory kodu, ale miejsca, w których możesz przetestować swoje oprogramowanie, nie martwiąc się o błędy i szybko sprawdzając, gdzie są błędy. Codepen i JSFiddle to dwie najpopularniejsze strony w tej kategorii, ale istnieje również wiele alternatyw.
CZYTAJ TAKŻE: Główne języki programowania używane w aplikacjach i witrynach internetowych
1) CodePen
CodePen jest najpopularniejszą witryną używaną przez programistów, ponieważ jest bezpłatna, intuicyjna i łatwa w użyciu. Stając się standardem w świecie programistów, wystarczy wyszukać w Google, aby znaleźć strony już skompilowane przez Codepen i od razu sprawdzić, czy tego właśnie szukasz. Elastyczne okna podglądu i natychmiastowe wykonanie napisanego kodu sprawiają, że jest on wystarczająco doskonały do wypróbowania animacji javascript i CSS, a ponadto może łatwo łączyć się ze skryptami zewnętrznymi (React, Vue i wszystkim innym dostępnym za pośrednictwem CDN).
CodePen zasługuje na pierwsze miejsce w tej kategorii, jednak niektóre funkcje są płatne, takie jak wspólne kodowanie i pełne podglądy na żywo na stronie (częściowe podglądy na żywo są bezpłatne).
2) JSFiddle
Na drugim miejscu (choć chronologicznie jest to jedna z najstarszych) w świecie stron do pisania i próbowania kodu programistycznego jest JSFiddle, zorientowany przede wszystkim na tworzenie i testowanie JavaScript. Może być również używany do HTML i CSS, ponieważ obsługuje wskazówki dotyczące uzupełniania kodu i może być również lepszy niż CodePen dla mniej doświadczonych.
Dużą zaletą JSFiddle jest to, że oferuje bezpłatny tryb współpracy (w tym czat głosowy i tekstowy), dzięki czemu możesz pracować nad kodem jednocześnie z innymi ludźmi.
3) Glitch
Wiele witryn kodowych pozwala na kodowanie HTML / CSS / JS i generowanie statycznych stron internetowych, podczas gdy Glitch oferuje niewielkie wolne miejsce do przechowywania projektów i sprawia, że dość łatwo jest wykonać kod po stronie serwera Node.js. Możesz wspólnie programować w Glitch,
Zawiera także wiele innych fantastycznych funkcji: wspólne kodowanie, kontrola wersji, wiele zasobów edukacyjnych, dobra integracja z GitHub, łatwe osadzanie, społeczność z prośbą o poradę, projekty już wykonane, które można dowolnie modyfikować lub używać oraz Integracja z Visual Studio. To świetny, szybki i łatwy sposób na uruchomienie aplikacji internetowej (lub naucz się, jak to zrobić).
4) CodeSandbox
CodeSandbox jest podobny do Glitcha, ale nieco bardziej złożony i kompletny. CodeSandbox ma bardziej elastyczny i konfigurowalny interfejs, pozwala dystrybuować kompletne aplikacje internetowe, ma miejsce na zapisywanie plików i wykonuje większość podstawowej pracy, pozostawiając programistowi jedynie zadanie pisania.
5) Repl.it
Repl.it to środowisko programistyczne do testowania różnych typów języków programowania, takich jak Python, z obsługą kodu front-end i back-end, pozwala dystrybuować witryny i aplikacje, ma integrację z GitHub i intuicyjny interfejs. Może to być trochę zbyt trudne dla każdego, kto tylko próbuje zaprojektować strony internetowe, ale dla już doświadczonych programistów jest to zasób do rozważenia. jeśli planujesz tylko front-end lub jesteś nowy w kodzie, ale jeśli planujesz wszystko regularnie, warto to zbadać.
6) Liveweave to edytor internetowy bardzo podobny do JSFiddle, za pomocą którego można pisać i wypróbowywać kod do użycia na stronach internetowych, z funkcją podglądu na żywo, podpowiedziami do kodu HTML5, CSS3, JavaScript i jQuery, i który pozwala pobrać projekt jako plik zip. Możesz także z łatwością dodawać biblioteki zewnętrzne, takie jak jQuery, AndgularJS, Bootstrap.
7) CodeSandbox to bezpłatna przestrzeń online, w której możesz uruchamiać projekty aplikacji internetowych przy użyciu różnych platform, takich jak React, Vue, Angular i wiele innych.
8) StackBlitz to doskonały edytor aplikacji javascript, który obsługuje różne frameworki, takie jak Vue i React.
9) Flems, minimalistyczna strona, idealna do szybkich testów.
10) JSBin, bardziej minimalistyczna wersja JSFiddle, do pisania kodu strony internetowej i sprawdzania jego wyglądu.
11) CSSDeck to prosta strona do testowania podstawowych pomysłów HTML / CSS i JS.
12) ICECoder, kolejne środowisko online do testowania kodu, które wymaga pobrania programu działającego w przeglądarce i można go również używać offline.
13) Plunker, front-end narzędzie, które pozwala pisać kod, pliki i strony internetowe i zapisywać je w Github.
14) Scrimba to innowacyjne połączenie edytora wideo i kodu, które jest idealnym środowiskiem do nauki dla studentów i tych, którzy chcą się uczyć.
15) WebMaker, twórca aplikacji internetowych z funkcjonalnością offline i integracją z CodePen.
16) Dabblet, aby spróbować napisać kod HTML / CSS / JS z ładną grafiką i automatycznym korektorem kodu CSS.
17) PlayCode to także środowisko do testowania w czasie rzeczywistym podstawowego kodu HTML / CSS / JS.
19) JSItor to kolejna alternatywa dla Codepen i JSFiddle, w której możesz pisać kod, łącząc HTML, CSS i JavaScript i od razu zobaczyć wynik.
CZYTAJ TAKŻE: Strony do nauki programowania, grając z interaktywnymi kursami i wyzwaniami
Nie są to proste edytory kodu, ale miejsca, w których możesz przetestować swoje oprogramowanie, nie martwiąc się o błędy i szybko sprawdzając, gdzie są błędy. Codepen i JSFiddle to dwie najpopularniejsze strony w tej kategorii, ale istnieje również wiele alternatyw.
CZYTAJ TAKŻE: Główne języki programowania używane w aplikacjach i witrynach internetowych
Witryny do testowania kodu online
1) CodePen
CodePen jest najpopularniejszą witryną używaną przez programistów, ponieważ jest bezpłatna, intuicyjna i łatwa w użyciu. Stając się standardem w świecie programistów, wystarczy wyszukać w Google, aby znaleźć strony już skompilowane przez Codepen i od razu sprawdzić, czy tego właśnie szukasz. Elastyczne okna podglądu i natychmiastowe wykonanie napisanego kodu sprawiają, że jest on wystarczająco doskonały do wypróbowania animacji javascript i CSS, a ponadto może łatwo łączyć się ze skryptami zewnętrznymi (React, Vue i wszystkim innym dostępnym za pośrednictwem CDN).
CodePen zasługuje na pierwsze miejsce w tej kategorii, jednak niektóre funkcje są płatne, takie jak wspólne kodowanie i pełne podglądy na żywo na stronie (częściowe podglądy na żywo są bezpłatne).
2) JSFiddle
Na drugim miejscu (choć chronologicznie jest to jedna z najstarszych) w świecie stron do pisania i próbowania kodu programistycznego jest JSFiddle, zorientowany przede wszystkim na tworzenie i testowanie JavaScript. Może być również używany do HTML i CSS, ponieważ obsługuje wskazówki dotyczące uzupełniania kodu i może być również lepszy niż CodePen dla mniej doświadczonych.
Dużą zaletą JSFiddle jest to, że oferuje bezpłatny tryb współpracy (w tym czat głosowy i tekstowy), dzięki czemu możesz pracować nad kodem jednocześnie z innymi ludźmi.
3) Glitch
Wiele witryn kodowych pozwala na kodowanie HTML / CSS / JS i generowanie statycznych stron internetowych, podczas gdy Glitch oferuje niewielkie wolne miejsce do przechowywania projektów i sprawia, że dość łatwo jest wykonać kod po stronie serwera Node.js. Możesz wspólnie programować w Glitch,
Zawiera także wiele innych fantastycznych funkcji: wspólne kodowanie, kontrola wersji, wiele zasobów edukacyjnych, dobra integracja z GitHub, łatwe osadzanie, społeczność z prośbą o poradę, projekty już wykonane, które można dowolnie modyfikować lub używać oraz Integracja z Visual Studio. To świetny, szybki i łatwy sposób na uruchomienie aplikacji internetowej (lub naucz się, jak to zrobić).
4) CodeSandbox
CodeSandbox jest podobny do Glitcha, ale nieco bardziej złożony i kompletny. CodeSandbox ma bardziej elastyczny i konfigurowalny interfejs, pozwala dystrybuować kompletne aplikacje internetowe, ma miejsce na zapisywanie plików i wykonuje większość podstawowej pracy, pozostawiając programistowi jedynie zadanie pisania.
5) Repl.it
Repl.it to środowisko programistyczne do testowania różnych typów języków programowania, takich jak Python, z obsługą kodu front-end i back-end, pozwala dystrybuować witryny i aplikacje, ma integrację z GitHub i intuicyjny interfejs. Może to być trochę zbyt trudne dla każdego, kto tylko próbuje zaprojektować strony internetowe, ale dla już doświadczonych programistów jest to zasób do rozważenia. jeśli planujesz tylko front-end lub jesteś nowy w kodzie, ale jeśli planujesz wszystko regularnie, warto to zbadać.
6) Liveweave to edytor internetowy bardzo podobny do JSFiddle, za pomocą którego można pisać i wypróbowywać kod do użycia na stronach internetowych, z funkcją podglądu na żywo, podpowiedziami do kodu HTML5, CSS3, JavaScript i jQuery, i który pozwala pobrać projekt jako plik zip. Możesz także z łatwością dodawać biblioteki zewnętrzne, takie jak jQuery, AndgularJS, Bootstrap.
7) CodeSandbox to bezpłatna przestrzeń online, w której możesz uruchamiać projekty aplikacji internetowych przy użyciu różnych platform, takich jak React, Vue, Angular i wiele innych.
8) StackBlitz to doskonały edytor aplikacji javascript, który obsługuje różne frameworki, takie jak Vue i React.
9) Flems, minimalistyczna strona, idealna do szybkich testów.
10) JSBin, bardziej minimalistyczna wersja JSFiddle, do pisania kodu strony internetowej i sprawdzania jego wyglądu.
11) CSSDeck to prosta strona do testowania podstawowych pomysłów HTML / CSS i JS.
12) ICECoder, kolejne środowisko online do testowania kodu, które wymaga pobrania programu działającego w przeglądarce i można go również używać offline.
13) Plunker, front-end narzędzie, które pozwala pisać kod, pliki i strony internetowe i zapisywać je w Github.
14) Scrimba to innowacyjne połączenie edytora wideo i kodu, które jest idealnym środowiskiem do nauki dla studentów i tych, którzy chcą się uczyć.
15) WebMaker, twórca aplikacji internetowych z funkcjonalnością offline i integracją z CodePen.
16) Dabblet, aby spróbować napisać kod HTML / CSS / JS z ładną grafiką i automatycznym korektorem kodu CSS.
17) PlayCode to także środowisko do testowania w czasie rzeczywistym podstawowego kodu HTML / CSS / JS.
19) JSItor to kolejna alternatywa dla Codepen i JSFiddle, w której możesz pisać kod, łącząc HTML, CSS i JavaScript i od razu zobaczyć wynik.
CZYTAJ TAKŻE: Strony do nauki programowania, grając z interaktywnymi kursami i wyzwaniami
