Mac:
Usaremos SublimeText3, descargarlo desde la página del desarrollador
Instalar git desde la pagina de desarrollo
Para instalarlo ir a Preferencias del Sistema-Seguridad y Privacidad y permitir aplicaciones descargadas desde "Cualquier sitio". Para ello es necesario introducir contraseña del administrador del equipo. Recordar dejarlo como estaba despues de esta instalación
Comprobar con : git --version
- Descargar nodejs para mac buscandolo con San Google o desde el enlace.
Comprobar que el path sea correcto: echo $PATH. Debe estar includo /usr/local/bin
Comprobar: node --version (4.2.4)
Comprobar: npm --version (2.14.12)
Ir al navegador y buscar browserSync
Copiar el comando de pantalla y ejecutar con sudo (npm install -g browser-sync)
Desde el terminal comprobar: browser-sync --version (2.10.1)
Crear el directorio de trabajo del sitio web y con SublimeText crear la pagina index.html dentro de este directorio. Escribir en este fichero "html" y dar a Ctrl+Espacio, con lo cual observaremos que rellena un guión de la página html. Poner un texto de prueba en el titulo y en el cuerpo.
Dentro del directorio de trabajo, comprobar con terminal:
browser-sync start --server --directory --files "*". Saldrá localhost:3000 en el navegador
Windows:
Poner a Chrome como navegador por defecto.
Instalar Sublime Text 3
Instalar Git:
Seleccionar: Usar git desde linea de comandos
Sel:Usar windows como consola por defecto
-Comprobar desde cmd: git --version (2.6.4.windows.1)
- Bu car download nodejs for windows.
- Instalarlo.
- Cerrar cmd y abrir otro
-Comprobar con nodejs --version (v4.2.4)
- Comprobar: npm --version (2.14.12)
- En el navegador: browser sync
-Copiar el mensaje: npm install -g browser-sync y ejecutar en terminal.
-Salir de terminal y abrir otro nuevo. Poner browser-sync --version (2.10.1)
Crear un repositorio en GitHub
Ir a Settings y pinchar en Launch Automatic Page Generator.
Leer y pinchar en Continue to Layouts
Pincvhar en Publish page
Crear subdirectorio de trabajo. Dentro de éste: git clone https://github.com/jmanuel34/Coursera-test.git
Pasar a coursera-test
-poner git status (Aparece en la rama master)
- Poner: git checkout gh-pages
- git status
- Mkdir site; cd site.
- Ejecutar sublime text
- Insertar un archivo index.html en coursera->coursera-test->site
-Ejecutar git status para comprobar
-Ejecutar "git add . "en la rama más alta. En Coursera-test
- Ejecutar " git commit -m "Mi primera pagina"".
- Exe: "git push" para subirlo
- Dentro del subdirectorio cambiado, exe: browser-sync start --server --directory --files "*"
- Para la sincronizacion. Ver los cambios realizados inmediatamente en Google Chrome:
Exe: browser-sync start --server --directory --files "*"
Recursos: stackoverflow.com
jsfiddle.net.
codepen.io
css-tricks.com
