View in English

Ocio Open (Proyecto formativo)

Repositorio de la App y el servidor de Ocio Open.

El proyecto es una red social básica, que permite, potencia y premia la organización de eventos sociales para los empleados de una empresa.

Cliente

image

Open Canarias SL

Documentación del Proyecto

Comenzando

Link de descarga:

Desde Github: https://github.com/rubensantibanezacosta/Ocio_Open

Prerequisitos

Necesitas un entorno de desarrollo con:

Instrucciones de instalación

Clone el repositorio:

git clone https://github.com/rubensantibanezacosta/Ocio_Open

El proyecto consta de 3 partes diferenciadas:

  • Frontend
  • Backend
  • Base de datos

Necesita tener instalado node.js en tu entorno de desarrollo. Version LTS recomendada: https://nodejs.org/es/

Una vez clonado, debe actualizar las dependencias.

cd frontend/
npm install
cd backend/
npm install
  • Para el frontend, se utiliza la función de inicio de sesión de Google, debe crear un ID de cliente creando un nuevo proyecto en el sitio web de desarrolladores de Google: https://console.cloud.google.com/apis

En esta pagina deberá configurar un nuevo proyecto haciendo click en crear crendenciales y Obtener tu Google ClientId.

Captura de pantalla de 2021-11-22 15-04-08

En la sección de Credenciales debera rellenar el campo "URI *" con su dirección de host del frontend. En nuestro caso:

Captura de pantalla de 2021-12-06 11-54-29

Deberá crear el archivo frontend/src/app/config/config.ts y rellenarlo con sus credenciales utilizando el esquema del archivo frontend/src/app//config.ts.example

import { Injectable } from '@angular/core';


@Injectable({
  providedIn: 'root'
})
export class VariablesService {

  variables = {
    googleClientId: "google Client Id",
    googleClientSecret: "Google Client Secret",
    host: "Backend host ", (En nuestro caso 'http://localhost:4000')

  }


  getVariables() {
    return this.variables;
  }
}


  • Para su backend:
  1. Necesita un servidor MySQL funcionando.

  2. Cree la base de datos, en su caso debe llamarse ocio_open

  3. Importe el archivo a su base de datos: Archivo SQL

  4. Debera crear el archivo backend/.env y rellenarlo con sus credenciales utilizando es esquema del archivo backend/.env.example

MySQL

MYSQL_DATABASE=nombre de la base de datos
MYSQL_USER=nombre de usuario
MYSQL_PASSWORD=clave de acceso de MySQL
MYSQL_ROOT_PASSWORD=clave de acceso de MySQL

Mode

NODE_ENV=development

JWT

JWT_SECRET=El secret utilizado para el protocolo Jwt
TOKEN_EXPIRE_TIME=Tiempo de expiración del token en minutos
TOKEN_EXPIRE_TIME_REMEMBER_ME=Tiempo de expiración del token en minutos con la casilla remember me marcada

Api key tokens

Éstas claves se generan automaticamente en la base de datos ejecutando el script:

npm run roleKeysCreate 

para crearlas, o

npm run roleKeysUpdate 

para actualizarlas.

Una vez creadas, copielas y péguelas aqui:

PUBLIC_API_KEY_TOKEN=
ADMIN_API_KEY_TOKEN=

Domains

ACCEPTED_DOMAINS="dominios aceptados para el registro separados por comas. Ejemplo: gmail.com,hotmail.com"

Mail credentials

EMAIL_API_NAME=direccion de email para enviar notificaciones
EMAIL_PASSWORD=contraseña de Api para el email

Frontend End point

FRONTEND_ENDPOINT=http://{dirección donde este alojado el frontend}/eventsbydate/

Mailing

Para el mailing, se ha utilizado una cuenta privada de Google. En su panel de configuración de su cuenta de google, acceda al apartado de SEGURIDAD y habilite la verificación en dos pasos. Captura de pantalla de 2021-12-09 18-20-44

El siguiente paso es acceder al apartado de CONTRASEÑAS DE APLICACIONES, y generar una nueva contraseña.

Captura de pantalla de 2021-12-09 18-22-45

Copie y pegue su dirección de correo electrónico y su clave generada en en archivo .env

Finalmente disfrute del proyecto:

Modo Desarrollador:

backend/
npm run dev
frontend/
ng serve -o

Modo Producción:

backend/
npm run start
frontend/
ng serve -o

Si sigue las instrucciones debera tener arrancados tres servidores:

Disfrute!!!