--- Under construction ---
Proyecto de buscador de series "TV Shows finder" realizado con el Web Starter Kit.
NOTA: Necesitas tener instalado Node JS para trabajar con este Starter Kit:
- Crea tu propio repositorio.
- Descarga este Starter kit desde GitHub.
- No recomendamos que clones este repo ya que no podrás añadir commits.
- Copia todos los ficheros de este Starter kit en la carpeta raíz de tu repositorio.
- Recuerda que debes copiar también los ficheros ocultos.
- Si has decidido clonar este repo, no debes copiar la carpeta
.git
. Si lo haces estarás machacando tu propio repositorio.
- Abre una terminal en la carpeta raíz de tu repositorio.
- Instala las dependencias locales ejecutando en la terminal el comando:
npm install
Una vez hemos instalado las dependencias, vamos a arrancar el proyecto. El proyecto hay que arrancarlo cada vez que te pongas a programar. Para ello ejecuta el comando:
npm start
Este comando:
- Abre una ventana de Chrome y muestra tu página web, al igual que hace el plugin de VS Code Live Server (Go live).
- También observa todos los ficheros que hay dentro de la carpeta
src/
, para que cada vez que modifiques un fichero refresca tu página en Chrome. - También procesa los ficheros HTML, SASS / CSS y JS y los genera y guarda en la carpeta
public/
. Por ejemplo:- Convierte los ficheros SASS en CSS.
- Combina los diferentes ficheros de HTML y los agrupa en uno o varios ficheros HTML.
Después de ejecutar npm start
ya puedes empezar a editar todos los ficheros que están dentro de la carpeta src/
y programar cómodamente.
Estas tareas de Gulp producen el siguiente flujo de archivos:
Nuestro gulpfile.js usa el fichero config.json
de configuración con las rutas de los archivos a generar / observar.
De esta manera separarmos las acciones que están en gulpfile.js
de la configuración de las acciones que están en config.json
.
La estructura de carpetas tiene esta pinta:
src
├─ api // los ficheros de esta carpeta se copian en public/api/
| └─ data.json
├─ images
| └─ logo.jpg
├─ js // los ficheros de esta carpeta se concatenan en el fichero main.js y este se guarda en public/main.js
| ├─ main.js
| └─ events.js
├─ scss
| ├─ components
| ├─ core
| ├─ layout
| └─ pages
└─ html
└─ partials