Code Monkey home page Code Monkey logo

guia_gourmet_paw's Introduction

Hola, soy Iván 🇦🇷 👋

Soy estudiante de Licenciatura en Sistemas de Informacion 👨‍💻, me gusta la programación, las redes y armar cosas de IOT con raspberry pi y arduino. Me he dedicado a la edicion de videos y soporte tecnico para algunas empresas locales de mi ciudad de origen. De vez en cuando realizo actividades de community manager para algunas marcas. Actualmente estoy aprendiendo a utilizar ReactJS En mi tiempo libre, practico un deporte paralimpico llamado Boccia.

Tecnologías:

arduino aws css3 docker firebase html5 illustrator java javascript linux mariadb mongodb mysql nodejs photoshop php postgresql rabbitMQ react symfony

Contacto:

costaivan34_ iv%c3%a1n-costa-a998291b9/

guia_gourmet_paw's People

Contributors

costaivan34 avatar

Watchers

 avatar  avatar

guia_gourmet_paw's Issues

Problemas de Instalación

Problema en instrucciones de instalación

  • Arreglado

Las instrucciones de instalación no eran exactas (faltaba el archivo config.php.example). Es necesario agregar ese archivo para saber las variables que usa el proyecto.

SQL con nombre de SCHEMA fijo

  • Arreglado

En el sql tenía un create schema y use del mismo, lo que forzaba el nombre de la base. Hay que sacarlo de la definición del modelo de datos.

Problema en esquema de validación

Al intentar registrarme, completando todos los campos según la validación indicada, al final obtenía el mensaje “El formulario presenta errores. Por favor, inténtalo de nuevo.” Al mirar en js (porque eso no iba al servidor), encontraba que no validaba pero que además había un error de js:

Screenshot from 2022-01-17 21-32-08

Este error puede deberse a que el HTML es cargado vía innerHTML pero que eso no refresca el DOM, el cual luego es consultado por getElementById y de ahí el “null”.

Esto genera que se “corte” la ejecución de js y no se pueda saber el motivo del error. Hasta aca el error js.

Más allá de cuál es la validación que falla, un form de registro no puede ser tan complejo, pide datos bastante estándar y tampoco esta claro porque se validan por js todos cuando muchas de esas validaciones se pueden hacer desde HTML (y con nada de código). En los casos de teléfono o mail, por ejemplo, la regex es innecesaria dado que el browser sabe validar ambos datos perfectamente con los tipos de input correspondientes. En el caso de la mínima cantidad de caracteres sucede parecido.

Reenfocar todo este esquema de validación, mejorando y aligerando código donde se pueda, sacando funcionalidad especifica y delegándola en el Browser.

Problemas de Frontend

Problemas en el carrusel

Problema de funcionalidad

  • Arreglado

Las flechas se ven abajo y no tienen funcionalidad

Problema de diseño

  • Arreglado

Las imágenes se ven “estiradas”, o se fuerza un tamaño o se acomoda de alguna manera para que se vean “bien”.

Paginación

  • Arreglado

En los lugares que está paginado (listado de restaurantes, resultados de búsqueda, opiniones) tiene comportamiento raro. Ademas, la funcionalidad no esta del todo bien resuelta, muestra todas las páginas, debería mostrar la actual, dos o tres anteriores y dos o tres posteriores, o buscar algún esquema cómodo.

Screenshot from 2021-07-26 20-44-01

Diseño general

  • La fuente es serif y podría buscarse alguna más moderna (opcional)
  • En la imagen de fondo de algunas páginas, habría que ver de hacer un efecto para evitar zonas poco legibles

Screenshot from 2021-07-27 15-02-10

  • Footer parece incompleto

Screenshot from 2021-07-27 14-29-38

Formularios

  • En el de opinión: tiene cantidad máxima de caracteres en 20 para nombre y mail, cambiarlo a algo más razonable (100)
  • Me deja enviar el form de opinión n veces. Está perfecto que lo haga por ajax, pero debería borrar el contenido del form y dar un mensaje de “opinión subida correctamente”.

Mashup

  • Mashup de “Cerca de mi”: Parece incompleto, puede ser?

Paquetes obsoletos

