El Código Rosa: Mi primer código

Nuestro segundo encuentro será 100% práctico, con ayuda de los equipos de cómputo del laboratorio de capacitación del punto vive digital, vamos a aplicar los conceptos que tocamos en la primera clase a través de un ejercicio básico que consistirá desde un formulario simple sin estilo en html hasta el procesamiento básico de datos de entrada.

Para empezar a trabajar, fue necesario instalar en los equipos 2 herramientas básicas: Xampp y Visual Studio Code. Tienen total libertad de elegir la herramienta con la cual se sienta más cómodo o tenga mejor dominio, lo importante es saber para qué nos sirven y que nos ofrezcan los servicios que necesitamos.

En el código rosa, el plan de trabajo está diseñado para empezar a trabajar con el lenguaje PHP aprovechando sus ventajas de fácil aprendizaje, amplia documentación, por ser la base de muchos importantes sistemas, y será lo que en este módulo nos ayudará a ir desarrollando nuestra lógica de programación. La idea es ir evolucionando con el tiempo y nuestros propios avances para ir conociendo nuevas tecnologías e ir profundizando gradual y progresivamente.

El ejercicio que vamos a empezar a desarrollar es el siguiente:

Un concurso de deportes, requiere informar a los aspirantes si son aptos para participar y en qué categoría podrían aplicar para la inscripción. Los datos que deben ingresar como referencia son la estatura, la edad y el género.

La condición principal para participar es estar entre los 13 y los 25 años de edad.

Las categorías son las siguientes:

de 13 a 16 años → Categoría 2 Mixto

de 17 – 20 años → Categoría 3 Sólo que midan más de 160cm Mixto

de 20 a 25 años → Categoría 4 Sólo para mujeres

Lo primero que hicimos, fue crear nuestro proyecto en la carpeta C:\xampp\htdocs\nombredelproyecto.

Creamos nuestro primer archivo llamado index.php con el formulario de registro que quedó de la siguiente forma:

Recuerda que este formulario lo podemos ver si vamos a nuestro navegador y escribimos localhost/nombredelproyecto. El código de nuestro formulario quedó de la siguiente forma:

En la clase, estuvimos hablando sobre las diferentes etiquetas básicas de html y para efectos funcionales, no le hicimos estilo css. Un detalle para resaltar en nuestro formulario, es el parámetro ‘action’ en la etiqueta ‘form’ donde indicamos el nombre del archivo procesar.php que hasta este punto, aún no lo hemos creado y es donde irá nuestro código funcional.

Una vez guardado nuestro index.php, procedemos a crear el archivo que llamamos en el formulario llamado procesar.php. (En la mayoría de los IDE, para crear un nuevo archivo vamos a Archivo → Nuevo Archivo) y aquí es donde analizamos la situación que nos plantea el ejercicio.

La primera parte de nuestro código consistió en recibir los datos que vienen del formulario que ya habíamos creado, y como indicamos que las enviaríamos por el método POST, entonces las traemos de la siguiente forma:

Recuerda: los traemos con el mismo nombre que les dimos en el html. Como lo primero que queríamos evaluar era si el aspirante es apto para participar en el concurso, utilizamos el condicional “if” para analizar la variable “$edad”.

Guardamos los cambios en nuestro documento, vamos al navegador, recargamos la página y ya podemos interactuar con el dato de edad, que al dar clic en el botón del formulario, nos dirá si según la edad ingresada, puede participar o no en el concurso.

Nuestra primera clase llegó hasta aquí, con el compromiso de terminar el ejercicio entre todos en próximos encuentros, la idea es que estudiemos los temas que tocamos acá y estudiemos estas cortas líneas de nuestro primer código.

Términos y temas para estudiar:

  • Servidor Web
  • Apache
  • Xampp
  • WampServer
  • IDE
  • PHP (php.net)
  • HTML
  • Input y tipos de input en html
  • Select en html
  • Form en html
  • Método POST y GET
  • Comentarios en php
  • Tipos de comillas en php (Diferencias entre comillas dobles y comillas simples)
  • Variables

Si tienen dudas, necesitan asesoría, acompañamiento o tienen sugerencias para una próxima charla, pueden escribirme a mi correo electrónico [email protected].

Ana Belisa Martinez Escudero

Ana Belisa Martinez Escudero

Ingeniera de Sistemas

Ingeniera de sistemas, desarrolladora de aplicaciones web y móviles, emprendedora fundadora de El Código Rosa (startup de emprendimientos digitales hechos por mujeres), Tech Sister en Geek Girls Latam, Líder del nodo Villavicencio y autora de el curso "El Código Rosa" de la GGAcademy,