¡Hola! Sé que estás aquí porque quieres saber cómo instalar y correr el proyecto de este curso, ¡No hay problema! aquí esto yo para guiarte paso a paso con la instalación del mismo.
¿Cómo funciona el proyecto de este curso?
El proyecto de este curso funciona gracias a gulp, gulp es una herramienta que te va a permitir compilar assets y levantar un servidor de desarrollo de manera sencilla y básica.
.
Este tutorial lo explicaré para Linux ¡Espera, no te vayas! Si usas Windows también puede servirte, necesitas tener WSL instalado (Por favor evita desarrollar bajo Windows directamente, es muy difícil virtualizar todo y adaptar los proyectos para que funcionen en Windows)
.
Si quieres saber cómo instalar WSL, te recomiendo que tomes el Curso de Prework: Configuración de Entorno de Desarrollo en Windows además también te servirá para instalar NPM y NodeJS que lo necesitarás.
.
También estaremos usando git así que no te vendría mal el Curso Profesional de Git y GitHub
.
Muy buen, ahora que ya lo tienes ¡Vamos a ello!
Instalación
Muy bien, lo primer es clonar el repositorio del proyecto, para eso nos dirigimos al repositorio del profesor:
.
https://github.com/jggomez/blogeek-platzi
.
Presionas el botón de “clone” y en tu terminal te vas a tu carpeta de proyecto en donde deseas guardarlo y escribes:
git clone git@github.com:jggomez/blogeek-platzi.git
En mi caso estoy usando SSH, si tu no usas SSH (Deberías usarlo) sustituye el enlace del repositorio por el de http.
.
Perfecto, ya tienes el proyecto clonado, sin embargo, este es el proyecto ya terminado, la idea es que tú puedas seguir el curso haciendo lo que el profesor hace, así que tenemos que revertirnos al primer commit, por lo que entramos a la carpeta del proyecto desde la terminal y lo hacemos:
cd blogeek-platzi
git reset 3c39e11 --hard
Al comando reset le estamos pasando el id del primer commit (Puedes consultarlo por medio de un git log), de esta manera reseteamos el proyecto al código boilerplate que usa el profesor.
.
Muy bien, hasta este punto ya tenemos el proyecto, sin embargo, eventualmente en el curso el profesor va a hacer uso de un archivo que no está trackeado por git, así que te tocará crearlo manualmente.
.
Dirígete a public/js y crea una carpeta llamada “config”, dentro de la misma, creaun archivo llamado “ConfigFirebase.js” tal cual, respetando las mayúsculas, deja el archivo vacío, el profesor indicará en el curso cómo llenarlo.
.
Procederemos a levantar ahora si el proyecto, como te mencioné, el proyecto usa gulp, sin embargo, la versión que se utiliza es una versión anterior a la reciente, por lo que tenemos que crear un archivo que nos ayudará a resolver este pequeño problema que impedirá que gulp se ejecute.
.
En la carpeta raíz del proyecto crearemos un archivo llamado “npm-shrinkwrap.json” y dentro colocaremos lo siguiente:
{
"dependencies": {
"graceful-fs": {
"version": "4.2.2"
}
}
}
Guardamos el archivo y nos dirigimos a nuestra terminal, nos ubicamos en la carpeta raíz del proyecto e instalamos las dependencias:
npm install
Para poder usar el comando gulp, debemos tenerlo instalado, así que procederemos a instalarlo de manera global mediante NPM:
sudo npm install --global gulp-cli
Como este comando lo instalará de manera global, debemos ejecutarlo con sudo
.
¡Genial! El proyecto ya está listo para correr, para empezar a trabajar tenemos que levantar el servidor, esto lo hacemos mediante el comando gulp, por lo que en la terminal, desde la raíz de nuestro proyecto simplemente escribimos:
gulp
Esto empezará a compilar los assets y te abrirá el proyecto en el navegador de forma automática, recuerda que para poder trabajar necesitas tener la terminal abierta con el proyecto corriendo, para apagar el servidor, en tu terminal presionas ctrl + c y escribes exit.
.
¡Ahora si a mirar el curso! Espero haberte ayudado ^^
