1

Introducción a la programación Web

UNIVERSIDAD DEL SUR

Alumn: Ramírez Jiménez Lorenzo

Materia: Programación Web

Fecha: 07/01/2024

Tema: Introduccion a la Programacion web

 2
Introducción a la programación Web

Índice

INTRODUCCIÓN ..................................................................................................................................................3
1.1 Que es el FrontEnd. ......................................................................................................................................4
2.1. Lenguajes de programación en el FrontEnd. ...............................................................................................5
3.1. Conceptos de FrontEnd. ..............................................................................................................................6
4.1. Servidores Web. ..........................................................................................................................................6
5.1. Entorno y herramientas de desarrollo de un FrontEnd...............................................................................7
Referencias ................................................................................................................................................................8
 3
Introducción a la programación Web

INTRODUCCIÓN

La idea es saber que el frontend son aquellas tecnologías de desarrollo web

del lado del cliente, es decir, las que conoce en el navegador del usuario y que

son básicamente tres: HTML, CSS Y JavaScript.

 4
Introducción a la programación Web

1.1 Que es el FrontEnd.

El frontend se enfoca en el usuario, en todo con lo que pueden interactuar y lo

que ve mientras navega. Una buena experiencia de usuario, inmersión y

usabilidad son algunos de los objetivos que busca un buen desarrollador

frontend, y hoy en día hay una gran variedad de frameworks, preprocesadores

y librerías que ayudan en esta tarea.

1.2 Cómo funciona un sistema front end.

Un sistema de frontend se utiliza principalmente para enviar preguntas y

solicitudes, y recibir datos desde el sistema anfitrión. Sirve o proporciona a

los usuarios la capacidad de interactuar y utilizar un sistema de información.

Típicamente, los sistemas de front-end tienen capacidades de procesamiento

de la lógica computacional o de negocio muy limitadas y se basan en los datos

y las funciones del sistema anfitrión. Sin embargo, algunos sistemas de front-

end de nivel avanzado mantienen copias de los datos, tales como un duplicado

de cada transacción, que se envía al sistema de back-end.

 5
Introducción a la programación Web

2.1. Lenguajes de programación en el FrontEnd.

A pesar de que hay varios lenguajes que se usan en el frontend, nosotros

nos fijaremos en tres: HTML, CSS Y JavaScript (aunque HTML Y CSS

no son lenguajes de programación).

1. HTML: Es un lenguaje de marcado de los contenidos de un sitio

web, es decir, para designar la función e cada elemento dentro de la

página: titulares, párrafos, listas, tablas, etc. Es el esqueleto de la

web y la base de todo.

2. CSS: Es un leguaje de hojas de estilo creado para controlar la

presentación de la pagina definiendo colores, tamaños, tipos de

letras, posiciones, espacios, etc.

3. JavaScript: Es un lenguaje de programación interpretando que se

encarga del comportamiento de una pagina web y de la

interactividad con el usuario. Aparte, junto al cliente también

tenemos los frameworks, las librerías, los preprocesadores, los

plugins. Pero todo gira alrededor de HTMLO, CSS Y JavaScript.

 6
Introducción a la programación Web

3.1. Conceptos de FrontEnd.

El front end, también conocido como "lado cliente" ("client side" en inglés)

es el espacio al que los usuarios de una web o aplicación pueden acceder,

con el cual pueden interactuar.

Comprende desde los colores y estilos utilizados, la estructura de la página

web, los botones y acciones disponibles, y todo aquello que sucede en

pantalla. En resumen, todo lo que el usuario puede experimentar y sentir

de forma empírica.

4.1. Servidores Web.

Un servidor web es un software que forma parte del servidor y tiene como

misión principal devolver información (páginas) cuando recibe peticiones

por parte de los usuarios.

En otras palabras, es el software que permite que los usuarios que quieren

ver una página web en su navegador puedan hacerlo.

 7
Introducción a la programación Web

5.1. Entorno y herramientas de desarrollo de un FrontEnd.

Las herramientas más básicas, como HTML y CSS pueden dominarse en

muy poco tiempo. En otros casos, se necesita más dedicación:

• HTML. Se trata de un lenguaje de etiquetas básico. HTML se utiliza para

establecer la base estructural del sitio web. Normalmente, su uso se centra en

la creación de encabezados, listas, inserción de imágenes y tablas, integración

de hipervínculos, etc. Como muchos sabréis, se basa en la creación de

etiquetas comprendidas por los símbolos <>.

• CSS. Con CSS, un lenguaje de diseño gráfico, podremos trabajar la parte

visual de nuestro sitio. Lo usaremos principalmente para diseñar y describir

cómo deben mostrarse los elementos codificados en HTML. Gracias a este

lenguaje podremos modificar los colores, los fondos, las animaciones de los

elementos de la web y mucho más. Además, es la herramienta que permite

elegir dónde colocamos cada elemento.

• JavaScript. JavaScript es un lenguaje utilizado para agregar funcionalidades

extra al sitio web. Permite potenciar la interactividad y el diseño en general y

se puede usar para integrar juegos, películas interactivas y otro tipo de

archivos. HTML y CSS, combinados con JavaScript son todos los

ingredientes que necesitas para el Frontend de una página sencilla.

 8
Introducción a la programación Web

• jQuery. Es una librería de JavaScript que reúne extensiones y plugins para

facilitar el desarrollo mediante este lenguaje. Te ayudará a ahorrar tiempo y a

generar código de calidad de forma más sencilla.

• Preprocesadores CSS. Estas herramientas se utilizan para generar

pseudocódigo CSS. El objetivo de estas soluciones es simplificar el código

para que sea más sencillo mantenerlo y modificarlo. Los preprocesadores CSS

permiten anidar selectores, cosa que evita que tengamos que escribir de nuevo

ciertos sectores del código. Sin embargo, se recomiendo no abusar de esto, ya

que podría acabar generándose un código demasiado pesado.

Referencias
dtagencytech. (s.f.). Recuperado el 07 de Diciembre de 2024, de dtagencytech:
https://dtagency.tech/desarollador-frontend/

indeed. (s.f.). Recuperado el 07 de Enero de 2024, de indeed: https://www.indeed.com/orientacion-

profesional/desarrollo-profesional/que-es-front-end

Introducción al frontend. (s.f.). Recuperado el 07 de Diciembre de 2024, de Introducción al frontend:

https://openaccess.uoc.edu/bitstream/10609/141486/1/Tecnologias%20y%20herramientas%20para%2
0el%20desarrollo%20web_Modulo1_Introduccion%20al%20frontend%20y%20backend.pdf

webempresa. (s.f.). Recuperado el 07 de Enero de 2024, de webempresa:

https://www.webempresa.com/hosting/que-es-servidor-web.html