A mí me funciona

El blog de Ignacio Cruz
logo-apple-arcoiris.com

Configura tu Mac para desarrollo en un pispás

5 jun. 2020
·
  • Configuraciones
·
  • Apple
  • composer
  • Git
  • homebrew
  • mac
  • npm

Inspirado por el post de Tania Rascia, quería escribir sobre el setup que tengo hecho en mi Mac y aprovechar para explicar una manera de hacerlo de forma automática. Al contrario que ella, yo no he tenido que formatear mi Mac en años e incluso cambiando de equipo lo he necesitado hacer. Tengo un Airport Time Capsule de Apple (ya extinto) en el que cada día se almacena una copia del Mac. En dos o tres ocasiones en los últimos 5 años he necesitado reinstalar todo sin necesidad de empezar de cero gracias a este aparatejo.

A pesar de todo, me interesaba crear alguna forma automática con la que, lanzando un script, pudiera instalar todo lo que necesito mientras me voy a duchar. Y resulta que es posible, gracias especialmente a Homebrew.

El repositorio de todo esto está aquí: https://github.com/igmoweb/mac-setup con un README más o menos explicando lo mismo pero en inglés y con un script.sh para ejecutarlo todo.

Homebrew

Es lo primero que debemos instalar en el Mac. Homebrew es un gestor de paquetes para Mac con el que podemos instalar paquetes desde la línea de comandos, como APT en algunas distribuciones de Linux. Instalarlo es muy sencillo:

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

# Nos aseguramos de que brew se ha instalado bien y está actualizado
brew update

Homebrew va a hacer la mayor parte del trabajo para nosotros gracias a su comando brew cask, que nos deja instalar Apps así que atención al siguiente comando:

brew cask install \
  phpstorm \
  sublime-text \
  atom \
  google-chrome \
  firefox \
  iterm2 \
  docker \
  vlc \
  1password \
  lastpass \ 
  alfred \
  anki \
  insomnia \
  spotify \
  google-backup-and-sync \
  feedly \
  oversight \
  filezilla \
  kap \
  local \
  mamp \
  omnidisksweeper \
  pocket \
  rar \
  skype \
  timemachineeditor \
  zoomus \
  screenflow \
  cacher \
  bear \
  eddieantonio/eddieantonio/imgcat

Con esto, la mayor parte del trabajo ya está hecho  🎉. Aquí explico algunas de ellas:

  • PhpStorm: Mi editor de código preferido.
  • Sublime Text: Otro editor más sencillo.
  • Atom: Otro más que puede que termine desapareciendo de la lista.
  • iTerm2: Un gestor de ventanas del terminal de Mac
  • VLC Media Player: Reproductor de vídeo.
  • 1Password: Mi gestor de contraseñas.
  • Alfred: Gestor de flujos de trabajo. Me ayuda con la automatización de tareas.
  • Anki: Una app para aprender por repetición.
  • Insomnia: Ayuda a hacer pruebas con REST APIs.
  • Google Backup and Sync: Un nombre feísimo para la App que sincroniza Drive con tu equipo.
  • Feedly: Gestión de feeds de los sitios que sigo.
  • Oversight: Una pequeña aplicación de seguridad que me alerta si el micrófono o cámara se están usando.
  • Kap: Aplicación Open Source para grabar la pantalla y hacer GIFs de forma rápida.
  • MAMP: Un entorno de desarrollo simple. No es el que uso habitualmente.
  • Local: Otro entorno de desarrollo. Tampoco lo uso habitualmente.
  • OmniDiskSweeper: Me sirve para hacer limpieza del disco duro.
  • Pocket: Para guardar los artículos pendientes de leer y nunca jamás volverlos a leer.
  • RAR: En ocasiones veo RARs
  • ScreenFlow: Edición de vídeo y screencasts.
  • TimeMachineEditor: Permite editar la frecuencia de Time Machine en el Mac.
  • VirtualBox: Software de virtualización. Lo uso con Vagrant.
  • Cacher: Para guardar snippets de código.
  • Bear: Es mi editor de notas habitual.
  • imgcat: Una herramienta para el terminal para hacer cat pero con imágenes.

Y alguna configuración adicional necesaria:

Alfred

Recomiendo cambiar la carpeta de ajustes de Alfred a la de Drive, para no perder ningún cambio.

PhpStorm

