100

Terminal en Big Sur, más bonita que nunca

24094Puntos

hace 7 días

Curso de Prework: Configuración de Entorno de Desarrollo en macOS
Curso de Prework: Configuración de Entorno de Desarrollo en macOS

Curso de Prework: Configuración de Entorno de Desarrollo en macOS

Aprende a configurar tu computadora Apple para un entorno de desarrollo profesional en el sistema operativo macOS. Instala las principales herramientas de desarrollo y prepara tu equipo para iniciar la escuela de desarrollo web.

¿Utilizas alguna terminal diferente a la que viene por defecto en tu Mac? Yo también lo hacía, mi terminal favorita y la que iba a instalar apenas estrenaba equipo era iTerm2, pero con la terminal actual de MacOS siento que ya no es necesario. Por defecto la terminal viene con zsh como shell.

ZSH, también llamado Z shell, es una versión extendida de Bourne Shell (sh), con muchas características nuevas y soporte para plugins y temas. Dado que se basa en el mismo shell que Bash, ZSH tiene muchas de las mismas características. Empezar a utilizarlo es muy sencillo.

👣 Primeros pasos

En primer lugar tienes que instalar… ¡Ah! Es verdad, trabajaremos con la terminal nativa de MacOS, entonces no tienes que instalar nada.

Espera, sí tenemos que instalar Homebrew que es el gestor de paquetes para macOS y que nos ayudará a instalar todo tipo de cosas en un futuro. Según la descripción de la página oficial, Homebrew instala todo aquello que necesitas que Apple no instala de serie.

Te recomiendo que vayas a su página oficinal para conocer más de esta herramienta, para la instalación deberás de ejecutar este comando en tu terminal:

brew install wget

Ya que terminó la instalación de Homebrew, es hora de instalar Oh My Zsh que es un framework open source para manejar las configuraciones de zsh.

De nuevo te invito a que vayas a su página oficial para conocer más de esta herramienta, pero para instalarla solamente necesitas el siguiente comando.

sh -c "$(curl -fsSL https://raw.github.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"

🎨 Coloreando la terminal

No hay nada más bonito en la personalización de nuestros entornos de desarrollo que poder definir los colores que nosotros queramos tener, ya sea la terminal, nuestro editor o lo que sea, así que veamos cómo puedes cambiar los colores de tu terminal.

Esto lo podemos hacer manualmente cambiando los colores ANSI de la terminal, pero no será la forma que veremos hoy. Emil Kashkevich tiene un repositorio genial en GitHub con diferentes temas (muchísimos en realidad) para la terminal nativa de macOS.

Los pasos para empezar a probar estos temas en tu terminal son muy sencillos y están descritos en el README del repositorio, pero como están inglés aquí te los explicaré en español para que no haya confusiones:

  1. Clona o descarga el repositorio a tu local, así tendrás todos los temas disponibles en tu computadora.

  2. Abre la carpeta que descargaste, en mi caso se descargó con el nombre de macos-terminal-themes-master y dentro de esa carpeta ve a la carpeta de themes.
    Captura_de_Pantalla_2021-02-16_a_la(s)_13.45.21.png

  3. Dentro de themes abre cualquiera de los archivos que terminan en .terminal, al hacer esto se abrirá la aplicación con el tema que has elegido.
    Captura_de_Pantalla_2021-02-16_a_la(s)_15.51.47.png

