7 najboljih besplatnih mrežnih HTML uređivača za testiranje vašeg koda

7 najboljih besplatnih mrežnih HTML uređivača za testiranje vašeg koda

Svaka web stranica koju koristite oslanja se na HTML. Dok web programeri trebaju vještine u JavaScriptu, Pythonu, CSS-u i skriptiranju na strani poslužitelja, HTML sve to drži zajedno.





Bez HTML -a nema weba pa ga morate znati stvoriti i urediti. Umjesto postavljanja sustava za testiranje HTML koda na vašem računalu, lakše je testirati kôd u pregledniku.



Bilo da se petljate s malim HTML isječcima ili cijelim projektima web stranica, online urednik HTML -a je idealan.





Zašto biste trebali koristiti mrežni HTML uređivač

Korištenje HTML uređivača zasnovanog na pregledniku ima smisla koristiti nešto poput Notepada ++ iz sljedećih razloga:

  • Mrežni HTML uređivači rade izravno u vašem web pregledniku
  • Testirajte svoj HTML kôd na mreži --- provjerite radi li kôd prema očekivanjima
  • Pogledajte preglede weba u stvarnom vremenu --- ažuriranje pregleda dok uređujete
  • Pojednostavite svoj tijek rada --- nema više spremanja, učitavanja u preglednik, vraćanja na uređivač i ponovite
  • Agnostička platforma --- izvode se na bilo kojem uređaju s internetskom vezom.

Ova posljednja točka vrlo je važna. To znači da web stranicu možete lako razviti na računalu kao Chromebook. Možda čak koristite Android tablet ili računalo od 50 USD poput Raspberry Pi.



HTML kodiranje je pristupačan, jednostavan pristup razumijevanju programiranja i razvoja. Stalno morate testirati svoj HTML kôd --- što je bolje od rezultata uživo u prozoru preglednika?

Pogledajmo neke od najboljih internetskih uređivača HTML -a koji su trenutno dostupni.



1. CodePen

CodePen je 'okruženje društvenog razvoja' za web programere, što u osnovi znači da je to mrežni uređivač sa značajkama suradnje. Nudi jednostavan izgled. Naći ćete ploču za HTML, ploču za CSS i ploču za JavaScript te jednu za pregled u stvarnom vremenu. Sve veličine panela mogu se prilagoditi povlačenjem rubova.

Možete stvoriti 'olovke' koje su poput pojedinačnih igrališta za prilagođavanje web koda. Više olovaka može se grupirati u zbirke.



Dok je registracija za osnovnu uporabu besplatna, privatne olovke i zbirke zahtijevaju: Profesionalni račun . Ovo počinje od 8 USD mjesečno i uključuje hosting imovine, teme za ugradnju, suradnju u stvarnom vremenu i pristup potpunom IDP-u za razvoj web stranica CodePen.

Mnogi ljudi smatraju CodePen najboljim mrežnim HTML uređivačem. Isprobajte da vidite odgovara li vašim potrebama.

2. JSFiddle

JSFiddle je otprilike ono što zvuči: pješčanik u kojem se možete petljati po JavaScriptu. Vjerojatno znate da JavaScript ide ruku pod ruku s HTML -om i CSS -om. To znači da s JSFiddleom možete urediti sva tri odjednom pomoću sučelja za uređivanje JSFiddlea.

Ako želite, možete potpuno preskočiti JavaScript.

Ono što je lijepo u vezi s JSFiddleom je to što možete dodati vanjske zahtjeve na bočnu traku. To vam omogućuje da uključite JavaScript i CSS datoteke izvan web mjesta za poboljšanje HTML-a. Također je koristan gumb Tidy, koji automatski čisti udubljenja vašeg koda, dok klik na Collaborate omogućuje internetsku suradnju u stvarnom vremenu.

Jedini nedostatak je što morate kliknuti gumb Pokreni da biste ažurirali ploču s pregledom.

3. JSBin

Razmotrite JSBin kao jednostavniju i čistiju alternativu JSFiddleu. Možete urediti bilo koju kombinaciju HTML -a, CSS -a i JavaScript -a samo preklapanjem panela s gornje alatne trake. Za maksimalnu fleksibilnost, prema potrebi možete također preklopiti ploču za pregled i ploču konzole.

kako pronaći ip adresu e -pošte

No, dok JSFiddle omogućuje povezivanje vanjskih CSS i JavaScript resursa, JSBin vas ograničava na unaprijed definirane JavaScript knjižnice. Odabir je ipak dobar, u rasponu od jQuery preko React do Angular i više.

Iako je JSBin besplatan i ne zahtijeva račun, trebat će vam Profesionalni račun za napredne značajke. To uključuje privatne pretince, prilagođena umetanja, hosting sredstava, Dropbox sinkronizaciju i isprazne URL -ove za stranice objavljene putem JSBina.