Mis ajustes de PhpStorm están en un repositorio: https://github.com/igmoweb/storm-settings (privado, lo siento). El tema que uso es Dark Purple con algún cambio que otro. Si quieres configurar PhpStorm para sincronizar los ajustes con Git, puedes seguir esta guía.

Time Machine Editor

Mi configuración es crear un backup todos los días pero fuera del horario de 20:00 a 8:00.

Git

brew install git

Otras aplicaciones

Estas aplicaciones no se pueden instalar de forma automática porque son de pago o porque no están en Homebrew:

Backups de Bear

Esto es más complicado porque Bear es de pago y yo uso la versión gratuita. En esta no te deja fácilmente crear respaldos de tus notas así que hay que utilizar crontab en Mac para crear copias periódicamente. Este script crea copias todos los días a las 11 de la mañana:

cat <<EOT > ~bin/bear-backup
#!/usr/bin/env bash

rm -rf ~/Drive/Bear/db-backup
cp -r ~/Library/Group\ Containers/9K33E3U3T4.net.shinyfrog.bear/Application\ Data ~/Drive/Bear/db-backup
EOT
sudo chmod 755 ~/bin/bear-backup

Ahora habría que añadir el script al crontab con crontab -e y luego insertar la siguiente línea:

0 11 * * * ~/bin/bear-backup

Extensiones de Chrome

Mis extensiones de Chrome. Si las tienes instaladas en el navegador y haces login en Chrome, se deberían instalar automáticamente:

  • Cacher: Permite copiar snippets desde cualquier sitio y pegarlos en Cacher.
  • 1Password
  • Form Save and Restore: Guarda el contenido de un formulario y lo rellena cuando quieras (para hacer pruebas, parece que ya no existe)
  • Grammarly for Chrome. Para corregir fallos gramaticales.
  • Guarda la imagen como quieras: Guarda imágenes en cualquier formato.
  • JSON viewer: JSON/JSONP highlighter.
  • Keepa: Es un tracker de precio para Amazon. Cuando veas cualquier producto, aparecerá una gráfica con la evolución de su precio.
  • React and Redux developer tools.
  • React Performance dev tool.
  • Save to Pocket
  • ZenHub for GitHub: Para gestionar proyectos dentro de GitHub.

Shell

Utilizo Oh My Zsh para mejorar mi terminal:

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

El tema que uso en mi terminal es powerlevel10k Theme.

git clone --depth=1 https://github.com/romkatv/powerlevel10k.git $ZSH_CUSTOM/themes/powerlevel10k

A continuación abre tu fichero .zshrc y reemplaza el valor ZSH_THEME por ZSH_THEME="powerlevel10k/powerlevel10k"

