<h1>Curso de Pre Work: Buenas prácticas y Entorno de Desarrollo</h1>
<h3>Configurar entorno de trabajo en Windows</h3>
- Activa el Developer mode: Dirígete a settings, luego al apartado de update & security, dentro de este ve a la pestaña For Developers y activa el Developer Mode.
- Activa el Windows Subsystem for Linux: Puedes correr el comando Enable-WindowsOptionalFeature -Online -FeatureName Microsoft-Windows-Subsystem-Linux en PowerShellDirígete al Control Panel, luego a Programs, dentro de este ve a Turn Windows feature on or off y coloca el check en Windows subsystem for linux.
- Descarga Ubuntu: Dirígete al Microsoft store, busca Ubuntu, descargar y configurar username y password.
- Instala Node Js y NPM: Abre la terminal de Ubuntu, corre el comando
curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash y luego de esto corre el comando sudo apt-get install -y nodejs - Instala Visual Studio Code: Desde la página oficial descarga Visual Studio Code, luego ve al apartado de extensiones e instala Remote - WSL para desarrollar en windows basado en linux.
<h3>Introducción a la terminal y línea de comandos</h3>
- Listar directorios: ls, ls -a, ls -l
- Crear y moverse entre los directorios: pwd, mkdir, cd, history
- Crear, editar y mover archivos: touch, nano, mv
- Eliminar archivos: rm
- Eliminar directorios: rm -rf
- Visualizar el archivo: cat, more, tail(últimas 10 líneas del archivo)
- Crear copias de archivos: cat (fileName ) > (copy_fileName)
- Abrir archivo con el programa por defecto: open
<h3>Crear llaves SSH</h3>
- Son la forma qué tenemos para autenticarnos en los servidores
- Las llaves SSH utilizan criptografía asimétrica: tenemos 2 llaves, la pública y la privada
- Nos permiten crear una conexión fácil y segura a servidores
- Creamos la llave desde la terminal con el comando
ssh-keygen -t rsa -b 4096 -C “This is a key” el primer parámetro qué recibe es -t rsa indica qué algoritmo utilizaremos para la creación de estas llaves qué en este caso en rsa, el segundo parámetro es -b 4096 qué indica la cantidad de bits qué tendrá la llave, el último parámetro es -C “comment” qué es un comentario. - Esto nos creará una llave privada y una llave pública con el nombre id_rsa y id_rsa.pub respectivamente
<h3>Configurar la terminal y el editor de código</h3>
- Herramientas principales: Hyper (Terminal multiplataforma), Oh My ZSH (Personalizar aún más nuestra terminal)
- Descargamos Hyper desde https://hyper.is
- Instalar ZSH https://github.com/ohmyzsh/ohmyzsh/wiki/Installing-ZSH o correr el comando sudo apt-get install zsh
- Instalar Oh My ZSH (framework de ZSH) https://ohmyz.sh
- Documentación de temas ZSH https://github.com/ohmyzsh/ohmyzsh/wiki/Themes o correr el comando
curl -Lo install.shhttps://raw.githubusercontent.com/ohmyzsh/ohmyzsh/master/tools/install.sh sh install.sh - Hacer qué ZSH sea el shell por defecto chsh -s /usr/bin/zsh
- Hacer qué Oh My ZSH esté reflejado en hyper abrir el shell de windows ir a settings , luego a edit y al apartado preferences, esto abre un editor de texto, buscamos la configuración de shell con Ctrl+f “shell: ” y le asignamos el texto qué está en “Bash on Windows Example: ‘…’ ” cerramos y abrimos hyper y ya estará configurado
- Modificar temas ZSH ejecutamos el comando nano .zshrc y la variable ZSH_THEME=”af-magic” (acá podemos indicar el tema de nuestra preferencia)
- Hacemos qué vuelva a leer las nuevas configuraciones de este archivo con el comando source .zshrc para qué cambie el tema
<h3>Instalar y configurar Visual Studio Code</h3>
- Instalamos VSC desde https://code.visualstudio.com
- Plugins para desarrollo: git blame (saber los autores de las líneas de código), ESlint (ayuda a verificar errores en el código)
- Instalación de ESlint globalmente en el sistema npm install -g eslint luego inicializamos la configuración de eslint en el proyecto npx eslint --init
- Prettier (corrige automáticamente los errores), color highlight (nos resalta el color qué estamos utilizando en css), Sass (preprocesador de css qué nos ayuda al momento de crear los estilos).
<h3>Developer Tools de Google Chrome</h3>
- Inspector de elementos
- console
- Plugins de react y redux: React Developer Tools, Redux DevTools
<h3>Herramientas de desarrollo BackEnd: JSON Viewer y Postman</h3>
- Plugin: JSON Viewer (facilita la vista de json)
- Instalar Postman para los request
<h3>Git y Github</h3>
- Git es un sistemas de control de versiones qué nos permite llevar un histórico sobre los cambios de nuestro proyecto
Conceptos Básicos
- Repositorio: Estructura de datos qué almacena información sobre archivos o directorios
- Rama: Es la duplicación de un objeto bajo un repositorio
- Github: Red social de programadores, qué permite crear pruebas sobre código, crear integraciones como crear deploy automáticos cada vez qué se haga un merge a la rama máster.
- Instalar Git corriendo el comando sudo apt-get update $ sudo apt-get install git o desde https://gitforwindows.org
Herramientas básicas de Git
- Crear un repositorio: git init
- Cómo está nuestro repositorio: git status
- Agregar los archivos qué están en estado Untracked: git add .
- Agregar los cambios al repositorio: git commit -m “comentario”
- Histórico del repositorio: git log
- Ignorar los cambios en un archivo: git checkout – (fileName)
- Regresar a un commit anterior de nuestro repositorio: Volver a un commit anterior manteniendo los cambios de los últimos commits git reset --soft (idCommit) volver a un commit anterior sin conservar los cambios de los últimos commits git reset --hard (idCommit)
- Como crear una rama: git checkout -b (branchName)
- Cambiarnos de rama: git checkout (branchName)
- Rebase para traernos todos los commits de una rama: git rebase (branchName)
- Hacer un merge para unir dos ramas: git merge (branchName)
<h3>Github: Configuración, repositorio remoto, push y pull</h3>
- Configurar llaves SSH: Ir a setting, apartado SSH and GPG keys, click en New SSH key, agregamos la llave pública qué creamos anteriormente en la consola
- Crear un nuevo repositorio: Ir a New repository, crear el repositorio con un nombre. agregar un licencia e inicializar con un readme
- Clonar el repositorio para modificar de manera local: Ir al home del repositorio, clic en Clone or download, clic en Use SSH, copiamos la dirección del repositorio, abrimos la terminal y corremos el comando git clone(repositoryLink)
