Tienda online a medida y servicios web

Esta tienda online de una pastelería andaluza está hecha “de cero” como una aplicación PHP + MySQL con un diseño y maquetación en XHTML + CSS de Joan Carles Muñoz y una gestión de la arquitectura de la información y posicionamiento de Massimo Grani.

Entre las opciones que posibilita el hacer una aplicación a medida para construir tu tienda online, podemos encontrar la libertad de hacer las cosas a nuestra manera, en este caso era necesario porque los mecanismos de generación de datos de los productos eran dependientes de herramientas externas, es decir, los datos llegaban desde servicios web que podrían tener varias categorías y subcategorías, cada producto tiene diferentes campos, entre los que cabe destacar el precio por litro o kilo o unidad, que tiene diferentes formas de calcularse a la hora de gestionar los pedidos y el stock.

Los stocks además son controlados por medio de llamadas al software residente en la tienda física, en el ordenador del administrador que recibe los pedidos pudiendo corregirlos antes de procesarlos y enviarlos, comunicando los cambios directamente a la web que refleja la información para que el usuario final pueda estar informado.

Entre las tecnologías usadas podemos destacar:

  • AJAX para gestión de stock, carrito, pedidos, etc.
  • Cuentas de diferentes roles, que deben ser confirmadas por el software del administrador para ser válidos en la web, por ejemplo, un tipo de usuario distribuidor puede realizar pedidos de más cantidades,etc. y para eso necesita permisos especiales, estas comprobaciones de usuario se realizan con servicios web
  • Scripts automatizados y meta-programación: cuando se administran contenidos multimedia se pre-configuran para que la información que esté asociada a ella como meta-etiquetas, thumbnails, etc., tengan cabida en su contexto, hay un seguimiento en el back-end para que el administrador lo tenga todo más fácil
  • El front-end dispone de varios efectos realizados en la maqueta, se pueden especificar diferentes temas para la tienda
  • etc

iPasteleria :: app web 2.0

Aplicación Web para restaurante con guarderia – Platos y Noticias

En el año 2007 se realizó la programación de esta web se hizo con el prototipo 0.1.2.7 de zenphp, las plantillas XHTML + CSS son validadas por la herramienta de la W3C.
Mediante la ayuda de la administración interna es posible editar el contenido de la base de datos que se muestra en el cliente.
Se realizan validaciones para formularios en AJAX, en cuanto a la administración, además se permite la creación rápida de categorías para platos, y otros parámetros avanzados, etc.

Las plantillas XHTML + CSS se crearon por Agencia Q4 en el 2007.



Ver en Youtube

Estudio de arquitectura – Proyectos, Galerías, Información

Se utilizó el framework ZENPHP sobre un diseño de Agencia Q4 contra bases de datos de un servidor MySQL y animaciones con Flash y JavaScript en el año 2007.

Se pueden ver como se puede configurar las categorías que se deben mostrar primero, la galería de imágenes y la administración de contenidos : proyectos e información del estudio.

Optimizar PHP con C y C++

Este artículo se compone de:

  1. Introducción
  2. Implementación de un caso real
  3. Resultados
  4. Conclusiones
  5. Comentarios
  6. Futuro: la web 3d

INTRODUCCIÓN C/C++ A TRAVÉS DE PHP:

He estado investigando después de leer una noticia enviada por WebGranada que decía que los chicos de Facebook han hecho una herramienta que transforma el código de PHP a C++ y que al realizar las tareas con lenguaje de la máquina (bajo nivel),como es lógico ,es más rápido ,sin embargo, me preguntaba hasta que punto es más rápido…como no he visto nada serio que me convenza me he decidio por hacer mis propias pruebas con este tipo de construcción de webs a través de lenguaje C/C++ en lugar de PHP, e incluso escribir el código en PHP y pasarlo a C++…

De hecho, esto ya existía desde hace tiempo,…cualquiera puede implementar una herramienta como: The PHP to C++ Translation tool…que no es más que un programa en C++ que analiza sintácticamente un programa en PHP y lo pasa a C++ para que se pueda compilar y colgar en el servidor , por ejemplo la plataforma SWAD está escrita en este lenguaje y la especificación CGI…pero lo difícil es hacerlo bien, como casi siempre jeje

El debate que existe en Internet, ronda, en parte, a la cuestión de que no se va a conseguir una verdadera experiencia de mejora de velocidad en cuanto a interacción y carga de páginas, sobre todo en las que no tienes más de un número máximo, digamos, de más de miles de usuarios…ni tampoco, a la hora de conectarse a la base de datos ya que es algo que no suele mejorarse demasiado de una tecnología a otra ,no más de un 20%…

