Todos los desarrolladores construyen su propio conjunto de herramientas cuando se trata de manejar varios proyectos. Las herramientas que utiliza un desarrollador web pueden reducir el tiempo necesario para completar un sitio web o una aplicación web y pueden hacer que las tareas sean más fáciles de manejar.

Las herramientas inteligentes son esenciales para el flujo de trabajo de todo desarrollador exitoso, por lo que si desea mejorar su conjunto de herramientas con una serie de trucos completamente nuevos, es una buena idea leer este artículo detenidamente de principio a fin.

No faltan los editores de código que puede usar para facilitar su trabajo. Decidir entre ellos se vuelve mucho más difícil cuando hay tantas opciones esperándote.

Por lo tanto, presentaremos una opción que destaca sobre el resto: Sublime Text. Este es uno de los editores de código más utilizados en el mercado y es el preferido por miles de programadores, desarrolladores web y diseñadores web.

Lo que es tan impresionante de Sublime Text es su flexibilidad. Puede ampliar fácilmente el editor de código utilizando complementos de Sublime Text creados para casi todos los propósitos imaginables. E incluso puede crear paquetes personalizados que mejorarán visiblemente su flujo de trabajo y aumentarán su productividad.

Siga leyendo más en este artículo creado por nuestro equipo en wpDataTables y conozca algunos de los mejores paquetes de Sublime Text, cómo funcionan y cómo puede usarlos.

Complementos de texto sublime: instalación de paquetes

Antes de enumerar los complementos de Sublime Text que consideramos relevantes para todos los diseñadores web, debe aprender cómo instalar paquetes en este editor de código. Estos son los pasos que debe seguir:

Descargue el archivo zip del repositorio de paquetes. Puede hacerlo desde la página de GitHub del paquete.
Extraiga los archivos en su carpeta Sublime Text Packages. Debería encontrarlo en: {{ nombre de usuario }}AppDataRoamingSublime Text {{ versión }}Paquetes

Instale el paquete a través del Control de paquetes oficial de Sublime Text Haga clic en el enlace y copie el código que se adapte a la versión de Sublime Text que posee.
Pegue el código en su consola Sublime Text, a la que puede acceder presionando CTRL + ~.
Reinicie su editor de código, abra la ventana de comandos presionando CTRL + Shift + P, y escriba "Control de paquete: Instalar paquete" (o simplemente "Instalar paquete"; la función de autocompletar mostrará las opciones deseadas)

Una vez que el paquete esté instalado, no realice ningún cambio en su archivo de configuración predeterminado, a menos que sepa exactamente lo que está haciendo. Los paquetes de Sublime Text están destinados principalmente a personalizarse con el uso de archivos de anulación separados para que sus cambios no se pierdan cuando se actualicen los paquetes.

Complementos de texto sublime que todos los desarrolladores web deberían probar

Hablando de la extensibilidad del editor de código, sería útil enumerar algunos de los mejores Sublime Text Plugins que existen y cómo pueden ayudarlo a convertirse en un mejor desarrollador en el menor tiempo posible.

Con suerte, encontrará estos complementos útiles y relevantes para su trabajo. Aquí está la lista:

Control de paquetes

Sublime Text Package Control es probablemente la herramienta más popular disponible para este editor de código. Le permite descargar, instalar y actualizar paquetes directamente desde la interfaz de Sublime Text.

Aunque "complemento" y "paquete" a menudo se usan indistintamente, los paquetes incluyen complementos, menús, fragmentos y otros bits y bobs que se pueden usar para extender Sublime Text a su gusto.

En lugar de descargar los archivos del paquete por su cuenta e instalarlos en la carpeta correcta, deje que este complemento haga todo por usted sin salir de Sublime Text. Si es programador, considérelo como pip para Python o npm para node.js.

Alineación

Alignment hace exactamente lo que dice su nombre: es uno de esos complementos de Sublime Text que hace que tu trabajo sea 10 veces más fácil al alinear tu código para que sea más ordenado y fácil de leer. Funciona muy bien con PHP, JavaScript, CSS y más.

Puede alinear secciones, selecciones de varias líneas o todo su código con el uso de delimitadores como "=". Aunque pienses que no ayuda mucho, una vez que lo uses te volverás adicto a lo útil que es.

Hormiga

Entre los complementos de Sublime Text más utilizados se encuentra Emmet, un complemento simple que puede mejorar la productividad de cualquier desarrollador al ayudarlo con su flujo de trabajo CSS y HTML.

Por ejemplo, si escribe html:5 y presiona CTRL + E mientras usa Emmet, obtendrá acceso a una plantilla de página HTML5 básica para trabajar. El complemento es simple, pero extremadamente efectivo y definitivamente mejorará su trabajo.

Cambiar Cotizaciones

¿Odias manejar citas? Felicidades, eres uno de los millones de desarrolladores que también tienen dificultades para mantener la coherencia. ChangeQuotes te ayudará.

Puede convertir fácilmente comillas simples/dobles y volver a escaparlas. Si desea cambiar las comillas, coloque el cursor dentro del texto citado y abra la paleta de comandos. Ejecute el complemento y ya no necesitará seleccionar la línea completa para cambiar las comillas. ¡Es mucho más rápido de esta manera!

