Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/lucbpz/balazos-web
Balazos - Grupo de versiones en directo
https://github.com/lucbpz/balazos-web
coverband gatsby gatsby-site hacktoberfest react
Last synced: 5 days ago
JSON representation
Balazos - Grupo de versiones en directo
- Host: GitHub
- URL: https://github.com/lucbpz/balazos-web
- Owner: lucbpz
- License: mit
- Created: 2020-02-21T17:21:26.000Z (almost 5 years ago)
- Default Branch: master
- Last Pushed: 2022-12-08T21:58:37.000Z (about 2 years ago)
- Last Synced: 2024-11-08T04:39:32.371Z (about 2 months ago)
- Topics: coverband, gatsby, gatsby-site, hacktoberfest, react
- Language: CSS
- Homepage: http://www.balazosdirecto.com
- Size: 13.5 MB
- Stars: 0
- Watchers: 2
- Forks: 2
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
Balazos - Grupo de versiones. Sitio web construido con Gatsby
- [🎉 Features](#-features)
- [⛵ Lighthouse score](#-lighthouse-score)
- [🏆 SEO component](#-seo-component)
- [✨ Development](#-development)
- [🚚 Deployment](#-deployment)
- [🔮 CMS](#-cms)
- [🏛 Licenses](#-licenses)
## 🎉 Features
Toda la página [web](http://balazosdirecto.com) es una Single Page Application hecha en React y construida por [Gatsby v2](https://www.gatsbyjs.org).
En un principio contaba con un template comprado en [themeforest](https://themeforest.net/), que ha sido migrado (solo las partes que me interesaban) a componentes de React.
Para alimentar los datos, se utiliza GraphQL.
### ⛵ Lighthouse score
Cosas a mejorar:
* Dónde se encuentra alejada la web, ya que es un dominio comprado pero que apunta a otro sitio donde esta web está desplegada de forma gratuita, con lo cual no cuenta con los mejores recursos para renderizarse cuanto antes.
* El vídeo que se carga nada más entrar.
* Accesibilidad.
* Convertir a PWA (¿tiene sentido?)
### 🏆 SEO component
Incluye un componente SEO (actualmente sólo para las tags de la página de inicio, ya que es la única ruta), inspirado en el SEO component de [kremalicious](https://github.com/kremalicious/portfolio).
## ✨ Development
Se puede arrancar perfectamente en local instalando las dependencias
- [] TODO: Dockerizar.
```bash
git clone [email protected]:lucbpz/balazos-web.git
cd balazos-web/
# instalar dependencias y arrancar
npm i
gatsby develop
```
## 🚚 Deployment
El proyecto está montado en un entorno de CI/CD con Travis y Surge.
Los deploys se hacen automáticamente.
- push a `master` hace un trigger de un despliegue a producción.
El comando para hacer deploy no es más que una build de Gatsby, que luego se despliega con Surge.
```bash
npm run build
npm run deploy:dev
```
## 🔮 CMS
El CMS elegido es el CMS de Netlify, el cual funciona de forma super sencilla cuando todo está integrado en la plataforma de Netlify.
Es decir, si alojas la web en Netlify y utilizas NetlifyCMS, no hay ningún problema.
El reto ha sido utilizar Netlify CMS pero alojando la web en otro dominio, y haciendo uso del login que permite Netlify a través de GitHub.
Para ello se ha hecho uso de una Lambda Function en AWS que permite esta integración. Hay varios proyectos que permiten esta integración con AWS.
Documentación de Netlify:
- [oauth-provider-tokens](https://docs.netlify.com/visitor-access/oauth-provider-tokens/#setup-and-settings)
Proyectos para integración NetlifyCMS - OAuth con GitHub:
- [netlify-cms-github-oauth-provider](https://github.com/vencax/netlify-cms-github-oauth-provider)
- [netlify-serverless-oauth2-backend](https://github.com/marksteele/netlify-serverless-oauth2-backend)
## 🏛 Licenses
**© Copyright 2020 Lucas Bernalte**
Todas las imágenes tienen copyright.
Puedes hacer un fork, y partir tu proyecto a partir de aquí, siempre y cuando las imágenes y vídeos que se sirven sean diferentes y se cambie el estilo, ya que es un template de pago.
Para todo lo demás:
**The MIT License**
[Full MIT license text](LICENSE)