de instalación y configuración de Sublime Text 3

14
Tutorial completo Sublime Text 3 de instalación y configuración de

Transcript of de instalación y configuración de Sublime Text 3

Page 1: de instalación y configuración de Sublime Text 3

Tutorial completo

Sublime Text 3de instalacioacuten y configuracioacuten de

1

2

5

3

6

7

Introduccioacuten-Paacutegina 3

iquestQueacute es Sublime Text 3 -Paacutegina 5

Caracteriacutesticas-Paacutegina 7

Instalacioacuten-Paacutegina 9

Utilidades y atajos -Paacutegina 11

Plugins-Paacutegina 13

Iacutendice decontenidos

1 Introduccioacuten

Paacutegina 3

En este tutorial hablaremos de uno de los editores maacutes completos y utilizados del mercado ahora mismo por los que se dedican al desarrollo sobre todo al desarrollo web Hablamos de Sublime Text 3Repararemos en sus caracteriacutesticas veremos como instalarlo en diferentes entornos de trabajo asiacute como sus muacuteltiples posibilidades para trabajar con eacutel en distintos aacutembitos Tambieacuten repasamos unos comandos baacutesicos que nos ayudaraacuten a trabajar de forma maacutes aacutegil con este magniacutefico editor de texto

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

2 iquestQueacute es Sublime Text 3

Estaacute preparado para editar archivos de infinidad de lenguajes desde Go a Java pasando por Python C etchellip Aunque es comuacutenmente utilizado para desarrollo web es decir para la edicioacuten de ficheros HTML CSS y Javascript

Paacutegina 5

Sublime Text 3 es un editor de texto multiplataforma escrito en C++ y basado en el claacutesico Vim Aunque es gratuito y totalmente funcional no se trata de un software de coacutedigo abierto sino que te proporciona una licencia perpetua para usarlo sin fin

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

Paacutegina 7

3 Caracteriacutesticas

Las principales caracteriacutesticas que convierten en tan interesante a este editor de texto son las siguientes

bull Soporta nativamente una gran cantidad de lenguajes(hasta 43) asiacute como el texto plano

bull Posee una funcionalidad de buacutesqueda dinaacutemica con laque se pueden llevar a cabo buacutesquedas por expresionesregulares dentro de los archivos y proyectos

bull Tiene autocompletado de palabras y expresiones asiacutecomo marcado de llaves lo que permite abrir bloquesde una manera muy aacutegil y sencilla

bull Instalacioacuten de plugins para ampliar su funcionalidad

bull Soporte de pestantildeas Se pueden abrir tantosdocumentos como se necesite en varias pestantildeas

bull Minimapa que permite previsualizar de forma generalel coacutedigo escrito

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

4 Instalacioacuten

En este punto vamos a mostrar que tenemos que hacer para instalar Sublime Text 3 en nuestro ordenador de forma sencilla

Solo tenemos que irnos a la paacutegina oficial del programa httpwwwsublimetextcom

En el menuacute de la parte superior tenemos la opcioacuten Download Pinchamos ahiacute

Una vez en la pagina de descargar solo tenemos que elegir la opcioacuten que queramos Windows o Mac

En ambos casos se descargargaraacute un archivo ejecutable que tendremos que abrir y llevar a cabo la instalacioacuten

En el caso de Linux la instalacioacuten hay que llevarla a cabo por consola La opcioacuten maacutes comuacuten es usando apt En ese caso solo tendremos que ejecutar los siguientes comandos

wget -qO - httpsdownloadsublimetextcomsublimehq-pubgpg | sudo apt-key add

sudo apt-get install apt-transport-https

echo ldquodeb httpsdownloadsublimetextcom aptstablerdquo | sudo tee

etcaptsourceslistdsublime-textlistsudo apt-get update

sudo apt-get install sublime-text

Una vez instalado abrimos un terminal y ejecutamos el siguiente comando

subl --version

Si estaacute instalado correctamente deberiacutea salirnos algo parecido a lo siguiente

subl --versionSublime Text Build 3476

Paacutegina 9

Sublime

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

5 Utilidades y atajos

Una de las principales cualidades de Sublime Text 3 es que te permite trabajar de una manera muy coacutemoda con los llamados workspaces o entornos de trabajo Cuando estamos trabajando en un proyecto nos gusta tener todo accesible faacutecil y raacutepidamente y eso no compatible con tener que estar yendo al sistema de archivos cada vez que queremos abrir uno diferente Por eso Sublime te permite abrir carpetasen este caso donde tengas el proyecto para trabajar con ello

Para ello simplemente hay que irse al menuacute superior en la parte izquierda ala apartado File (o Archivo) y seleccionar la opcioacuten Open Folderhellip (o Abrir Carpeta) Una vez seleccionemos la carpeta de nuestro proyecto tendremos las subcarpetas y archivos accesibles en forma de aacuterbol en la parte izquierda de la pantalla facilitandonos el trabajo

Otra cosa que nos hace la vida maacutes faacutecil a la hora de trabajar con una herramienta son sus atajos de teclado Estos son los maacutes interesantes que Sublime proporciona(Para Mac Ctrl = )

Pestantildeas y ventanasCambio entre pestantildeas Ctrl + 123hellip o Ctrl + TabNueva pestantildea Ctrl + NNueva ventana Ctrl + Shift + N

ProyectosAbrir archivo Ctrl + PPaleta de comandos Ctrl + Shift + PVer u ocultar barra lateral Ctrl + KBSalto de liacuteneas Ctrl + Shift + EnterDividir el coacutedigo en pestantildeas diferentes Alt + Shift + 123hellipSeleccioacutenSeleccionar palabras Ctrl + DSeleccionar liacutenea Ctrl + LSeleccionar todo Ctrl + ASeleccionar contenido dentro de dos llaves Ctrl + Shift + MSeleccioacuten muacuteltiple para tener varios punteros en variossitios a la vez Ctrl + click

BuacutesquedasBuacutesqueda simple Ctrl + FBuacutesqueda avanzada Ctrl + Shift + FBuacutesqueda de funciones en nuestro coacutedigo Ctrl + Shift + R

Manipulacioacuten de textoTexto en mayuacutesculas Ctrl + KUTexto en minuacutesculas Ctrl + KLReemplazar texto Ctrl + Shift + F

IndentacioacutenIndentacioacuten muacuteltiple TabIndentacioacuten muacuteltiple con retroceso Ctrl + Tab

Paacutegina 11

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

6 Plugins

Para acabar con esta guiacutea hablaremos de las posibilidades que existen para ampliar la funcionalidad de Sublime Text a traveacutes de plugins Los plugin nos ayudan a antildeadir funciones extra para poder cubrir nuestras necesidades

Para poder hacerlo primero debemos instalar Package Control Para ello debemos seguir los siguientes pasos

1 Vamos a la pagina oficial (httpspackagecontrolioinstallation) seleccionamos nuestra versioacuten de Sublime(en este caso la 3) y copiamos el coacutedigo

2 Abrimos Sublime pulsamos en ViewgtShow console

3 Pegamos el coacutedigo Una vez hecho esto comenzaraacute lainstalacioacuten

Una vez instalado el package control podremos instalar plugins siguiendo los siguientes pasos

1 Hacemos click en PreferencesgtPackage Controlo pulsar Control + Shift + P

2 Escribimos install y seleccionamos la opcioacuten installpackage

3 En el recuadro escribimos el nombre del plugin ainstalar y a los pocos segundo estaraacute listo

4 Reiniciamos Sublime Text para que los cambiosfuncionen correctamente

Ahora para finalizar enumeraremos unos cuantos plugins que son bastante uacutetiles para desarrolladores

bull Sidebar Enhancements Ampliacutea las opciones de gestioacutende archivos de la barra lateral

bull Color Highlighter Permite ver los colores que elijamosen las etiquetas CSS

bull Bracket Highlighter Resalta las etiquetas de apertura ycierre para mejorar la lectura de coacutedigo

bull SFTP Actualiza los archivos en el servidor simplementecon guardar el archivo

bull LiveReload Actualiza los cambios del archivo en elnavegador al guardarlo

bull DocBlockr Permite insertar faacutecilmente comentariospara documentacioacuten con soporte para Php Java etc

bull jQuery Nos da sugerencias de meacutetodos al escribircoacutedigo jQuery

bull SublimeCodeIntel Autocompleta el coacutedigo y reconocelas funciones de nuestro proyecto

bull Alignment Alinea y organiza todas las variablesseleccionando y presionando Ctrl + Alt + a

Paacutegina 13

iexclSi te ha resultado uacutetilcomparte en redes sociales

Maacutes en openwebinarsnet

iquestQuieres convertirte enFrontend Developer Profesional

Aprende ahora con los mejores expertos

CARRERAFRONTEND DEVELOPER WEB

COMENZAR CARRERA AHORA

Page 2: de instalación y configuración de Sublime Text 3

1

2

5

3

6

7

Introduccioacuten-Paacutegina 3

iquestQueacute es Sublime Text 3 -Paacutegina 5

Caracteriacutesticas-Paacutegina 7

Instalacioacuten-Paacutegina 9

Utilidades y atajos -Paacutegina 11

Plugins-Paacutegina 13

Iacutendice decontenidos

1 Introduccioacuten

Paacutegina 3

En este tutorial hablaremos de uno de los editores maacutes completos y utilizados del mercado ahora mismo por los que se dedican al desarrollo sobre todo al desarrollo web Hablamos de Sublime Text 3Repararemos en sus caracteriacutesticas veremos como instalarlo en diferentes entornos de trabajo asiacute como sus muacuteltiples posibilidades para trabajar con eacutel en distintos aacutembitos Tambieacuten repasamos unos comandos baacutesicos que nos ayudaraacuten a trabajar de forma maacutes aacutegil con este magniacutefico editor de texto

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

2 iquestQueacute es Sublime Text 3

Estaacute preparado para editar archivos de infinidad de lenguajes desde Go a Java pasando por Python C etchellip Aunque es comuacutenmente utilizado para desarrollo web es decir para la edicioacuten de ficheros HTML CSS y Javascript

Paacutegina 5

Sublime Text 3 es un editor de texto multiplataforma escrito en C++ y basado en el claacutesico Vim Aunque es gratuito y totalmente funcional no se trata de un software de coacutedigo abierto sino que te proporciona una licencia perpetua para usarlo sin fin

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