Mejoras en la barra lateral

Este complemento de Sublime Text agregará algunas características nuevas a su menú de barra lateral. Por ejemplo, puede crear un nuevo archivo mucho más rápido mientras permanece en su carpeta de proyecto actual. También puede mover archivos y carpetas más fácilmente, duplicarlos según sea necesario y abrir archivos en Finder o en su navegador.

SublimeEnhancements agrega una serie de funciones útiles en la barra lateral que lo ayudarán a administrar su proyecto de manera más eficiente. Instálelo para descubrir todas las funciones útiles.

SublimeLinter

Si eres usuario de Sublime Text 3, te encantará SublimeLinter. No se actualizaron muchos complementos de Sublime Text para la última versión del editor, por lo que siempre es bueno ver que los desarrolladores de complementos se enfocan en actualizar sus productos. En lugar de tener todos sus linters en un solo paquete, este complemento le permite instalar los que usa regularmente.

Básicamente, SublimeLinter le brinda un marco para usar para delinear el código. En caso de que no lo sepa, el linting representa el proceso de marcar la sintaxis no portátil o incorrecta en su código. En palabras más simples, le advierte cuando el código está repleto de errores.

SublimeGit

Trabajar con software de control de versiones es común para los desarrolladores. El más popular es Git. Para aquellos que están cansados de guardar archivos de texto y volver a una terminal para ejecutar un par de comandos de Git, SublimeGit será la respuesta. Este complemento de Sublime Text le permite ejecutar todos sus comandos de Git dentro del editor de texto.

Al usar SublimeGit, los desarrolladores pueden hacer más en menos tiempo, lo que aumenta mucho su productividad. No tendrá que alternar entre su editor de código y la línea de comandos.

Esto solía estar disponible solo como un complemento pago, pero el año pasado se volvió de código abierto. Tiene numerosas funciones que encontrará útiles, así como los documentos de SublimeGit, que lo ayudarán a comprender y usar el complemento.

GitGutter

Siempre puede ejecutar los comandos de Git dentro de Sublime Text, pero no es la manera más rápida de manejar esta tarea. Sublime Text te hace ejecutar un comando separado, en lugar de permitirte ver los cambios en tiempo real. Bueno, aquí es donde interviene GitGutter.

GitGutter es similar a Atom desde algunos puntos de vista. Agrega los mismos tipos de funcionalidades a Sublime Text, lo que significa que puede comenzar a agregar sugerencias diferentes a la canaleta de su barra lateral. Al pasar el cursor sobre los indicadores de la barra lateral, obtiene acceso a ventanas emergentes de diferencias muy útiles.

HABLAR CON DESCARO A

Resaltar es primordial para notar errores y fallas rápidamente. Para los desarrolladores, corregir errores de manera rápida y eficiente es una necesidad absoluta. SASS te ayuda a hacer eso. Destaca la sintaxis de SASS y SCSS, y ayudará a cualquier desarrollador de CSS que utilice estos lenguajes de extensión.

GitHubinator

Aquellos que usan repositorios de GitHub/Bitbucket deben probar GitHubinator. Este complemento muestra el texto seleccionado en el repositorio remoto. Por lo tanto, el texto que está buscando se resalta y simplemente puede hacer clic en el menú contextual para iniciar la página web correspondiente en el navegador.

Como en el caso de otros complementos de Sublime Text enumerados aquí, GitHubinator ayuda a los desarrolladores a ahorrar tiempo y evitar acciones repetitivas.

GitOpenChangedFiles

Como puede ver, este complemento se usa para abrir archivos modificados desde un repositorio de Git. Simplemente necesita instalarlo e iniciar el complemento para abrir archivos que ha cambiado previamente en su rama de Sublime Text.

No es un gran complemento, pero aquellos que requieren esta función la encontrarán muy útil.

Terminal

Ya sabes cuánto dura el proceso para abrir carpetas de proyectos con Sublime Text. Terminal le permite abrir las carpetas directamente desde Sublime Text en la plataforma con una sola tecla de acceso rápido. ¿No es eso conveniente?

Al ejecutar líneas de comando en una carpeta determinada, debe realizar algunos pasos que requieren mucho tiempo y son bastante estresantes. Terminal reduce estos pasos a la tecla de acceso directo CTRL + SHIFT + T.

sublimeREPL

Usar SublimeREPL hará que el trabajo de un programador sea 10 veces más fácil. Este complemento le permite ejecutar intérpretes de los lenguajes más comunes, incluidos NodeJS, Python, Ruby, Scala o Haskell.

Puede ejecutar un intérprete en cualquiera de estos idiomas y más, directamente desde Sublime Text. Eche un vistazo a las otras funciones del complemento para una comprensión más profunda de lo que puede hacer.

Babel

Si necesita definiciones de lenguaje para ES6+ Javascript, debe usar Babel. No muchos complementos de Sublime Text ofrecen buenas definiciones de lenguaje, especialmente para su última versión. Babel está diseñado específicamente para Sublime Text 3 y no es compatible con versiones anteriores. También es compatible con la sintaxis de React JSX.