Sí que se notará cuando se realicen búsquedas y otras operaciones complejas con los datos ya que un programa en C++ está optimizado en memoria mucho más que PHP,siempre y cuando el programador haya llevado cuidado a la hora de escribir el código…además, al funcionar PHP como un módulo (extensión) del Servidor (por ejemplo Apache), tiene sus propios límites de memoria y ciclos de ejecución, darle los datos de entrada a un programa en C++ y que realice tareas complejas es más eficiente según qué casos…

IMPLEMENTACIÓN DE UN CASO REAL


Aquí propongo un ejemplo sencillo para demostrar en qué casos es mejor C++ que PHP, para empezar, si queremos ir probando todo lo que vamos haciendo, podemos crearnos un directorio en nuestro servidor llamado  “c++”, recordar añadirlo al .htaccess:
RewriteRule ^c\+\+(.*) – [PT]
…para que Apache no procese ese directorio con otra regla, (si le ponemos un password mejor)…ahora, un script sencillo para ejecutar programas como si estuviéramos en una consola:
shell.php:

 
<html>
<head>
<script type="text/javascript">
function loadXML(_cmd) {
url="/c++/shell_exec.php";
if (window.XMLHttpRequest) {
// codigo para IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
} else {// para IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET",url+"?cmd="+_cmd,false);
xmlhttp.send(null);
document.getElementById('test').innerHTML=
 xmlhttp.responseText;
if (document.frmT.b.checked)
document.frmT.cmd.value="";
document.frmT.cmd.focus();
}
 
</script>
<title>Exec</title>
</head>
 
<body>
 
<div id="test">
<h2>CONSOLA</h2>
</div>
<form name="frmT" onsubmit="
loadXML(document.frmT.cmd.value); 
return false;">
<input type="text" name="cmd" />
<input type="checkbox" name="b" value="1" id="b"/>
<label for="b">Borrar</label>
</form>
<button type="button" onclick="loadXML(document.frmT.cmd.value);
 return false;">run</button>
</body>
</html>

Este código llamará, usando el truquito AJAX, al siguiente fichero PHP (ojo!: más peligroso):

shell_exec.php

 
$t = trim($_GET['cmd']);
if (empty($t)) die("Escribe un comando chatin");
 
echo $_GET['cmd']."<br />";
echo str_replace("\n","<br />",passthru($_GET['cmd']));


Ahora podemos utilizarlo invocando directamente la URL:


Ya podemos probar nuestros programas en C++ subiéndolos y compilándolos online (si nuestro servidor tiene gcc), o bien, haciendo una llamada al programa compilado directamente por nosotros en local…Para los que son más de Windows, podéis instalar cygwin y descargar las librerías para hacer compilaciones de Linux: crosscompilers for cygwin (existe una versión para 64bits de las librerías), descomprimiéndolas en el directorio cygwin para poder llamar a g++-linux, por Ejemplo para compilar The PHP to C++ Translation tool:

$ g++-linux -o php2cpp php2cpp.cpp

No debe de darnos ningún error o advertencia…ahora podemos usar el comando desde el servidor para pasar un fichero en lenguaje php a un fichero en lenguaje C++ mediante:

./php2cpp entrada.php salida.cpp

de nuevo debemos compilar la salida para obtener un binario…

$g++-linux -o salida salida.cpp

Una vez que tenemos los binarios podemos usar la consola improvisada en el navegador, para dar permisos de ejecución a aquellos mediante
chmod 750 salida

Y entonces podemos cargar el programa desde el servidor como antes (una vez subido,claro)
./salida

Un ejemplo básico de C,sería una búsqueda binaria de datos,por ejemplo de triadas de vértices (x,y,z) de un conjunto de polígonos, dentro de un conjunto mayor,pero para no complicarnos, usaremos un array unidimensional, de valores dobles, un código como el siguiente nos vale:

#include <stdio .h>
#include <time .h>
#define tamanio 500
int busquedaBinaria(double *matrizOrdenada, int primero,
int ultimo, double llave);
 
int main ()
{
clock_t t_antes,t_despues;
double t,aux;
int i,k;
srandom(time(0));
 
for (k=1000; k< =3000; k+=1000){
t_antes = clock();
double *m =  malloc (sizeof(double)*tamanio*k);
for (i=0; i<tamanio*k; i++) {
m[i] = (double) (rand()%1000)+1;
}
 
aux = busquedaBinaria(m,0,tamanio*k,m[(int) (tamanio*k)/2]);
free(m);
t_despues = clock();
t = (((double)(t_despues - t_antes)) / CLOCKS_PER_SEC);
printf("<br><h1>%f</h1>segundos",t);
}
return 0;
}
 
/**
* @brief function busquedaBinaria:
*     Busca desde matrizOrdenada[primero]..
       matrizOrdenada[ultimo] por llave.
*  @returns: indice del elemento encontrado, la llave,
*          en otro caso -(indice donde se puede insertar)-1.
*  @param int matrizOrdenada array de sorted (ascending) values.
*  @param int primero
*  @param int ultimo
*  @llave double llave
*  @return int
*/
int busquedaBinaria(double *matrizOrdenada, int primero,
int ultimo, double llave) {
while (primero < = ultimo) {
// calcula el punto medio
int mid = (primero + ultimo) / 2;
if (llave > matrizOrdenada[mid])
// repite la busqueda si no esta en la mitad
primero = mid + 1;
else if (llave < matrizOrdenada[mid])
// repite la busqueda en la otra mitad
ultimo = mid - 1;
else // encuentra el item, lo devuelve
return mid;
}
// no encontrado
return -(primero + 1);
}

Para compilar con gcc…

Ahora el mismo programa compilado con gcc, pero en PHP:

o2.php:

 
srand(null);
$tamanio = 500;
for ($k=1000; $k< =3000; $k+=1000){
$t_antes = microtime(true);
$m =  array();
for ($i=0; $i<$tamanio*$k; $i++) {
$m[i] = doubleval(rand(1,1000));
}
$aux = busquedaBinaria($m,0,$tamanio*$k,
$m[($tamanio*$k)/2]);
unset($m);
$t_despues = microtime(true);
$t = $t_despues - $t_antes;
printf("<br><h1>%f</h1>segundos",$t);
}
 
/**
* @brief function busquedaBinaria:
*     Busca desde matrizOrdenada[primero]..
  matrizOrdenada[ultimo] por llave.
*  @returns: indice del elemento encontrado, la llave,
*          en otro caso -(indice donde se puede insertar)-1.
*  @param int matrizOrdenada array de sorted (ascending) values.
*  @param int primero
*  @param int ultimo
*  @llave double llave
*  @return int
*/
function busquedaBinaria(&$matrizOrdenada,
$primero, $ultimo, $llave) {
while ($primero < = $ultimo) {
$mid = ($primero + $ultimo) / 2;  // calcula el punto medio
if ($llave > $matrizOrdenada[$mid])
$primero = $mid + 1;  // repite la busqueda si no esta en la mitad
else if ($llave < $matrizOrdenada[$mid])
$ultimo = $mid - 1; // repite la busqueda en la otra mitad
else
return $mid;     // encuentra el item, lo devuelve
}
return -($primero + 1);    // no encontrado
}

RESULTADOS


Resultados C/C++:

Resultados PHP:


He elegido las búsquedas ya que estas operaciones de ordenación, concatenación de cadenas, etc. son más rápidas que en PHP y se pueden ver en los resultados.

Gráficas:

La gráfica muestra la diferencia de eficiencia entre C/C++ y PHP a la hora de ejecutar algoritmos complejos de búsqueda y ordenación…

Esta gráfica corresponde al benchmark entre C++ y PHP: tiempo usado, memoria usada ,código usado versus velocidad y tamaño comparando los programas más rápidos de PHP

CONCLUSIONES


Después de saber que C y C++ es mucho más rápido que PHP para manejar la memoria y realizar operaciones complejas como algoritmos de ordenación, podemos consultar algunas webs que han hecho análisis más profundos y sacan sus propias conclusiones al respecto:

  • C++ vs Java vs Python vs Ruby : la primera impresión, analiza como he hecho yo, un programa en todos estos lenguajes añadiendo Java, Ruby y Python,realizando comparativas de lo mejor y lo peor de cada uno, por ejemplo la poca información de Ruby a la hora de mostrar errores en tiempo de ejecución y compilación, o los requerimientos de cada sintaxis, para poder hacer un programa, que hace que baje el tiempo de producción de una solución por ejemplo teniendo que recordar que en Python hay que escribir “self” y aumente el coste del proyecto…acaba concluyendo que Java es más productivo que C++ pero nomás que Ruby o Python que además tienen un código más bonito…, mencionando que depende de nuestros conocimientos de estos dos últimos la curva final,…como colofón, los comentarios [flame!]
  • Tamaño y velocidad: una serie de análisis de lenguajes: este es uno de esos análisis de titanes, compara cualquier lenguaje, como si de un comparador de móviles o coches se tratara, dando datos y gráficas de las estadísticas de ejecución, además provee de enlaces con los ficheros con los que se realizaron las pruebas.

Como conclusión personal, pienso en C siempre que necesite un algoritmo que consuma mucho tiempo o mucho espacio en memoria del servidor, por supuesto, este tipo de programas se usan en empresas para realizar diversas operaciones…si bien, no está mal recordar que si lo que necesitamos en un listado de productos con condiciones únicas podemos utilizar un algoritmo de C o C++ embebido en PL/SQL tal como dicta el manual de Oracle…

¿Casos reales? Por ejemplo, se podría implementar un algoritmo para una búsqueda en una red social como Badoo.com, si necesitamos encontrar todas las personas con los ojos azules, aplicarle a la primera foto de cada contacto un algoritmo, primero con el comando wget() (o con PHP) nos descargamos la imagen o un rango de ellas, a un directorio de caché, llamamos al programa en C++ (exec() ,CGI, o lo que sea) que analiza la/s foto/s y nos dá una probabilidad de que los ojos azules se encuentren en ella y basándose en estos datos, marcar el perfil de la persona pasado al script como apto para añadirlo a la lista de candidatos de nuestra base de datos…esto en PHP podría tardar pues…imaginaos jaja

FUTURO: LA WEB 3D


Ni que decir tiene que el futuro nos depara webs en 3D programadas en C++ o las generaciones siguientes a este como LUA que transforma internamente el código a C++…y esto amigos, si que se nota comparado con un applet de Java :]

