html5 internet php javascript css

1. ➔ PrestaShop.
➔ OsCommerce.

2. ¿Qué es PrestaShop?
➔ Es un gestor de contenidos de código abierto compatible con
las pasarelas de pago: DirecPay, Google CheckOut, PayPal.
➔ Está escrito en PHP y es utilizado actualmente por 165.000
tiendas en todo el mundo.
Características:
1. Permite cargas masivas de productos.
2. Comparar productos.
3. Agregar a la lista de regalo.
4. Enviar lista de regalo por e-mail.
5. Imágenes redimensionamiento automático.
6. Múltiples imágenes por producto.
7. Zoom-in a las imágenes de productos.

3. Instalación
1. Descargar la última versión y descomprimir en la carpeta
web. ( /var/www/html ).
2. Ingresar con el navegador al PrestaShop: http:
//localhost/prestashop/
3. El programa de instalación preguntará el idioma, la
configuración de la base de datos, y otros datos de
seguridad.
4. En caso de problemas de permisos, el siguiente comando:
sudo chgrp -R www-data /var/www/html/
5. Una vez instalado, te enviará a la página de acceso.
Accede con el nombre de usuario elegido y la contraseña.
6. Ahora podrás hacer clic en ‘Perfil’ y cambiar la contraseña.

4. Front-End
➔ Es el sitio visible para los usuarios.

5. Back-End
➔ Es la administración del sitio: productos, precios, ventas,

6. ¿Qué es OsCommerce?
➔ Similar a PrestaShop: permite montar una tienda virtual.
Características
➔ Posee un Front-End y Back-End.
➔ Programada en lenguaje PHP, trabaja sobre un servidor
Apache y usa MySQL como servidor de base de datos.
➔ Actualmente casi todas las empresas de Hosting
ofrecen OsCommerce como opción.
➔ Es realmente fácil instalar.
http://www.oscommerce.com

7. Front-End
➔ Es el sitio visible para los usuarios.

8. Back-end.
➔ Es la administración del sitio: productos, precios, ventas,

9. Instalación
1. Descargar la última versión y descomprimir en la
carpeta web. ( /var/www/html ).
2. Ingresar con el navegador al OsCommerce: http:
//localhost/oscommerce-2.3.4/catalog/
3. El programa de instalación te preguntará la
configuración de la base de datos, y otros datos de
seguridad.
4. Una vez instalado, te enviará a la página de acceso.
Accede con el nombre de usuario elegido y la
contraseña creada durante la instalación.
5. Ahora podrás hacer clic en ‘Perfil’ y cambiar la
contraseña.

10. Seguridad en Aplicaciones.
➔ Uno de los problemas típicos es permitir subir archivos.
<form enctype=multipart/form-data
action=subir.php method=post>
<input name=archivo type=file>
<input type=submit value=Subir>
</form>
<?php
$target = basename( $_FILES['archivo']['name']);
move_uploaded_file($_FILES['archivo']['tmp_name'], $target);
print "<img src=$target>";
?>

11. Seguridad en Aplicaciones.
➔ En lugar de subir una imagen: un usuario con malas
intenciones puede subir código maligno: Web-Shell.

12. Verificación del archivo.
<form enctype=multipart/form-data
action=subir.php method=post>
<input name=archivo type=file>
<input type=submit value=Subir>
</form>
<?php
if($_FILES['archivo']['type'] != "image/jpeg")
{ print "Solo se permite Imagenes JPG"; exit; }
$target = basename( $_FILES['archivo']['name']);
move_uploaded_file($_FILES['archivo']['tmp_name'], $target);
print "<img src=$target>";
?>

13. Permisos por
Usuarios
➔ Se recomienda HTML y PHP para validar usuarios.
<link href=bootstrap.min.css rel=stylesheet>
<div class=container>
<form action=sistema.php>
<h2>Acceso al Sistema</h2>
<input type=email name=email class=form-control
placeholder=Email required autofocus>
<input type=password name=clave class=form-control
placeholder=Password required>
<input type=checkbox value=recordarme> Recordarme
<button class="btn btn-primary btn-block" type=submit>
Sign in</button>
</form></div>

14. Permisos por usuarios
<link href="bootstrap.min.css" rel="stylesheet">
<nav class="navbar navbar-inverse navbar-fixed-top">
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="active"><a href=#>Inicio</a></li>
<?php
if ($_REQUEST['email']=="admin@admin.com" &&
$_REQUEST['clave']=='123')
print "<li><a href=#privado>Privado</a></li>";
?>
<li><a href=#contact>Contacto</a></li>
</ul>
</div>
</nav>
Solo si se cumple
la condición
mostrará la
opción: ”Privado”.