Paacutegina 7

3 Caracteriacutesticas

Las principales caracteriacutesticas que convierten en tan interesante a este editor de texto son las siguientes

bull Soporta nativamente una gran cantidad de lenguajes(hasta 43) asiacute como el texto plano

bull Posee una funcionalidad de buacutesqueda dinaacutemica con laque se pueden llevar a cabo buacutesquedas por expresionesregulares dentro de los archivos y proyectos

bull Tiene autocompletado de palabras y expresiones asiacutecomo marcado de llaves lo que permite abrir bloquesde una manera muy aacutegil y sencilla

bull Instalacioacuten de plugins para ampliar su funcionalidad

bull Soporte de pestantildeas Se pueden abrir tantosdocumentos como se necesite en varias pestantildeas

bull Minimapa que permite previsualizar de forma generalel coacutedigo escrito

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

4 Instalacioacuten

En este punto vamos a mostrar que tenemos que hacer para instalar Sublime Text 3 en nuestro ordenador de forma sencilla

Solo tenemos que irnos a la paacutegina oficial del programa httpwwwsublimetextcom

En el menuacute de la parte superior tenemos la opcioacuten Download Pinchamos ahiacute

Una vez en la pagina de descargar solo tenemos que elegir la opcioacuten que queramos Windows o Mac

En ambos casos se descargargaraacute un archivo ejecutable que tendremos que abrir y llevar a cabo la instalacioacuten

En el caso de Linux la instalacioacuten hay que llevarla a cabo por consola La opcioacuten maacutes comuacuten es usando apt En ese caso solo tendremos que ejecutar los siguientes comandos

wget -qO - httpsdownloadsublimetextcomsublimehq-pubgpg | sudo apt-key add

sudo apt-get install apt-transport-https

echo ldquodeb httpsdownloadsublimetextcom aptstablerdquo | sudo tee

etcaptsourceslistdsublime-textlistsudo apt-get update

sudo apt-get install sublime-text

Una vez instalado abrimos un terminal y ejecutamos el siguiente comando

subl --version

Si estaacute instalado correctamente deberiacutea salirnos algo parecido a lo siguiente

subl --versionSublime Text Build 3476

Paacutegina 9

Sublime

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

5 Utilidades y atajos

Una de las principales cualidades de Sublime Text 3 es que te permite trabajar de una manera muy coacutemoda con los llamados workspaces o entornos de trabajo Cuando estamos trabajando en un proyecto nos gusta tener todo accesible faacutecil y raacutepidamente y eso no compatible con tener que estar yendo al sistema de archivos cada vez que queremos abrir uno diferente Por eso Sublime te permite abrir carpetasen este caso donde tengas el proyecto para trabajar con ello

Para ello simplemente hay que irse al menuacute superior en la parte izquierda ala apartado File (o Archivo) y seleccionar la opcioacuten Open Folderhellip (o Abrir Carpeta) Una vez seleccionemos la carpeta de nuestro proyecto tendremos las subcarpetas y archivos accesibles en forma de aacuterbol en la parte izquierda de la pantalla facilitandonos el trabajo

Otra cosa que nos hace la vida maacutes faacutecil a la hora de trabajar con una herramienta son sus atajos de teclado Estos son los maacutes interesantes que Sublime proporciona(Para Mac Ctrl = )

Pestantildeas y ventanasCambio entre pestantildeas Ctrl + 123hellip o Ctrl + TabNueva pestantildea Ctrl + NNueva ventana Ctrl + Shift + N

ProyectosAbrir archivo Ctrl + PPaleta de comandos Ctrl + Shift + PVer u ocultar barra lateral Ctrl + KBSalto de liacuteneas Ctrl + Shift + EnterDividir el coacutedigo en pestantildeas diferentes Alt + Shift + 123hellipSeleccioacutenSeleccionar palabras Ctrl + DSeleccionar liacutenea Ctrl + LSeleccionar todo Ctrl + ASeleccionar contenido dentro de dos llaves Ctrl + Shift + MSeleccioacuten muacuteltiple para tener varios punteros en variossitios a la vez Ctrl + click

BuacutesquedasBuacutesqueda simple Ctrl + FBuacutesqueda avanzada Ctrl + Shift + FBuacutesqueda de funciones en nuestro coacutedigo Ctrl + Shift + R

Manipulacioacuten de textoTexto en mayuacutesculas Ctrl + KUTexto en minuacutesculas Ctrl + KLReemplazar texto Ctrl + Shift + F

IndentacioacutenIndentacioacuten muacuteltiple TabIndentacioacuten muacuteltiple con retroceso Ctrl + Tab

Paacutegina 11

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

6 Plugins

Para acabar con esta guiacutea hablaremos de las posibilidades que existen para ampliar la funcionalidad de Sublime Text a traveacutes de plugins Los plugin nos ayudan a antildeadir funciones extra para poder cubrir nuestras necesidades

Para poder hacerlo primero debemos instalar Package Control Para ello debemos seguir los siguientes pasos

1 Vamos a la pagina oficial (httpspackagecontrolioinstallation) seleccionamos nuestra versioacuten de Sublime(en este caso la 3) y copiamos el coacutedigo

2 Abrimos Sublime pulsamos en ViewgtShow console

3 Pegamos el coacutedigo Una vez hecho esto comenzaraacute lainstalacioacuten

Una vez instalado el package control podremos instalar plugins siguiendo los siguientes pasos

1 Hacemos click en PreferencesgtPackage Controlo pulsar Control + Shift + P

2 Escribimos install y seleccionamos la opcioacuten installpackage

3 En el recuadro escribimos el nombre del plugin ainstalar y a los pocos segundo estaraacute listo

4 Reiniciamos Sublime Text para que los cambiosfuncionen correctamente

Ahora para finalizar enumeraremos unos cuantos plugins que son bastante uacutetiles para desarrolladores

bull Sidebar Enhancements Ampliacutea las opciones de gestioacutende archivos de la barra lateral

bull Color Highlighter Permite ver los colores que elijamosen las etiquetas CSS

bull Bracket Highlighter Resalta las etiquetas de apertura ycierre para mejorar la lectura de coacutedigo

bull SFTP Actualiza los archivos en el servidor simplementecon guardar el archivo

bull LiveReload Actualiza los cambios del archivo en elnavegador al guardarlo

bull DocBlockr Permite insertar faacutecilmente comentariospara documentacioacuten con soporte para Php Java etc

bull jQuery Nos da sugerencias de meacutetodos al escribircoacutedigo jQuery

bull SublimeCodeIntel Autocompleta el coacutedigo y reconocelas funciones de nuestro proyecto

bull Alignment Alinea y organiza todas las variablesseleccionando y presionando Ctrl + Alt + a

Paacutegina 13

iexclSi te ha resultado uacutetilcomparte en redes sociales

Maacutes en openwebinarsnet

iquestQuieres convertirte enFrontend Developer Profesional

Aprende ahora con los mejores expertos

CARRERAFRONTEND DEVELOPER WEB

COMENZAR CARRERA AHORA

Page 3: de instalación y configuración de Sublime Text 3

1 Introduccioacuten

Paacutegina 3

En este tutorial hablaremos de uno de los editores maacutes completos y utilizados del mercado ahora mismo por los que se dedican al desarrollo sobre todo al desarrollo web Hablamos de Sublime Text 3Repararemos en sus caracteriacutesticas veremos como instalarlo en diferentes entornos de trabajo asiacute como sus muacuteltiples posibilidades para trabajar con eacutel en distintos aacutembitos Tambieacuten repasamos unos comandos baacutesicos que nos ayudaraacuten a trabajar de forma maacutes aacutegil con este magniacutefico editor de texto

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

2 iquestQueacute es Sublime Text 3

Estaacute preparado para editar archivos de infinidad de lenguajes desde Go a Java pasando por Python C etchellip Aunque es comuacutenmente utilizado para desarrollo web es decir para la edicioacuten de ficheros HTML CSS y Javascript

Paacutegina 5

Sublime Text 3 es un editor de texto multiplataforma escrito en C++ y basado en el claacutesico Vim Aunque es gratuito y totalmente funcional no se trata de un software de coacutedigo abierto sino que te proporciona una licencia perpetua para usarlo sin fin

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

Paacutegina 7

3 Caracteriacutesticas

Las principales caracteriacutesticas que convierten en tan interesante a este editor de texto son las siguientes

bull Soporta nativamente una gran cantidad de lenguajes(hasta 43) asiacute como el texto plano

bull Posee una funcionalidad de buacutesqueda dinaacutemica con laque se pueden llevar a cabo buacutesquedas por expresionesregulares dentro de los archivos y proyectos

bull Tiene autocompletado de palabras y expresiones asiacutecomo marcado de llaves lo que permite abrir bloquesde una manera muy aacutegil y sencilla

bull Instalacioacuten de plugins para ampliar su funcionalidad

bull Soporte de pestantildeas Se pueden abrir tantosdocumentos como se necesite en varias pestantildeas

bull Minimapa que permite previsualizar de forma generalel coacutedigo escrito

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

4 Instalacioacuten

En este punto vamos a mostrar que tenemos que hacer para instalar Sublime Text 3 en nuestro ordenador de forma sencilla

Solo tenemos que irnos a la paacutegina oficial del programa httpwwwsublimetextcom

En el menuacute de la parte superior tenemos la opcioacuten Download Pinchamos ahiacute

Una vez en la pagina de descargar solo tenemos que elegir la opcioacuten que queramos Windows o Mac

En ambos casos se descargargaraacute un archivo ejecutable que tendremos que abrir y llevar a cabo la instalacioacuten

En el caso de Linux la instalacioacuten hay que llevarla a cabo por consola La opcioacuten maacutes comuacuten es usando apt En ese caso solo tendremos que ejecutar los siguientes comandos

wget -qO - httpsdownloadsublimetextcomsublimehq-pubgpg | sudo apt-key add

sudo apt-get install apt-transport-https

echo ldquodeb httpsdownloadsublimetextcom aptstablerdquo | sudo tee

etcaptsourceslistdsublime-textlistsudo apt-get update

sudo apt-get install sublime-text

Una vez instalado abrimos un terminal y ejecutamos el siguiente comando

subl --version