Abrir grecia del futuro

COMENTARIOS

De hecho existen algoritmos que estudian su probabilidad de éxito en el marketing…no es nada descabellada la idea :)

Es la hora de comentarme o insultarme, lo que más os guste o lo que más rabia os de :D

Aplicación web para un restaurante con edición de platos y noticias

Esta es una web bastante sencilla que programé cuando era empleado en Agencia Q4, allá por el año 2007, es de los prototipos de zenphp más avanzados de aquel tiempo, cuando empecé a comprender el patrón de diseño MVC sobre todo la parte del controlador y el modelo
Escuchar a los que más saben de la programación ha hecho posible toda la evolución hasta lo que los sistemas actuales son capaces de hacer…, después de un análisis completo me dí cuenta de todos los errores que cometía y empecé a trabajar en solucionarlos con mucha salud.
El sitio web dispone de administración interna que permite dar de alta los platos, las categorías de platos y las noticias.
Los apartados: “presentación restaurante” y “política de privacidad” son estáticos, los apartados “servicios”, “la carta”, “noticias”, “localización”, “reserva”, “contacto” son dinámicos, las noticias y la carta pueden tener artículos en distintas categorías…
Se usa un editor de textos WYSIWYG y AJAX para las validaciones de los formularios además de validarse con PHP a la hora de enviarse.