TodoAutocompletar

De forma predeterminada, Sublime Text utiliza la opción de autocompletar solo en las palabras que están presentes en el archivo actual. Para expandir esta funcionalidad a todos los archivos abiertos, puede usar AllAutocomplete, un complemento que busca todos los archivos que ha abierto y encuentra coincidencias, al mismo tiempo que sugiere palabras.

CSSComb

CSSComb ordena las propiedades CSS para que su código sea más limpio y más fácil de leer. Pone el código en el orden correcto y le permite personalizar sus propiedades sin mucha molestia. Es un complemento útil para aquellos que trabajan en equipos donde no todos los miembros escriben código de la misma manera.

MarkdownPreview

Muchos desarrolladores están acostumbrados a crear archivos Markdown en GitHub, StackEdit o Markable, en la nube. Si eres un escritor de la vieja escuela y prefieres mantener tus archivos localmente, entonces deberías probar MarkdownPreview.

También puede instalar MarkdownEditing y resaltar su código Markdown.

DocBlockr

En algunas empresas, todas las pautas de codificación deben respetarse religiosamente. Esto puede ejercer presión sobre los hombros de los desarrolladores. DocBlockr lo hace más fácil al crear comentarios para su código, analizar las funciones, variables o parámetros y agregar automáticamente elementos básicos.

Solo tendrás que teclear /y el plugin hace el trabajo por ti.

Fragmentos de CSS materializados

MaterializeCSS es un marco front-end memorable creado por Google. Es moderno, totalmente receptivo y está listo para ser utilizado por todos los diseñadores y desarrolladores. Este complemento de Sublime Text lo ayudará a usar Materialise CSS dentro del editor de texto con el uso de fragmentos comunes.

Fragmentos de CSS materializados agrega componentes de CSS directamente en el editor de código, para que pueda acceder a ellos con comandos básicos. Los fragmentos de CSS materializados pueden ahorrar mucho tiempo y energía que normalmente se consumiría escribiendo la sintaxis manualmente y agregando componentes de CSS por separado.

Formato estándar

Sin formatear, su código se verá desordenado y difícil de leer. StandardFormat le permite crear una base de código mucho más sólida mientras ayuda a las personas a leer su código de manera más rápida y efectiva cuando lo necesitan.

El complemento se basa en la biblioteca JS de formato estándar, que se aplicará a lo que escriba. Todo el mundo sabe cómo leer el formato JS tradicional, por lo que este complemento resulta bastante útil para los desarrolladores.

Fragmentos de consulta de medios CSS

Las consultas de medios se utilizan para desarrollar aplicaciones y software para dispositivos móviles o tamaños de pantalla escalables. Sin estas consultas, no puede convertir su proyecto en uno compatible con dispositivos móviles.

CSS Media Query Snippets tiene como objetivo ayudarlo con esta tarea, al ofrecer plantillas preescritas para consultas de medios. Puede usar la plantilla para hacer modificaciones.

Ejecutivo de Shell

Todos sabemos que el acceso a Shell es un tema controvertido debido a las configuraciones inseguras que los servidores ejecutaban en el pasado. Caer presa de los piratas informáticos era mucho más común cuando se podía acceder a los comandos de Shell Exec desde el exterior, lo que abría vulnerabilidades en la plataforma.

Este complemento lo ayuda a ejecutar comandos de shell dentro de Sublime Text 3, considerando que Internet es mucho más seguro ahora. Es una buena manera de ahorrar tiempo, pero no olvide configurar los ajustes del firewall y averiguar los patrones de acceso para evitar la situación antes mencionada.

Laravel BladeIluminador

Laravel es un marco de código abierto para PHP y ha influido en el desarrollo de PHP de manera bastante visible. Laravel usa Blade Engine, una sintaxis que le permite desarrollar nuevo software sobre el marco.

Sublime Text no sería lo mismo sin Laravel Blade Highlighter si usas Laravel a diario. Con más de 300.000 instalaciones, ningún desarrollador de PHP se puede perder este complemento.

Pensamientos finales sobre estos complementos de Sublime Text

Sublime Text es lo suficientemente fuerte por sí solo, pero los complementos y los paquetes lo hacen aún más poderoso. El mayor beneficio de estos complementos es ahorrarle tiempo al ayudarlo a personalizar Sublime Text para que se ajuste a sus necesidades, requisitos y tareas diarias.

Cada desarrollador prefiere una cierta rutina de codificación, y puede mantener esa rutina seleccionando los complementos de Sublime Text que funcionan mejor para su situación. Elija los que tengan sentido para su forma de trabajar y su trabajo. Esto hará que todo sea más eficiente y que consuma menos tiempo.

¡Buena suerte con tus tareas de codificación!

Si disfrutó leyendo este artículo sobre complementos de Sublime Text, debe consultar este sobre temas de Sublime Text.

También escribimos sobre algunos temas relacionados, como los mejores paquetes Atom y cómo convertirse en un desarrollador front-end.

Fuente de grabación: wpdatatables.com