Si estaacute instalado correctamente deberiacutea salirnos algo parecido a lo siguiente

subl --versionSublime Text Build 3476

Paacutegina 9

Sublime

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

5 Utilidades y atajos

Una de las principales cualidades de Sublime Text 3 es que te permite trabajar de una manera muy coacutemoda con los llamados workspaces o entornos de trabajo Cuando estamos trabajando en un proyecto nos gusta tener todo accesible faacutecil y raacutepidamente y eso no compatible con tener que estar yendo al sistema de archivos cada vez que queremos abrir uno diferente Por eso Sublime te permite abrir carpetasen este caso donde tengas el proyecto para trabajar con ello

Para ello simplemente hay que irse al menuacute superior en la parte izquierda ala apartado File (o Archivo) y seleccionar la opcioacuten Open Folderhellip (o Abrir Carpeta) Una vez seleccionemos la carpeta de nuestro proyecto tendremos las subcarpetas y archivos accesibles en forma de aacuterbol en la parte izquierda de la pantalla facilitandonos el trabajo

Otra cosa que nos hace la vida maacutes faacutecil a la hora de trabajar con una herramienta son sus atajos de teclado Estos son los maacutes interesantes que Sublime proporciona(Para Mac Ctrl = )

Pestantildeas y ventanasCambio entre pestantildeas Ctrl + 123hellip o Ctrl + TabNueva pestantildea Ctrl + NNueva ventana Ctrl + Shift + N

ProyectosAbrir archivo Ctrl + PPaleta de comandos Ctrl + Shift + PVer u ocultar barra lateral Ctrl + KBSalto de liacuteneas Ctrl + Shift + EnterDividir el coacutedigo en pestantildeas diferentes Alt + Shift + 123hellipSeleccioacutenSeleccionar palabras Ctrl + DSeleccionar liacutenea Ctrl + LSeleccionar todo Ctrl + ASeleccionar contenido dentro de dos llaves Ctrl + Shift + MSeleccioacuten muacuteltiple para tener varios punteros en variossitios a la vez Ctrl + click

BuacutesquedasBuacutesqueda simple Ctrl + FBuacutesqueda avanzada Ctrl + Shift + FBuacutesqueda de funciones en nuestro coacutedigo Ctrl + Shift + R

Manipulacioacuten de textoTexto en mayuacutesculas Ctrl + KUTexto en minuacutesculas Ctrl + KLReemplazar texto Ctrl + Shift + F

IndentacioacutenIndentacioacuten muacuteltiple TabIndentacioacuten muacuteltiple con retroceso Ctrl + Tab

Paacutegina 11

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

6 Plugins

Para acabar con esta guiacutea hablaremos de las posibilidades que existen para ampliar la funcionalidad de Sublime Text a traveacutes de plugins Los plugin nos ayudan a antildeadir funciones extra para poder cubrir nuestras necesidades

Para poder hacerlo primero debemos instalar Package Control Para ello debemos seguir los siguientes pasos

1 Vamos a la pagina oficial (httpspackagecontrolioinstallation) seleccionamos nuestra versioacuten de Sublime(en este caso la 3) y copiamos el coacutedigo

2 Abrimos Sublime pulsamos en ViewgtShow console

3 Pegamos el coacutedigo Una vez hecho esto comenzaraacute lainstalacioacuten

Una vez instalado el package control podremos instalar plugins siguiendo los siguientes pasos

1 Hacemos click en PreferencesgtPackage Controlo pulsar Control + Shift + P

2 Escribimos install y seleccionamos la opcioacuten installpackage

3 En el recuadro escribimos el nombre del plugin ainstalar y a los pocos segundo estaraacute listo

4 Reiniciamos Sublime Text para que los cambiosfuncionen correctamente

Ahora para finalizar enumeraremos unos cuantos plugins que son bastante uacutetiles para desarrolladores

bull Sidebar Enhancements Ampliacutea las opciones de gestioacutende archivos de la barra lateral

bull Color Highlighter Permite ver los colores que elijamosen las etiquetas CSS

bull Bracket Highlighter Resalta las etiquetas de apertura ycierre para mejorar la lectura de coacutedigo

bull SFTP Actualiza los archivos en el servidor simplementecon guardar el archivo

bull LiveReload Actualiza los cambios del archivo en elnavegador al guardarlo

bull DocBlockr Permite insertar faacutecilmente comentariospara documentacioacuten con soporte para Php Java etc

bull jQuery Nos da sugerencias de meacutetodos al escribircoacutedigo jQuery

bull SublimeCodeIntel Autocompleta el coacutedigo y reconocelas funciones de nuestro proyecto

bull Alignment Alinea y organiza todas las variablesseleccionando y presionando Ctrl + Alt + a

Paacutegina 13

iexclSi te ha resultado uacutetilcomparte en redes sociales

Maacutes en openwebinarsnet

iquestQuieres convertirte enFrontend Developer Profesional

Aprende ahora con los mejores expertos

CARRERAFRONTEND DEVELOPER WEB

COMENZAR CARRERA AHORA

Page 4: de instalación y configuración de Sublime Text 3

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

2 iquestQueacute es Sublime Text 3

Estaacute preparado para editar archivos de infinidad de lenguajes desde Go a Java pasando por Python C etchellip Aunque es comuacutenmente utilizado para desarrollo web es decir para la edicioacuten de ficheros HTML CSS y Javascript

Paacutegina 5

Sublime Text 3 es un editor de texto multiplataforma escrito en C++ y basado en el claacutesico Vim Aunque es gratuito y totalmente funcional no se trata de un software de coacutedigo abierto sino que te proporciona una licencia perpetua para usarlo sin fin

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

Paacutegina 7

3 Caracteriacutesticas

Las principales caracteriacutesticas que convierten en tan interesante a este editor de texto son las siguientes

bull Soporta nativamente una gran cantidad de lenguajes(hasta 43) asiacute como el texto plano

bull Posee una funcionalidad de buacutesqueda dinaacutemica con laque se pueden llevar a cabo buacutesquedas por expresionesregulares dentro de los archivos y proyectos

bull Tiene autocompletado de palabras y expresiones asiacutecomo marcado de llaves lo que permite abrir bloquesde una manera muy aacutegil y sencilla

bull Instalacioacuten de plugins para ampliar su funcionalidad

bull Soporte de pestantildeas Se pueden abrir tantosdocumentos como se necesite en varias pestantildeas

bull Minimapa que permite previsualizar de forma generalel coacutedigo escrito

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

4 Instalacioacuten

En este punto vamos a mostrar que tenemos que hacer para instalar Sublime Text 3 en nuestro ordenador de forma sencilla

Solo tenemos que irnos a la paacutegina oficial del programa httpwwwsublimetextcom

En el menuacute de la parte superior tenemos la opcioacuten Download Pinchamos ahiacute

Una vez en la pagina de descargar solo tenemos que elegir la opcioacuten que queramos Windows o Mac

En ambos casos se descargargaraacute un archivo ejecutable que tendremos que abrir y llevar a cabo la instalacioacuten

En el caso de Linux la instalacioacuten hay que llevarla a cabo por consola La opcioacuten maacutes comuacuten es usando apt En ese caso solo tendremos que ejecutar los siguientes comandos

wget -qO - httpsdownloadsublimetextcomsublimehq-pubgpg | sudo apt-key add

sudo apt-get install apt-transport-https

echo ldquodeb httpsdownloadsublimetextcom aptstablerdquo | sudo tee

etcaptsourceslistdsublime-textlistsudo apt-get update

sudo apt-get install sublime-text

Una vez instalado abrimos un terminal y ejecutamos el siguiente comando

subl --version

Si estaacute instalado correctamente deberiacutea salirnos algo parecido a lo siguiente

subl --versionSublime Text Build 3476

Paacutegina 9

Sublime

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

5 Utilidades y atajos

Una de las principales cualidades de Sublime Text 3 es que te permite trabajar de una manera muy coacutemoda con los llamados workspaces o entornos de trabajo Cuando estamos trabajando en un proyecto nos gusta tener todo accesible faacutecil y raacutepidamente y eso no compatible con tener que estar yendo al sistema de archivos cada vez que queremos abrir uno diferente Por eso Sublime te permite abrir carpetasen este caso donde tengas el proyecto para trabajar con ello

Para ello simplemente hay que irse al menuacute superior en la parte izquierda ala apartado File (o Archivo) y seleccionar la opcioacuten Open Folderhellip (o Abrir Carpeta) Una vez seleccionemos la carpeta de nuestro proyecto tendremos las subcarpetas y archivos accesibles en forma de aacuterbol en la parte izquierda de la pantalla facilitandonos el trabajo

Otra cosa que nos hace la vida maacutes faacutecil a la hora de trabajar con una herramienta son sus atajos de teclado Estos son los maacutes interesantes que Sublime proporciona(Para Mac Ctrl = )

Pestantildeas y ventanasCambio entre pestantildeas Ctrl + 123hellip o Ctrl + TabNueva pestantildea Ctrl + NNueva ventana Ctrl + Shift + N

ProyectosAbrir archivo Ctrl + PPaleta de comandos Ctrl + Shift + PVer u ocultar barra lateral Ctrl + KBSalto de liacuteneas Ctrl + Shift + EnterDividir el coacutedigo en pestantildeas diferentes Alt + Shift + 123hellipSeleccioacutenSeleccionar palabras Ctrl + DSeleccionar liacutenea Ctrl + LSeleccionar todo Ctrl + ASeleccionar contenido dentro de dos llaves Ctrl + Shift + MSeleccioacuten muacuteltiple para tener varios punteros en variossitios a la vez Ctrl + click

BuacutesquedasBuacutesqueda simple Ctrl + FBuacutesqueda avanzada Ctrl + Shift + FBuacutesqueda de funciones en nuestro coacutedigo Ctrl + Shift + R

Manipulacioacuten de textoTexto en mayuacutesculas Ctrl + KUTexto en minuacutesculas Ctrl + KLReemplazar texto Ctrl + Shift + F

IndentacioacutenIndentacioacuten muacuteltiple TabIndentacioacuten muacuteltiple con retroceso Ctrl + Tab

Paacutegina 11

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

6 Plugins

Para acabar con esta guiacutea hablaremos de las posibilidades que existen para ampliar la funcionalidad de Sublime Text a traveacutes de plugins Los plugin nos ayudan a antildeadir funciones extra para poder cubrir nuestras necesidades

