Curso FRancisco TRiviñoDesarrollo Web Completo Con HTML5

DISEÑO Y DESARROLLO WEB
Desarrollo Web Completo con HTML5, CSS3, JS AJAX

PHP y MySQL
TEMAS A ESTUDIAR:
 Convertir y crear sus propios diseños en páginas web
 Escribir código Java Ascript y jQuery
 Entender cómo funciona JavaScript y PHP
 Aprender AJAX, para crear páginas web dinámicas
 Crear páginas web con HTML y CSS
 Crear sitios Web Dinamicos con PHP y MYSQL
 Aplicar a un empleo de Desarrollo web junior
 Agregar pagos de PayPal a tus sitios web
INTRODUCCIÓN:
Html se conoce como un lenguaje de marcación de texto, es fácil, sintaxis clara
No es lenguaje de programación, diseñado para la estructura de un sitio web.
<p> = parrrafo
<nav> =navegación
<header> = Ebcabezado del sitio
ESTRUCTURA DE ARCHI HTML
<html>
<head>
<title> Mi pagina Web </title>
</head>
<body>
</html>
DEMOSTRACION DE UN DOCUMENTO SITIO WEB

Sitio web dinámico.
B/D
Servidor
-----------
________
________
______
php
1
¿Qué es CSS?
Carcteristicas de las hojas estilos cascadas, que permitirá darle a tu código HTML un
diseño único y especial en pocas líneas. Tamaños y tipos de fuentes espacios,
márgenes, adaptar diseños a un distinto dispositivos animaciones.
Ejemplo escribir en CSS es muy fácil:
<style>
p{
color: blue;
}
</style>
CONOCIMIENTO DE CSS
{ Llaves de apertura
//declaraciones propiedad para agregar color; finalizar con punto y coma
cada linea
} Llaves de cierre:
CSS UTILIZA CASCADA

Porque puede tener un código repetido siempre el que este al final toma la hoja de
estilo, color de la página.
¿Qué es Java Script?

Añade comportamiento interactividad a tus sitios web, es un lenguaje de la web,
Desarrollo Front End
Añade Interactividad.
Desarrollo Back End.
JavaScript añade interactividad y comportamiento a tu sitio web
Reacciona a eventos del usuario en nuestra página web
Validar formularios
Procesar información
Mostrar mapas o ubicaciones
DEFINIR JavaScript
Es un lenguaje maduro y estable tiene variables, funciones, estructuras de control,
métodos lo cual lo hace un lenguaje de programación.
Java funciona se ejecuta sobre algo llamado DOM /Elementos que integran una pag.
web/
Otros usos de JavaScript
Puede utilizarse como ayuda servidor, automatizado y Dependencias, en otras
tecnologías aprender Java ayuda al desarrollo de crear otras aplicaciones.
2
FUNCIONAMIENTO DE PHP Y MySQL

Sitios dinámicos de forma fácil y efectiva
¿Qué es PHP?
Es un lenguaje de Scripting diseñado para trabajar con Html, no es necesario compilar
su sintaxis es similar a C y JavaScript.
Más flexible que Html.
Ventajas:
Es necesario instalar un servidor local posible utilizar la ultima versión pero compatible
con las versiones anteriores, software libre, desarrollarse en Linux, Mac o Windows.
Diseñado para la web, es estable, muchas veces utilizado como programación
orientada a Objeto. Es una muy buen opción para utilizarlo como programación
Backend.
Permitido casi en todos los servicios hosting.
¿Qué es MyDQL?
Es una base de datos /Open Source, guarda y lee grandes cantidades de datos,
permite relacionar con otros datos. Fácil de usar y es software libre.
Para el uso de principiante es muy bueno utilizar la combinación de PHP y MySQL
siguiendo las recomendaciones protección de seguridad informática, que muchas
veces es vulnerable para programadores expertos.
COMO FUNCIONA LA COMBINACIÓN DE PHP Y MySQL
-----------
www.SitioWeb.com
________ B/D
________
______
php
Servidor
Página Web
3
TEMAS A DESARROLLAR:
 Etiquetas básicas para trabajar en HTLM 5, como crear textos imágenes, listas
menús contenedores y formularios.
 Estilos en CSS 3: Textos Colores, Menús de navegación, animaciones, -