En mi caso yo seleccionaré el de Ayu Mirage.terminal que según la misma documentación del repositorio tiene la paleta de colores que vemos en la imagen siguiente.
Untitled.png

  1. Si te gustó el tema que seleccionaste, abre las configuraciones de la terminal, recuerda que puedes usar el shortcut `cmd + `` y selecciónalo como predeterminado.
    Captura_de_Pantalla_2021-02-16_a_la(s)_15.50.01.png

Listo, ahora ya tienes la terminal con los colores a tu gusto, sigamos personalizándola porque la cosa no acaba aquí.

Extra: Neofetch

Neofetch es un programa que nos permite ver en la terminal información básica tanto de nuestro hardware como de nuestro software. Seguro te estás preguntando ¿esto qué tiene que ver con la personalización de los colores? Pues bien, la información que muestra neofetch se hace mediante el uso de colores y logos del sistema operativo en ASCII.

La instalación de neofetch la puedes realizar con el siguiente comando:

brew install neofetch

Una vez instalado solo tenemos que escribir el comando neofetch desde la terminal y te mostrará la información de tu sistema. En la imagen siguiente te muestro como se ve en mi terminal.
Captura_de_Pantalla_2021-02-16_a_la(s)_15.45.58.png

🖋 Fuentes

Hay muchos proyectos con fuentes parcheadas para desarrolladores. Estas fuentes vienen con glifos adicionales de fuentes icónicas como lo puede ser Font Awesome, Devicons, etcétera.

La que a mí más me gusta es Nerd Fonts, nuevamente te invito a revisar su página oficial donde encontrarás todas las features que incluye.

La instalación de este proyecto será también a través de brew con los siguientes comandos:

brew tap homebrew/cask-fonts
brew install --cask font-hack-nerd-font

Configuración de la fuente

Una vez que ya tienes instalada esta fuente hay que aplicarla para que la terminal empiece a usarla. Abrimos nuestra terminal y accedemos a las configuraciones haciendo uso del shortcut cmd + ``. Debes de acceder a la sección de perfiles y en el perfil predeterminado (que es el perfil actual) selecciona el tipo de letra que quieres usar, en este casoHack Regular Nerd Font`, yo la tengo seleccionada con un tamaño de letra 13.
Captura_de_Pantalla_2021-02-16_a_la(s)_13.29.04.png

Sí no ves ningún cambio en tu terminal aún, no te preocupes todo esto lo empezarás a ver conforme avancemos en la configuración.

💲 El prompt

Ya que instalamos la fuente parcheada y definimos la fuente y los colores de nuestra preferencia ahora podemos personalizar el prompt para que se vea completamente a nuestro gusto.

Pero antes… ¿Sabes qué es el prompt?
Según la Wikipedia es el carácter o conjunto de caracteres que se muestran en una línea de comandos para indicar que está a la espera de órdenes.

Temas de Oh My Zsh

Oh My Zsh tiene su propio listado de temas para modificarlo, estos los podemos encontrar en su documentación. La colección de temas que tiene disponibles están ordenados de forma alfabética y podemos elegir entre muchísimos temas, te invito a que vayas a revisar todos los que hay disponibles, escojas algunos para probar y regreses para seguir personalizando tu terminal.

Sí ya elegiste el tema que quieres utilizar es hora de configurarlo, para esto necesitas abrir el archivo ~/.zshrc, este lo puedes abrir desde tu terminal haciendo uso del comando code para que se abra en Visual Studio Code.

code ~/.zshrc

Ya que tengas abierto el archivo ya sea en Visual Studio Code o en tu editor favorito, has uso de la función de búsqueda cmd + f para encontrar la variable ZSH_THEME ya que ahí tienes que definir el nombre del tema que utilizarás para tu prompt.

Uno de mis temas favoritos es awesomepanda, ya que es muy minimalista, así que lo definiré en la variable de esta forma ZSH_THEME="awesomepanda", una vez hecho esto solo resta guardar los cambios en el archivo y reiniciar la terminal para que los cambios sean aplicados.

Con los cambios aplicados mi terminal luce así, pero aún no estamos aprovechando del todo los superpoderes de tener una fuente iconográfica.
Captura_de_Pantalla_2021-02-16_a_la(s)_16.12.12.png

Powerlevel10k

Powerlevel10k es un tema de zsh que se enfoca en la velocidad, la flexibilidad y la experiencia out-of-the-box, esta es la definición que ellos mismos se dan en su documentación, la cual, sí adivinaste, te invito a revisar.

Untitled 1.png

Hay muchas formas de realizar la instalación de este tema, pero veamos la forma sencilla, la cual es utilizando Oh My Zsh en donde solo necesitas utilizar este comando en la terminal:

git clone --depth=1 https://github.com/romkatv/powerlevel10k.git ${ZSH_CUSTOM:-$HOME/.oh-my-zsh/custom}/themes/powerlevel10k

Una vez que el comando termine su ejecución repetimos los pasos anteriores para definir el valor de ZSH_THEME en el archivo ~/.zshrc, el nuevo valor debe de ser powerlevel10k/powerlevel10k, por lo que la variable nos debe quedar de esta forma:

ZSH_THEME="powerlevel10k/powerlevel10k"

Para ver los cambios aplicados podemos reiniciar la terminal o simplemente recargar el archivo, para recargar el archivo escribe este comando en la terminal:

source ~/.zshrc

Powerlevel10k tiene un asistente propio de configuración, para acceder escribe p10k configure lo cual habilitará dicho asistente en tu terminal.

