BURGER QUEEN

Interface where they can take orders using a tablet, and send them to the kitchen to be prepared neatly and efficiently.

🔨 Technologies

📝 Prototype

The high fidelity prototype was made in Figma.

📈 Lighthouse report

Objetivos de aprendizaje

A continuación puedes ver los objetivos de aprendizaje de este proyecto:

HTML y CSS

• Uso de HTML semántico.
• Uso de selectores de CSS.
• Construir tu aplicación respetando el diseño realizado (maquetación).
• Uso de flexbox en CSS.
• Uso de Media Queries.

JavaScript

• Uso de condicionales (if-else | switch | operador ternario)
• Uso de funciones (parámetros | argumentos | valor de retorno)
• Manipular arrays (filter | map | sort | reduce)
• Manipular objects (key | value)
• Uso ES modules (import | export)
• Diferenciar entre expression y statements.
• Diferenciar entre tipos de datos atómicos y estructurados.
• Uso de callbacks.
• Consumo de Promesas.

Testing

• Testeo unitario.

Estructura del código y guía de estilo

• Organizar y dividir el código en módulos (Modularización)
• Uso de identificadores descriptivos (Nomenclatura | Semántica)
• Uso de linter (ESLINT)

Git y Github

• Uso de comandos de git (add | commit | pull | status | push)
• Manejo de repositorios de GitHub (clone | fork | gh-pages)
• Colaboración en Github (branches | pull requests | |tags)
• Organización en Github (projects | issues | labels | milestones)

Firebase

• Firestore.
• Firebase Auth.
• Firebase security rules.
• Observadores. (onAuthStateChanged | onSnapshot)

React

• JSX
• Componentes class y componentes function
• props
• Eventos en React.
• Listas y keys.
• Renderizado condicional.
• Elevación de estados.
• hooks
• CSS modules.
• React Router.

UX

• Diseñar la aplicación pensando y entendiendo al usuario.
• Crear prototipos para obtener feedback e iterar.
• Aplicar los principios de diseño visual (contraste, alineación, jerarquía)
• Planear y ejecutar tests de usabilidad.

Authors

Carolina Suarez Laura López