Para poder hacerlo primero debemos instalar Package Control Para ello debemos seguir los siguientes pasos

1 Vamos a la pagina oficial (httpspackagecontrolioinstallation) seleccionamos nuestra versioacuten de Sublime(en este caso la 3) y copiamos el coacutedigo

2 Abrimos Sublime pulsamos en ViewgtShow console

3 Pegamos el coacutedigo Una vez hecho esto comenzaraacute lainstalacioacuten

Una vez instalado el package control podremos instalar plugins siguiendo los siguientes pasos

1 Hacemos click en PreferencesgtPackage Controlo pulsar Control + Shift + P

2 Escribimos install y seleccionamos la opcioacuten installpackage

3 En el recuadro escribimos el nombre del plugin ainstalar y a los pocos segundo estaraacute listo

4 Reiniciamos Sublime Text para que los cambiosfuncionen correctamente

Ahora para finalizar enumeraremos unos cuantos plugins que son bastante uacutetiles para desarrolladores

bull Sidebar Enhancements Ampliacutea las opciones de gestioacutende archivos de la barra lateral

bull Color Highlighter Permite ver los colores que elijamosen las etiquetas CSS

bull Bracket Highlighter Resalta las etiquetas de apertura ycierre para mejorar la lectura de coacutedigo

bull SFTP Actualiza los archivos en el servidor simplementecon guardar el archivo

bull LiveReload Actualiza los cambios del archivo en elnavegador al guardarlo

bull DocBlockr Permite insertar faacutecilmente comentariospara documentacioacuten con soporte para Php Java etc

bull jQuery Nos da sugerencias de meacutetodos al escribircoacutedigo jQuery

bull SublimeCodeIntel Autocompleta el coacutedigo y reconocelas funciones de nuestro proyecto

bull Alignment Alinea y organiza todas las variablesseleccionando y presionando Ctrl + Alt + a

Paacutegina 13

iexclSi te ha resultado uacutetilcomparte en redes sociales

Maacutes en openwebinarsnet

iquestQuieres convertirte enFrontend Developer Profesional

Aprende ahora con los mejores expertos

CARRERAFRONTEND DEVELOPER WEB

COMENZAR CARRERA AHORA

Page 5: de instalación y configuración de Sublime Text 3

2 iquestQueacute es Sublime Text 3

Estaacute preparado para editar archivos de infinidad de lenguajes desde Go a Java pasando por Python C etchellip Aunque es comuacutenmente utilizado para desarrollo web es decir para la edicioacuten de ficheros HTML CSS y Javascript

Paacutegina 5

Sublime Text 3 es un editor de texto multiplataforma escrito en C++ y basado en el claacutesico Vim Aunque es gratuito y totalmente funcional no se trata de un software de coacutedigo abierto sino que te proporciona una licencia perpetua para usarlo sin fin

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

Paacutegina 7

3 Caracteriacutesticas

Las principales caracteriacutesticas que convierten en tan interesante a este editor de texto son las siguientes

bull Soporta nativamente una gran cantidad de lenguajes(hasta 43) asiacute como el texto plano

bull Posee una funcionalidad de buacutesqueda dinaacutemica con laque se pueden llevar a cabo buacutesquedas por expresionesregulares dentro de los archivos y proyectos

bull Tiene autocompletado de palabras y expresiones asiacutecomo marcado de llaves lo que permite abrir bloquesde una manera muy aacutegil y sencilla

bull Instalacioacuten de plugins para ampliar su funcionalidad

bull Soporte de pestantildeas Se pueden abrir tantosdocumentos como se necesite en varias pestantildeas

bull Minimapa que permite previsualizar de forma generalel coacutedigo escrito

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

4 Instalacioacuten

En este punto vamos a mostrar que tenemos que hacer para instalar Sublime Text 3 en nuestro ordenador de forma sencilla

Solo tenemos que irnos a la paacutegina oficial del programa httpwwwsublimetextcom

En el menuacute de la parte superior tenemos la opcioacuten Download Pinchamos ahiacute

Una vez en la pagina de descargar solo tenemos que elegir la opcioacuten que queramos Windows o Mac

En ambos casos se descargargaraacute un archivo ejecutable que tendremos que abrir y llevar a cabo la instalacioacuten

En el caso de Linux la instalacioacuten hay que llevarla a cabo por consola La opcioacuten maacutes comuacuten es usando apt En ese caso solo tendremos que ejecutar los siguientes comandos

wget -qO - httpsdownloadsublimetextcomsublimehq-pubgpg | sudo apt-key add

sudo apt-get install apt-transport-https

echo ldquodeb httpsdownloadsublimetextcom aptstablerdquo | sudo tee

etcaptsourceslistdsublime-textlistsudo apt-get update

sudo apt-get install sublime-text

Una vez instalado abrimos un terminal y ejecutamos el siguiente comando

subl --version

Si estaacute instalado correctamente deberiacutea salirnos algo parecido a lo siguiente

subl --versionSublime Text Build 3476

Paacutegina 9

Sublime

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

5 Utilidades y atajos

Una de las principales cualidades de Sublime Text 3 es que te permite trabajar de una manera muy coacutemoda con los llamados workspaces o entornos de trabajo Cuando estamos trabajando en un proyecto nos gusta tener todo accesible faacutecil y raacutepidamente y eso no compatible con tener que estar yendo al sistema de archivos cada vez que queremos abrir uno diferente Por eso Sublime te permite abrir carpetasen este caso donde tengas el proyecto para trabajar con ello

Para ello simplemente hay que irse al menuacute superior en la parte izquierda ala apartado File (o Archivo) y seleccionar la opcioacuten Open Folderhellip (o Abrir Carpeta) Una vez seleccionemos la carpeta de nuestro proyecto tendremos las subcarpetas y archivos accesibles en forma de aacuterbol en la parte izquierda de la pantalla facilitandonos el trabajo

Otra cosa que nos hace la vida maacutes faacutecil a la hora de trabajar con una herramienta son sus atajos de teclado Estos son los maacutes interesantes que Sublime proporciona(Para Mac Ctrl = )

Pestantildeas y ventanasCambio entre pestantildeas Ctrl + 123hellip o Ctrl + TabNueva pestantildea Ctrl + NNueva ventana Ctrl + Shift + N

ProyectosAbrir archivo Ctrl + PPaleta de comandos Ctrl + Shift + PVer u ocultar barra lateral Ctrl + KBSalto de liacuteneas Ctrl + Shift + EnterDividir el coacutedigo en pestantildeas diferentes Alt + Shift + 123hellipSeleccioacutenSeleccionar palabras Ctrl + DSeleccionar liacutenea Ctrl + LSeleccionar todo Ctrl + ASeleccionar contenido dentro de dos llaves Ctrl + Shift + MSeleccioacuten muacuteltiple para tener varios punteros en variossitios a la vez Ctrl + click

BuacutesquedasBuacutesqueda simple Ctrl + FBuacutesqueda avanzada Ctrl + Shift + FBuacutesqueda de funciones en nuestro coacutedigo Ctrl + Shift + R

Manipulacioacuten de textoTexto en mayuacutesculas Ctrl + KUTexto en minuacutesculas Ctrl + KLReemplazar texto Ctrl + Shift + F

IndentacioacutenIndentacioacuten muacuteltiple TabIndentacioacuten muacuteltiple con retroceso Ctrl + Tab

Paacutegina 11

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

6 Plugins

Para acabar con esta guiacutea hablaremos de las posibilidades que existen para ampliar la funcionalidad de Sublime Text a traveacutes de plugins Los plugin nos ayudan a antildeadir funciones extra para poder cubrir nuestras necesidades

Para poder hacerlo primero debemos instalar Package Control Para ello debemos seguir los siguientes pasos

1 Vamos a la pagina oficial (httpspackagecontrolioinstallation) seleccionamos nuestra versioacuten de Sublime(en este caso la 3) y copiamos el coacutedigo

2 Abrimos Sublime pulsamos en ViewgtShow console

3 Pegamos el coacutedigo Una vez hecho esto comenzaraacute lainstalacioacuten

Una vez instalado el package control podremos instalar plugins siguiendo los siguientes pasos

1 Hacemos click en PreferencesgtPackage Controlo pulsar Control + Shift + P

2 Escribimos install y seleccionamos la opcioacuten installpackage

3 En el recuadro escribimos el nombre del plugin ainstalar y a los pocos segundo estaraacute listo

4 Reiniciamos Sublime Text para que los cambiosfuncionen correctamente

Ahora para finalizar enumeraremos unos cuantos plugins que son bastante uacutetiles para desarrolladores

bull Sidebar Enhancements Ampliacutea las opciones de gestioacutende archivos de la barra lateral

bull Color Highlighter Permite ver los colores que elijamosen las etiquetas CSS

bull Bracket Highlighter Resalta las etiquetas de apertura ycierre para mejorar la lectura de coacutedigo

bull SFTP Actualiza los archivos en el servidor simplementecon guardar el archivo

bull LiveReload Actualiza los cambios del archivo en elnavegador al guardarlo

bull DocBlockr Permite insertar faacutecilmente comentariospara documentacioacuten con soporte para Php Java etc

bull jQuery Nos da sugerencias de meacutetodos al escribircoacutedigo jQuery

bull SublimeCodeIntel Autocompleta el coacutedigo y reconocelas funciones de nuestro proyecto

bull Alignment Alinea y organiza todas las variablesseleccionando y presionando Ctrl + Alt + a

Paacutegina 13

iexclSi te ha resultado uacutetilcomparte en redes sociales

Maacutes en openwebinarsnet

iquestQuieres convertirte enFrontend Developer Profesional

Aprende ahora con los mejores expertos

CARRERAFRONTEND DEVELOPER WEB

COMENZAR CARRERA AHORA

Page 6: de instalación y configuración de Sublime Text 3

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

Paacutegina 7

3 Caracteriacutesticas

Las principales caracteriacutesticas que convierten en tan interesante a este editor de texto son las siguientes

bull Soporta nativamente una gran cantidad de lenguajes(hasta 43) asiacute como el texto plano

bull Posee una funcionalidad de buacutesqueda dinaacutemica con laque se pueden llevar a cabo buacutesquedas por expresionesregulares dentro de los archivos y proyectos