Por algún motivo, el paquete Twig está bloqueado a la rama 2.X, cuando ya existe una rama 3 para el mismo. Esto representa un potencial problema de seguridad, ya sea por el propio paquete como por la versión de PHP que obliga el mismo. Por ejemplo, la versión fijada no permite ser instalado con PHP 8 (Recordar que la 7.4 está por ser discontinuada en menos de 1 año: https://www.php.net/supported-versions.php).

Siempre mantener actualizados los paquetes de composer en la medida de lo posible.

Ojo, si se actualiza la versión de Twig, verificar si tiene retro-compatibilidad con la sintaxis de la versión 2. (miré medio rápido y parece ser idéntica)

Feedback en el Mashup de Mapa

Si uno llega al mashup y no hay nada cerca, estaría bueno un mensajito (si es posible dentro del mapa), que aclare que no existen locales cerca de uno.

Por otro lado, ¿Se cargan todos los locales del sistema, siempre? ¿Eso puede tener impacto en la escalabilidad? ¿Cómo lo resolverías usando los conceptos de PAW?

El directorio de SQL no es de migrations y no esta claro su contenido

La guía de instalación habla de migrations, pero los archivos del directorio sql/ no son migrations ya que se editan en varios commits.

Un esquema de mgirations crea nuevos archivos sql antes cada modificación del modelo, además de establecer un orden en los mismos para poder ejecutar todos los sql que me faltan (pensar si el proyecto ya está en producción, no se puede eliminar la base y crearla de nuevo por un cambio en el modelo (este orden puede ser a través de los nombres de los archivos o en un script).

Por otro lado, la propia guía habla de ejecutar los sql en orden, pero no se especifica en qué orden. O darle algún tipo de orden, o buscar otro esquema.

Problemas de Backend

Encoding de la base

  • En ningún lado se aclara el encoding de la base, sin embargo, esta debe ser latin1 o similar porque la creé en utf8 y muestra mal los caracteres. Lo ideal sería aclarar el encoding en el README, durante el paso correspondiente de la instalación.

Screenshot from 2021-07-26 14-57-54

Notice en intento de Login fallido

  • Arreglado

Al intentar loguearme con un usuario que no existe, en la consola se ve el siguiente NOTICE:

[Fri Jul 30 12:14:31 2021] PHP Notice:  Undefined variable: _SESSION in <proyecto>/Applicacion/app/controllers/UsersController.php on line 47

Form de consultas

  • Arreglado

Al querer enviar una Consulta, me sale este error

[Fri Jul 30 12:19:07 2021] PHP Fatal error:  Uncaught Error: Object of class App\Controllers\SitioController could not be converted to string in <proyecto>/Applicacion/core/Router.php:86
Stack trace:
#0 <proyecto>/Applicacion/core/Router.php(66): App\Core\Router->callAction()
#1 <proyecto>/Applicacion/index.php(16): App\Core\Router->direct()
#2 {main}
  thrown in <proyecto>/Applicacion/core/Router.php on line 86
[Fri Jul 30 12:19:07 2021] 127.0.0.1:57554 [500]: POST /sendConsulta - Uncaught Error: Object of class App\Controllers\SitioController could not be converted to string in <proyecto>/Applicacion/core/Router.php:86
Stack trace:
#0 <proyecto>/Applicacion/core/Router.php(66): App\Core\Router->callAction()
#1 <proyecto>/Applicacion/index.php(16): App\Core\Router->direct()
#2 {main}
  thrown in <proyecto>/Applicacion/core/Router.php on line 86

Del lado del frontend, el error que muestra es

Screenshot from 2021-07-30 12-20-28

Mensajes poco específicos en los errores de validación en el alta de sitio

Cuando un usuario da de alta un sitio, si comete un error, de acuerdo a las reglas de validación, los mensajes no del todos informativos. Por ejemplo:

Screenshot 2022-01-21 at 20-37-56 NUEVO SITIO La Guia Gourmet

  • ¿Por qué se informa que debo escribir algo en la descripción si el campo está completo?
  • ¿Qué tiene de malo la dirección?
  • ¿Qué problema tiene el horario ingresado?

Es así que, por ejemplo, para el caso de la descripción, si el usuario completó el campo pero no llega a la longitud mínima, debería informar algo así como "Requerimos que la descripción cuente con 40 caracteres o más".

Mensajes poco informativos atentan contra la "tasa de conversión" de nuestro sitio, es decir, que el usuario realice una acción determinada que es de nuestro interés.

Tareas a implementar

  • Agregar elementos de SEO al sitio.
  • Mejorar el HTML para hacerlo semántico.
  • Que el sitio sea Responsive (es decir, que en pantallas chicas y en el celular se vea correctamente)
    Sin título3
  • Hacer funcionar correctamente el Mashup de lugares cercanos
    Sin título

Que esté integrado en las diferentes vistas
Que muestre solo las ubicaciones cercanas
Cuando el mapa se desliza, que cargue las nuevas ubicaciones ahí (para hacerlo escalable)
Probar el funcionamiento en el celular

  • Encoding (hacer que la visualización de los caracteres acentuados y otros especiales se visualicen correctamente)
    Sin título2

Objetivo del buscador del mapa poco claro

El buscador del mapa “cercanos” busca sobre todo el mundo y busca localidades, no restaurantes del sistema. O cambiar el placeholder y aclarar eso (por ejemplo Buscar Localidad), o hacer que busque sobre locales gastronómicos (los cargados en el sistema).

Formularios en general y de carga de restaurante en particular

Existe un problema en general con los formularios del sitio y en particular con el de carga de un sitio nuevo. Son varias cosas así que las voy listando por acá:

  • No pueden todos los campos ser obligatorios. Cargar todo es bastante engorroso. Entiendo la dirección pues la ubicación en mapa es importante, pero teléfono y mail obligatorios? Y no hay opción de redes sociales?
  • Me pasó que cargué todo el form con varios días y horarios, y cuando fui a mandar me rebotó el backend porque en la descripción había escrito poco texto. Por JS no me lo aviso, pero lo malo fue que perdí todos los días cargados y el lugar del mapa.
  • Hablando de los días cargados, me parece que de todas las opciones posibles elegiste una poco dinámica y muy rígida. Entiendo lo de intentar dar la posibilidad de que cada día sea un horario diferente, pero en el esquema elegido se pierde por ejemplo la posibilidad de decir que el viernes esta abierto hasta las 2 AM (que ya seria sábado). Se me ocurren otras maneras que hubieran sido mas flexibles y menos engorrosas.

No hay manejo de transacciones a nivel base de datos

Entre los pendientes remitidos por correo, se solicitó que el backend contenga manejo de transacciones. Un ejemplo donde este faltante puede traer problemas es:

public function store(){
// $this->model->insertarSitio($_POST, $_FILES);
$sitio = [
'idSitio' => $_POST['sitio'],
'nombre' => $_POST['nombre'],
'descripcion' => $_POST['texto'],
'telefono' => $_POST['precio'],
'sitioWeb' => $_POST['mail'],
'idUsuario' => $_POST['precio'],
'idCategoria' => $_POST['sabor'],
];
$idSitio= $this->model->agregarSitio($_POST['nameSitio'],$_POST['subject'], $_POST['TelefonoSitio'],
$_POST['MailSitio'],$_POST["username"],1);
if ($idSitio>0){
$this->model->agregarImagenes($_FILES,$idSitio);
$this->model->agregarServicios($_POST['servicios'],$idSitio);
$this->model->agregarHorarios($_POST['Dia-Inicio'],$_POST['Dia-Fin'],$_POST['De-Inicio'],$_POST['Hasta-Fin'],$idSitio);
$this->model->agregarUbicacion($idSitio, $_POST['DireccionSitio'],$_POST['LocalidadSitio'],$_POST['ProvinciaSitio'],$_POST['Longitud'],$_POST['Latitud']);
return 1;
}else{
return 0;
}
}

¿Qué sucede si el proceso que está ejecutando dicho código termina inesperadamente antes de ejecutar la línea 87?

Revisar el uso de tags <section> y <article>

Tomemos por ejemplo el siguiente código:

<article itemscope itemtype="https://schema.org/Restaurant">
<section class="encabezado">
<section class="slideshow-sitio slideshow-container contenedor">
<ul>
<!-- Full-width images with number and caption text -->
{% for N in datos.Imagenes %} {% if loop.index-1 == 0 %}
<li class="mySlides fade" style="display: block;">
<img itemprop="image" src="{{ datos.Imagenes[ loop.index-1 ].path }}" alt="" />
</li>
{% else %}
<li class="mySlides fade" style="display: none;">
<img itemprop="image" src="{{ datos.Imagenes[ loop.index-1 ].path }}" alt="" />
</li>
{% endif %}
{% endfor %}
</ul>
<a class="prev" onclick="plusSlides(-1)">&#10094;</a>
<a class="next" onclick="plusSlides(1)">&#10095;</a>
<!-- The dots/circles -->
<ul style="text-align: center;">
{% for N in datos.Imagenes %} {% if loop.index-1 == 0 %}
<li class="dot activo" onclick="currentSlide( '{{ datos.loop.index-1 }}' )"></li>
{% else %}
<li class="dot" onclick="currentSlide( '{{ datos.loop.index-1}}' )"></li>
{% endif %}
{% endfor %}
</ul>
</section>
<section class="contenedor ">
<section class="fondo">
<h3 itemprop="name" class="title">{{ datos.OneSitio[0].nombre }}</h3>
<section class=" caracteristicas">

Cada restaurante es un <article>, lo cual es correcto debido a que lo podemos considerar un contenido "autocontenido" que es independiente en cierta forma del contexto de la página (es decir, lo saco del sitio y sigue siento un restaurante con determinadas características). Esto adhiere a la especificación de HTML5 para dicho tag.

Ahora bien, si avanzamos un poco más en el código, vemos un sección "encabezado" que contiene otra secciones correspondientes a la galería de imágenes y más adelante a otra sección "contenedor" donde está el nombre del restaurante. Si miramos la especificación de HTML5 para <section>, vemos que nos dice que dicho elemento debe ser usado para un agrupamiento temático del contenido. En consecuencia:

  • ¿Qué justificación tiene el uso de la sección "encabezado"?
  • ¿La sección "contenedor" y la sección "fondo" no están siendo usadas más por una necesidad de presentación que semántica?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.