Puesta a punto Brackets 14 de diciembre de 2015

ID

…PUESTA A PUNTO…

0

DUMMY AVANZADO

Por: Carlos Arce.

Puesta a punto Brackets 14 de diciembre de 2015

CONFIGURANDO EDITOR DE TEXTO BRACKETS

Desarrollado por Adobe Systems Licencia MIT.

Escrito en HTML, CSS, JavaScript con un enfoque principal en desarrollo Web.

Lanzado el 4 de Noviembre 2014, es multiplataforma

descarga en MAC, WINDOWS, LINUX.

wikipedia…

Vamos a empezar instalando Brackets a los que ya lo

tienen instalado omitir estos pasos. Nos vamos a la página oficial que les dejo en el siguiente

enlace:

Ambos son buenos editores

Puesta a punto Brackets 14 de diciembre de 2015

Una vez instalado nos vamos al gestor de extensiones

Buscar plugins:

1. Themes for Brackets

Una vez instalado Ver-Temas

Personalmente me gusta así, pero vosotros escoger el tema

que más os guste.

Extensiones

Puesta a punto Brackets 14 de diciembre de 2015

Para completar código rápidamente.

Lo primero es asignarle una extensión es decir index.html y guardar el archivo caso contrario no os va funcionar.

Solo tiene que escribir por Ejemplo div + y los crea

automáticamente con esa lógica funciona todo.

Para más información, iros a su Página oficial…

Para trabajar con las pestañas más cómodamente.

Para agregar iconos y poder diferenciarlos en nuestro entorno.

! +

2. Pestañas trabajando cómodamente

1. Emmet

3. Brackets Icons

Puesta a punto Brackets 14 de diciembre de 2015

Viene instalado en automáticamente en la última versión 1.5, pero

en los que son portables hay que instalarlo.

Sirve para ver en vivo los cambios que le hacemos a nuestro

proyecto de una forma dinámica y en vivo.

Hasta aquí ya tenemos lo necesario para trabajar con nuestro

proyecto o continuar instalando las demás extensiones.

Para que puedas crear tus propios atajos de teclado Ejemplo:

+ INTRO

4. Extract for Brackets (Preview)

5. Brackets Snippets (by edc)

Puesta a punto Brackets 14 de diciembre de 2015

Ordena el código automáticamente es una buena práctica.

Muestra todos los atajos de teclado que tiene instalado el programa.

RESULTADO

Ctrl+Alt+i

6. Indentator

7. Display Shortcuts

Puesta a punto Brackets 14 de diciembre de 2015

Hace que las líneas largas (que no caben en una sola línea) tengan el

mismo sangrado en todas las líneas.

Para saber si nuestro código es validado correctamente.

Falta <h1>

8. Indent softwrapped lines

9. w3cvalidation

Puesta a punto Brackets 14 de diciembre de 2015

Corregido el problema: Esto es una buen práctica !!!

Hasta aquí hemos llegado compañeros espero que os haya gustado

este pequeño tutorial no formal.