Nivel K

 

HTML

Bienvenidos al curso de nivel K lección HTML, en esta lección vamos a aprender de manera básica el lenguaje con etiquetas HTML por medio de entono de programación Visual Studio Code, para esto te compartimos un manual que te explicará el proceso de descarga e instalación:

El software Visual Studio Code ya esta instalado en los equipos de computo del colegio.


Este lenguaje maneja una estructura básica como lo muestra la siguiente imagen




Ahora bien, hay varias versiones para programar en HTML, nosotros vamos a utilizar la versión HTML 5, por lo cual en la primera línea de código debemos escribir “<!DOCTYPE html>” con el fin de indicarle al navegador que nuestro código está escrito con base en la versión HTML 5, cabe resaltar que DOCTYPE no es una etiqueta sino una declaración.

Descarga la siguiente guía y realiza los ejercicios allí planteados.

Descargar 


CSS

Bienvenidos al curso de nivel K lección CSS, en esta lección vamos a configurar el diseño de una página web por medio de este lenguaje CSS.

Vamos a conocer que es CCS por medio del siguiente video:



Actualmente, estamos en la versión 3 de CSS y existen varias maneras de incorporar CSS en nuestra página web, vamos a ver algunos ejemplos:


Formas de trabajar con lenguaje CSS









JavaScript

Bienvenidos al curso de nivel K lección JavaScript, en esta lección vamos a implementar en lenguaje de java script en una página web con el fin de incorporar elementos interactivos, pero primero vamos a conocer que es JavoScript:




Como podemos ver Java Script es un lenguaje de programación enfocado a páginas web, el cual es similar a otros lenguajes de programación como C o Arduino, vamos a ver algunas normas básicas que definen la sintaxis de Java Script:



Variables



Función

Al igual que CSS, JavaScript maneja varias formas de incorporar el lenguaje en nuestra página web, nosotros vamos a utilizar el método más común, el cual es crear un archivo tipo JS (JavaScript) aparte del documento HTML, para luego llamar las acciones del documento JavaScript desde el documento HTML.





Taller practico

Este proyecto tiene como objetivo crear una calculadora básica implementada en una página web, complementando los conceptos técnicos vistos durante el curso (HTML, CSS y JavaScript). Parámetros de la calculadora:

  1. Ingreso de Números: Utiliza los botones numéricos para ingresar los valores de los números.
  2. Operadores Matemáticos: Selecciona los botones de operadores para realizar las operaciones deseados.
  3. Borrar y Reiniciar: Utiliza el botón “C” para borrar la entrada actual y reiniciar la calculadora.
  4. Resultado: El resultado de la operación se mostrará instantáneamente en el campo de visualización.

A continuación adjuntamos el código de programación para este proyecto.


Pasos para crear este estupendo proyecto. 


1) Crear una carpeta en el escritorio de tu computador con el nombre de "Calculadora".



2) Dentro de la carpeta deberán ir 3 archivos los cuales debes crear en el software "Visual Studio Code".



3) Empieza creando el archivo CSS "Estilos de la calculadora". Para ello deberás abrir el software Visual Studio Code, Crear un archivo nuevo y guardarlo con la extensión CSS y el nombre ""style..css". 
Sigue los siguientes pasos 




luego debes dar clic en File, Save as;






Guarda el archivo así:







Luego deberás editar el siguiente código:







4) De la misma forma que lo hiciste anteriormente deberás crear otro archivo con el nombre de "main.js" y guardarlo con la extensión js que significa JavaScript.





Deberás editar el siguiente código











 5) Finalmente deberás crear un ultimo archivo y guardarlo con el nombre "index.html" y digitar el siguiente código. 



Acá te dejo el código:



 









Nota: 



La calculadora deberá tener colores y estilos distintos distintos en cada pareja de estudiantes.

Video que demuestra el funcionamiento de la calculadora. 




 



















































































Comentarios

Entradas populares de este blog