https://raw.githubusercontent.com/romkatv/powerlevel10k-media/master/configuration-wizard.gif

Cuando termines con el asistente ya tendrás una terminal muy personalizada, recuerda que puedes elegir entre muchos temas que ya están incluidos en Oh My Zsh, por si no quedas convencida del resultado de Powerlevel10k.

🧱 Plugins

Oh My Zsh viene con su propio bundle de plugins, te dejo la liga para que revises las opciones que más se adapten a tus necesidades. En lo personal yo te recomendaré dos que son básicas en mi día a día.

  1. Syntax highlighting ofrece el resaltado de sintaxis para la shell de zsh. Esto no es otra cosa que de forma interactiva nos resalta los comandos mientras los vamos escribiendo, lo cual nos ayuda a detectar errores de sintaxis al escribir.

    Si el comando que estás escribiendo es incorrecto o está incompleto lo mostrará en rojo.
    Captura_de_Pantalla_2021-02-17_a_la(s)_12.46.05.png

    Por otro lado, si el comando que escribiste es correcto lo mostrará en verde, esto a la hora de estar trabajando en la terminal es muy útil.
    Captura_de_Pantalla_2021-02-17_a_la(s)_12.46.22.png

  2. Autosuggestions su funcionalidad es que a medida que vas escribiendo te recomendará comandos según el historial que tengas.
    Captura_de_Pantalla_2021-02-17_a_la(s)_13.09.43.png

Veamos cómo instalar estos dos plug-ins, para que los puedas empezar a usar en tu terminal y con eso puedas instalar después cualquier otro plug-in que quieras añadir.

Instalación

La instalación en ambos casos es sencilla, se puede hacer a través de Oh My Zsh como ya has instalado otros recursos para tu terminal o se puede hacer de forma manual, en este caso te mostraré cómo hacerlo de forma manual en caso de que la instalación automática falle.

  1. Lo primero es clonar el repositorio del plug-in en tu local. Te recomiendo clonarlo en la carpeta de plug-ins de Oh My Zsh, en mi caso esta carpeta se encuentra en la siguiente ruta:

    /Users/alejandracamacho/.oh-my-zsh/plugins
    

    Identifica el lugar donde clonarás el repositorio y navega hacia ahí desde tu terminal.

    cd /Users/%tu_usuario%/.oh-my-zsh/plugins
    

    Una vez ahí solo debes de utilizar el comando git clone para clonar el repositorio.

    # Syntax highlighting
    git clone https://github.com/zsh-users/zsh-syntax-highlighting.git
    
    # Autosuggestions
    git clone https://github.com/zsh-users/zsh-autosuggestions ~/.zsh/zsh-autosuggestions
    
  2. Ya que ambos repositorios fueron clonados, hay que ir al archivo ~/.zshrc y añadir hasta el final las siguientes líneas:

    # Syntax highlightingsource /Users/%tu_usuario%/.oh-my-zsh/plugins/zsh-syntax-highlighting/zsh-syntax-highlighting.zsh
    
    # Autosuggestionssource /Users/%tu_usuario%/.oh-my-zsh/plugins/zsh-autosuggestions/zsh-autosuggestions.zsh
    

Reinicias la terminal y ya tendrás tanto el autocompletado como la revisión de sintaxis en tu terminal.

🕵🏻‍♀️ Alias

Algo que es muy útil dentro de la terminal es usar alias, así podemos acortar los comandos que más usemos para no tener que estarlos escribiendo completos o también para que sea más fácil memorizar comandos largos.

Para crear un alias lo único que necesitas hacer es escribir lo siguiente en tu terminal:

alias l='ls -l'

Con esto, a partir de ahora en lugar de tener que escribir ls -l para obtener un listado detallado de los archivos de la ubicación actual simplemente escribes l y obtendrás la misma información un poco más rápido.

Puedes definir todos los alias que tú necesites.

👋🏻 ¿Qué más podemos hacer?

En este punto tienes una terminal muy personalizada, podría decir que hasta con superpoderes, pero la cosa no acaba ahí, ahora te invito a ti a descubrir que más puedes implementar en la terminal para dejarla completamente a tu gusto.

Hay herramientas como tmux que te permite correr varias tareas de forma simultánea en tu terminal a través de paneles y sesiones configurables… desde una sola ventana. Así como esta puede haber muchas opciones más que sean de tu interés, así que no dudes en darte un clavado y ver de qué forma le puedes sacar más provecho a la terminal.

