Home

Bienvenido a la wiki!

Estructura del proyecto

|   index.html                         # Archivo HTML de entrada
|
+---js                                 # Lógica (archivos .js)
|   index.js                           # Lógica de la app
|   login.js                           # Lógica de la página de login
|   registro.js                        # Lógica de la página de registro

+---css                                # Estilos CSS (archivos .css)
|   index.css                          # Estilos de la app
|   login.css                          # Estilos de la página de login
|   registro.css                       # Estilos de la página de registro
|
+---assets                             # Archivos estáticos
|   |   +---img                        # Imágenes
|
|   .gitignore                         # Git: Archivos y directorios ignorados por Git
|   .prettierrc.json                   # Prettier: Configuración de formateo del código
|   package-lock.json                  # Npm: Instantánea del árbol de dependencias
|   package.json                       # Npm: El manifiesto, scripts de desarrollo y dependencias
|   README.md                          # Documentación
|
+---node_modules                       # Npm: Módulos de Node.js

Archivos HTML

index.html: home, registrarse, iniciar sesión, mis reuniones nuevo perfil

reuniones.html: mis reuniones

reunion.html: detalles de reunión, votación completa

nueva-reunion.html: nueva reunión, opciones disponibles, enviar encuesta, confirmación

perfil.html: mi perfil

votaciones.html: votaciones

Consideraciones técnicas

Convenciones de naming

Usar camelCase para el nombre de las variables

let name = 'Juan';

Usar UPPERCASE para el nombre de las constantes

const APP_NAME = 'Mango';

Usar camelCase para el nombre de las funciones

function createHello(name) {
  return `Hello ${name}`;
}

Entorno de desarrollo

VS Code: Extensiones

es6-string-html: resaltado de sintaxis para el código HTML dentro de Javascript

Uso: Agregar el comentario /*html*/ antes del string con el código HTML

title.innerHTML = /*html*/`<h1>Titulo</h1>`

Live server: iniciar un servidor de desarrollo con la capacidad de recargar automáticamente la paǵina cuando hagas un cambio. No hace falta hacer un cambio e ir al navegador a recargar el archivo

Uso: Click derecho sobre el archivo public/index.html y click en "Abrir con Live Server"

Recursos útiles

Diseño