macos.es.md

Instrucciones de la configuración

Aquí abajo encontrarás las instrucciones para la configuración que tu computadora necesita para el curso de Desarrollo Web de Le Wagon.

Por favor, léelas cuidadosamente y ejecuta todos los comandos en el orden indicado. Si tienes algún problema, no dudes en pedirle ayuda a tu profesor 🙋

¡Comencemos! 🚀

Zoom

Para poder interactuar cuando no estemos en el mismo lugar físico, usaremos Zoom, una herramienta de videoconferencia.

⚠️ Si ya tienes Zoom instalado, por favor asegúrate de que por lo menos tienes la versión 5.6.

Ve a zoom.us/download.

Haz clic en el botón Download debajo de Zoom Client.

Abre el archivo que acabas de descargar para instalar la aplicación.

Abre la aplicación Zoom.

Si tienes una Mac con Apple silicon, te pedirán instalar Rosetta. Haz clic en instalar. Luego escribe tu nombre y contraseña para que corra la instalación.

Si ya tienes una cuenta Zoom, inicia sesión con tus credenciales.

Si no, haz clic en el enlace Sign Up Free, que significa registrarse gratuitamente:

Te redireccionarán a la página de Zoom para que completes un formulario.

Cuando termines, regresa a la aplicación Zoom e inicia sesión usando tus credenciales.

Deberías ver una pantalla como la siguiente:

Ya puedes cerrar la aplicación Zoom.

Cuenta GitHub

¿Ya tienes una cuenta GitHub? Si no es el caso, ábrela ya.

👉 Sube una foto y escribe tu nombre correctamente en tu cuenta GitHub. Esto es importante porque nosotros usaremos un tablero de comando interno con tu avatar. Por favor hazlo ahora antes de dar un paso más en esta guía.

👉 Habilita la Autenticación de Dos Factores (2FA). GitHub te enviará mensajes de texto con un código cuando intentes iniciar sesión. Esto es importante para la seguridad y también pronto será necesario para contribuir código en GitHub.

Cómo cerrar aplicaciones en una Mac correctamente

Hacer clic en círculo rojo en la esquina superior izquierda de la ventana de la aplicación en Mac no la termina el proceso, solo cierra una ventana activa. Hay dos alternativas para cerrar la aplicación realmente. Puedes presionar Cmd + Q cuando la misma está activa. La otra opción es ir a APP_NAME -> Quit en la barra del menú.

Durante esta configuración, se te pedirá cerrar y abrir nuevamente aplicaciones varias veces. Por favor asegúrate de hacerlo correctamente 🙏

Herramientas de la Línea de Comando

Abre una nueva terminal, copia y pega el comando siguiente y presiona Enter:

xcode-select --install

Si obtienes el mensaje que te mostramos a continuación, puedes ignorar este paso e ir al siguiente.

# command line tools are already installed, use "Software Update" to install updates

Este mensaje significa que las herramientas de la línea de comando ya están instaladas y te pide que uses "Software Update" para instalar las actualizaciones. Si no recibes este mensaje, se abrirá una ventana preguntándote si quieres instalar algún programa: haz clic en "Install" y espera.

✔️ Si ves el mensaje "The software was installed", lo que significa que el programa se ha instalado, entonces todo está bien 👍

❌ Si falla el comando xcode-select --install , intenta nuevamente: algunas veces los servidores de Apple se sobrecargan.

❌ Si ves el mensaje "Xcode is not currently available from the Software Update server", debes actualizar el catálogo de actualización de programas:

sudo softwareupdate --clear-catalog

Cuando termines eso, puedes intentar hacer la instalación nuevamente.

Homebrew

Homebrew es un gestionador de paquetes: es un programa que se usa para instalar otros programas desde la línea de comando. ¡Vamos a instalarlo!

Abre la terminal y ejecuta lo siguiente:

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

Te pedirá que confirmes (presionando Enter) y también te pedirá la contraseña de tu cuenta de usuario macOS (la que usas para iniciar sesión cuando reinicias tu Macbook).