bull Tiene autocompletado de palabras y expresiones asiacutecomo marcado de llaves lo que permite abrir bloquesde una manera muy aacutegil y sencilla

bull Instalacioacuten de plugins para ampliar su funcionalidad

bull Soporte de pestantildeas Se pueden abrir tantosdocumentos como se necesite en varias pestantildeas

bull Minimapa que permite previsualizar de forma generalel coacutedigo escrito

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

4 Instalacioacuten

En este punto vamos a mostrar que tenemos que hacer para instalar Sublime Text 3 en nuestro ordenador de forma sencilla

Solo tenemos que irnos a la paacutegina oficial del programa httpwwwsublimetextcom

En el menuacute de la parte superior tenemos la opcioacuten Download Pinchamos ahiacute

Una vez en la pagina de descargar solo tenemos que elegir la opcioacuten que queramos Windows o Mac

En ambos casos se descargargaraacute un archivo ejecutable que tendremos que abrir y llevar a cabo la instalacioacuten

En el caso de Linux la instalacioacuten hay que llevarla a cabo por consola La opcioacuten maacutes comuacuten es usando apt En ese caso solo tendremos que ejecutar los siguientes comandos

wget -qO - httpsdownloadsublimetextcomsublimehq-pubgpg | sudo apt-key add

sudo apt-get install apt-transport-https

echo ldquodeb httpsdownloadsublimetextcom aptstablerdquo | sudo tee

etcaptsourceslistdsublime-textlistsudo apt-get update

sudo apt-get install sublime-text

Una vez instalado abrimos un terminal y ejecutamos el siguiente comando

subl --version

Si estaacute instalado correctamente deberiacutea salirnos algo parecido a lo siguiente

subl --versionSublime Text Build 3476

Paacutegina 9

Sublime

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

5 Utilidades y atajos

Una de las principales cualidades de Sublime Text 3 es que te permite trabajar de una manera muy coacutemoda con los llamados workspaces o entornos de trabajo Cuando estamos trabajando en un proyecto nos gusta tener todo accesible faacutecil y raacutepidamente y eso no compatible con tener que estar yendo al sistema de archivos cada vez que queremos abrir uno diferente Por eso Sublime te permite abrir carpetasen este caso donde tengas el proyecto para trabajar con ello

Para ello simplemente hay que irse al menuacute superior en la parte izquierda ala apartado File (o Archivo) y seleccionar la opcioacuten Open Folderhellip (o Abrir Carpeta) Una vez seleccionemos la carpeta de nuestro proyecto tendremos las subcarpetas y archivos accesibles en forma de aacuterbol en la parte izquierda de la pantalla facilitandonos el trabajo

Otra cosa que nos hace la vida maacutes faacutecil a la hora de trabajar con una herramienta son sus atajos de teclado Estos son los maacutes interesantes que Sublime proporciona(Para Mac Ctrl = )

Pestantildeas y ventanasCambio entre pestantildeas Ctrl + 123hellip o Ctrl + TabNueva pestantildea Ctrl + NNueva ventana Ctrl + Shift + N

ProyectosAbrir archivo Ctrl + PPaleta de comandos Ctrl + Shift + PVer u ocultar barra lateral Ctrl + KBSalto de liacuteneas Ctrl + Shift + EnterDividir el coacutedigo en pestantildeas diferentes Alt + Shift + 123hellipSeleccioacutenSeleccionar palabras Ctrl + DSeleccionar liacutenea Ctrl + LSeleccionar todo Ctrl + ASeleccionar contenido dentro de dos llaves Ctrl + Shift + MSeleccioacuten muacuteltiple para tener varios punteros en variossitios a la vez Ctrl + click

BuacutesquedasBuacutesqueda simple Ctrl + FBuacutesqueda avanzada Ctrl + Shift + FBuacutesqueda de funciones en nuestro coacutedigo Ctrl + Shift + R

Manipulacioacuten de textoTexto en mayuacutesculas Ctrl + KUTexto en minuacutesculas Ctrl + KLReemplazar texto Ctrl + Shift + F

IndentacioacutenIndentacioacuten muacuteltiple TabIndentacioacuten muacuteltiple con retroceso Ctrl + Tab

Paacutegina 11

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

6 Plugins

Para acabar con esta guiacutea hablaremos de las posibilidades que existen para ampliar la funcionalidad de Sublime Text a traveacutes de plugins Los plugin nos ayudan a antildeadir funciones extra para poder cubrir nuestras necesidades

Para poder hacerlo primero debemos instalar Package Control Para ello debemos seguir los siguientes pasos

1 Vamos a la pagina oficial (httpspackagecontrolioinstallation) seleccionamos nuestra versioacuten de Sublime(en este caso la 3) y copiamos el coacutedigo

2 Abrimos Sublime pulsamos en ViewgtShow console

3 Pegamos el coacutedigo Una vez hecho esto comenzaraacute lainstalacioacuten

Una vez instalado el package control podremos instalar plugins siguiendo los siguientes pasos

1 Hacemos click en PreferencesgtPackage Controlo pulsar Control + Shift + P

2 Escribimos install y seleccionamos la opcioacuten installpackage

3 En el recuadro escribimos el nombre del plugin ainstalar y a los pocos segundo estaraacute listo

4 Reiniciamos Sublime Text para que los cambiosfuncionen correctamente

Ahora para finalizar enumeraremos unos cuantos plugins que son bastante uacutetiles para desarrolladores

bull Sidebar Enhancements Ampliacutea las opciones de gestioacutende archivos de la barra lateral

bull Color Highlighter Permite ver los colores que elijamosen las etiquetas CSS

bull Bracket Highlighter Resalta las etiquetas de apertura ycierre para mejorar la lectura de coacutedigo

bull SFTP Actualiza los archivos en el servidor simplementecon guardar el archivo

bull LiveReload Actualiza los cambios del archivo en elnavegador al guardarlo

bull DocBlockr Permite insertar faacutecilmente comentariospara documentacioacuten con soporte para Php Java etc

bull jQuery Nos da sugerencias de meacutetodos al escribircoacutedigo jQuery

bull SublimeCodeIntel Autocompleta el coacutedigo y reconocelas funciones de nuestro proyecto

bull Alignment Alinea y organiza todas las variablesseleccionando y presionando Ctrl + Alt + a

Paacutegina 13

iexclSi te ha resultado uacutetilcomparte en redes sociales

Maacutes en openwebinarsnet

iquestQuieres convertirte enFrontend Developer Profesional

Aprende ahora con los mejores expertos

CARRERAFRONTEND DEVELOPER WEB

COMENZAR CARRERA AHORA

Page 7: de instalación y configuración de Sublime Text 3

Paacutegina 7

3 Caracteriacutesticas

Las principales caracteriacutesticas que convierten en tan interesante a este editor de texto son las siguientes

bull Soporta nativamente una gran cantidad de lenguajes(hasta 43) asiacute como el texto plano

bull Posee una funcionalidad de buacutesqueda dinaacutemica con laque se pueden llevar a cabo buacutesquedas por expresionesregulares dentro de los archivos y proyectos

bull Tiene autocompletado de palabras y expresiones asiacutecomo marcado de llaves lo que permite abrir bloquesde una manera muy aacutegil y sencilla

bull Instalacioacuten de plugins para ampliar su funcionalidad

bull Soporte de pestantildeas Se pueden abrir tantosdocumentos como se necesite en varias pestantildeas

bull Minimapa que permite previsualizar de forma generalel coacutedigo escrito

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

4 Instalacioacuten

En este punto vamos a mostrar que tenemos que hacer para instalar Sublime Text 3 en nuestro ordenador de forma sencilla

Solo tenemos que irnos a la paacutegina oficial del programa httpwwwsublimetextcom

En el menuacute de la parte superior tenemos la opcioacuten Download Pinchamos ahiacute

Una vez en la pagina de descargar solo tenemos que elegir la opcioacuten que queramos Windows o Mac

En ambos casos se descargargaraacute un archivo ejecutable que tendremos que abrir y llevar a cabo la instalacioacuten

En el caso de Linux la instalacioacuten hay que llevarla a cabo por consola La opcioacuten maacutes comuacuten es usando apt En ese caso solo tendremos que ejecutar los siguientes comandos

wget -qO - httpsdownloadsublimetextcomsublimehq-pubgpg | sudo apt-key add

sudo apt-get install apt-transport-https

echo ldquodeb httpsdownloadsublimetextcom aptstablerdquo | sudo tee

etcaptsourceslistdsublime-textlistsudo apt-get update

sudo apt-get install sublime-text

Una vez instalado abrimos un terminal y ejecutamos el siguiente comando

subl --version

Si estaacute instalado correctamente deberiacutea salirnos algo parecido a lo siguiente

subl --versionSublime Text Build 3476

Paacutegina 9

Sublime

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

5 Utilidades y atajos

Una de las principales cualidades de Sublime Text 3 es que te permite trabajar de una manera muy coacutemoda con los llamados workspaces o entornos de trabajo Cuando estamos trabajando en un proyecto nos gusta tener todo accesible faacutecil y raacutepidamente y eso no compatible con tener que estar yendo al sistema de archivos cada vez que queremos abrir uno diferente Por eso Sublime te permite abrir carpetasen este caso donde tengas el proyecto para trabajar con ello

Para ello simplemente hay que irse al menuacute superior en la parte izquierda ala apartado File (o Archivo) y seleccionar la opcioacuten Open Folderhellip (o Abrir Carpeta) Una vez seleccionemos la carpeta de nuestro proyecto tendremos las subcarpetas y archivos accesibles en forma de aacuterbol en la parte izquierda de la pantalla facilitandonos el trabajo

Otra cosa que nos hace la vida maacutes faacutecil a la hora de trabajar con una herramienta son sus atajos de teclado Estos son los maacutes interesantes que Sublime proporciona(Para Mac Ctrl = )

Pestantildeas y ventanasCambio entre pestantildeas Ctrl + 123hellip o Ctrl + TabNueva pestantildea Ctrl + NNueva ventana Ctrl + Shift + N

