Cómo utilizar Digital Ocean para el desarrollo web en un iPad

Si bien algunas personas han amado las últimas ediciones de los teclados MacBook Pro, otras no. Caigo en el lado de que no me gusten en absoluto, lo que me dejó con una decisión que tomar con mi vieja MacBook Air de 13 ”. ¿Sigo usándolo o busco alternativas?

Después de probar Linux y otras máquinas, recurrí a mi iPad Pro de 9,7 ”y me pregunté si podía hacer todo mi trabajo desde un iPad. Ya tenía mis flujos de trabajo de escritura, edición de audio y video clavados con el iPad, pero había una brecha en mi trabajo de desarrollo web.

Después de investigar un poco, me alegré de descubrir que es bastante posible hacer todo mi trabajo de desarrollo web en un iPad casi de la misma manera que trabajaba en mi MacBook Air. Esto no solo me dio una computadora mucho menos costosa con la que podría reemplazar mi MacBook Air, sino que también me brindó un entorno de trabajo mucho más portátil y enfocado.

Así es como hago el desarrollo web en mi iPad Pro.

Contenido

Concha parpadeante

Ya era un usuario de Vim, por lo que sabía que si podía obtener una buena conexión de sesión de terminal a un proveedor de VPS sólido, podría usar mi configuración actual con pocos cambios (si los hubiera). Si bien ha habido una serie de aplicaciones de terminal para iOS, ninguna de ellas ofrece la característica clave que Concha parpadeante ofrece hacer posible el desarrollo web en un iPad.

El mayor inconveniente de otras aplicaciones de terminal era que se conectaban solo a través de SSH y SSH. Si bien SSH es excelente por todo tipo de razones en una computadora, no es ideal para una conexión un poco menos estable que la que obtienes con iOS. Cuando iOS mata una aplicación en segundo plano, SSH se desconecta. Si está utilizando un dispositivo iOS conectado a una celda, también está cambiando de torre a veces, lo que también elimina las conexiones SSH.

Aquí es donde Mosh en Blink Shell entra. Mosh es muy similar a SSH, pero tiene el beneficio adicional de poder reconectarse con alta confiabilidad cuando regresa a Blink. He tenido conexiones que tienen varios días de antigüedad cuando vuelvo a un proyecto de cliente después de un fin de semana libre.

Blink Shell también ofrece algunas otras sutilezas como reasignar la tecla de escape al bloqueo de mayúsculas. Esto es importante para iOS porque muchos teclados de iOS no tienen una tecla de escape. En lugar de donde normalmente tiene escape, tiene una clave que lo lleva de regreso a la pantalla de inicio de su dispositivo iOS.

Mapeo de modificadores de teclado en Blink Shell para iOS

Para mejorar su seguridad con las conexiones de mayor duración que permiten Blink y Mosh, también puede configurar Blink Shell para que se bloquee después de 10 minutos. Luego, si alguien toma su iPad al azar, como lo hacen mis hijos a veces, Blink está bloqueado y no pueden hacer nada accidentalmente.

Bloqueo automático en Blink Shell

Finalmente, Blink hace un gran trabajo con sus claves SSH. Las claves SSH le permiten iniciar sesión en un servidor sin contraseña y son un componente clave del flujo de trabajo de cualquier desarrollador. Utilizo mis claves SSH con muchos sitios de clientes, Github, Bitbucket y muchos otros lugares mientras configuro implementaciones para clientes.

Pero Blink es solo el componente de iOS para hacer desarrollo web con un iPad. También necesitas un VPS decente para alojar tu trabajo. Aquí es donde recurrí a Digital Ocean.

Océano digital

Tiempo está en un servidor bastante grande para manejar el tráfico que recibe, no necesito la misma configuración para mi entorno de desarrollo. Para cada uno de mis clientes, gano $ 5 / mes Gota de océano digital y ejecutarlo como un sitio de ensayo.

Una vez que haya configurado su gota estándar, deberá agregar algunas cosas, como Mosh, al servidor. Por lo general, corro en Ubuntu, lo que significa que los comandos para instalar Mosh son:

sudo apt-get install python-software-properties
sudo add-apt-repository ppa:keithw/mosh
sudo apt-get update
sudo apt-get install mosh