Formularios, Botones y muchos más.
 Crear Proyectos y para concluir con un proyecto final.
 Lenguaje de la web JavaScript JS, sintaxis, funciones trabajar con DOM, Manipular
DOM Crear un cotizador online y mucho más.
jQuery como escribir código Integrar Plugins crear galerías jQuery, reaccionar a
eventos en sitio y muchos más.
Integrar las 4 tecnologías en un proyecto final
Sitios web dinámicos con PHP y MySQL, sintaxis y funciones, hacer una aplicación
consultas hacer más modular nuestro sitio y demás.
Importancia de Utilizar un editor de texto /ATOM/ Sublitem text, Adobe Brackets, Visual
Studio Code para Windows. Ejecutan en cualquier plataforma
Ventajas posicionarse al inicio de una función presiona el triangulo y hacer pequeño el
código para poder seguir navegando.
Permite formatear el texto, lo recomendable es utilizar un editor de texto.
Editor de Texto más popular

Sublime Text 3 para Windows software de paga y no paga casi es licencia que no
caduca.
SU FORMA DE TRABAJO:
Puede trabajar con carpetas directorios organizados en forma jerárquica, puede hacer
la fuente más grande, puede trabajar con navegar y abrir la presentación indicada.
4
Crear Archivos para trabajar con CSS (Estilos) y JavaScript, puede instalar librerías,
Plugin para instalar.
EDITOR VISUAL STUDIO CODE (DE Microsoft) gratuito para cualquier plataforma
Mac, Ubuntu
Programas trabaja con cualquier extensión, para paython, C++, etc.
Tiene un buen auto completado, No es necesario instalar muchos plugins, funciona o
se integra con otras herramientas, tiene que instalar ciertas extensiones.
ATOM /Trabaja con Ubuntu/

Se puede instalar en MAC, Windows, editor para trabajar en el curso. Un editor muy
popular, es más pesado que los otros. Se puede cambiar la apariencia, escoger un
tema, instalar un paquete para abrir un proyecto.
Brackets /Adove/
Es el mejor editor para hacer paginas web es pesado más de 50 megas, editor mas
completo.
Para trabajar con proyectos grandes. Crear carpeta de CSS. Es un poco mas
complicado, tiene forma de autocompletado muy interesante. Más orientado a web,
5
PRACTICA BÁSICA
Todo lo básico de HTML, desarrollo web, a utilizar ATOM Editor de Text páginas web
Crea mi primer archivo, dar un nombre. Index.html crear: New file, decirle al navegador
que haga con nuestra pagina debemos decir que version de html
<!DOCTYPE html> este código avisa al navegador que utilice la última versión de
HTML5.
TRABAJAR CON ENCABEZADO
<hmtl>
<head> etiquetas importantes para nuestro sitio web
< meta charset=“utf-8”>
< meta name= “description” content=Explorando y Aprendiendo HTML”>
<title=Mi primer página web con HTML5 </title>
</head>
<h1>CONTENIDO DE MI PAGINA WEB </h1>
//lugar para escribir una instrucción de java//
<body>
H1 head del 1 al 6 es el tamaño de la letra.
<p> esto es un parrafo</p> de un solo tamaño no cambia el tamaño de letra
Para separa párrafo saltos de líneas utilizamos la etiqueta <br>
Para espacios en blanco &nbsp
Para resaltar texto <b></b>
Para hacer texto en cursiva <i ></i>
H1=el más importante

H2 = más común usado en la pag
H3 = texto más pequeño
6
H6= menos importante

</body>
</hmtl>
7

Curso FRancisco TRiviñoDesarrollo Web Completo Con HTML5

Cargado por

Información del documento

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

Curso FRancisco TRiviñoDesarrollo Web Completo Con HTML5

Cargado por

Copyright:

Formatos disponibles

DISEÑO Y DESARROLLO WEB

Desarrollo Web Completo con HTML5, CSS3, JS AJAX

DEMOSTRACION DE UN DOCUMENTO SITIO WEB

CSS UTILIZA CASCADA

¿Qué es Java Script?

FUNCIONAMIENTO DE PHP Y MySQL

COMO FUNCIONA LA COMBINACIÓN DE PHP Y MySQL

Editor de Texto más popular

ATOM /Trabaja con Ubuntu/

H1=el más importante

H6= menos importante

También podría gustarte