Ya estarás familiarizado con un editor de texto si has hecho algún curso de Codecademy. A continuación se muestra el editor de texto de Codecademy en pantalla completa al final del primer módulo del curso de HTML.
Aunque el entorno de aprendizaje de Codecademy proporciona una experiencia de codificación intuitiva y fácil de usar, a veces necesitarás utilizar tu propio editor de texto. Por ejemplo, si decides asistir a un Meetup o a un curso de codificación en persona, utilizarán un editor de texto descargable, y tendrás que instalarlo para trabajar en los proyectos tanto en clase como en casa.
He jugado con unos cuantos editores de texto para tener una mejor idea de lo que se adapta a mis necesidades. Esto es crucial, ya que no existe el «mejor» editor de texto, sólo el que te permite crear tu mejor trabajo.
En este artículo, voy a ofrecer una comparación en profundidad de dos de los editores de texto más populares: Visual Studio y Sublime Text.
Visual Studio
Visual Studio (el editor de texto se conoce como Visual Studio Code, así que nos referiremos a él a partir de ahora) es el editor de texto gratuito de Microsoft que funciona en Windows, Linux y macOS. Es un participante reciente en el mercado; Microsoft lanzó el producto como una vista previa pública a finales de 2015, publicando el código abierto en Github, antes de hacerlo disponible como un lanzamiento general en abril de 2016.
A pesar de su condición de novato, Visual Studio Code ha ganado rápidamente popularidad entre los desarrolladores, clasificándose como el entorno de desarrollo más popular en general en la Encuesta de Desarrolladores de Stack Overflow de 2018.
Los fundamentos
Así se ve la pantalla de inicio de Visual Studio Code cuando escribes tu primera línea de código o abres un archivo que ya has creado:
En el panel superior izquierdo, puedes ver las diferentes variaciones de código que estás editando. En este caso, estoy editando un archivo llamado «style.css».
En el panel central es donde editas el código que has escrito o que necesitas arreglar; puedes abrir y editar varios archivos diferentes uno al lado del otro.
El diseño de Visual Studio se parece al diseño del propio editor de texto de Codecademy en su simplicidad y facilidad de uso. Echa un vistazo al editor de texto de Codecademy a continuación para comparar.
Puedes, por supuesto, editar el diseño también. El Modo Zen es uno de mis favoritos, especialmente porque suena muy relajante. En realidad, se trata de un modo de pantalla completa que te permite editar código sin distracciones.
Más características
Visual Studio Code te permite editar código en una amplia variedad de lenguajes de programación. El ejemplo que he utilizado arriba es CSS (sí, ¡estoy clasificando CSS como un lenguaje de codificación!). CSS es uno de los lenguajes de programación incorporados, pero puedes instalar y configurar otros lenguajes, como Python y C#, a través del Mercado de Extensiones.
Debugging
Uno de los ejercicios clásicos que harás cuando aprendas a programar es «romper» algún código y luego intentar arreglarlo de nuevo. En mis primeros días de programación, me pasaba años mirando las líneas de código hasta que se me nublaban los ojos, intentando averiguar por qué lo que había escrito no se reflejaba en el producto final.
Afortunadamente, Visual Studio Code incluye la funcionalidad de depuración para ayudar a detectar esos errores antes de que llegues a la fase de ojos nublados. Para empezar a depurar tu código, todo lo que tienes que hacer es pulsar F5 para ejecutarlo en tu ventana actual, o ir al menú «Depuración».
También puedes crear «puntos de interrupción», que son puntos donde el proceso de depuración se detendrá automáticamente.
En un nivel de depuración más básico, Visual Studio Code detecta automáticamente problemas menores en tu código, y te lleva directamente allí para que puedas resolver el problema fácilmente.
Intellisense
Cuando estaba aprendiendo a codificar, uno de los consejos que nos daba el profesor cuando no sabíamos cómo hacer algo era buscarlo en Google. Microsoft ha incorporado una función en Visual Studio Code llamada Intellisense, que es una alternativa a buscar el problema en Google (o «Bing-ing», en el caso de Microsoft).
IntelliSense analiza la semántica (las letras) de lo que estás introduciendo, así como el resto del código que has creado, y luego proporciona sugerencias sobre cómo terminar lo que estás escribiendo. Puedes acceder a toda una serie de complementos diferentes a través de Intellisense, incluyendo sugerencias del servidor de idiomas, fragmentos y complementos textuales basados en palabras.
IntelliSense está disponible para los lenguajes de programación más comunes, incluyendo HTML, CSS y Javascript, pero para otros lenguajes, necesitarás instalar una extensión.
Y el resto
Visual Studio Code tiene una serie de otras características útiles que le ayudarán a través de su viaje de codificación ayudándole a visualizar mejor su código y acelerar su programación. Esto incluye:
- Soporte para snippets: Esto le permite crear un catálogo de pequeñas partes de código reutilizable, que puede insertar en cuerpos de código más grandes
- Funcionalidad «Ir a»: Esto le permite encontrar rápidamente e ir a los símbolos, archivos, líneas y definiciones
- Resaltar la sintaxis: Esto muestra el código en diferentes colores y fuentes de acuerdo con el tipo de lenguaje de codificación que se utiliza.
- Snippets: Estos funcionan de la misma manera que con Visual Studio, pero también puedes construir los tuyos propios, o instalar más desde las extensiones
- Multi-edición: Cuando presionas ctrl + d, todas las instancias de la palabra o el comando en el que estás actualmente serán resaltadas dentro del archivo, también puedes presionar ctrl + f para encontrar y reemplazar palabras.
Impresión general
Tiempo de confesión: Soy un viejo usuario de Windows/Microsoft Office. Parte de la razón de esta decisión (poco cool) es que encuentro los productos de Microsoft familiares y fáciles de navegar. Lo mismo ocurre con Visual Studio Code.
Incluso si eres nuevo en el mundo de los editores de texto, VS Code es fácil de coger y empezar a usarlo inmediatamente. Tiene el aspecto y la sensación de Microsoft, y tiene dos capas que lo hacen ideal para cualquier tipo de usuario.
Si eres un codificador novato, es fácil resolver los comandos básicos (además Microsoft ha escrito un montón de documentación para ello), pero si eres un usuario experto que busca hacer algo de programación seria, hay un montón de opciones de características avanzadas allí también.
Sublime Text (Versión 3)
Sublime Text, desarrollado por un antiguo ingeniero de Google, existe desde 2007. La primera gran diferencia con Visual Studio Code (VSC) es que tiene un coste de licencia de 80 dólares, aunque tiene una versión de prueba gratuita. Al igual que VSC, funciona en Windows, Linux y macOS, y es el cuarto entorno de desarrollo más popular en 2018 según StackOverflow.
La última versión de Sublime Text -la versión 3- estuvo en fase beta durante más de cuatro años, desde enero de 2013 hasta que se lanzó al público en septiembre de 2017.
Los fundamentos
Cuando abres Sublime Text por primera vez, te encuentras con un editor de texto despojado. No hay barra lateral, ni opciones para buscar, ni opción que te lleve directamente a la barra lateral de la extensión. Ofrece un diseño más centrado para ayudarte a concentrarte en la codificación. Hay un pequeño minimapa en la esquina superior derecha para darle una vista rápida de su código.
Se abrió bastante rápido en comparación con Visual Studio Code y, si usted está listo para ponerse a editar el código, proporciona el punto de partida perfecto. Sin embargo, si eres nuevo en los editores de texto, las otras características y funcionalidades son más difíciles de encontrar. La mayor parte de lo que necesitas está en los menús de la parte superior, pero también querrás llamar a la Paleta de Comandos (más adelante) desde el menú Herramientas para llegar más rápidamente a lo que necesitas.
Características de Sublime Text
Si quieres sacar el máximo partido a Sublime Text, querrás instalar plugins adicionales que te den la funcionalidad extra. Para ello, necesitas instalar Package Control, que te guiaremos a continuación.
Package Control
Package Control es similar al mercado de extensiones de Visual Studio, pero no está disponible de forma inmediata. Hay un montón de paquetes (o plugins) disponibles para las personas que son nuevas en la programación, como un paquete de inicio para C++, un paquete que ayudará con las terminaciones de Python (un poco como Intellisense en Visual Studio), y Emmet, que le ayuda a escribir HTML y CSS más rápido al permitirle usar abreviaturas, que expande automáticamente.
Paleta de comandos
Cuando utilices la función de la paleta de comandos, podrás encontrar y navegar hasta cualquier comando mucho más rápido que si tienes que buscarlo en los menús. Puedes acceder a casi todo, y la Paleta de comandos también se autocompletará por ti, así que si no estás seguro de lo que buscas exactamente, te sugerirá algunas opciones.
Por ejemplo, si estás trabajando en un proyecto y necesitas añadir rápidamente una nueva carpeta, o guardar el proyecto en el que estás trabajando, puedes sacar rápidamente esa opción. O si quieres crear snippets sin tener que navegar por los menús, también puedes hacerlo.
Para acceder a la Paleta de Comandos, todo lo que tienes que hacer es pulsar ctrl + shift + p.
Funcionalidad Goto
Hay un menú en Sublime Text dedicado a toda la funcionalidad «Goto» dentro de este editor de texto. Se trata de una versión mucho más completa del menú «Ir a» del propio Visual Studio.
Algunas de las funciones más destacadas son Goto Symbol (añadida en Sublime Text 3), que permite encontrar fácilmente todos los ejemplos de símbolos dentro de un archivo. El ejemplo de abajo es para las etiquetas H1 (sólo había una instancia dentro de este archivo).
Proyectos
La característica Proyectos se refiere a una forma de organizar carpetas y archivos dentro de Sublime Text. Significa que todas las carpetas y archivos se almacenan en un solo lugar y son rápidamente accesibles desde la barra lateral tan pronto como se abre el proyecto, en lugar de tener que seguir abriendo manualmente más archivos. También significa que puedes buscar (rápidamente) en todos los archivos de un proyecto a la vez.
Sólo puedes tener un proyecto abierto en un espacio de trabajo a la vez, así que si quieres cambiar de proyecto, tienes que seleccionar la opción «Cambiar de proyecto».
Visual Studio tiene una característica similar llamada «Espacios de trabajo», que le permite abrir y trabajar en múltiples archivos a la vez.
Y el resto
Sublime Text tiene una gran cantidad de otras características, «más pequeñas», que vale la pena mencionar aquí. Esto incluye:
Impresión general
Sublime Text es un editor de texto rápido y despojado que está caliente en la organización y la búsqueda a través del código que ha escrito, y ser capaz de saltar fácilmente a cualquier función o símbolo rápidamente. Su funcionalidad «Goto» y sus muchos atajos de teclado facilitan a los desarrolladores experimentados la navegación y la escritura y búsqueda de código sin tener que quitar las manos del teclado. Para los programadores más novatos (como yo), cuesta más acostumbrarse.
Sublime Text no incluye una opción de depuración, lo que podría ser un problema para los desarrolladores que requieren esta funcionalidad.
¿Qué editor de texto debería elegir?
Visual Studio podría clasificarse como un entorno de desarrollo integrado (IDE), porque permite a los programadores tanto escribir como probar el código. Sublime Text, por otro lado, es «sólo» un editor de texto (aunque uno excelente) porque se centra en proporcionar la forma más rápida de organizar y escribir su código, pero sin capacidad para probar (depurar) el código.
Otra gran diferencia entre Visual Studio Code y Sublime Text es el soporte que proporciona Microsoft en comparación con Sublime Text. Microsoft ha creado montones de documentación explicando casi todas las características y cómo utilizarlas, así como entradas de blog y tutoriales en vídeo para ayudar a los usuarios a ponerse al día con el editor de texto.
Sublime Text proporciona alguna documentación más difícil de encontrar, una entrada de blog explicando las características de la última versión y un foro.
Sublime Text es rápido y fácil de escribir código y navegar por él cuando se sabe lo que se está haciendo. Visual Studio proporciona más ayuda y es una gran opción por su funcionalidad de depuración, pero puede ralentizar a algunos programadores rápidos y experimentados cuando se trata de escribir código.