Curso Turbo Web Full Stack 2024

🌟 Temario General

HTML & CSS

Estructura y estilo profesional.

JavaScript

Interactividad y lógica en la web.

MySQL

Bases de datos y consultas.

PHP

Backend clásico y seguro.

Python

Automatización y análisis de datos.

Entorno Local/Hosting

Prepara y publica tu web.

🧩 HTML + CSS — Estructura y Estilo

Ejemplo HTML


<!DOCTYPE html>
<html>
  <head><title>Mi Web</title></head>
  <body>
    <h1>¡Hola Mundo!</h1>
    <p>Esto es HTML básico.</p>
    <img src="img/logo.png" alt="Logo">
    <a href="#contacto">Contacto</a>
  </body>
</html>

Estructuras HTML más usadas
Etiqueta	Uso	Ejemplo
<h1>...</h1>	Título principal	<h1>Mi Título</h1>
<p>...</p>	Párrafo	<p>Texto aquí</p>
<a href="">...</a>	Enlace	<a href="url">Ir</a>
<img src="" alt="">	Imagen	<img src="logo.png">
<ul><li></li></ul>	Lista	<ul><li>item</li></ul>
<form>	Formulario	<form>...</form>
<table>	Tabla	<table>...</table>
<input>	Campo de entrada	<input type="text">

Ejemplo CSS


body {
  background: linear-gradient(135deg, #222, #33a9ff 70%);
  color: #fff;
  font-family: Arial, sans-serif;
}
h1 { color: #ffd600; }
a:hover { color: #40c057; }

Propiedades CSS más comunes
Propiedad	Uso	Ejemplo
background	Color/fondo	background: #fff;
color	Color del texto	color: #222;
font-family	Fuente de letra	font-family: Arial;
margin/padding	Espaciados	margin: 10px;
border	Borde	border: 1px solid #ccc;
display	Modelo de caja	display: flex;
@media	Responsive	@media (max-width:600px){...}

🟧 JavaScript — Interactividad y lógica

Ejemplo JavaScript


function saludar() {
  alert("¡Hola, usuario!");
}
document.getElementById('miBoton').onclick = saludar;

Estructuras y funciones JS más usadas
Sintaxis	Uso	Ejemplo
function nombre(){}	Definir función	function f(){}
document.getElementById()	DOM	document.getElementById('id')
alert()	Pop-up	alert('Hola')
let/const/var	Variables	let x = 2;
if(){...}	Condición	if(x>1){...}
for(){...}	Bucle	for(let i=0;i<5;i++){}
fetch()	Peticiones HTTP	fetch('url')

💾 MySQL — Bases de datos

Ejemplo MySQL


CREATE TABLE usuarios (
  id INT PRIMARY KEY AUTO_INCREMENT,
  nombre VARCHAR(50),
  email VARCHAR(80)
);
INSERT INTO usuarios (nombre, email) VALUES ('Ana','ana@email.com');
SELECT * FROM usuarios;

Comandos SQL esenciales
Comando	Uso	Ejemplo
CREATE TABLE	Crear tabla	CREATE TABLE usuarios (...)
INSERT INTO	Insertar dato	INSERT INTO ... VALUES (...)
SELECT	Consultar	SELECT * FROM ...
UPDATE	Actualizar dato	UPDATE usuarios SET ...
DELETE	Borrar dato	DELETE FROM ...
WHERE	Filtro	SELECT ... WHERE ...
JOIN	Unir tablas	SELECT ... FROM a JOIN b ...

🐘 PHP — Backend clásico

Ejemplo PHP


<?php
$nombre = $_POST['nombre'];
if($nombre == "Torex"){
  echo "¡Bienvenido!";
} else {
  echo "No autorizado";
}
?>

Estructuras y funciones PHP más comunes
Sintaxis	Uso	Ejemplo
$_POST / $_GET	Datos formulario/URL	$_POST['campo']
echo	Imprimir texto	echo "Hola";
if / else	Condicionales	if($x==1){...}
while / for	Bucles	for($i=0;$i<5;$i++)
mysqli_connect()	Conexión BD	mysqli_connect("host","user","pass","db")
mysqli_query()	Consulta BD	mysqli_query($conn, "SQL")
session_start()	Sesiones	session_start();

🐍 Python — Automatización y análisis

Ejemplo Python


import mysql.connector
db = mysql.connector.connect(
  host="localhost", user="user", password="pass", database="midb")
cursor = db.cursor()
cursor.execute("SELECT nombre, email FROM usuarios")
for nombre, email in cursor.fetchall():
    print(nombre, email)
db.close()

Estructuras y funciones Python más útiles
Sintaxis	Uso	Ejemplo
def nombre():	Función	def suma():
if ...:	Condición	if x==2:
for ... in ...:	Bucle	for i in range(5):
import	Importar módulo	import pandas
print()	Imprimir	print("Hola")
open()	Abrir archivo	open("f.txt")
mysql.connector	Conectar a MySQL	mysql.connector.connect(...)

🖥️ Entorno Local/Hosting — Desarrolla y publica tu web

XAMPP (PHP/MySQL)

Descarga en apachefriends.org
Coloca tu proyecto en htdocs
Accede a http://localhost/miweb/

Comandos útiles XAMPP / FTP
Acción	Comando/Paso
Iniciar Apache/MySQL	Desde el panel de XAMPP
Ruta archivos web	C:\xampp\htdocs\miweb\
Subir a hosting	FTP (ej: FileZilla) a /public_html/
BD en hosting	phpMyAdmin: Exportar/Importar SQL

Node.js (JS server)

Descarga en nodejs.org
Inicializa: npm init
Instala Express: npm install express
Ejecuta: node app.js

Comandos útiles Node.js / Deploy
Acción	Comando
Crear proyecto	npm init -y
Instalar Express	npm install express
Ejecutar servidor	node app.js
Deploy cloud	heroku/vercel/render
Subir a VPS	scp * usuario@ip:/var/www/