⚠️ Cuando escribas tu contraseña no verás nada en la pantalla. Esto es normal. Es una herramienta de seguridad para ocultar tanto el contenido de tu contraseña como su longitud. Simplemente escribe tu contraseña y presiona Enter al terminar.

⚠️ Si ves esta advertencia 👇, ejecuta los dos comandos de la sección Next steps para añadir Homebrew a tu PATH:

# ⚠️ Only execute these commands if you saw this warning ☝
echo 'eval "$(/opt/homebrew/bin/brew shellenv)"' >> ~/.zprofile
eval "$(/opt/homebrew/bin/brew shellenv)"

Si ya tienes Homebrew instalado, el sistema te lo dirá y puedes continuar.

Luego instala algunos programas útiles:

brew update

Si obtienes un error como este: /usr/local must be writable, ejecuta el código que te mostramos a continuación:

sudo chown -R $USER:admin /usr/local
brew update

Ejecuta el siguiente código en tu terminal (puedes copiar y pegar todas las líneas de código al mismo tiempo):

brew upgrade git || brew install git
brew upgrade gh || brew install gh
brew upgrade wget || brew install wget
brew upgrade imagemagick || brew install imagemagick
brew upgrade jq || brew install jq
brew upgrade openssl || brew install openssl

Visual Studio Code

Instalación

Instala el editor de texto Visual Studio Code.

Copia (presionando Cmd + C) el comando de aquí abajo y luego pégalo en tu terminal (con Cmd + V):

brew install --cask visual-studio-code

Luego abre VS Code ejecutando el siguiente comando en tu terminal:

code

✔️ Si se acaba de abrir una ventana de VS Code, todo está bien y puedes continuar 👍

❌ De lo contrario, por favor contacta a un profesor.

Extensiones de VS Code

Instalación

Vamos a instalar algunas extensiones útiles de VS Code.

Copia y pega los siguientes comandos en tu terminal:

code --install-extension ms-vscode.sublime-keybindings
code --install-extension emmanuelbeziat.vscode-great-icons
code --install-extension github.github-vscode-theme
code --install-extension MS-vsliveshare.vsliveshare
code --install-extension rebornix.ruby
code --install-extension dbaeumer.vscode-eslint
code --install-extension Rubymaniac.vscode-paste-and-indent
code --install-extension alexcvzz.vscode-sqlite
code --install-extension anteprimorac.html-end-tag-labels

Aquí está la lista de las extensiones que estás instalando:

• Sublime Text Keymap and Settings Importer
• VSCode Great Icons
• Live Share
• Ruby
• ESLint
• Paste and Indent
• SQLite

Configuración de Live Share

Visual Studio Live Share es una extensión de VS Code que te permite compartir el código en tu editor de texto para debugging y pair-programming: ¡Instalémoslo!

Abre VS Code desde tu terminal escribiendo code y presionando Enter.

Haz clic en la pequeña flecha de la parte inferior de la barra de la izquierda:

• Haz clic en el botón "Share". Luego en "GitHub (Inicia sesión usando tu cuenta GitHub)".
• Va a aparecer una ventana emergente pidiéndote que inicies sesión con GitHub: Haz clic en "Allow".
• Te redireccionarán a una página GitHub en tu navegador pidiéndote que autorices Visual Studio Code: Haz clic en "Continue" y luego en "Authorize github".
• Es posible que VS Code muestre más ventanas emergentess: Ciérralas haciendo clic en "OK".

Eso es todo. ¡Ya puedes continuar!

Tema de la Terminal en macOS

Abre una terminal. Haz clic en Terminal > Preferences y coloca el tema llamado "Pro" como perfil predeterminado.

En la pestaña "Ventana", configura también tu Tamaño de la ventana a Columnas: 200, Filas: 50

Cierra y reinicia tu terminal: ahora debería tener un fondo negro que no te cansa tanto la vista.

Oh-my-zsh

Instalemos el plugin zsh Oh My Zsh.

