Base de Datos

Base de Datos
Ayudantía 1
Daniel Joel Moran

José Ignacio Santamaría
Introducción a
HTML y PHP
Parte 1: HTML
¿Qué es HTML?
HTML es un lenguaje de marcado que se utiliza para el desarrollo de páginas de

Internet. Se trata de la siglas que corresponden a HyperText Markup Language, es
decir, Lenguaje de Marcas de Hipertexto
● No es un lenguaje de programación como Python, C, C++. No puede realizar

operaciones aritméticas. Todo está etiquetado de la siguiente forma:
○ <etiqueta> ... más cosas ... </etiqueta>
● Ya que no es un lenguaje de programación, no requiere
de una compilación o interpretación.
Parte 1: HTML
¿Que se necesita?
● Navegador web
● Editor de texto
○ Sublime
○ Visual Studio Code → Extension Live Server
○ Brackets (incluye live preview)
Parte 1: HTML
Estructura más básica de una página web con HTML
<!DOCTYPE html> ---> Indica la versión de HTML y tipo

<html> ---> Documento HTML
<head> … </head> ---> <head> Se suelen incluir elementos como
<body> … </body> el título de la página, icono, hojas de estilo css,
</html> scripts, definir la codificación, entre otros
---> <body> Se escriben las etiquetas
que conformarán la página web
Parte 1: HTML
ATENCIÓN
Si estás modificando un archivo HTML o PHP y luego visualizas en un navegador,
y observas que no hay cambios es posible que el navegador haya guardado en
caché la página web.
Posible ayuda:
● Configurar el navegador para que no guarde caché o limpiarla
● Activar una ventana en modo incógnito
● Modificar otra sección y comprobar ese cambio
Parte 1: HTML <head>
<title> Aqui el titulo </title> -> Define el título de la página
<style> -> Definir o utilizar hojas de estilo (CSS)
<meta charset="utf-8"> -> Define la codificación UTF-8
Parte 1: HTML <body> Los títulos
<h1>Hola H1</h1>
<h2>Hola H2</h2>
<h3>Hola H3</h3>
<h4>Hola H4</h4>
<h5>Hola H5</h5>
<h6>Hola H6</h6>
Parte 1: HTML <body> Los párrafos
<h1>Titulo del parrafo</h1>
<p>
Hola este es un párrafo
</p>
<p>
Este párrafo es el segundo
</p>
<h2>Subpárrafo</h2>
<p>
Hola este es otro párrafo
</p>
Parte 1: HTML <body> Textos preformateados
<h1>Con etiqueta pre</h1>
<pre>
ESTE TEXTO ESTA PREFORMATEADO,
POR LO TANTO RESPETARÁ TODOS LOS ESPACIOS Y
SALTOS DE LINEA
QUE YO QUIERA
</pre>
<h1>Con etiqueta p</h1>
<p>
ESTE TEXTO ESTA PREFORMATEADO,
POR LO TANTO RESPETARÁ TODOS LOS ESPACIOS Y
SALTOS DE LINEA
QUE YO QUIERA
</p>
Parte 1: HTML <body> Divisores
● <div></div>
● Esta etiqueta no tienen una influencia directa sobre la visualización de la
página web, pero mejoran la lectura del código HTML y además permiten una
mayor personalización de esa sección en específico (colores de fuente,
fuentes distintas, color de fondo, entre otros)
<div>
<p>HOLA</p>
</div>