Usabilidad y Arquitectura de la Información de las aplicaciones web

La usabilidad de una aplicación web es mucho más fácil de revisar utilizando un Inventario de Contenido, es decir, una lista del contenido de un sitio web, y, si usamos una clase principal con referencias (punteros) a las clases que construyen la plataforma de información web nos será más fácil acceder al contenido para elaborar dicha lista.

He desarrollado sitios web donde el contenido ha sido adquirido gracias a las entradas de los usuarios, sus propias búsquedas son las generadoras de datos…, sus necesidades crean un punto de referencia que se ha tenido en cuenta en la Arquitectura de la Información, almacenándose para ser utilizadas en próximas visitas.

Diseño de Procesos

Diseño de Procesos

Para organizar dicha información se utilizan estructuras de datos, normalmente matrices (vector

es) de varios tipos que almacenan el texto de una búsqueda, su url en formato amigable para los buscadores, el números de veces que se ha repetido la misma búsqueda y otros datos opcionales como la fecha y la hora de la petición/creación de una nueva entrada en la tabla de información, nombre del usuario, procedencia, idioma, etc.

Al observar este informe APEI sobre Usabilidad me he llevado una grata sorpresa al descubrir que el esquema de wireframe utilizado para una web:

es precisamente el que utilizo en mis aplicaciones web,

Ejemplo 1:

Ejemplo 2:


Existen un conjunto de herramientas muy útiles para diseñar la AI fácilmente:

  • fluidIA: herramienta para generar varias ideas  simultáneamente construyendo sobre una pizarra prototipos de interfaces enriquecidas
  • Omnigraffle: Recursos de la AI para este programa , más información aquí
  • Text 2 Mind Map : una web para crear nuestros árboles de conceptos.

Teoría aplicable de la Arquitectura de la Información:

Presentaciones sobre AI:

Plantillas para desarrollo de contenidos:

Plantillas Wireframe

(más…)

Página 1 de 212
footer
jbelon © | sitemap.xml