Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/sebastiandotdev/team-saturday


https://github.com/sebastiandotdev/team-saturday

Last synced: 25 days ago
JSON representation

Awesome Lists containing this project

README 

        
# Proyecto Syntactic 



## Creando una Red Social



## descripcion



Instagram, Snapchat, Twitter, Facebook, Twitch, Linkedin, etc. Las redes sociales han invadido nuestras vidas. Las amamos u odiamos, y muchos no podemos vivir sin ellas.



Hay redes sociales de todo tipo y para todo tipo de intereses. Por ejemplo, en una ronda de financiamiento con inversionistas, se presentó una red social para químicos en la que los usuarios podían publicar artículos sobre sus investigaciones, comentar en los artículos de sus colegas, y filtrar artículos de acuerdo a determinadas etiquetas o su popularidad, lo más reciente, o lo más comentado.



## Resumen del proyecto

En este proyecto construirás una Red Social sobre lo que decidas tú. Podría ser, por ejemplo, sobre alimentación saludable, feminismo, educación, salud, energías renovables, amantes de las Empanadas o de los Tacos de Canasta, de la Feijoada, o de lo que sea.



Tu Red Social tendrá que permitir a cualquier usuario crear una cuenta de acceso y loguearse con ella; crear, editar, borrar y "likear" publicacciones.



## Aprendizajes



#### HTML y CSS

 - HTML semántico

 - CSS flexbox

 - Construir tu aplicación respetando el diseño realizado (maquetación).

#### DOM y Web APIs

 - Manipulación dinámica del DOM

 - History API

 - localStorage

#### Javascript

 - Uso de callbacks

 - Consumo de Promesas

 - Uso ES modules (import | export)

#### React

  - Estados

  - Hooks

  - Components

  - Props

#### Firebase

 - Firestore

 - Firebase Auth

 - Firebase security rules

 - Uso de onSnapshot | onAuthStateChanged

#### Git y Github

 - Colaboración en Github

 - Organización en Github

#### Buenas prácticas de desarrollo

 - Modularización

 - Nomenclatura / Semántica

 - Linting



## Criterios



- Debe ser una SPA.

- Debe ser responsive.

- Hicieron pruebas de usabilidad e incorporaron el feedback de los usuarios como mejoras.

- Desplegaron su aplicación y etiquetaron la versión (git tag).



## Diseño de la Interfaz de Usuario

Debes definir cuál será el flujo que seguirá el usuario dentro de tu aplicación y, con eso, diseña la Interfaz de Usuario (UI por sus siglas en inglés) que siga este flujo.



* Debe verse bien en dispositivos de pantallas grandes (computadoras/es, laptops, etc.) y pequeñas (tablets, celulares, etc.). Te sugerimos seguir la técnica de mobile first (más detalles sobre esta técnica al final).



## Consideraciones técnicas UX

- Hacer al menos 2 entrevistas con usuarios.

- Hacer un prototipo de baja fidelidad.

- Asegurarte de que la implementación en código siga los lineamientos del diseño.



## Consideraciones técnicas Front-end

- Contar con múltiples vistas. Para esto, tu aplicación debe ser una [Single Page Application (SPA)](https://es.wikipedia.org/wiki/Single-page_application)

- Alterar y persistir datos. Los datos que agregues o modifiques deberán persistir a lo largo de la aplicación. Te recomendamos que uses Firebase para eso también.

- 

## Entrega

El proyecto será entregado subiendo tu código a GitHub (commit/push) y la interfaz será desplegada usando GitHub pages u otro servicio de hosting que puedas haber encontrado en el camino.



**Buena suerte...**