<p>HOLA</p>
Parte 1: HTML <body> “Saltos de línea” y Separador
<div>
<p>
HOLA <br> Necesitaba hacer un salto de linea
</p>
<p>
HOLA
Necesitaba hacer un salto de linea
</p>
<br>
<p>Siguiendo con la....</p>
<hr>
<p>Separé todo</p>
</div>
Parte 1: HTML <body> Tablas
<table>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
<table style="width:100%">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
<table style="border: 1px solid black;">
<tr>
<th style="border: 1px solid black;">Firstname</th>
<th style="border: 1px solid black;">Lastname</th>
<th style="border: 1px solid black;">Age</th>
</tr>
<tr>
<td style="border: 1px solid black;">Jill</td>
<td style="border: 1px solid black;">Smith</td>
<td style="border: 1px solid black;">50</td>
</tr>
<tr>
<td style="border: 1px solid black;">Eve</td>
<td style="border: 1px solid black;">Jackson</td>
<td style="border: 1px solid black;">94</td>
</tr>
</table>
<style>
table, th, td {
border: 1px solid black;
}
</style>
<table>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
Parte 1: HTML <body> Listas
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
Parte 1: HTML <body> Listas
<ul>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea</li>
</ul>
</li>
<li>Milk</li>
</ul>
Parte 1: HTML Ayuda
https://www.w3schools.com/
https://lenguajehtml.com/
Parte 1: HTML Ejercicios
Las respuestas las pueden encontrar en:
https://www.delidded.com/html-css-practice-test/
Parte 2: PHP y ORACLE
Instalación de XAMPP en Windows para PHP y Oracle Database
● Descargue "XAMPP para Windows" y siga el asistente de instalación →

https://www.apachefriends.org/download.html
● Inicie el servidor Apache a través del panel de control XAMPP.
● Visite http: //localhost/dashboard/phpinfo.php a través de su navegador para ver la arquitectura y el

modo de seguridad de subprocesos del PHP instalado.
● Reemplace los archivos de"C: \ xampp \ php \ ext \" con los del siguiente paquete, este contiene los
archivo correspondientes para oracle 11g.
https://drive.google.com/file/d/1US4W8oROKNe2UUmYZK0qai5_CBySR0Hq/view?usp=sharing
● Edite "C: \ xampp \ php \ php.ini" y elimine el comentario de la línea "extension = oci8" y añada bajo este
“extension=oci8_11g”. Asegúrese de que "extension_dir" esté configurado en el directorio que contiene
las DLL de extensión PHP.
● Descargue el paquete Oracle Instant Client. Seleccione la arquitectura correcta para alinear con PHP.
https://www.oracle.com/database/technologies/instant-client/downloads.html o
https://drive.google.com/file/d/1QYp2FdNacyptp3AzTcMqtA8nI_VLpqVA/view?usp=sharing
● Extraiga el archivo en un directorio como "C: \". Se creará un subdirectorio "C: \ instantclient_xx_x".
● Agregue este subdirectorio a la variable de entorno PATH. Puede actualizar PATH en el Panel de control
-> Sistema -> Configuración avanzada del sistema -> Avanzado -> Variables de entorno -> Variables del
sistema -> PATH. En mi ejemplo, lo configuré en "C: \ instantclient_xx_x".
● Reinicie el servidor Apache y revise la página phpinfo.php (http: //localhost/dashboard/phpinfo.php)
nuevamente. Muestra que la extensión OCI8 se ha cargado correctamente.
● Para ejecutar su primera aplicación OCI8, cree un nuevo archivo en la raíz del documento XAMPP "C: \
xampp \ htdocs \ test.php". Debe contener:
<?php
$c = oci_connect('Usuario','Contraseña','localhost/XE');
if($c){
echo "Hello World c:";
}
else{
echo "Bye world :c";
}
?>
● Recuerde tener iniciada la Base de Datos y cargue el programa de prueba en un navegador usando http:
//localhost/test.php
FIN

Base de Datos

Cargado por

Información del documento

Título original

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

Base de Datos

Cargado por

Copyright:

Formatos disponibles

Base de Datos

Daniel Joel Moran

HTML es un lenguaje de marcado que se utiliza para el desarrollo de páginas de

● No es un lenguaje de programación como Python, C, C++. No puede realizar

<!DOCTYPE html> ---> Indica la versión de HTML y tipo

<h1>Con etiqueta pre</h1>

● Descargue "XAMPP para Windows" y siga el asistente de instalación →

● Visite http: //localhost/dashboard/phpinfo.php a través de su navegador para ver la arquitectura y el

También podría gustarte