(Si ya has instalado Sublime Text puedes abrir el fichero con subl -a ~/.zshrc

Tengo alguna personalización en mi archivo.zshrc:

alias para Shell

Para listar todos los archivos en una carpeta, incluyendo los ocultos.

cat <<EOT >> ~/.zshrc
alias laxo='ls -laxo'
EOT

Alias para Git (Si has instalado hub previamente)

cat <<EOT >> ~/.zshrc
alias git='hub' # Only if you have installed hub. It adds more features to git command line
alias pulls='git browse -- pulls' # Opens the current repo PRs list URL.
alias repo='git browse' # Opens the current repo URL.
alias mypulls='git browse -- pulls/igmoweb' # Opens the current repo PRs list URL authored by me.
alias wiki='git browse -- wiki' # Opens the current repo Wiki URL.
alias gprl='git pr list --format="%sC%>(8)%i%Creset %U %n %t% l%n%n"' # Display a list of the current opened PRs with colors.
alias gnpr='git pull-request' # Create a new PR from the current branch to the default branch.
Navigates to a given issue ID. Run issue ID in your terminal.
function issue() {
    git browse -- issues/$1
}
EOT

Prevenir una catástrofe con rm -rf

Para prevenir un mal uso de rm -rf en el terminal, utilizo una función que sobrescribe a la nativa y envía los ficheros a la papelera.

cat <<EOT >> ~/.zshrc
function rm() {
  local path
  for path in "$@"; do
    # ignore any arguments
    if [[ "$path" = -* ]]; then :
    else
      local dst=${path##*/}
      # append the time if necessary
      while [ -e ~/.Trash/"$dst" ]; do
        dst="$dst "$(date +%H-%M-%S)
      done
      /bin/mv "$path" ~/.Trash/"$dst"
    fi
  done
}
EOT

nvm, node and yarn

nvm se encarga ya de todo lo relativo a node y npm:

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.2/install.sh | bash
brew install yarn
export NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm

También añado un plugin de Oh My Zsh para completar comandos de npm:

git clone https://github.com/lukechilds/zsh-better-npm-completion ~/.oh-my-zsh/custom/plugins/zsh-better-npm-completion
cat <<EOT >> ~/.zshrc
plugins+=(zsh-better-npm-completion)
EOT

En principio sólo instalo un paquete global, imgls para listar las miniaturas de las imágenes en una carpeta desde el terminal.

npm install -g imgls

Integración entre Cacher y Alfred

npm install --g alfred-cacher

Configuración de Git

Configuración global

touch ~/.gitconfig

.gitignore global

Muchas veces utilizo un fichero con nombre ignacio.php para añadir modificaciones a WordPress pero que sólo necesito que se aploquen en mi instalación local. Por otra parte, .idea es la carpeta que PhpStorm genera para su caché.

.idea
ignacio.php

PHP and Composer install

Normalmente trabajo dentro de una máquina virtual con Vagrant o Docker pero también instalo PHP localmente para así ejecutar Composer.

Se puede cambiar el 7.2 por cualquier otra versión:

# PHP
curl -s http://php-osx.liip.ch/install.sh | bash -s 7.2
export PATH=/usr/local/php5/bin:$PATH  
php -v 

#Composer
curl -sS https://getcomposer.org/installer | php
sudo mv composer.phar /usr/local/bin/
sudo chmod 755 /usr/local/bin/composer.phar

cat <<EOT >> ~/.zshrc
alias composer="php /usr/local/bin/composer.phar"
EOT

Muchas veces utilizo un script para hacer revisiones de seguridad de manera automatizada. Primero, hay que crear un binario phpcs para acceder de forma global. Si la carpeta ~/bin no existe, habría que crearla.

touch ~/bin/phpcs

Ahora creamos un fichero con lógica en PHP.

cat <<EOT >> ~/bin/phpcs
if (is_file(__DIR__.'/../autoload.php') === true) {
    include_once __DIR__.'/../autoload.php';
} else {
    include_once 'PHP/CodeSniffer/autoload.php';
}

$runner   = new PHP_CodeSniffer\Runner();
$exitCode = $runner->runPHPCS();
exit($exitCode);
EOT
sudo chmod 755 ~/bin/phpcs

Asegúrate de que todo está bien con el comando phpcs --help

Para hacer revisiones de seguridad, hay que crear un fichero con las reglas para el Code Sniffer.

touch ~/phpcs-security.xml
cat <<EOT >> ~/phpcs-security.xml
<?xml version="1.0"?>
<ruleset name="Security">
    <description>Security reviews with PHPCS.</description>

    <file>.</file>

    <!-- Exclude the Composer Vendor directory. -->
    <exclude-pattern>/vendor/*</exclude-pattern>

    <!-- Exclude the Node Modules directory. -->
    <exclude-pattern>/node_modules/*</exclude-pattern>

    <!-- wpcs installed path -->
    <config name="installed_paths" value="/Users/ignacio/.composer/vendor/wp-coding-standards/wpcs" />

    <!-- PHPCS WP Aliases. Needed to execute WP Rules -->
    <autoload>/Users/ignacio/.composer/vendor/wp-coding-standards/wpcs/WordPress/PHPCSAliases.php</autoload>

    <!-- Just check php files -->
    <arg name="extensions" value="php"/>

    <!-- Colors! Nice! -->
    <arg name="colors"/>
    <arg value="s"/>

    <!-- Set of rules we're going to use -->
    <rule ref="WordPress.Security"/>
    <rule ref="WordPress.DB.PreparedSQL"/>
    <rule ref="WordPress.WP.GlobalVariablesOverride"/>
    <rule ref="Squiz.PHP.Eval"/>
    <rule ref="Squiz.PHP.Eval.Discouraged" />
</ruleset>
EOT

Y por último las dependencias necesarias

composer global require phpunit/phpunit squizlabs/php_codesniffer humanmade/coding-standards

Ahora simplemente puedes ejecutar phpcs --standard=~/phpcs-security.xml . para revisar alguna carpeta o ficheros.

Conclusión

Y ya está, no sólo tenemos un ordenador configurado para desarrollar sino para el día a día también. Si ponemos todo en un script podríamos ejecutarlo la próxima vez que instalemos un Mac desde cero pero es verdad que algunas acciones manuales hay que hacer.

RSS