No olvides que Platzi tiene cursos que te ayudarán a sacarle el máximo provecho a tu terminal, de los cuales te dejaré una lista aquí abajo para que no dudes en tomarlos ya.

  1. Curso de Prework: Configuración de Entorno de Desarrollo en macOS
  2. Curso de Introducción a la Terminal y Línea de Comandos

Y listo, por último recuerda: nunca pares de aprender. 💚

Curso de Prework: Configuración de Entorno de Desarrollo en macOS
Curso de Prework: Configuración de Entorno de Desarrollo en macOS

Curso de Prework: Configuración de Entorno de Desarrollo en macOS

Aprende a configurar tu computadora Apple para un entorno de desarrollo profesional en el sistema operativo macOS. Instala las principales herramientas de desarrollo y prepara tu equipo para iniciar la escuela de desarrollo web.
Alejandra
Alejandra
alexcamachogz

24094Puntos

hace 7 días

Todas sus entradas
Escribe tu comentario
+ 2
Ordenar por:
13
15999Puntos

Excelente post. Le daré una segunda probada a la terminal a ver si suelto iTerm

6
24992Puntos

In love with ZSH😍

0
24094Puntos
5 días

En Linux o en Mac no importa donde ZSH es lo mejor de lo mejor

3
17980Puntos

!Está super! …muchas gracias @alexcamachogz 😄

2
4999Puntos

Excelente post!
De verdad está increible que algunos ya puedan ir abandonando iterm en MAC

1
5058Puntos
3 días

Al contrario, yo me pase a iTerm por el soporte de colores

2
3715Puntos

spaceship para oh my zsh es un 10 de 10 o almenos para mi

0
24094Puntos
5 días

Su simpleza y minimalismo es un acierto.

1
9095Puntos

Acabo de abandonar iTerm 💻 , definitivamente me quedo con la Terminal. 😍 Screen Shot 2021-02-25 at 19.56.00.png)

1
6639Puntos

No me sirven los comando en mi Mac, debe ser por el chip M1 ayuda pls

0
23727Puntos
6 días

¡Hola Diego!

Yo tuve un problema con un comando solamente…a mi me sirvió ir a la documentación que comparte Alejandra y copiar los comandos desde el repositorio de Github.

Te recomiendo esa manera!
(Yo también tengo un Mac)

0
24094Puntos
5 días

Revisa si no tienes algun typo en los comandos. Como dice Jorge siempre es bueno ir a la documentación y revisar directamente ahí por si tenemos algún error 😄

1
71820Puntos
4 días

Te recomiendo correo tu terminal con rosseta, a mi me funciona mejor asi en mi M1

0
6639Puntos
2 días

Gracias por la ayuda, si debía descargar rosetta y hacerlo funcionar como si fuera un intel, algunos comandos zsh no vienen por defecto en la nueva terminal. Martindavila crack !

1
14279Puntos

Uuuufff, excelente aporte Alex 😄

1

yo tengo mac mojave, es diferente o tambien funciona?gracias

1
1667Puntos

Me parece excelente, no me había fijado, ya uno va por default a instalar iTerm

0
24094Puntos
5 días

Yo hacia lo mismo, hasta que descubrí que la terminal nativa se volvió más poderosa que antes jaja

1
71820Puntos

Holi alguien sabe como cambiar los colores de Powerlevel10k?

2
24094Puntos
5 días

PowerLevel10k solo cambia como se visualiza el prompt, los colores los cambias cambiando el tema de la terminal 😄

1
15933Puntos

Ahora quiero comprarme un Mac! TnT

0
24094Puntos
5 días

Nunca es tarde para venir a este lado de la fuerza 😛

1
21330Puntos

Alguien sabe si se puede algo similar en Linux. ?

Mas especificamente, Ubuntu…

Se ve muy bonita. 😃

2
24094Puntos
5 días

Claro que sí, la personalización en Linux también es muy potente y también puedes instalar ZSH y por supuesto Oh My ZSh y los diferentes plugins que menciono en el blog 😃 Solo es cuestión de que identifiques los comandos necesarios para hacer estas instalaciones en tu sistema.

0
8736Puntos

Me gustó bastante! 😎 ahora lo experimento…

0

Creo que existe una corrección ya que clonamos el repo de zsh-autosuggestions en:

Auto # Autosuggestions
git clone https://github.com/zsh-users/zsh-autosuggestions ~/.zsh/zsh-autosuggestions

Y se indica confugurar en el archivo ~/.zshrc

<h1>Autosuggestions</h1>

source /Users/%tu_usuario%/.oh-my-zsh/plugins/zsh-autosuggestions/zsh-autosuggestions.zsh

Pero debe ser
source ~/.zsh/zsh-autosuggestions/zsh-autosuggestions.zsh
Ya que allí es donde se le indica que clone el plugin

En mi caso al abrir una consola en Visual Studio Code me salia el log
/Users/francisco.naranjo/.zshrc:source:118: no such file or directory: /Users/francisco.naranjo/.oh-my-zsh/plugins/zsh-autosuggestions/zsh-autosuggestions.zsh

0
24094Puntos
5 días

No es un error, la ruta dada en esa sección del blog depende de dónde esté clones el repositorio como lo indiqué de elegir la ruta de tu preferencia x)

Y bueno el source dependerá completamente de tu entorno, las rutas sugeridas dependen del entorno en el que yo hice estas configuraciones 😃

0

No hay algo así para la powershell de windows? jaja
Digo, ya me acostumbre a como se ve todo en azul, pero igual no estaría de más que se viera un poco mejor.
Este post creo que debería estar recomendado en algún vídeo u otro lugar para que todos los usuarios de Mac puedan usarlo.

0
24094Puntos
5 días

Este nivel de personalización no, lo más cercano que puedes tener en Windows es con WSL que al ser una terminal de Linux sí puede ser personalizable.

0
3 días

De hecho en estos últimos años existe Oh my Posh, inspirado en Oh my ZSH, te dejo este link a la documentación https://ohmyposh.dev/ , es un proyecto bastante reciente asi que probablemente no haya tantos temas ni plugins como en Oh my ZSH pero sin duda vas a poder personalizar Powershell, para que la experiencia sea completa recomiendan el uso de Windows Terminal que puedes instalar desde la Microsoft Store.

0
7520Puntos

No lo sabía hasta que leí tu artículo. Soy muy de iTerm desde tiempos inmemoriales, pero vale la pena darle un ojo a esta bebé.

0
24094Puntos
5 días

Yo era igual, mac nueva y de cajón iTerm, pero creo que eso ya empieza a estar en el pasado jaja

0

Hola! Tuve un problema; en la parte de 💲 El prompt Temas de Oh My Zsh;
tengo el vs pero no me funciono con esto code ~/.zshrc
hice open ~/.zshrc lo modifique con un editor de texto al tema que pusiste para ver de ejemplo awesomepanda, lo guarde reinicie y sigue todo igual. Como haria para solucionar esto ?¿

0
24094Puntos
5 días

Que bueno que lo pudiste solucionar 😄

0
31629Puntos

Esta información es oro puro.

¡Es momento de decirle adios 👋a iterm!

¿Cómo quedaron sus terminales?

0
24094Puntos
5 días

Adios, adios a iTerm. Comparte cómo luce tu nueva terminal 😄

0
4047Puntos

Por cierto, muy bueno el post! meticulosamente detallado, y muy bien estructurado!

0
7539Puntos

Excelente tutorial para personalizar la terminal de Mac, gracias!

0

qué hay con los de windows?

0
86188Puntos
4 días

Con Windows puedes usar WSL para tener una parte de Linux en Windows y poder personalizarla.

Echale un vistazo al curso que dice Mus y después a este blog post

0
11779Puntos

mi tema favorito es Cloud

2
14167Puntos
4 días

uhhhhh siiii, es sencillo y hermoso a la vez.

0
23727Puntos

¡Hola Alejandra!

Muchas gracias por este gran post, me ha encantado y ha sido de mucha ayuda!!!

Cuando estaba instalando los plugins, me encontré con un pequeño error con el comando del Autosuggestions

En la guia esta este comando:
Screen Shot 2021-02-20 at 3.33.31 PM.png
A mi no me sirvió, cuando ley la documentación, encontré el siguiente:

source ~/.zsh/zsh-autosuggestions/zsh-autosuggestions.zsh

y este si me sirvió

Para que lo tengan en cuente 😃

0
14198Puntos

Me encantó tu blogpost! Los plugins son oro puro

1
24094Puntos
5 días

Muchas gracias Raul, y sí, los plugins hace de tu vida más fácil jaja una vez que los pruebas no los puedes dejar.