Objetivo: Entender el panorama del desarrollo web y su evolución.
Contenido:
¿Qué es el desarrollo web?: El desarrollo web es el proceso de creación y mantenimiento de sitios web o aplicaciones web. Involucra diferentes etapas como el diseño, la implementación, el despliegue y el mantenimiento de las páginas que vemos en internet. Un desarrollador web trabaja en el código que hace posible la visualización e interacción de un sitio desde un navegador.
El ecosistema del desarrollo: El desarrollo web se divide en dos áreas principales:
- Frontend: La parte visible de la web que el usuario final ve e interactúa. Incluye tecnologías como HTML, CSS y JavaScript.
- Backend: Se refiere a lo que sucede detrás de escena, como la lógica del servidor, la manipulación de bases de datos, y la interacción con APIs. Tecnologías comunes son Node.js, PHP, Python, y bases de datos como MySQL.
Herramientas esenciales de un desarrollador web:
- Editores de texto o IDE (por ejemplo, Visual Studio Code, Sublime Text).
- Navegadores web (Chrome, Firefox) con herramientas de desarrollo.
- Control de versiones (Git).
- Plataformas de despliegue (cPanel, GitHub Pages, Netlify).
Presentación del plan del curso: Se proporcionará una visión general del curso que abordará desde las bases de HTML hasta cómo desplegar un sitio web utilizando herramientas modernas como Git, cPanel y FTP.
2. HTML Básico: Más Allá de "Hola Mundo"
Objetivo: Construir la estructura básica de un sitio web.
Contenido:
¿Qué es HTML y por qué es fundamental?: HTML (HyperText Markup Language) es el lenguaje estándar para la creación de páginas web. Su función es estructurar el contenido que será visualizado en los navegadores, utilizando etiquetas específicas.
Estructura básica de un documento HTML: Todo archivo HTML sigue una estructura específica que incluye:
html<!DOCTYPE html> <html> <head> <title>Mi primer sitio web</title> </head> <body> <h1>Hola Mundo</h1> <p>Bienvenido a mi página</p> </body> </html>Etiquetas comunes:
<html>,<head>,<body>: Elementos fundamentales que definen la estructura del documento.<title>: Título de la página, aparece en la pestaña del navegador.<h1>a<h6>: Encabezados de diferentes tamaños.<p>: Párrafos de texto.<a>: Enlaces.<img>: Inserta imágenes en la página.
Ejercicio: Crear una página web personal con enlaces, imágenes y formato básico.
3. Creación de Contenido Estático con HTML5
Objetivo: Implementar características modernas de HTML5.
Contenido:
Nuevas etiquetas en HTML5:
<header>,<footer>: Definen la cabecera y el pie de página.<section>,<article>: Agrupan contenido por secciones.<nav>: Define la navegación del sitio.
Uso de multimedia:
<audio>: Incluir archivos de audio.<video>: Mostrar videos directamente en la página.
Formularios HTML5:
- Mejora la validación de datos y la accesibilidad.
Ejercicio: Construir un sitio web con contenido multimedia.
4. Introducción a CSS: Dale Estilo a tu Web
Objetivo: Aplicar estilos visuales a páginas HTML.
Contenido:
¿Qué es CSS y cómo se integra con HTML?: CSS (Cascading Style Sheets) es el lenguaje utilizado para dar estilo y apariencia a las páginas web, desde colores y fuentes hasta la distribución de los elementos.
Selectores y propiedades básicas:
- Colores, fuentes, márgenes, y padding son algunas propiedades más usadas.
Modelos de cajas (Box Model): Explica cómo se organizan los elementos en la página.
Ejercicio: Estilizar la página web creada en la unidad 2.
5. Git: Control de Versiones
Objetivo: Implementar control de versiones en tus proyectos.
Contenido:
¿Qué es Git y por qué es fundamental en el desarrollo?: Git es un sistema de control de versiones que permite a los desarrolladores guardar versiones de su código y colaborar en proyectos de manera eficiente.
Instalación de Git: Se explicará cómo instalar Git en diferentes sistemas operativos.
Comandos básicos:
git init,git add,git commit,git push,git pull.
Ejercicio: Crear un repositorio Git para el proyecto web y realizar commits.
6. GitHub: Publica y Colabora
Objetivo: Aprender a gestionar proyectos en GitHub.
Contenido:
- Creación de una cuenta en GitHub.
- Clonar un repositorio desde GitHub.
- Subir el proyecto a GitHub.
- Colaboración en proyectos de código abierto.
Ejercicio: Subir el proyecto web a GitHub y compartirlo.
7. Introducción a cPanel: Gestión de Servidores
Objetivo: Familiarizarse con cPanel para administrar servidores web.
Contenido:
- ¿Qué es cPanel y por qué es útil?: cPanel es un panel de control para administrar servidores, dominios y bases de datos de manera gráfica.
Ejercicio: Configurar cPanel para alojar tu página web personal.
8. FTP: Transferencia de Archivos al Servidor
Objetivo: Transferir archivos al servidor usando FTP.
Contenido:
¿Qué es FTP y cómo funciona?: FTP (File Transfer Protocol) permite transferir archivos entre un equipo local y un servidor.
Herramientas de FTP:
- FileZilla, WinSCP.
Ejercicio: Subir los archivos de tu página web al servidor a través de FTP.
9. Despliegue del Proyecto Web en cPanel
Objetivo: Desplegar y publicar tu proyecto web en un servidor.
Contenido:
- Uso de cPanel para despliegue.
- Configuración de DNS y dominios.
Ejercicio: Desplegar tu página web utilizando cPanel y FTP.
10. Práctica Continua y Mejora de tu Sitio Web
Objetivo: Mejorar y mantener el proyecto web a largo plazo.
Contenido:
- Revisión de buenas prácticas en HTML, CSS y Git.
- Optimización de sitios web para velocidad y rendimiento.
Ejercicio: Hacer mejoras iterativas al proyecto web basado en feedback y prácticas avanzadas.
No hay comentarios.:
Publicar un comentario