![Online uređivači koda]()
Programer nema uvijek pri ruci poseban softver, preko kojeg radi s kodom. Ako se dogodi da morate urediti kôd, a odgovarajući softver nije dostupan, možete koristiti besplatne online usluge. Dalje ćemo ispričati o dva takva mjesta i detaljno analizirati načelo rada u njima.
Uređivanje programskog koda na mreži
Budući da postoji veliki broj takvih urednika i da ih jednostavno ne smatramo svima, odlučili smo se usredotočiti samo na dva online izvora koji su najpopularniji i predstavljaju osnovni set potrebnih alata.
Pogledajte i: Kako napisati Java program
Metoda 1: CodePen
Na stranici CodePen, mnogi programeri dijele vlastite kodove, spremaju i rade s projektima. Nema ništa teško stvoriti svoj račun i odmah početi pisati, ali to se radi na sljedeći način:
Idite na CodePen web stranicu
- Otvorite glavnu stranicu CodePen stranice pomoću gore navedene veze i nastavite s izradom novog profila.
![Idite na registraciju na stranici CodePen]()
- Odaberite prikladan način registracije i, slijedeći dane upute, izradite vlastiti račun.
![Dovršite postupak registracije na web-lokaciji CodePen]()
- Upišite podatke o svojoj stranici.
![Ispunite osobne podatke na web-lokaciji CodePen]()
- Sada možete otići na kartice, proširiti skočni izbornik "Create" i odabrati stavku "Project" .
![Napravite novi projekt na web-lokaciji CodePen]()
- U prozoru s desne strane vidjet ćete podržane formate datoteka i programske jezike.
![Podržane vrste datoteka na usluzi CodePen]()
- Počnite uređivati odabirom jednog od predložaka ili standardnog HTML5 oznake.
![Korištenje predložaka na usluzi CodePen]()
- Sve kreirane knjižnice i datoteke bit će prikazane s lijeve strane.
![Korištenje predložaka na usluzi CodePen]()
- Lijevim klikom na objekt aktivira ga, u prozoru s desne strane prikazuje se kôd.
![Uređivanje datoteka na usluzi CodePen]()
- Na dnu se nalaze gumbi koji omogućuju dodavanje vlastitih mapa i datoteka.
![Dodavanje novih datoteka na CodePen uslugu]()
- Nakon stvaranja, dodijelite naziv objektu i spremite promjene.
![Postavite novo ime datoteke na usluzi CodePen]()
- U bilo kojem trenutku možete otići u postavke projekta klikom na "Postavke" .
![Idite na postavke na usluzi CodePen]()
- Ovdje možete postaviti osnovne informacije - ime, opis, oznake, kao i parametre pregleda i uvlačenje koda.
![Promijenite i spremite postavke na usluzi CodePen]()
- Ako niste zadovoljni trenutnim pogledom na radni prostor, možete ga promijeniti tako da kliknete na "Promijeni prikaz" i odaberete željeni prozor za pregled.
![Promijenite izgled usluge CodePen]()
- Kada uredite potrebne retke koda, kliknite "Spremi sve + pokretanje" da biste spremili sve promjene i pokrenuli program. Prevedeni rezultat prikazan je u nastavku.
![Proces izrade koda na usluzi CodePen]()
- Spremite projekt na svoje računalo klikom na "Izvoz" .
![Priprema projekta za preuzimanje CodePen]()
- Pričekajte dok se obrada ne dovrši i preuzmete arhivu.
![Preuzmite projekt na usluzi CodePen]()
- Budući da korisnik ne može imati više od jednog aktivnog projekta u besplatnoj verziji CodePena, morat će se izbrisati ako trebate stvoriti novi. Da biste to učinili, kliknite "Izbriši" .
![Idi na brisanje projekta na usluzi CodePen]()
- Unesite riječ provjere i potvrdite brisanje.
![Potvrdite brisanje projekta iz usluge CodePen]()
Iznad smo pregledali osnovne funkcije online usluge CodePen. Kao što možete vidjeti, vrlo je pogodno ne samo za uređivanje koda, nego i za pisanje od nule, a zatim ga dijeliti s drugim korisnicima. Jedini nedostatak stranice su ograničenja u besplatnoj verziji.
Metoda 2: LiveWeave
Sada bih se želio zadržati na web-u LiveWeave. Sadrži ne samo ugrađeni uređivač koda, već i druge alate o kojima ćemo raspravljati u nastavku. Rad s web-lokacijom počinje ovako:
Idite na web stranicu LiveWeave
- Slijedite gornju vezu da biste došli do stranice uređivača. Ovdje ćete odmah vidjeti četiri prozora. Prvi je pisanje koda u HTML5, drugi je JavaScript, treći je CSS, a četvrti prikazuje rezultat kompilacije.
![Četiri aktivna prozora na usluzi LiveWeave]()
- Jedna od značajki ove stranice može se smatrati opisima alata prilikom tipkanja oznaka, oni vam omogućuju da povećate brzinu tipkanja i izbjegavate pravopisne pogreške.
![Prikaži savjete o usluzi LiveWeave]()
- Prema zadanim postavkama, kompilacija se odvija u živom načinu rada, tj. Odmah nakon obrade.
![Kompilacija uživo u LiveWeaveu]()
- Ako želite deaktivirati ovu funkciju, morate pomaknuti klizač nasuprot željene stavke.
![Onemogućite automatsku kompilaciju na usluzi LiveWeave.]()
- U blizini je dostupan i isključen noćni način rada.
![Isključite noćni način na usluzi LiveWeave]()
- Možete raditi s CSS kontrolerima klikom na odgovarajući gumb na ploči s lijeve strane.
![Idite na CSS editor na usluzi LiveWeave]()
- U izborniku koji se otvori, naljepnica se uređuje pomicanjem klizača i promjenom određenih vrijednosti.
![Uredite CSS na usluzi LiveWeave]()
- Dalje, preporučujemo da obratite pozornost na odrednicu boja.
![Idite na boje preglednika na LiveWeave]()
- Na raspolaganju vam je opsežna paleta u kojoj možete odabrati bilo koju nijansu, a njezin će se kod prikazati na vrhu, koja se kasnije koristi za pisanje programa s sučeljem.
![Rad s preglednikom u boji na LiveWeaveu]()
- Prijeđite na izbornik "Vector Editor" .
![Idite na vektorski urednik na usluzi LiveWeave]()
- Radi s grafičkim objektima, koji će također ponekad biti korisni tijekom razvoja softvera.
![Radite u vektorskom uredniku na usluzi LiveWeave]()
- Otvorite skočni izbornik "Alati" . Ovdje možete preuzeti predložak, spremiti HTML datoteku i generator teksta.
![Idite na spremanje usluge LiveWeave]()
- Projekt se preuzima kao jedna datoteka.
![Otvorite spremljeni dokument iz usluge LiveWeave]()
- Ako želite spremiti posao, najprije ćete morati proći postupak registracije u ovoj online usluzi.
![Spremi projekt na LiveWeave uslugu]()
Sada znate kako urediti kod na LiveWeaveu. Sigurno možemo preporučiti korištenje ovog internetskog resursa, jer na njemu ima mnogo funkcija i alata koji omogućuju optimizaciju i pojednostavljenje procesa rada s programskim kodom.
Ovim je zaključen naš članak. Danas smo vam dali dvije detaljne upute za rad s kodom pomoću online usluga. Nadamo se da su ove informacije bile korisne i da su nam pomogle odrediti izbor najprikladnijeg web resursa za rad.
Pogledajte i:
Odabir programskog okruženja
Programi za izradu Android aplikacija
Odaberite program za stvaranje igre