Ejecuta este comando en la terminal:

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

Si te preguntan "Do you want to change your default shell to zsh?", presiona Y

Cuando termines, tu terminal debería lucir así:

✔️ Si es el caso, puedes continuar 👍

❌ Si no, por favor pídele ayuda a un profesor.

GitHub CLI

CLI es una abreviación de Command-line Interface que significa interfaz de línea de comando.

En esta sección usaremos GitHub CLI para interactuar directamente con GitHub desde la terminal.

Ya debería haberse instalado en tu computadora con los comandos que ejecutaste anteriormente.

Lo primero que hay que hacer para iniciar sesión es copiar y pegar el comando siguiente en tu terminal:

⚠️ NO edites el email

gh auth login -s 'user:email' -w

gh le hará algunas preguntas:

What is your preferred protocol for Git operations? Con las flechas, elige SSH y presiona Enter. SSH es un protocolo para iniciar la sesión utilizando claves SSH en lugar de la famosa pareja nombre de usuario y contraseña.

Generate a new SSH key to add to your GitHub account? Presiona Enter para pedirle a gh que genere las claves SSH por ti.

Si ya tienes claves SSH, verás en su lugar Upload your SSH public key to your GitHub account?Con las flechas, selecciona la ruta de tu archivo de clave pública y pulsa Intro.

Enter a passphrase for your new SSH key (Optional). Pon algo que quieras y que recuerdes. Es una contraseña para proteger tu private key que está almacenada en tu disco duro. Luego presiona Enter.

Title for your SSH key. Puede dejarlo en la propuesta "GitHub CLI", presiona Enter.

Obtendrás el siguiente resultado:

! First copy your one-time code: 0EF9-D015
- Press Enter to open github.com in your browser...

Selecciona y copia el código (0EF9-D015 en el ejemplo) y luego presiona Enter.

Tu navegador se abrirá y te pedirá que autorices GitHub CLI para usar tu cuenta GitHub. Acepta y espera un poco.

Regresa a la terminal, presiona Enter nuevamente y listo. Eso es todo.

Para verificar que están conectado correctamente, escribe lo siguiente:

gh auth status

✔️ Si obtienes este mensaje: Logged in to github.com as <YOUR USERNAME> , significa que todo está bien 👍

❌ De lo contrario, contacta a un profesor.

Dotfiles (configuración estándar)

Los hackers aman mejorar sus shells y sus herramientas.

Comenzaremos con una configuración predeterminada proporcionada por Le Wagon: lewagon/dotfiles.

Tu configuración es personal, así que necesitas tu propio repositorio para almacenarla. Haz el fork del repositorio de Le Wagon.

Hacer un fork significa crear un nuevo repositorio en tu propia cuenta GitHub $GITHUB_USERNAME/dotfiles el cual es idéntico al original de Le Wagon y que podrás modificar como quieras.

Abre tu terminal y ejecuta los siguientes comandos:

export GITHUB_USERNAME=`gh api user | jq -r '.login'`
echo $GITHUB_USERNAME

✔️ Deberías ver tu usuario GitHub en la pantalla.

❌ Si no es el caso, no des un paso más y pide ayuda. Es posible que haya un problema con el paso anterior (gh auth).

Es hora de hacer el fork del repositorio y clonarlo en tu computadora:

mkdir -p ~/code/$GITHUB_USERNAME && cd $_
gh repo fork lewagon/dotfiles --clone

Instalación de Dotfiles

Ejecuta el instalador de dotfiles:

cd ~/code/$GITHUB_USERNAME/dotfiles
zsh install.sh

Verifica los emails registrados en tu cuenta GitHub. Deberás seleccionar uno en el paso siguiente:

gh api user/emails | jq -r '.[].email'

✔️ Si ves una lista de tus emails registrados, puedes continuar 👍

❌ De lo contrario, por favor haz la autenticación en GitHub nuevamente antes de ejecutar este comando ☝️ again.

Instalación de git

Ejecuta el instalador de git:

cd ~/code/$GITHUB_USERNAME/dotfiles && zsh git_setup.sh

☝️ Esto te pedirá tu nombre (FirstName LastName) y tu email. Cualquier correo que elijas se mostrará públicamente en internet. 💡 Selecciona la dirección @users.noreply.github.com si no quieres que tu correo electrónico aparezca en los repositorios públicos a los que puedas contribuir.

⚠️ Necesitas poner uno de los emails que aparecen arriba gracias al comando anterior gh api .... De lo contrario, Kitt no podrá hacerle seguimiento a tu progreso.

Ahora resetea tu terminal ejecutando lo siguiente:

exec zsh

rbenv

Instala rbenv, un programa para instalar y gestionar entornos ruby.

Primero debemos limpiar cualquier instalación previa de Ruby que tengas en tu computadora:

rvm implode && sudo rm -rf ~/.rvm
# If you got "zsh: command not found: rvm", carry on. It means `rvm` is not
# on your computer, that's what we want!

sudo rm -rf $HOME/.rbenv /usr/local/rbenv /opt/rbenv /usr/local/opt/rbenv

⚠️ Este comando te puede pedir tu contraseña.

⚠️ Cuando escribas tu contraseña no verás nada en la pantalla. Esto es normal. Es una herramienta de seguridad para ocultar tanto el contenido de tu contraseña como su longitud. Simplemente escribe tu contraseña y presiona Enter al terminar.

Ejecuta lo siguiente en tu terminal:

brew uninstall --force rbenv ruby-build
exec zsh

Luego ejecuta esto:

brew install rbenv

Ruby

Instalación

Ahora estás listo para instalar la última versión de ruby y ponerla como la versión predeterminada.

Corre este comando, tomará un tiempo (5-10 minutos)

rbenv install 3.1.2

Cuando la instalación de ruby termine, corre este comando para decirle al sistema que use la versión 3.1.2 por defecto.

rbenv global 3.1.2

Reinicia tu terminal y chequea tu versión Ruby:

exec zsh

Luego ejecuta esto:

ruby -v

✔️ Si ves algo que comience por ruby 3.1.2p, entonces puedes continuar +1:

❌ Si no es el caso, pídele ayuda a un profesor.

Instalación de algunas gemas

Si estás en China 🇨🇳 haga clic aquí

⚠️ Si estás en China, deberías actualizar la forma de instalar las gemas con los siguientes comandos.

# China only!
gem sources --remove https://rubygems.org/
gem sources -a https://gems.ruby-china.com/
gem sources -l
# *** CURRENT SOURCES ***
# https://gems.ruby-china.com/
# Ruby-china.com must be in the list now

Todos, todas, en China o no, continúen aquí para instalar gemas.

En el universo de ruby, a las librerías externas se les llama gems: son pedazos de código ruby que puedes descargar y ejecutar en tu computadora. ¡Instalemos algunas!

Primero, vamos a actualizar bundler, que es lo que nos permite instalar gemas:

gem update bundler

En tu terminal, copia y pega el siguiente comando:

gem install colored faker http pry-byebug rake rails rest-client rspec rubocop-performance sqlite3:1.7.3 activerecord:7.1.3.2

✔️ Si obtienes xx gems installed, entonces todo está bien 👍

❌ Si obtienes el siguiente error:

ERROR: While executing gem ... (TypeError)
incompatible marshal file format (can't be read)
format version 4.8 required; 60.33 given

Ejecuta el siguiente comando:

rm -rf ~/.gemrc

Ejecuta el comando nuevamente para instalar las gemas.

⚠️ ¡NUNCA instales una gema con sudo gem install! Incluso si encuentras una solución en Stackoverflow (o la terminal) diciéndote que lo hagas.

Node.js

Node.js es un JavaScript runtime para ejecutar código JavaScript en la terminal. Instálalo con nvm, aun gestionador de versiones para Node.js.

En una terminal, ejecuta estos comandos:

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | zsh
exec zsh

Luego corre el siguiente comando:

nvm -v

Deberías ver una versión. Si no, pídele ayuda a tu profesor.

Ahora instala node:

nvm install 16.15.1

Cuando termine la instalación, corre lo siguiente:

node -v

Si ves v16.15.1, the installation succeeded ✔️ entonces ahora puedes ejecutar lo siguiente:

nvm cache clear

❌ De lo contrario, contacta a un profesor.

yarn

yarn es un gestor de paquetes para instalar librerías JavaScript. Instálalo:

En una terminal, ejecuta los siguientes comandos:

npm install --global yarn
exec zsh

Luego ejecuta este comando:

yarn -v

✔️ si ves una versión, entonces todo está bien 👍

❌ Si no es el caso, pídele ayuda a un profesor

SQLite

En algunas semanas hablaremos de bases de datos y de SQL. SQLite es un sistema utilizado en bases de datos para ejecutar consultas SQL en bases de datos de un solo archivo. Vamos a instalarlo:

En un terminal, ejecuta los siguientes comandos:

brew install sqlite

A continuación, ejecuta el siguiente comando:

sqlite3 -version

✔️ Si ves una versión, puedes continuar 👍

❌ Si no, pídele ayuda a un profesor

PostgreSQL

A veces SQLite no es suficiente y necesitaremos una herramienta más avanzada llamada PostgreSQL. Esta es un sistema para bases de datos de código abierto y listo para usar en producción.

Vamos a instalarlo ahora.

Ejecuta los siguientes comandos:

brew install postgresql@15 libpq
brew link --force libpq

brew services start postgresql@15

Cuando termines, verifica que funcione:

psql -d postgres

Deberías ver un nuevo mensaje como este 👇

psql (15.2)
Type "help" for help.

postgres=#

✔️ Si es asi, escribe \q y luego presiona Enter para cerrar el programa. Puede continuar 👍

❌ Si no, pídele ayuda a un profesor

Chequeo

Verifiquemos si has instalado todo bien.

Ejecuta el siguiente comando en tu terminal:

exec zsh

Luego ejecuta lo siguiente:

curl -Ls https://raw.githubusercontent.com/lewagon/setup/master/check.rb > _.rb && ruby _.rb && rm _.rb || rm _.rb

✔️ Si obtienes un mensaje verde diciendo Awesome! Your computer is now ready!, significa que tu computadora está lista y que todo está bien 👍

❌ De lo contrario, habla con tu profesor.

Kitt

⚠️ Si recibiste una invitación por email de Le Wagon para crear una cuenta en Kitt (nuestra plataforma de aprendizaje), ignora este paso y sigue las instrucciones en el email si es que todavía no lo has hecho.

Si no sabes que hacer, haz clic en este enlace. Si ya iniciaste sesión, puedes omitir esta sección. Si no, haz clic en Enter Kitt as a Student. Esto significa iniciar sesión como estudiante. Si no tienes problemas para iniciar sesión, puedes omitir este paso. De lo contrario pídele a un profesor que te confirme si debiste haber recibido o si debes seguir las instrucciones de aquí abajo.

Registrate como alumni de Le Wagon yendo a kitt.lewagon.com/onboarding. Selecciona tu batch, inicia sesión con GitHub y completa toda la información que te piden.

Ahora tu profesor podrá validar que realmente eres parte del batch. Pídele que lo haga justo después de que hayas completado el formulario de registro.

Cuando el profesor haya aprobado tu perfil, ve a la bandeja de entrada de tu email. Deberías tener 2 nuevos emails:

• Uno de Slack, invitándote a la comunidad de los alumni de Le Wagon en slack (donde podrás chatear con tus compañeros y todos los demás alumni). Haz clic en Join y completa la información que te piden.
• Otro de GitHub, invitándote a lewagon team. Acéptala, de lo contrario no podrás acceder a las diapositivas de las clases.

Slack

Slack es una plataforma de comunicación popular en la industria tech.

Instalación

Descarga la aplicación Slack e instálala.

⚠️ Si ya estás usando Slack en tu navegador, por favor descarga e instala la aplicación de escritorio la cual tiene todas las funciones.

Parámetros

Abre la aplicación e inicia sesión en lewagon-alumni.

Asegúrate de subir una foto para tu perfil 👇

La idea es tener Slack abierto todo el día para compartir enlaces útiles / pedir ayuda / decidir dónde almorzar / etc.

Para asegurarte de que todo lo relacionado a videollamadas funcione bien, prueba tu cámara y tu micrófono:

• Abre la aplicación Slack
• Haz clic en tu foto de perfil en la esquina superior derecha
• Selecciona "Preferencias" en el menú.
• Haz clic en "Audio y vídeo" en la columna de la izquierda.
• Debajo de "Solución de problemas", haz clic en "Ejecutar una prueba de audio, vídeo y pantalla compartida". La prueba se abrirá en una nueva ventana.
• Comprueba que tus dispositivos preferidos de altavoz, micrófono y cámara aparecen en los menús desplegables y haz clic en "Iniciar prueba"
• Haz clic en el botón verde "Start test"

✔️ Cuando termine el test deberías ver mensajes de "Succeed" en verde por lo menos para tu micrófono y tu cámara. 👍

❌ Si no es el caso, contacta a un profesor.

¡También puedes instalar la aplicación Slack en tu smartphone e iniciar sesión en lewagon-alumni!

Parámetros de macOS

Seguridad

Es imperativo proteger tu sesión con una contraseña. Si todavía no es el caso, ve a  > System Preferences > Users & Groups y cambia la contraseña de tu computadora. Luego ve a  > System Preferences > Security > General. Configura el sistema para que pida la contraseña cada 5 seconds después de regresar de la opción suspender y cuando se active el protector de pantalla.

También puedes ir a  > System Preferences > Mission Control y haz clic en el botón Hot Corners abajo a la izquierda. Selecciona la opción donde al hacer clic en la esquina inferior derecha se active el protector de pantalla. De esa manera al dejar tu escritorio podrás bloquear tu pantalla rápidamente poniendo el cursor del ratón en la esquina inferior derecha. En 5 segundos tu Macbook se bloqueará y te pedirá la contraseña para volver a tu sesión.

Teclado

A medida que te vayas convirtiendo en programador, entenderás que pierdes tiempo cuando quitas las manos del teclado para usar otra herramienta. Por esa razón es importante aprender a minimizar el uso del trackpad o del ratón. Aquí te mostramos algunos trucos para que lo hagas en macOS.

Velocidad del teclado

Ve a  > System Preferences > Keyboard. Coloca a Key Repeat en la posición más rápida (a la derecha) y a Delay Until Repeat en la posición más corta (a la derecha).

macOS para hackers

Lee este script y selecciona algunas cosas que creas que serán útiles para ti. Por ejemplo, puedes escribir lo siguiente en la terminal:

# Expanding the save panel by default
defaults write NSGlobalDomain NSNavPanelExpandedStateForSaveMode -bool true
defaults write NSGlobalDomain PMPrintingExpandedStateForPrint -bool true
defaults write NSGlobalDomain PMPrintingExpandedStateForPrint2 -bool true

# Save screenshots to the Desktop (or elsewhere)
defaults write com.apple.screencapture location "${HOME}/Desktop"

# etc..

Anclaje de aplicaciones a tu dock

Usarás frecuentemente casi todas las aplicaciones que has instalado hoy. ¡Anclémoslas a tu dock para que estén a solo un clic de ti!

Para ello, inicia la aplicación. Haz clic derecho en el ícono de la barra de tareas para hacer que aparezca el menú contextual (también llamado emergente) y selecciona "Options" y después "Keep in Dock".

Ancla lo siguiente:

• Tu terminal
• Tu explorador de archivos
• VS Code
• Tu navegador de Internet
• Slack
• Zoom

¡Fin de la configuración!

Tu computadora está lista para el curso de Desarrollo Web de Le Wagon 💪 👏

Disfrútalo, sabemos que te va a ir genial 🚀