Después de eso, deberá abrir el puerto para Mosh para que su servidor pueda aceptar su conexión. La mayoría de las gotas solo necesitarán esta única línea para permitir que Mosh acepte las conexiones correctamente.

sudo ufw allow 60000:61000/udp

Si está ejecutando un sistema operativo diferente o tiene otras consideraciones de firewall, entonces Digital Ocean proporciona una guía más completa para configurar Mosh.

Con Mosh configurado para aceptar conexiones, es hora de configurar el editor de código que prefiera. Recuerde, estamos trabajando en terminal, lo que significa que no podemos usar IDE grandes (Entorno de desarrollo integrado). En este caso, podemos utilizar editores como Vim o EMACS.

Si es un usuario de Vim como yo y desarrolla WordPress, puede obtener una copia de mi configuración de Vim en Github.

Puede encontrar una explicación completa de cómo configurar mi configuración de Vim en la página de Github y qué hace exactamente cada componente. Los fundamentos son:

  1. Clona el repositorio en tu directorio personal.
    git clone https://github.com/curtismchale/WPTT-Vim-Config.git ~/.vim
  2. Instale Vundle para administrar la configuración.
    git clone https://github.com/gmarik/Vundle.vim ~/.vim/bundle/vundle
  3. Asegurarse .vimrc y .gvimrc todos apuntan al mismo lugar, lo que permite que esta configuración se utilice en otras plataformas como macOS.
    ln -s /.vim/.gvimrc /.gvimrc && ln -s /.vim/.vimrc /.vimrc
  4. Finalmente, instale las dependencias de Ubuntu.
    sudo apt-get install exuberant-ctags sudo apt-get install ack-grep

Una vez hecho esto, tiene un entorno de desarrollo configurado en su droplet de Ubuntu.

Vim ejecutándose en mi Digital Ocean VPS

Herramientas Web Ergo

A continuación, necesitará un buen navegador web para el desarrollo. Tiempo iCab es muy útil para el trabajo de iOS, Firebug lite es terrible en iOS. El mejor navegador para desarrollar en un iPad es Herramientas Web Ergo.

Tiene un inspector completo para ver qué está haciendo su HTML y CSS.

Por una pequeña tarifa, también tiene una consola JavaScript completa que puede usar para depurar JavaScript.

Finalmente, no solo puede cambiar el tamaño del área visible libremente, sino que también tiene una serie de configuraciones de dispositivo para probar diferentes tamaños de pantalla para todos los dispositivos móviles.

Si está intentando realizar cualquier tipo de desarrollo web y probar dispositivos móviles, Ergo Web Tools es una herramienta imprescindible.

Coda

El componente final de mi configuración de desarrollo web es Coda por Panic. Esta es una pieza crucial porque tiene el motor FTP completo del último Transmit para iOS. Además del motor FTP, Coda es un editor de código capaz.

Lo que extraña con Coda es buscar su código base completo en su servidor y algunas de las herramientas avanzadas de finalización de código que tiene con Vim o EMACS ejecutándose directamente en el servidor. Aún así, utilizo el código con regularidad para mover archivos o para hacer un cambio rápido en algo.

Si está buscando una plataforma de desarrollo web económica, entonces ir con el nuevo iPad y un VPS de $ 5 al mes es difícil de superar. Dado que el iPad se vende por tan solo $ 429 en Canadá, incluso si estoy pagando $ 15 al mes para respaldar los sitios de desarrollo de clientes, solo tengo un gasto anual de poco más de $ 600.

Si actualiza a un iPad Pro, sigue siendo mucho menos costoso que un MacBook Pro. Y con los iPads y iOS cada vez más habilitados cada día, es difícil para mí ver por qué alguna vez tendré que gastar $ 2,000 o más cada pocos años para actualizar mi computadora portátil nuevamente.


Tenemos más ejemplos de flujos de trabajo útiles aquí.


Deja un comentario

Esta web utiliza cookies propias y de terceros para su correcto funcionamiento y para fines analíticos y para mostrarte publicidad relacionada con sus preferencias en base a un perfil elaborado a partir de tus hábitos de navegación. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Ver
Privacidad