{"id":345,"date":"2022-10-04T12:18:09","date_gmt":"2022-10-04T10:18:09","guid":{"rendered":"http:\/\/quadern-programacio.recursos.uoc.edu\/?page_id=345"},"modified":"2022-10-04T12:20:08","modified_gmt":"2022-10-04T10:20:08","slug":"2-2-codelab","status":"publish","type":"page","link":"http:\/\/quadern-programacio.recursos.uoc.edu\/es\/2-2-codelab\/","title":{"rendered":"2.2. CodeLab"},"content":{"rendered":"<p>CodeLab es una herramienta desarrollada por la UOC cuyo objetivo es servir como un laboratorio para aprender a programar. CodeLab integra en el propio campus virtual un entorno de programaci\u00f3n web que permite crear y ejecutar programas en distintos lenguajes, entre otros Javascript y, por extensi\u00f3n, P5.js. Esto significa que no necesitamos descargar ni configurar ning\u00fan tipo de software para empezar a programar, sino que basta con que accedamos a la herramienta desde el aula para que podamos crear y ejecutar nuestros programas.<\/p>\n<figure id=\"attachment_60\" aria-describedby=\"caption-attachment-60\" style=\"width: 800px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" class=\"size-full wp-image-60\" src=\"\/wp-content\/uploads\/2022\/10\/PID_00290094_013.jpg\" alt=\"\" width=\"800\" height=\"512\" srcset=\"\/wp-content\/uploads\/2022\/10\/PID_00290094_013.jpg 800w, \/wp-content\/uploads\/2022\/10\/PID_00290094_013-300x192.jpg 300w, \/wp-content\/uploads\/2022\/10\/PID_00290094_013-768x492.jpg 768w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/><figcaption id=\"caption-attachment-60\" class=\"wp-caption-text\">Figura 13. P\u00e1gina de inicio de CodeLab<\/figcaption><\/figure>\n<p>Una vez dentro de la web de CodeLab, se puede acceder a los ejercicios de cada reto haciendo clic en el t\u00edtulo de cada uno de estos, lo que desplegar\u00e1 la lista de ejercicios planteados para cada una de las PEC. Dentro de cada ejercicio encontraremos su enunciado, los pasos que se deber\u00e1n seguir y el entorno de trabajo donde escribiremos y ejecutaremos nuestro c\u00f3digo, que est\u00e1 dividido en distintas zonas:<\/p>\n<figure id=\"attachment_62\" aria-describedby=\"caption-attachment-62\" style=\"width: 800px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" class=\"size-full wp-image-62\" src=\"\/wp-content\/uploads\/2022\/10\/PID_00290094_014.jpg\" alt=\"\" width=\"800\" height=\"571\" srcset=\"\/wp-content\/uploads\/2022\/10\/PID_00290094_014.jpg 800w, \/wp-content\/uploads\/2022\/10\/PID_00290094_014-300x214.jpg 300w, \/wp-content\/uploads\/2022\/10\/PID_00290094_014-768x548.jpg 768w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/><figcaption id=\"caption-attachment-62\" class=\"wp-caption-text\">Figura 14. Entorno de trabajo de CodeLab<\/figcaption><\/figure>\n<ol>\n<li><strong>Editor de c\u00f3digo<\/strong>: aqu\u00ed escribiremos nuestro programa.<\/li>\n<li><strong>Visor<\/strong>: aqu\u00ed veremos los resultados de nuestro programa.<\/li>\n<li><strong>Botones de ejecuci\u00f3n y stop<\/strong>: para iniciar o parar la ejecuci\u00f3n del programa.<\/li>\n<li><strong>Barra de men\u00fa<\/strong>: aqu\u00ed podemos encontrar las siguientes funciones:<\/li>\n<\/ol>\n<ul>\n<li><strong>Guardar<\/strong>: guarda el c\u00f3digo y el trabajo realizado.<\/li>\n<li><strong>A\u00f1adir archivos<\/strong>: permite subir archivos (im\u00e1genes, tipograf\u00edas, etc.) a la mediateca de CodeLab para usarlos en nuestros programas.<\/li>\n<li><strong>Restaurar c\u00f3digo original<\/strong>: para regresar al estado inicial del ejercicio.<\/li>\n<li><strong>Pantalla completa<\/strong>: permite visualizar el entorno de trabajo de CodeLab en pantalla completa, para trabajar de manera m\u00e1s c\u00f3moda.<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>CodeLab es una herramienta desarrollada por la UOC cuyo objetivo es servir como un laboratorio para aprender a programar. CodeLab integra en el propio campus virtual un entorno de programaci\u00f3n web que permite crear y ejecutar programas en distintos lenguajes, entre otros Javascript y, por extensi\u00f3n, P5.js. Esto significa que no necesitamos descargar ni configurar [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"acf":[],"_links":{"self":[{"href":"http:\/\/quadern-programacio.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/pages\/345"}],"collection":[{"href":"http:\/\/quadern-programacio.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/quadern-programacio.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/quadern-programacio.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"http:\/\/quadern-programacio.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/comments?post=345"}],"version-history":[{"count":2,"href":"http:\/\/quadern-programacio.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/pages\/345\/revisions"}],"predecessor-version":[{"id":347,"href":"http:\/\/quadern-programacio.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/pages\/345\/revisions\/347"}],"wp:attachment":[{"href":"http:\/\/quadern-programacio.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/media?parent=345"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}