ProyectosAbrir archivo Ctrl + PPaleta de comandos Ctrl + Shift + PVer u ocultar barra lateral Ctrl + KBSalto de liacuteneas Ctrl + Shift + EnterDividir el coacutedigo en pestantildeas diferentes Alt + Shift + 123hellipSeleccioacutenSeleccionar palabras Ctrl + DSeleccionar liacutenea Ctrl + LSeleccionar todo Ctrl + ASeleccionar contenido dentro de dos llaves Ctrl + Shift + MSeleccioacuten muacuteltiple para tener varios punteros en variossitios a la vez Ctrl + click

BuacutesquedasBuacutesqueda simple Ctrl + FBuacutesqueda avanzada Ctrl + Shift + FBuacutesqueda de funciones en nuestro coacutedigo Ctrl + Shift + R

Manipulacioacuten de textoTexto en mayuacutesculas Ctrl + KUTexto en minuacutesculas Ctrl + KLReemplazar texto Ctrl + Shift + F

IndentacioacutenIndentacioacuten muacuteltiple TabIndentacioacuten muacuteltiple con retroceso Ctrl + Tab

Paacutegina 11

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

6 Plugins

Para acabar con esta guiacutea hablaremos de las posibilidades que existen para ampliar la funcionalidad de Sublime Text a traveacutes de plugins Los plugin nos ayudan a antildeadir funciones extra para poder cubrir nuestras necesidades

Para poder hacerlo primero debemos instalar Package Control Para ello debemos seguir los siguientes pasos

1 Vamos a la pagina oficial (httpspackagecontrolioinstallation) seleccionamos nuestra versioacuten de Sublime(en este caso la 3) y copiamos el coacutedigo

2 Abrimos Sublime pulsamos en ViewgtShow console

3 Pegamos el coacutedigo Una vez hecho esto comenzaraacute lainstalacioacuten

Una vez instalado el package control podremos instalar plugins siguiendo los siguientes pasos

1 Hacemos click en PreferencesgtPackage Controlo pulsar Control + Shift + P

2 Escribimos install y seleccionamos la opcioacuten installpackage

3 En el recuadro escribimos el nombre del plugin ainstalar y a los pocos segundo estaraacute listo

4 Reiniciamos Sublime Text para que los cambiosfuncionen correctamente

Ahora para finalizar enumeraremos unos cuantos plugins que son bastante uacutetiles para desarrolladores

bull Sidebar Enhancements Ampliacutea las opciones de gestioacutende archivos de la barra lateral

bull Color Highlighter Permite ver los colores que elijamosen las etiquetas CSS

bull Bracket Highlighter Resalta las etiquetas de apertura ycierre para mejorar la lectura de coacutedigo

bull SFTP Actualiza los archivos en el servidor simplementecon guardar el archivo

bull LiveReload Actualiza los cambios del archivo en elnavegador al guardarlo

bull DocBlockr Permite insertar faacutecilmente comentariospara documentacioacuten con soporte para Php Java etc

bull jQuery Nos da sugerencias de meacutetodos al escribircoacutedigo jQuery

bull SublimeCodeIntel Autocompleta el coacutedigo y reconocelas funciones de nuestro proyecto

bull Alignment Alinea y organiza todas las variablesseleccionando y presionando Ctrl + Alt + a

Paacutegina 13

iexclSi te ha resultado uacutetilcomparte en redes sociales

Maacutes en openwebinarsnet

iquestQuieres convertirte enFrontend Developer Profesional

Aprende ahora con los mejores expertos

CARRERAFRONTEND DEVELOPER WEB

COMENZAR CARRERA AHORA

Page 8: de instalación y configuración de Sublime Text 3

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

4 Instalacioacuten

En este punto vamos a mostrar que tenemos que hacer para instalar Sublime Text 3 en nuestro ordenador de forma sencilla

Solo tenemos que irnos a la paacutegina oficial del programa httpwwwsublimetextcom

En el menuacute de la parte superior tenemos la opcioacuten Download Pinchamos ahiacute

Una vez en la pagina de descargar solo tenemos que elegir la opcioacuten que queramos Windows o Mac

En ambos casos se descargargaraacute un archivo ejecutable que tendremos que abrir y llevar a cabo la instalacioacuten

En el caso de Linux la instalacioacuten hay que llevarla a cabo por consola La opcioacuten maacutes comuacuten es usando apt En ese caso solo tendremos que ejecutar los siguientes comandos

wget -qO - httpsdownloadsublimetextcomsublimehq-pubgpg | sudo apt-key add

sudo apt-get install apt-transport-https

echo ldquodeb httpsdownloadsublimetextcom aptstablerdquo | sudo tee

etcaptsourceslistdsublime-textlistsudo apt-get update

sudo apt-get install sublime-text

Una vez instalado abrimos un terminal y ejecutamos el siguiente comando

subl --version

Si estaacute instalado correctamente deberiacutea salirnos algo parecido a lo siguiente

subl --versionSublime Text Build 3476

Paacutegina 9

Sublime

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

5 Utilidades y atajos

Una de las principales cualidades de Sublime Text 3 es que te permite trabajar de una manera muy coacutemoda con los llamados workspaces o entornos de trabajo Cuando estamos trabajando en un proyecto nos gusta tener todo accesible faacutecil y raacutepidamente y eso no compatible con tener que estar yendo al sistema de archivos cada vez que queremos abrir uno diferente Por eso Sublime te permite abrir carpetasen este caso donde tengas el proyecto para trabajar con ello

Para ello simplemente hay que irse al menuacute superior en la parte izquierda ala apartado File (o Archivo) y seleccionar la opcioacuten Open Folderhellip (o Abrir Carpeta) Una vez seleccionemos la carpeta de nuestro proyecto tendremos las subcarpetas y archivos accesibles en forma de aacuterbol en la parte izquierda de la pantalla facilitandonos el trabajo

Otra cosa que nos hace la vida maacutes faacutecil a la hora de trabajar con una herramienta son sus atajos de teclado Estos son los maacutes interesantes que Sublime proporciona(Para Mac Ctrl = )

Pestantildeas y ventanasCambio entre pestantildeas Ctrl + 123hellip o Ctrl + TabNueva pestantildea Ctrl + NNueva ventana Ctrl + Shift + N

ProyectosAbrir archivo Ctrl + PPaleta de comandos Ctrl + Shift + PVer u ocultar barra lateral Ctrl + KBSalto de liacuteneas Ctrl + Shift + EnterDividir el coacutedigo en pestantildeas diferentes Alt + Shift + 123hellipSeleccioacutenSeleccionar palabras Ctrl + DSeleccionar liacutenea Ctrl + LSeleccionar todo Ctrl + ASeleccionar contenido dentro de dos llaves Ctrl + Shift + MSeleccioacuten muacuteltiple para tener varios punteros en variossitios a la vez Ctrl + click

BuacutesquedasBuacutesqueda simple Ctrl + FBuacutesqueda avanzada Ctrl + Shift + FBuacutesqueda de funciones en nuestro coacutedigo Ctrl + Shift + R

Manipulacioacuten de textoTexto en mayuacutesculas Ctrl + KUTexto en minuacutesculas Ctrl + KLReemplazar texto Ctrl + Shift + F

IndentacioacutenIndentacioacuten muacuteltiple TabIndentacioacuten muacuteltiple con retroceso Ctrl + Tab

Paacutegina 11

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

6 Plugins

Para acabar con esta guiacutea hablaremos de las posibilidades que existen para ampliar la funcionalidad de Sublime Text a traveacutes de plugins Los plugin nos ayudan a antildeadir funciones extra para poder cubrir nuestras necesidades

Para poder hacerlo primero debemos instalar Package Control Para ello debemos seguir los siguientes pasos

1 Vamos a la pagina oficial (httpspackagecontrolioinstallation) seleccionamos nuestra versioacuten de Sublime(en este caso la 3) y copiamos el coacutedigo

2 Abrimos Sublime pulsamos en ViewgtShow console

3 Pegamos el coacutedigo Una vez hecho esto comenzaraacute lainstalacioacuten

Una vez instalado el package control podremos instalar plugins siguiendo los siguientes pasos

1 Hacemos click en PreferencesgtPackage Controlo pulsar Control + Shift + P

2 Escribimos install y seleccionamos la opcioacuten installpackage

3 En el recuadro escribimos el nombre del plugin ainstalar y a los pocos segundo estaraacute listo

4 Reiniciamos Sublime Text para que los cambiosfuncionen correctamente

Ahora para finalizar enumeraremos unos cuantos plugins que son bastante uacutetiles para desarrolladores

bull Sidebar Enhancements Ampliacutea las opciones de gestioacutende archivos de la barra lateral

bull Color Highlighter Permite ver los colores que elijamosen las etiquetas CSS

bull Bracket Highlighter Resalta las etiquetas de apertura ycierre para mejorar la lectura de coacutedigo

bull SFTP Actualiza los archivos en el servidor simplementecon guardar el archivo

bull LiveReload Actualiza los cambios del archivo en elnavegador al guardarlo

bull DocBlockr Permite insertar faacutecilmente comentariospara documentacioacuten con soporte para Php Java etc

bull jQuery Nos da sugerencias de meacutetodos al escribircoacutedigo jQuery

bull SublimeCodeIntel Autocompleta el coacutedigo y reconocelas funciones de nuestro proyecto

bull Alignment Alinea y organiza todas las variablesseleccionando y presionando Ctrl + Alt + a

Paacutegina 13

iexclSi te ha resultado uacutetilcomparte en redes sociales

Maacutes en openwebinarsnet

iquestQuieres convertirte enFrontend Developer Profesional

Aprende ahora con los mejores expertos

CARRERAFRONTEND DEVELOPER WEB

COMENZAR CARRERA AHORA

Page 9: de instalación y configuración de Sublime Text 3

4 Instalacioacuten

En este punto vamos a mostrar que tenemos que hacer para instalar Sublime Text 3 en nuestro ordenador de forma sencilla

Solo tenemos que irnos a la paacutegina oficial del programa httpwwwsublimetextcom

En el menuacute de la parte superior tenemos la opcioacuten Download Pinchamos ahiacute

Una vez en la pagina de descargar solo tenemos que elegir la opcioacuten que queramos Windows o Mac

En ambos casos se descargargaraacute un archivo ejecutable que tendremos que abrir y llevar a cabo la instalacioacuten

En el caso de Linux la instalacioacuten hay que llevarla a cabo por consola La opcioacuten maacutes comuacuten es usando apt En ese caso solo tendremos que ejecutar los siguientes comandos

