El programador no sempre té un programari especial a través del qual treballa amb el codi. Si succeeix que necessiteu editar el codi, i el programari corresponent no és a mà, podeu utilitzar els serveis en línia gratuïts. A més, explicarem dos d'aquests llocs i analitzarem en detall el principi de treballar-hi.
Edició del codi del programa en línia
Com que hi ha un gran nombre d’aquests editors i simplement no els considerem tots, vam decidir centrar-nos només en els dos recursos en línia que són els més populars i representem el conjunt bàsic d’eines necessàries.
Vegeu també: Com escriure un programa Java
Mètode 1: CodePen
Al lloc CodePen, molts desenvolupadors comparteixen els seus propis codis, estalvien i treballen amb projectes. No hi ha res difícil de crear el vostre compte i començar a escriure immediatament, però es fa així:
Aneu al lloc web de CodePen
- Obriu la pàgina principal del lloc CodePen mitjançant l’enllaç anterior i continueu creant un perfil nou.
- Trieu una manera convenient de registrar-vos i, seguint les instruccions donades, creeu el vostre propi compte.
- Empleneu la informació de la vostra pàgina.
- Ara podeu anar per la pestanya, expandiu el menú emergent. "Crea" i trieu un element "Projecte".
- A la finestra de la dreta veureu els formats de fitxers i els llenguatges de programació admesos.
- Comenceu a editar seleccionant una de les plantilles o l’etiquetatge estàndard d’HTML5.
- Totes les biblioteques i fitxers creats es mostraran a l’esquerra.
- En fer clic a l’esquerra sobre un objecte l’activa, a la finestra de la dreta es mostra el codi.
- A la part inferior hi ha botons que us permeten afegir carpetes i fitxers propis.
- Després de la creació, doneu un nom a l’objecte i deseu-ne els canvis.
- En qualsevol moment podeu anar a la configuració del projecte fent clic al botó "Configuració".
- Aquí podeu configurar la informació bàsica: el nom, la descripció, les etiquetes, així com els paràmetres de la vista prèvia i el sagnat de codi.
- Si no esteu satisfets amb la vista actual de l’espai de treball, podeu canviar-la fent clic a "Canvia la vista" i seleccioneu la finestra de visualització que desitgeu.
- Quan editeu les línies de codi necessàries, feu clic a "Desa-ho tot + executa"per desar tots els canvis i executar el programa. A continuació es mostra el resultat compilat.
- Deseu el projecte a l’ordinador fent clic a "Exporta".
- Espereu fins que es completi el processament i baixeu l’arxiu.
- Atès que l'usuari no pot tenir més d'un projecte actiu en la versió gratuïta de CodePen, caldrà suprimir-lo si necessiteu crear-ne un de nou. Per fer-ho, feu clic a "Suprimeix".
- Introduïu la paraula de verificació i confirmeu la supressió.
Per sobre, vam revisar les funcions bàsiques del servei en línia CodePen. Com podeu veure, és adequat no només per editar el codi, sinó també per escriure-ho des de zero i després compartir-lo amb altres usuaris. L’únic inconvenient del lloc són les restriccions en la versió gratuïta.
Mètode 2: LiveWeave
Ara voldria parlar del recurs web de LiveWeave. Conté no només l’editor de codi incorporat, sinó també altres eines que es tractaran a continuació. El treball amb el lloc comença així:
Aneu al lloc web de LiveWeave
- Seguiu l’enllaç anterior per arribar a la pàgina de l’editor. Aquí veuràs immediatament quatre finestres. El primer és escriure codi en HTML5, el segon és JavaScript, el tercer és CSS, i el quart mostra el resultat de la compilació.
- Una de les funcions d’aquest lloc es pot considerar com a consells quan escriviu etiquetes, us permeten augmentar la velocitat d’escriure i evitar errors ortogràfics.
- Per defecte, la compilació es realitza en mode en directe, és a dir, es processa immediatament després de fer els canvis.
- Si voleu desactivar aquesta funció, haureu de moure el control lliscant enfront de l’element desitjat.
- Propera disponible en i fora del mode nocturn.
- Podeu anar a treballar amb controladors CSS fent clic al botó corresponent del panell de l'esquerra.
- Al menú que s'obre, l’etiqueta s’edita movent els lliscadors i canviant certs valors.
- A continuació, es recomana prestar atenció al determinant dels colors.
- Us proporciona una àmplia paleta on podeu triar qualsevol ombra i el seu codi es mostrarà a la part superior, que posteriorment s'utilitzarà quan escriviu programes amb una interfície.
- Vés al menú "Editor de vectors".
- Funciona amb objectes gràfics, que a vegades també seran útils durant el desenvolupament de programari.
- Obriu el menú emergent "Eines". Aquí podeu descarregar la plantilla, desar el fitxer HTML i el generador de text.
- El projecte es descarrega com un únic fitxer.
- Si voleu estalviar feina, primer haureu de passar pel procediment de registre en aquest servei en línia.
Ara ja sabeu com editar el codi a LiveWeave. Podem recomanar amb seguretat aquest recurs a Internet, ja que hi ha moltes funcions i eines que permeten optimitzar i simplificar el procés de treball amb el codi del programa.
Això conclou el nostre article. Avui us hem proporcionat dues instruccions detallades per treballar amb el codi mitjançant serveis en línia. Esperem que aquesta informació sigui útil i hagi ajudat a determinar l’elecció del recurs web més adequat per al treball.
Vegeu també:
Escollir un entorn de programació
Programes per crear aplicacions Android
Trieu un programa per crear un joc
