Scribd Logo
Cargar

¡Te damos la bienvenida a Scribd!

  • 147 vistas

    DWEC01 Tarea 01

    Cargado por

    Félix Marín
    Este documento presenta las instrucciones para instalar un editor de código y agregar la extensión Emmet. Describe Sublime Text, Brackets y Atom como opciones de editor y explica cómo usar Emmet para generar fragmentos de código HTML y CSS a partir de abreviaturas. A continuación, detalla los pasos para instalar Emmet en Sublime Text y proporciona un ejemplo de su uso.

    Copyright:

    © All Rights Reserved
    Descargue como PDF, TXT o lea en línea desde Scribd

    DWEC01 Tarea 01

    Cargado por

    Félix Marín
    147 vistas6 páginas
    Este documento presenta las instrucciones para instalar un editor de código y agregar la extensión Emmet. Describe Sublime Text, Brackets y Atom como opciones de editor y explica cómo usar Emmet para generar fragmentos de código HTML y CSS a partir de abreviaturas. A continuación, detalla los pasos para instalar Emmet en Sublime Text y proporciona un ejemplo de su uso.

    Descripción original:

    Realizar la instalación de uno de los siguientes editores: Sublime Text, Brackets, o Atom.

    Título original

    DWEC01_Tarea_01

    Derechos de autor

    © © All Rights Reserved

    Formatos disponibles

    PDF, TXT o lea en línea desde Scribd

    ¿Le pareció útil este documento?

    ¿Este contenido es inapropiado?

    Este documento presenta las instrucciones para instalar un editor de código y agregar la extensión Emmet. Describe Sublime Text, Brackets y Atom como opciones de editor y explica cómo usar Emmet para generar fragmentos de código HTML y CSS a partir de abreviaturas. A continuación, detalla los pasos para instalar Emmet en Sublime Text y proporciona un ejemplo de su uso.

    Copyright:

    © All Rights Reserved
    Descargue como PDF, TXT o lea en línea desde Scribd
    Descargar como pdf o txt
    147 vistas6 páginas

    DWEC01 Tarea 01

    Cargado por

    Félix Marín
    Este documento presenta las instrucciones para instalar un editor de código y agregar la extensión Emmet. Describe Sublime Text, Brackets y Atom como opciones de editor y explica cómo usar Emmet para generar fragmentos de código HTML y CSS a partir de abreviaturas. A continuación, detalla los pasos para instalar Emmet en Sublime Text y proporciona un ejemplo de su uso.

    Copyright:

    © All Rights Reserved
    Descargue como PDF, TXT o lea en línea desde Scribd
    Descargar como pdf o txt
    de 6

    2º DAW Desarrollo web en entorno Félix Marín Ramírez

    cliente

    Tarea DWEC01

    1. Realizar la instalación de uno de los siguientes editores: Sublime Text, Brackets,


    o Atom.

    Sublime Text

    Es un editor de código basado en C++ y Python, que dispone de una versión gratuita de evaluación,
    pero tiene un coste de 20 dólares por licencia. Es multiplataforma, aunque no es de código abierto, y
    tampoco es, como vemos, gratuito completamente.

    Brackets

    Es un editor de código basado en HTML, CSS y JavaScript, desarrollado por la firma Adobe Systems,
    y que es de código abierto. Es completamente gratuito y multiplataforma, siendo soportado por
    Windows, Linux, y Mac OS.

    Atom

    Es un editor de código basado en Node.js, multiplataforma y gratuito. Ha sido desarrollado por el


    equipo de Github, el famoso portal que funciona como repositorio abierto de código.

    Fuente

    Después de comprobar las características de cada uno de los editores y aunque la diferencia entre
    las tres aplicaciones son mínimas, me decanto por Sublime Text, ya que es más ligero y más utilizado
    que los demás.

    2. Una vez realizada la instalación añádele la extensión emmet. Investiga como


    funciona esta extensión y pon un ejemplo de uso de la misma.

    Emmet es un juego de herramientas para desarrolladores web para impulsar la escritura de códigos
    HTML y CSS.

    Con Emmet, puede escribir expresiones (abreviaturas) similares a los selectores CSS y convertirlas en
    fragmentos de código con una sola pulsación de tecla.

    Ejemplo:
    ul#nav>li.item$*4>a{Item $}
    ...se puede ampliar a:
    <ul id="nav"> <li class="item1"><a href="">Item 1</a></li> <li
    class="item2"><a href="">Item 2</a></li> <li class="item3"><a href="">Item
    3</a></li> <li class="item4"><a href="">Item 4</a></li></ul>
    Fuente
    2º DAW Desarrollo web en entorno Félix Marín Ramírez
    cliente

    Instalación de la extensión:

    Una vez instalado el editor (en este caso Sublime Text) seleccionar en la barra de herramientas el
    menú “Preferences “> “Package Control”.

    En el menú contextual seleccionar la opción “Instalar Paquete”.


    2º DAW Desarrollo web en entorno Félix Marín Ramírez
    cliente

    A continuación, en la barra de búsqueda insertar “emmet”

    Seleccionar la primera opción del cuadro de diálogo. Con eso ya tenemos la extensión en el editor.
    2º DAW Desarrollo web en entorno Félix Marín Ramírez
    cliente

    3. Utilizando el editor instalado inserta código javascript dentro de un documento


    html, el código que vamos a insertar es "window.alert('Hola soy TU NOMBRE')".

    Al introducir la abreviación “html:5” automáticamente aparece la estructura básica de un


    documento HTML5. Se añade la etiqueta “script” para introducir el alert.

    Dentro del tag “script” es donde se añade el código javascript.


    2º DAW Desarrollo web en entorno Félix Marín Ramírez
    cliente

    4. Utilizando el editor instalado inserta código javascript en un documento


    externo al documento html, el código que vamos a insertar es
    "window.alert('Hola soy TU NOMBRE desde un archivo externo')".

    Se añade un tag “script” con atributo “src” para indicar la ruta del fichero externo.

    En el fichero externo (con extensión .js) se añade la línea de código con la que aparece el alert.
    2º DAW Desarrollo web en entorno Félix Marín Ramírez
    cliente

    Se ejecuta elfichero .html en el navegador para comprobar el resultado.

    Aparece una ventana mostrando el texto del alert.

    También podría gustarte