wget -qO - httpsdownloadsublimetextcomsublimehq-pubgpg | sudo apt-key add

sudo apt-get install apt-transport-https

echo ldquodeb httpsdownloadsublimetextcom aptstablerdquo | sudo tee

etcaptsourceslistdsublime-textlistsudo apt-get update

sudo apt-get install sublime-text

Una vez instalado abrimos un terminal y ejecutamos el siguiente comando

subl --version

Si estaacute instalado correctamente deberiacutea salirnos algo parecido a lo siguiente

subl --versionSublime Text Build 3476

Paacutegina 9

Sublime

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

5 Utilidades y atajos

Una de las principales cualidades de Sublime Text 3 es que te permite trabajar de una manera muy coacutemoda con los llamados workspaces o entornos de trabajo Cuando estamos trabajando en un proyecto nos gusta tener todo accesible faacutecil y raacutepidamente y eso no compatible con tener que estar yendo al sistema de archivos cada vez que queremos abrir uno diferente Por eso Sublime te permite abrir carpetasen este caso donde tengas el proyecto para trabajar con ello

Para ello simplemente hay que irse al menuacute superior en la parte izquierda ala apartado File (o Archivo) y seleccionar la opcioacuten Open Folderhellip (o Abrir Carpeta) Una vez seleccionemos la carpeta de nuestro proyecto tendremos las subcarpetas y archivos accesibles en forma de aacuterbol en la parte izquierda de la pantalla facilitandonos el trabajo

Otra cosa que nos hace la vida maacutes faacutecil a la hora de trabajar con una herramienta son sus atajos de teclado Estos son los maacutes interesantes que Sublime proporciona(Para Mac Ctrl = )

Pestantildeas y ventanasCambio entre pestantildeas Ctrl + 123hellip o Ctrl + TabNueva pestantildea Ctrl + NNueva ventana Ctrl + Shift + N

ProyectosAbrir archivo Ctrl + PPaleta de comandos Ctrl + Shift + PVer u ocultar barra lateral Ctrl + KBSalto de liacuteneas Ctrl + Shift + EnterDividir el coacutedigo en pestantildeas diferentes Alt + Shift + 123hellipSeleccioacutenSeleccionar palabras Ctrl + DSeleccionar liacutenea Ctrl + LSeleccionar todo Ctrl + ASeleccionar contenido dentro de dos llaves Ctrl + Shift + MSeleccioacuten muacuteltiple para tener varios punteros en variossitios a la vez Ctrl + click

BuacutesquedasBuacutesqueda simple Ctrl + FBuacutesqueda avanzada Ctrl + Shift + FBuacutesqueda de funciones en nuestro coacutedigo Ctrl + Shift + R

Manipulacioacuten de textoTexto en mayuacutesculas Ctrl + KUTexto en minuacutesculas Ctrl + KLReemplazar texto Ctrl + Shift + F

IndentacioacutenIndentacioacuten muacuteltiple TabIndentacioacuten muacuteltiple con retroceso Ctrl + Tab

Paacutegina 11

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

6 Plugins

Para acabar con esta guiacutea hablaremos de las posibilidades que existen para ampliar la funcionalidad de Sublime Text a traveacutes de plugins Los plugin nos ayudan a antildeadir funciones extra para poder cubrir nuestras necesidades

Para poder hacerlo primero debemos instalar Package Control Para ello debemos seguir los siguientes pasos

1 Vamos a la pagina oficial (httpspackagecontrolioinstallation) seleccionamos nuestra versioacuten de Sublime(en este caso la 3) y copiamos el coacutedigo

2 Abrimos Sublime pulsamos en ViewgtShow console

3 Pegamos el coacutedigo Una vez hecho esto comenzaraacute lainstalacioacuten

Una vez instalado el package control podremos instalar plugins siguiendo los siguientes pasos

1 Hacemos click en PreferencesgtPackage Controlo pulsar Control + Shift + P

2 Escribimos install y seleccionamos la opcioacuten installpackage

3 En el recuadro escribimos el nombre del plugin ainstalar y a los pocos segundo estaraacute listo

4 Reiniciamos Sublime Text para que los cambiosfuncionen correctamente

Ahora para finalizar enumeraremos unos cuantos plugins que son bastante uacutetiles para desarrolladores

bull Sidebar Enhancements Ampliacutea las opciones de gestioacutende archivos de la barra lateral

bull Color Highlighter Permite ver los colores que elijamosen las etiquetas CSS

bull Bracket Highlighter Resalta las etiquetas de apertura ycierre para mejorar la lectura de coacutedigo

bull SFTP Actualiza los archivos en el servidor simplementecon guardar el archivo

bull LiveReload Actualiza los cambios del archivo en elnavegador al guardarlo

bull DocBlockr Permite insertar faacutecilmente comentariospara documentacioacuten con soporte para Php Java etc

bull jQuery Nos da sugerencias de meacutetodos al escribircoacutedigo jQuery

bull SublimeCodeIntel Autocompleta el coacutedigo y reconocelas funciones de nuestro proyecto

bull Alignment Alinea y organiza todas las variablesseleccionando y presionando Ctrl + Alt + a

Paacutegina 13

iexclSi te ha resultado uacutetilcomparte en redes sociales

Maacutes en openwebinarsnet

iquestQuieres convertirte enFrontend Developer Profesional

Aprende ahora con los mejores expertos

CARRERAFRONTEND DEVELOPER WEB

COMENZAR CARRERA AHORA

Page 10: de instalación y configuración de Sublime Text 3

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

5 Utilidades y atajos

Una de las principales cualidades de Sublime Text 3 es que te permite trabajar de una manera muy coacutemoda con los llamados workspaces o entornos de trabajo Cuando estamos trabajando en un proyecto nos gusta tener todo accesible faacutecil y raacutepidamente y eso no compatible con tener que estar yendo al sistema de archivos cada vez que queremos abrir uno diferente Por eso Sublime te permite abrir carpetasen este caso donde tengas el proyecto para trabajar con ello

Para ello simplemente hay que irse al menuacute superior en la parte izquierda ala apartado File (o Archivo) y seleccionar la opcioacuten Open Folderhellip (o Abrir Carpeta) Una vez seleccionemos la carpeta de nuestro proyecto tendremos las subcarpetas y archivos accesibles en forma de aacuterbol en la parte izquierda de la pantalla facilitandonos el trabajo

Otra cosa que nos hace la vida maacutes faacutecil a la hora de trabajar con una herramienta son sus atajos de teclado Estos son los maacutes interesantes que Sublime proporciona(Para Mac Ctrl = )

Pestantildeas y ventanasCambio entre pestantildeas Ctrl + 123hellip o Ctrl + TabNueva pestantildea Ctrl + NNueva ventana Ctrl + Shift + N

ProyectosAbrir archivo Ctrl + PPaleta de comandos Ctrl + Shift + PVer u ocultar barra lateral Ctrl + KBSalto de liacuteneas Ctrl + Shift + EnterDividir el coacutedigo en pestantildeas diferentes Alt + Shift + 123hellipSeleccioacutenSeleccionar palabras Ctrl + DSeleccionar liacutenea Ctrl + LSeleccionar todo Ctrl + ASeleccionar contenido dentro de dos llaves Ctrl + Shift + MSeleccioacuten muacuteltiple para tener varios punteros en variossitios a la vez Ctrl + click

BuacutesquedasBuacutesqueda simple Ctrl + FBuacutesqueda avanzada Ctrl + Shift + FBuacutesqueda de funciones en nuestro coacutedigo Ctrl + Shift + R

Manipulacioacuten de textoTexto en mayuacutesculas Ctrl + KUTexto en minuacutesculas Ctrl + KLReemplazar texto Ctrl + Shift + F

IndentacioacutenIndentacioacuten muacuteltiple TabIndentacioacuten muacuteltiple con retroceso Ctrl + Tab

Paacutegina 11

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

6 Plugins

Para acabar con esta guiacutea hablaremos de las posibilidades que existen para ampliar la funcionalidad de Sublime Text a traveacutes de plugins Los plugin nos ayudan a antildeadir funciones extra para poder cubrir nuestras necesidades

Para poder hacerlo primero debemos instalar Package Control Para ello debemos seguir los siguientes pasos

1 Vamos a la pagina oficial (httpspackagecontrolioinstallation) seleccionamos nuestra versioacuten de Sublime(en este caso la 3) y copiamos el coacutedigo

2 Abrimos Sublime pulsamos en ViewgtShow console

3 Pegamos el coacutedigo Una vez hecho esto comenzaraacute lainstalacioacuten

Una vez instalado el package control podremos instalar plugins siguiendo los siguientes pasos

1 Hacemos click en PreferencesgtPackage Controlo pulsar Control + Shift + P

2 Escribimos install y seleccionamos la opcioacuten installpackage

3 En el recuadro escribimos el nombre del plugin ainstalar y a los pocos segundo estaraacute listo

4 Reiniciamos Sublime Text para que los cambiosfuncionen correctamente

Ahora para finalizar enumeraremos unos cuantos plugins que son bastante uacutetiles para desarrolladores

bull Sidebar Enhancements Ampliacutea las opciones de gestioacutende archivos de la barra lateral

bull Color Highlighter Permite ver los colores que elijamosen las etiquetas CSS

bull Bracket Highlighter Resalta las etiquetas de apertura ycierre para mejorar la lectura de coacutedigo

bull SFTP Actualiza los archivos en el servidor simplementecon guardar el archivo

bull LiveReload Actualiza los cambios del archivo en elnavegador al guardarlo

bull DocBlockr Permite insertar faacutecilmente comentariospara documentacioacuten con soporte para Php Java etc

bull jQuery Nos da sugerencias de meacutetodos al escribircoacutedigo jQuery

bull SublimeCodeIntel Autocompleta el coacutedigo y reconocelas funciones de nuestro proyecto

bull Alignment Alinea y organiza todas las variablesseleccionando y presionando Ctrl + Alt + a

Paacutegina 13

iexclSi te ha resultado uacutetilcomparte en redes sociales

Maacutes en openwebinarsnet

iquestQuieres convertirte enFrontend Developer Profesional

Aprende ahora con los mejores expertos

CARRERAFRONTEND DEVELOPER WEB

