Introducción al Desarrollo Web

Esta tarea se trata de usar la aplicación bloc de notas para desarrollar código en el y que vayamos aprendiendo las bases de la programación, además hemos usado una página para hacer comprobaciones del código y ver si todo está en orden, también hemos podido ver una vista previa de como sería nuestra página si se lanzase al público

Paso 1: Preparación de los archivos en Bloc de Notas

Lo primero que hice fue abrir el Bloc de Notas en mi computadora. Para ello, presioné la tecla Windows, escribí «Bloc de Notas» en la barra de búsqueda y seleccioné la aplicación. Luego, creé tres archivos diferentes para cada tipo de código presente en los apuntes.

1. Abrí uno de los archivos que cree anteriormente de Bloc de Notas y escribí el código HTML de los apuntes de la tarea.

2. Guardé el archivo con el nombre index.html, pero no sin antes elegir el tipo de archivo «Todos los archivos» y agregando la extensión .html.

3. Repetí el proceso para el código CSS y JavaScript:

   • Archivo de código CSS: style.css

   • Archivo de código JavaScript: script.js

El código de cada archivo fue el siguiente:

HTML (index.html)

CSS (style.css)

JavaScript (script.js)

Paso 2: Verificación y modificación en CodePen

Una vez creados y guardados los archivos, el siguiente paso fue comprobar si el código creado realmente funciona o por el contrario existe algún error, para ello usamos la plataforma CodePen.

1. Abrí la página web de CodePen en mi navegador a través del link que se nos proporcionó en la tarea: https://codepen.io/.

2. Cree una cuenta con uno de mis correos personales ya que no la tenía previamente creada.

3. Una vez en la cuenta pulse «start coding» para crear un nuevo proyecto.

4. Copié y pegué cada código en su sección correspondiente:

   • El código HTML en el panel de «HTML».

   • El código CSS en el panel de «CSS».

   • El código JavaScript en el panel de «JS».

5. Verifiqué que el código funcionara correctamente gracias a la vista previa en tiempo real que ofrece CodePen.

Paso 3: Modificación y ajustes del código

Después de comprobar que efectivamente el código funcionaba perfectamente, realicé algunas modificaciones a mi gusto, pero sin modificar su funcionalidad.

• En el código HTML, cambie los textos que tenía de forma predeterminada.

• En el código CSS, ajusté propiedades de estilo para mejorar la presentación visual.

Una vez finalizadas las modificaciones, volví a guardar el código en CodePen y también hice una captura de pantalla para agregarlo en la entrega de la tarea.

Conclusión

Esta tarea acerca de desarrollo web si que creo que esta más orientada a la gente que tenga más interés en entrar a fondo en la programación, sin embargo estos conocimientos pueden resultar ser útiles en el futuro aunque no nos vayamos a dedicar específicamente a ello ya que a día de hoy las páginas web son muy importantes en lo que respecta a el mundo laboral y empresarial.