Četiri. Liveweave

Liveweave je vizualno sličan prethodnim urednicima, s ugodnim korisničkim sučeljem. Poput JSFiddlea, Liveweave omogućuje suradnju u stvarnom vremenu, a poput JSBina omogućuje vam povezivanje unaprijed definiranih resursa trećih strana poput jQueryja.

Ali ima i nekoliko jedinstvenih značajki. Lorem Ipsum Generator stvara tekst rezervirano mjesto na vašoj trenutnoj poziciji kursora. CSS Explorer pruža WYSIWYG alat za kreiranje CSS stilova, a Color Explorer vam pomaže pri odabiru savršenih boja. U međuvremenu, Vector Editor omogućuje vam stvaranje vektorske grafike za vaše web mjesto.

zašto moja poruka ne radi na macu

5. HTMLhouse

HTMLhouse je dobra opcija ako vam je stalo samo do HTML -a (tj. Bez CSS -a ili JavaScript -a). Čist i minimalan, podijeljen je okomito s uređivanjem na lijevoj strani i pregledom u stvarnom vremenu s desne strane.

Korisna je mogućnost objavljivanja HTML -a i njegovo dijeljenje privatno (putem privatnog URL -a) ili javno (dodano u HTMLhouse stranica pregledavanja ). Jednostavan je, ali učinkovit, upravo u tome dolazi u obzir i uređuje se HTML uređivač na mreži.

Imajte na umu da su HTMLhouse stvorili i održavaju ljudi na adresi Pišite.kao , mrežni alat za pisanje bez ometanja. Imajte to na umu ako planirate pisati vlastiti sadržaj web stranice.

6. HTMLG

Druga mogućnost HTMLG -a slijedi isti obrazac korištenja koda i prozora za pregled HTML -a. Međutim, ovaj alat ne uključuje CSS i JavaScript unutar istog objedinjenog projekta. Umjesto toga, ako ih želite urediti, morat ćete otvoriti novu karticu i urediti ih kao zasebne projekte.

To ga čini idealnim za čista HTML podešavanja i testiranje koda u vašem pregledniku; manje ako želite ugraditi CSS uređivanja.

Imajte na umu da postoji ograničenje od 300 riječi ako testirate cijele web stranice s HTMLG-om. Da biste to povećali, možete se prijaviti na premium verziju bez oglasa, već od 5,80 USD mjesečno.

7. Dabblet

Nudeći malo drugačiji pristup online uređivačima HTML -a, Dabblet dijeli zaslon na dva, a ne na tri/četiri okna. Dakle, imate prikaz za HTML i rezultat, a zaseban (ali povezan) prikaz za CSS i rezultat.

Ovo nudi više prostora, dajući jasniji prikaz koda i pregleda. Nadalje, ugrađeni w3.org HTML i CSS validator naglašava sve probleme.

Ako vam je potreban čist prostor na radnoj površini za testiranje koda vaše web stranice, ovo bi mogao biti najbolji uređivač HTML -a za vas.

Koristite najbolje internetske HTML uređivače za poboljšanje svojih vještina

Ako je vaša jedina izloženost HTML -u ono što ste naučili prije deset godina, sada je vrijeme da to nadoknadite. HTML5 objavljen 2014. i uveo je pregršt novih standarda i značajki. Niste sigurni odakle početi? Pogledajte ove bitne nove HTML5 elemente.

Želite naučiti dobre prakse u HTML5 web dizajnu i razvoju? Provjerite ove web stranice s primjerima kvalitetnog HTML kodiranja . Također biste trebali pogledati ove druge alate za nadogradnju vještina razvoja web stranica.

Udio Udio Cvrkut E -pošta 15 Komande Windows naredbenog retka (CMD) koje morate znati

Naredbeni redak i dalje je moćan Windows alat. Evo najkorisnijih CMD naredbi koje svaki korisnik sustava Windows mora znati.

Pročitajte Dalje Povezane teme
  • Programiranje
  • Uređivač teksta
  • Web razvoj
  • Urednici WYSIWYG -a
  • HTML5
  • Skriptiranje
O autoru Christian Cawley(1510 objavljenih članaka)

Zamjenik urednika za sigurnost, Linux, DIY, programiranje i objašnjenje tehnologije, te zaista koristan producent Podcasta, s velikim iskustvom u podršci za stolna i softverska rješenja. Suradnik časopisa Linux Format, Christian je majstor za maline Pi, ljubitelj Lega i ljubitelj retro igara.

Više od Christiana Cawleyja

Pretplatite se na naše obavijesti

Pridružite se našem biltenu za tehničke savjete, recenzije, besplatne e -knjige i ekskluzivne ponude!

Kliknite ovdje za pretplatu