COMENZAR CARRERA AHORA

Page 11: de instalación y configuración de Sublime Text 3

5 Utilidades y atajos

Una de las principales cualidades de Sublime Text 3 es que te permite trabajar de una manera muy coacutemoda con los llamados workspaces o entornos de trabajo Cuando estamos trabajando en un proyecto nos gusta tener todo accesible faacutecil y raacutepidamente y eso no compatible con tener que estar yendo al sistema de archivos cada vez que queremos abrir uno diferente Por eso Sublime te permite abrir carpetasen este caso donde tengas el proyecto para trabajar con ello

Para ello simplemente hay que irse al menuacute superior en la parte izquierda ala apartado File (o Archivo) y seleccionar la opcioacuten Open Folderhellip (o Abrir Carpeta) Una vez seleccionemos la carpeta de nuestro proyecto tendremos las subcarpetas y archivos accesibles en forma de aacuterbol en la parte izquierda de la pantalla facilitandonos el trabajo

Otra cosa que nos hace la vida maacutes faacutecil a la hora de trabajar con una herramienta son sus atajos de teclado Estos son los maacutes interesantes que Sublime proporciona(Para Mac Ctrl = )

Pestantildeas y ventanasCambio entre pestantildeas Ctrl + 123hellip o Ctrl + TabNueva pestantildea Ctrl + NNueva ventana Ctrl + Shift + N

ProyectosAbrir archivo Ctrl + PPaleta de comandos Ctrl + Shift + PVer u ocultar barra lateral Ctrl + KBSalto de liacuteneas Ctrl + Shift + EnterDividir el coacutedigo en pestantildeas diferentes Alt + Shift + 123hellipSeleccioacutenSeleccionar palabras Ctrl + DSeleccionar liacutenea Ctrl + LSeleccionar todo Ctrl + ASeleccionar contenido dentro de dos llaves Ctrl + Shift + MSeleccioacuten muacuteltiple para tener varios punteros en variossitios a la vez Ctrl + click

BuacutesquedasBuacutesqueda simple Ctrl + FBuacutesqueda avanzada Ctrl + Shift + FBuacutesqueda de funciones en nuestro coacutedigo Ctrl + Shift + R

Manipulacioacuten de textoTexto en mayuacutesculas Ctrl + KUTexto en minuacutesculas Ctrl + KLReemplazar texto Ctrl + Shift + F

IndentacioacutenIndentacioacuten muacuteltiple TabIndentacioacuten muacuteltiple con retroceso Ctrl + Tab

Paacutegina 11

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

6 Plugins

Para acabar con esta guiacutea hablaremos de las posibilidades que existen para ampliar la funcionalidad de Sublime Text a traveacutes de plugins Los plugin nos ayudan a antildeadir funciones extra para poder cubrir nuestras necesidades

Para poder hacerlo primero debemos instalar Package Control Para ello debemos seguir los siguientes pasos

1 Vamos a la pagina oficial (httpspackagecontrolioinstallation) seleccionamos nuestra versioacuten de Sublime(en este caso la 3) y copiamos el coacutedigo

2 Abrimos Sublime pulsamos en ViewgtShow console

3 Pegamos el coacutedigo Una vez hecho esto comenzaraacute lainstalacioacuten

Una vez instalado el package control podremos instalar plugins siguiendo los siguientes pasos

1 Hacemos click en PreferencesgtPackage Controlo pulsar Control + Shift + P

2 Escribimos install y seleccionamos la opcioacuten installpackage

3 En el recuadro escribimos el nombre del plugin ainstalar y a los pocos segundo estaraacute listo

4 Reiniciamos Sublime Text para que los cambiosfuncionen correctamente

Ahora para finalizar enumeraremos unos cuantos plugins que son bastante uacutetiles para desarrolladores

bull Sidebar Enhancements Ampliacutea las opciones de gestioacutende archivos de la barra lateral

bull Color Highlighter Permite ver los colores que elijamosen las etiquetas CSS

bull Bracket Highlighter Resalta las etiquetas de apertura ycierre para mejorar la lectura de coacutedigo

bull SFTP Actualiza los archivos en el servidor simplementecon guardar el archivo

bull LiveReload Actualiza los cambios del archivo en elnavegador al guardarlo

bull DocBlockr Permite insertar faacutecilmente comentariospara documentacioacuten con soporte para Php Java etc

bull jQuery Nos da sugerencias de meacutetodos al escribircoacutedigo jQuery

bull SublimeCodeIntel Autocompleta el coacutedigo y reconocelas funciones de nuestro proyecto

bull Alignment Alinea y organiza todas las variablesseleccionando y presionando Ctrl + Alt + a

Paacutegina 13

iexclSi te ha resultado uacutetilcomparte en redes sociales

Maacutes en openwebinarsnet

iquestQuieres convertirte enFrontend Developer Profesional

Aprende ahora con los mejores expertos

CARRERAFRONTEND DEVELOPER WEB

COMENZAR CARRERA AHORA

Page 12: de instalación y configuración de Sublime Text 3

Tutorial completode instalacioacuten y configuracioacuten dede Sublime Text 3

6 Plugins

Para acabar con esta guiacutea hablaremos de las posibilidades que existen para ampliar la funcionalidad de Sublime Text a traveacutes de plugins Los plugin nos ayudan a antildeadir funciones extra para poder cubrir nuestras necesidades

Para poder hacerlo primero debemos instalar Package Control Para ello debemos seguir los siguientes pasos

1 Vamos a la pagina oficial (httpspackagecontrolioinstallation) seleccionamos nuestra versioacuten de Sublime(en este caso la 3) y copiamos el coacutedigo

2 Abrimos Sublime pulsamos en ViewgtShow console

3 Pegamos el coacutedigo Una vez hecho esto comenzaraacute lainstalacioacuten

Una vez instalado el package control podremos instalar plugins siguiendo los siguientes pasos

1 Hacemos click en PreferencesgtPackage Controlo pulsar Control + Shift + P

2 Escribimos install y seleccionamos la opcioacuten installpackage

3 En el recuadro escribimos el nombre del plugin ainstalar y a los pocos segundo estaraacute listo

4 Reiniciamos Sublime Text para que los cambiosfuncionen correctamente

Ahora para finalizar enumeraremos unos cuantos plugins que son bastante uacutetiles para desarrolladores

bull Sidebar Enhancements Ampliacutea las opciones de gestioacutende archivos de la barra lateral

bull Color Highlighter Permite ver los colores que elijamosen las etiquetas CSS

bull Bracket Highlighter Resalta las etiquetas de apertura ycierre para mejorar la lectura de coacutedigo

bull SFTP Actualiza los archivos en el servidor simplementecon guardar el archivo

bull LiveReload Actualiza los cambios del archivo en elnavegador al guardarlo

bull DocBlockr Permite insertar faacutecilmente comentariospara documentacioacuten con soporte para Php Java etc

bull jQuery Nos da sugerencias de meacutetodos al escribircoacutedigo jQuery

bull SublimeCodeIntel Autocompleta el coacutedigo y reconocelas funciones de nuestro proyecto

bull Alignment Alinea y organiza todas las variablesseleccionando y presionando Ctrl + Alt + a

Paacutegina 13

iexclSi te ha resultado uacutetilcomparte en redes sociales

Maacutes en openwebinarsnet

iquestQuieres convertirte enFrontend Developer Profesional

Aprende ahora con los mejores expertos

CARRERAFRONTEND DEVELOPER WEB

COMENZAR CARRERA AHORA

Page 13: de instalación y configuración de Sublime Text 3

6 Plugins

Para acabar con esta guiacutea hablaremos de las posibilidades que existen para ampliar la funcionalidad de Sublime Text a traveacutes de plugins Los plugin nos ayudan a antildeadir funciones extra para poder cubrir nuestras necesidades

Para poder hacerlo primero debemos instalar Package Control Para ello debemos seguir los siguientes pasos

1 Vamos a la pagina oficial (httpspackagecontrolioinstallation) seleccionamos nuestra versioacuten de Sublime(en este caso la 3) y copiamos el coacutedigo

2 Abrimos Sublime pulsamos en ViewgtShow console

3 Pegamos el coacutedigo Una vez hecho esto comenzaraacute lainstalacioacuten

Una vez instalado el package control podremos instalar plugins siguiendo los siguientes pasos

1 Hacemos click en PreferencesgtPackage Controlo pulsar Control + Shift + P

2 Escribimos install y seleccionamos la opcioacuten installpackage

3 En el recuadro escribimos el nombre del plugin ainstalar y a los pocos segundo estaraacute listo

4 Reiniciamos Sublime Text para que los cambiosfuncionen correctamente

Ahora para finalizar enumeraremos unos cuantos plugins que son bastante uacutetiles para desarrolladores

bull Sidebar Enhancements Ampliacutea las opciones de gestioacutende archivos de la barra lateral

bull Color Highlighter Permite ver los colores que elijamosen las etiquetas CSS

bull Bracket Highlighter Resalta las etiquetas de apertura ycierre para mejorar la lectura de coacutedigo

bull SFTP Actualiza los archivos en el servidor simplementecon guardar el archivo

bull LiveReload Actualiza los cambios del archivo en elnavegador al guardarlo

bull DocBlockr Permite insertar faacutecilmente comentariospara documentacioacuten con soporte para Php Java etc

bull jQuery Nos da sugerencias de meacutetodos al escribircoacutedigo jQuery

bull SublimeCodeIntel Autocompleta el coacutedigo y reconocelas funciones de nuestro proyecto

bull Alignment Alinea y organiza todas las variablesseleccionando y presionando Ctrl + Alt + a

Paacutegina 13

iexclSi te ha resultado uacutetilcomparte en redes sociales

Maacutes en openwebinarsnet

iquestQuieres convertirte enFrontend Developer Profesional

Aprende ahora con los mejores expertos

CARRERAFRONTEND DEVELOPER WEB

COMENZAR CARRERA AHORA

Page 14: de instalación y configuración de Sublime Text 3

iexclSi te ha resultado uacutetilcomparte en redes sociales

Maacutes en openwebinarsnet

iquestQuieres convertirte enFrontend Developer Profesional

Aprende ahora con los mejores expertos

CARRERAFRONTEND DEVELOPER WEB

COMENZAR CARRERA AHORA