DEPARTAMENTO DE SISTEMAS Y COMPUTACION

INGENIERIA EN SISTEMAS COMPUTACIONALES

Investigación
Frontend y BackEnd
UNIDAD I

NOMBRE ALUMNO:
Serapio Lagunes Carlos Alfonso

MATERIA: PROGRAMACIÓN WEB

GRUPO: 6g5C HORA: 15-16 hrs.

CATEDRATICO
M.C.C. Manuel Panzi Utrera

FECHA DE ENTREGA:
21/10/2020
Contenido
1 Introducción .................................................................................................................... 2
2 Tecnología FrontEnd ....................................................................................................... 3
2.1 Características .......................................................................................................... 4
2.2 Forma de interacción con el usuario ........................................................................ 4
2.3 Ejemplos de Tecnologías FrontEnd ......................................................................... 4
3 Tecnología BackEnd ....................................................................................................... 5
3.1 Características .......................................................................................................... 5
3.2 Forma de interacción con el usuario ........................................................................ 6
3.3 Ejemplos de Tecnologías BackEnd ......................................................................... 6
4 Conclusión....................................................................................................................... 7
5 Bibliografía...................................................................................................................... 7

1 Introducción
Mediante esta investigación se quiso dar una decisión mas clara de que es el FrontEnd y
BackEnd, y demostrar las diferentes características que tienen entre sí, y remarcar la
importancia de cada uno ennel desarrollo de una página o aplicación web.

2
2 Tecnología FrontEnd
El frontend son aquellas tecnologías de desarrollo web del lado del cliente, es decir, las que
corren en el navegador del usuario y que son básicamente tres: HTML, CSS y JavaScript. El
frontend se enfoca en el usuario, en todo con lo que puede 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.

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).

HTML es un lenguaje de marcado de los contenidos de un sitio web, es decir, para designar
la función de cada elemento dentro de la página: titulares, párrafos, listas, tablas, etc. Es el
esqueleto de la web y la base de todo.

CSS es un lenguaje de hojas de estilo creado para controlar la presentación de la página

definiendo colores, tamaños, tipos de letras, posiciones, espaciados, etc.

JavaScript es un lenguaje de programación interpretado que se encarga del comportamiento

de una página 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 HTML, CSS y JavaScript.

3
2.1 Características
Se relaciona con todo lo que ven las personas, esto incluye el diseño, pruebas de usabilidad
y accesibilidad; lenguajes de diseño y marcado como HTML, CSS y JavaScript; diseño
gráfico y herramientas de edición de imágenes; posicionamiento en buscadores o SEO;
rendimiento web y compatibilidad del navegador. esta tecnología web se encargará de
optimizar visualmente la página, estructurarla cómodamente a los ojos del usuario y mantener
una adecuada estética del sitio para que la interacción en él (consulta, solicitud, clics) sea
correcta y eficaz. Por ello, una de las cualidades más valiosas para obtener una web
responsive es la creatividad para poder diseñar sitios llamativos y atractivos que sean óptimos
para todo tipo de dispositivos y resoluciones.

2.2 Forma de interacción con el usuario

FrontEnd es básicamente la estructura visible de una página, los usuarios interactúan
directamente con el diseño, permite al usuario la navegación dentro de una pagina por este
motivo el programador del ForntEnd debe trabajar con lenguajes, frameworks y bibliotecas
para cumplir con altos estándares de usabilidad y estética.

2.3 Ejemplos de Tecnologías FrontEnd

React.js
React es sin duda, para mí, lo que vendría siendo el futuro del desarrollo web, ya que este
más que ser un Framework es una librería JavaScript que ayuda exclusivamente a la
construcción de la UI reactjs 10 tecnologías que debes de aprender este añodel lado del
navegador. Esta característica permite que podamos seguir utilizando la tecnología de nuestro
agrado en la parte del Back End. React es desarrollado por Facebook e implementado en
muchos de sus proyectos, lo que garantiza la constante actualización y evolución. Lo más
interesante de React es su concepto de Web Componentes, que nos permite crear elementos
reutilizables que simplemente se reutilizan dentro de nuestra aplicación, de esta menare
podemos crear nuestras propias etiquetas y utilizarlas cuantas veces queramos. Actualmente
React compite fuertemente con Angular del cual hablaremos a continuación.

Angular
Angular es hoy en día, la tecnología favorita para el desarrollo web. Angular es también
escrito en Javascript, lo que le proporciona una súper portabilidad al igual que React, sin
embargo, Angular angular-js 10 tecnologías que debes de aprender este añoes un Framework,
lo que implica que hace más cosas que solo construir la UI. Angular se encarga de crear las
vistas, pero también se puede implementar la lógica de negocio, el acceso a datos y muchas
más cosas. Debido a esto, Angular un gran número de fans. Sin embargo, tener todo en uno
tiene un coste, y es que una vez que usamos Angular, estamos muy limitados a utilizar las
tecnologías que queramos del lado del servidor.

Vue.js
Vue ya tiene una dilatada historia. En 2014 Evan You acababa de terminar su etapa en Google
como desarrollador y entre otros proyectos también había trabajado en Angular. Su
experiencia le permitió crear su propia biblioteca personal que posteriormente liberó al

4
público. Fue precisamente la comunidad quien hizo crecer el proyecto hasta convertirse en
el potente y ligero framework que es en nuestros días.

Backbone.js
Backbone es un framework que nos permite construir de una manera muy sencilla
aplicaciones javascript de tipo SPA (Single Page App), implementando el patrón MVC
(Modelo Vista Controlador). Backbone se sostiene sobre una serie de piezas clave que nos
permitirán, de una forma sencilla, construir cualquier aplicación:

• Modelos
• Vistas
• Colecciones
• Eventos

Ember.js
es un marco web JavaScript de código abierto que utiliza un patrón de servicio de
componentes. Permite a los desarrolladores crear aplicaciones web escalables de una sola
página mediante la incorporación de modismos comunes, mejores prácticas y patrones de
otros patrones del ecosistema de aplicaciones de una sola página en el marco. El framework
Ember.js representa un cambio de paradigma con respecto a otros frameworks ya que para
funcionar correctamente nos exige que respetemos totalmente unas convenciones de
nomenclatura (Naming conventions) a la hora de nombrar a cada uno de los objetos de la
App.

3 Tecnología BackEnd
Backend es aquello que se encuentra del lado del servidor y se encarga de interactuar con
bases de datos, verificar maniobras de sesiones de usuarios, montar la página en un servidor
y servir todas las vistas creadas por el desarrollador frontend. En este caso el número de
tecnologías es mucho menos limitado, puesto que la programación backend puede alcanzar
lenguajes como PHP, Python, .NET, Java, etc., y las bases de datos sobre las que se trabaja
pueden ser SQL, MongoDB, MySQL, entre otras.

3.1 Características
trabaja todo el tiempo con lenguajes de programación, La encargada de optimizar recursos,
de la seguridad de un sitio y demás. Combinar la información encontrada y transformarla,
flexibilidad de este para integrar nuevas estructuras y códigos. Seguridad: debido a la
constante interacción del Backend con las bases de datos, desarrollar el código siguiendo
prácticas seguras es sumamente importante. Robustez: con esto nos referimos a la "fuerza"
del Backend, o su capacidad para funcionar en cualquier contexto. Back-end se le atribuye
todo lo que sucede en segundo plano porque facilita la interacción web.

5
3.2 Forma de interacción con el usuario
Los usuarios interactúan con el BackEnd solo cuando ingresan información al sitio o realizan
búsquedas, estas funciones son llevadas a cabo de manera discreta que los usuarios no sabrán
que tipo de metodologías utilizaron los programadores en su desarrollo. Mayormente el
BackEnd esta enfocada a los programadores y es la base de toda pagina o sitio web, además
que se encarga de la seguridad de los datos que lleguen a almacenar.

3.3 Ejemplos de Tecnologías BackEnd

Java
Es un lenguaje de propósito general capaz de acometer todo tipo de proyectos y ejecutarse
en múltiples plataformas. Con Java podemos hacer todo tipo de proyectos, desde aplicaciones
web a servicios web basados en SOAP o REST, aplicaciones de escritorio de consola o
interfaz gráfica.

Php
Acrónimo recursivo en inglés de PHP: Hypertext Preprocessor (preprocesador de hipertexto),
es un lenguaje de programación de propósito general de código del lado del servidor
originalmente diseñado para el desarrollo web de contenido dinámico.

Phyton
Es un lenguaje de programación interpretado cuya filosofía hace hincapié en una sintaxis que
favorezca un código legible. Se trata de un lenguaje de programación multiparadigma, ya que
soporta orientación a objetos, programación imperativa y, en menor medida, programación
funcional. Es un lenguaje interpretado, usa tipado dinámico y es multiplataforma.

Ruby
Es un lenguaje de programación interpretado, reflexivo y orientado a objetos, creado por el
programador japonés Yukihiro "Matz" Matsumoto, quien comenzó a trabajar en Ruby en
1993, y lo presentó públicamente en 1995. Combina una sintaxis inspirada en Python y Perl
con características de programación orientada a objetos similares a Smalltalk. Comparte
también funcionalidad con otros lenguajes de programación como Lisp, Lua, Dylan y CLU.
Ruby es un lenguaje de programación interpretado en una sola pasada y su implementación
oficial es distribuida bajo una licencia de software libre.

MySql
Es un sistema de gestión de bases de datos relacional desarrollado bajo licencia dual: Licencia
pública general/Licencia comercial por Oracle Corporation y está considerada como la base
datos de código abierto más popular del mundo,12 y una de las más populares en general
junto a Oracle y Microsoft SQL Server, sobre todo para entornos de desarrollo web.

6
4 Conclusión
Para concluir debemos entender la importancia de estas dos tecnologías, una depende de otra
para ser en conjunto una pagina con la mejor estética y confiabilidad en el manejo de datos,
el FrontEnd es la composición de interfaces y mapeo de cada función de la página que genera
el BackEnd, uno de los principales objetivos del BackEnd es garantizar una base fuerte para
el FrontEnd, ya que se encarga de levantar el servidor donde se encontrar y en la seguridad
y manejo de datos por eso mismo llega a ser en mi opinión la parte más importante del
desarrollo de una pagina web.

5 Bibliografía
Ramos, J. (s. f.). Desarrollo web: Diferencias entre Frontend y Backend (Ejemplos).
Programación y mas. Recuperado 19 de octubre de 2020, de
https://programacionymas.com/frontend-vs-backend

Ponguta, E. (2019, 10 febrero). características y complementariedad existente entre el

desarrollo Front-Ed y Back-End en programación web. Edwinponguta.blogspot.
https://edwinponguta.blogspot.com/2019/02/caracteristicas-y-complementariedad.html

Arturo, F. C. (2014, 10 septiembre). ¿ Que es Front-end y que es Back-End ? FalconMasters.

http://www.falconmasters.com/web-design/que-es-front-end-y-que-es-back-end/

C. (2015, 25 agosto). Desarrollador web: Front-end, back-end y full stack. ¿Quién es quién?
campusMVP.es. https://www.campusmvp.es/recursos/post/Desarrollador-web-Front-end-
back-end-y-full-stack-Quien-es-quien.aspx