intro-introduction/README-es.md

Introducción al laboratorio y a los programas que utilizaremos

Esta es la primera de una serie de experiencias de laboratorio que se desarrollaron como parte del proyecto patrocinado por la NSF “Development of engaging and readily transferable laboratory experiences for the introductory programming course” (DUE-1245744). El objetivo principal de estas experiencias de laboratorio es que los estudiantes de cursos introductorios de programación practiquen los conceptos y habilidades aprendidas en clase y obtengan productos atractivos que los motivarán a explorar aún más las infinitas oportunidades de diversión y aplicabilidad de la Ciencia de Cómputos.

Cada una de las experiencias de laboratorio utiliza bibliotecas y código reutilizable desarrollado por profesores y estudiantes del programa de Ciencia de Cómputos de la Universidad de Puerto Rico, en el campus de Río Piedras (http://ccom.uprrp.edu) (http://ccom.uprrp.edu)) . Cuando se complete cada experiencia de laboratorio, el alumno no sólo reforzará los conceptos aprendidos en clase, sino que también podrá ver los productos que él o ella puede lograr con un poco más de conocimiento y experiencia en computación.

En esta primera experiencia de laboratorio aprenderá el flujo de trabajo para las próximas actividades, cómo acceder a los archivos que se utilizarán y cómo entregar sus trabajos. También aprenderá a gestionar los elementos básicos de Qt, la plataforma que nos permitirá desarrollar y ejecutar proyectos en C++.

Objetivos:

1. Conocer sobre las experiencias de laboratorio preparadas y las expectativas generales de las sesiones de laboratorio.

2. Practicar el uso de Git y Bitbucket, bajar, y guardar los archivos necesarios para cada experiencia de laboratorio.

3. Practicar cómo compilar, corregir errores y ejecutar un programa usando Qt.

---

Servicios y programados que utilizaremos:

Libro electrónico

Las instrucciones para las experiencias de laboratorio están contenidas en el libro electrónico que puedes acceder en http://eip.ccom.uprrp.edu/book_es/.

Publicaremos el nombre del laboratorio cada semana en nuestra página de Moodle del curso.

Esta es una versión preliminar del libro y por lo tanto puede contener errores. Te agradeceremos que nos indiques si encuentras algún error y si tienes alguna sugerencia que pueda ayudar a que las instrucciones sean más claras. Por favor notifiquenos a: eip.uprrp@upr.edu.

Bitbucket y Git

Bitbucket es un repositorio o depósito de archivos digitales al que se puede acceder en línea y que permite trabajar proyectos en grupo de manera ordenada y simple. Los archivos del Laboratorio de Introducción a la Programación estarán almacenados en este lugar y se podrán bajar a las computadoras personales utilizando Git.

Git es un sistema de control de versiones de código abierto que es usado principalmente para el desarrollo de software. El equipo de EIP utilizó Git durante el desarrollo de software de las experiencias de laboratorio. Usted como estudiante posiblemente no necesitará usar las capacidades de control de versiones de Git para las asignaciones de código en las experiencias de laboratorio. Sin embargo, usted utilizará Git para bajar el código fuente de los archivos de las experiencias de laboratorio al comienzo de la sesión de laboratorio, por ejemplo, usando git clone url. Puede obtener Git en http://git-scm.com/.

Terminal y Linux

Los ejercicios de programación desarrollados por EIP se pueden completar en cualquiera de los tres sistemas operativos principales: Linux, OSX y Windows. Independientemente de su sistema operativo preferido, hemos encontrado que el dominio de la línea de comandos siempre ayuda a los estudiantes a completar los ejercicios de programación más cómodamente. Los siguientes son algunos comandos útiles para el terminal OSX y Linux.

---

Comando	Acción
ls	muestra lista de los archivos en el directorio
mv nombre1 nombre2	mueve contenido de nombre1 a archivo nombre2 (cambia nombre del archivo)
cp nombre1 nombre2	copia contenido de nombre1 a archivo nombre2
rm nombre	borra archivo
mkdir nombre	crea directorio nombre dentro del directorio actual
cd ..	cambia al directorio anterior
cd ~	cambia al directorio hogar
cd nombre	cambia al directorio nombre (dentro del actual)
flecha hacia arriba	repite comando anterior

Figura 1. Comandos básicos de Unix.

---

Qt

Qt es un marco de aplicaciones multiplataforma ampliamente utilizado por muchas organizaciones para desarrollar aplicaciones multiplataforma. C++ es el lenguaje de programación principal de Qt. La marco QT funciona en, y puede crear versiones de, aplicaciones para diferentes plataformas (tanto plataformas de escritorio, plataformas móviles, entre otras). El proyecto Qt proporciona un entorno de desarrollo integrado (IDE), denominado Qt Creator. Le recomendamos que instale Qt y Qt Creator en su computadora personal y explore las opciones que ofrecen estas aplicaciones. También le animamos a inspirarse explorando la diversidad de aplicaciones desarrolladas por la comunidad Qt en https://showroom.qt.io/.

Máquina virtual

El proyecto EIP distribuye todos sus productos (libros electrónicos, código fuente, etc.) como una máquina virtual disponible en http://eip.ccom.uprrp.edu/vms/. El archivo comprimido contiene un archivo VMDK que se puede reproducir en VMware Workstation o VirtualBox.

Le recomendamos que utilice la máquina virtual, ya que viene preinstalada con Qt, el libro en línea y directorios de código fuente para las diversas experiencias de laboratorio. Además, el código fuente ha sido probado con la versión Qt que está preinstalada. Si instala otra versión de Qt, usted puediese tener problemas con algunos de los programas.

Cómo obtener Qt

Si decide instalar la aplicación Qt de forma nativa en su computadora, puede descargarla desde la página del proyecto Qt en http://qt-project.org/. Nuestro proyecto desarrolló algunos videos que le instruyen sobre cómo instalar Qt en los distintos sistemas operativos en: http://youtu.be/6eY5VSPYZCw (Linux), http://youtu.be/CImDCSxi7Wc (Windows), http://youtu.be/_zq-pSw3Ox4 (Mac).

---

---

Usando Qt

En esta experiencia de laboratorio aprenderemos a utilizar algunas de las funcionalidades básicas de Qt Creator. Utilizaremos Qt Creator principalmente para editar y depurar nuestros programas. Sin embargo, Qt Creator también incluye Qt Designer, la herramienta Qt para diseño de GUI que se utilizó para diseñar las interfaces gráficas de las experiencias de laboratorio. Aprender a usar esta herramienta no es parte de este curso, pero puedes aprender a usarlo por tu cuenta. En https://docs.google.com/file/d/0B_6PcmpWnkFBOXJxVDlUNEVfOFk puede encontrar una presentación, preparada por el estudiante Jonathan Vélez, que muestra los conceptos básicos de usar Qt Creator y Qt Designer para diseñar interfaces gráficas.

Proyectos en C++

Cada proyecto en C++ se compone de varios tipos de archivos. En proyectos de Qt comunmente tendrás archivos del tipo fuente (source), encabezados (header) y formulario (form).

• Archivos “source”: Estos archivos tienen una extensión .cpp (C plus plus) y contienen el código fuente de C++ para su programa. Entre estos archivos encontrará main.cpp; este es el archivo que normalmente contiene la función principal que el preprocesador buscará para iniciar su programa. Otro archivo fuente que encontrará en los proyectos creados con Qt es el archivo mainwindow.cpp; este archivo es creado por Qt y contiene la implementación de las funciones que controlan el código asociado con la ventana GUI principal diseñada con la opción de diseño (por ejemplo, las funciones que aparecen debajo de “Private slots”).

• Archivos “headers”: Estos archivos tienen extensión .h y contienen declaraciones de las funciones que son utilizadas en el programa.

• Archivos “forms”: Estos archivos tienen extensión .ui (user interface) y contienen una descripción de los controles y widgets incluidos en la ventana GUI de la aplicación.

---

---

Sesión de laboratorio

En esta experiencia de laboratorio practicarás el uso de algunos de los programas que utilizarás durante el semestre. Utilizarás los programas que están instalados en la máquina virtual.

Ejercicio 0: Crear directorio para los archivos de los laboratorios

Utiliza el terminal y el comando mkdir para crear un directorio Documents/eip para los archivos de los laboratorios.

Ejercicio 1: Comenzar proyecto nuevo

Instrucciones

1. Para comenzar un proyecto en C++, marca el botón de New Project o ve al menú principal de Qt Creator y en File selecciona New File or Project. Saldrá una ventana similar a la ventana en la Figura 2. Selecciona Non-Qt Project, Plain C++ Project y marca Choose.

   ---

   

   Figura 2. Comenzar proyecto en C++ sin aplicaciones gráficas.

   ---

2. Escribe el nombre del proyecto, selecciona el directorio en donde quieres guardarlo, marca Next en esa y la siguiente ventana, y luego Finish en la próxima.

   Este proceso creará un nuevo proyecto en Qt con el esqueleto de un programa básico en C++ que solo despliega “Hello World!”. Antes de continuar, selecciona Projects en el menú vertical de la izquierda. Deberá aparecer la pantalla de Build Settings. En esa pantalla, asegúrate que la cajita de Shadow build NO esté seleccionada, como ocurre en la Figura 3.

   ---

   

   Figura 3. La opción Shadow build no está seleccionada.

   ---

3. Regresa a la pantalla donde puedes editar el programa seleccionando Edit en el menú de la izquierda y haciendo “doble click” en Sources y luego en main.cpp. Presiona la flecha verde en el menú de la izquierda para ejecutar el programa. Los resultados del programa se desplegarán en una pantalla de terminal. Si hubiese errores, estos aparecerán en la pantalla de Issues en Qt Creator.

4. Cambia el contenido de main.cpp para que sea:

   #include <iostream>
   using namespace std;
   
   int main()
   {
       cout << endl << "Me gusta el laboratorio de programacion." << endl;
       return 0;
   }
   

   ---

5. Marca el botón verde del menú de la izquierda para compilar y ejecutar el programa. Saldrá una ventana que te ofrece la opción de guardar los cambios. Marca Save all. Al ejecutar, si no cometiste ningún error, el programa debe desplegar “Me gusta el laboratorio de programacion.” en la pantalla de terminal.

Ejercicio 2: Bajar proyectos de Bitbucket

Los archivos para cada experiencia de laboratorio están guardados en Bitbucket. En cada sesión de laboratorio bajarás de Bitbucket la carpeta que contiene los archivos de esa experiencia de laboratorio y los guardarás en el directorio Documents/eip que creaste en el Ejercicio 0. Para bajar la carpeta correspondiente a esta experiencia de laboratorio, abre un terminal, utiliza los comandos de Linux para cambiar de directorio al directorio Documents/eip y ejecuta el comando git clone https://bitbucket.org/eip-uprrp/intro-introduction.git. Ve al directorio Documents/eip y verifica que contiene la carpeta intro-introduction.

Ejercicio 3: Abrir proyecto ya creado, compilar, y ejecutar

En este ejercicio practicarás cómo compilar, corregir errores, y ejecutar un programa usando Qt.

Instrucciones

1. Primero borrarás los archivos que fueron creados por Qt durante el proceso de construcción y cerrarás los archivos del proyecto anterior. Para hacer esto, en el menú principal de Qt Creator ve a Build y selecciona Clean all; luego ve a File y selecciona Close all projects and editors.

2. Carga a QtCreator el proyecto Practica haciendo doble “click” en el archivo Practica.pro en el directorio Documents/eip/introduccion de tu computadora. En la ventana que aparece marca Configure Project.

   Cada vez que cargues o comiences algún proyecto asegúrate de que el Shadow build no esté seleccionado: en el menú de la izquierda, selecciona Projects y luego, en Build Settings, verifica que la cajita de Shadow build no esté seleccionada, como vimos en la Figura 3.

3. Como viste anteriormente, Qt te permite construir y ejecutar el programa marcando la flecha verde que aparece en la columna de la izquierda. Presiona la flecha y nota que obtienes una ventana de “Issues” que ocurrieron al construir. La lista que aparece te muestra información que te permitirá encontrar y corregir los errores.

4. Selecciona el archivo main.cpp en el directorio de Sources para que puedas encontrar y corregir los errores.

   Corrige todos los errores y presiona nuevamente la flecha verde para construir y ejecutar el programa. Una vez corrijas todos los errores, el programa debe abrir la pantalla Application Output y desplegar Salida: 1.

5. Como mencionamos antes, durante el proceso de compilación y ejecución, Qt crea varios archivos que debemos borrar luego de terminar con el programa. Para hacer esto, en la opción Build del menú de Qt Creator, selecciona Clean All.

Ejercicio 4: Entrega de trabajos

Durante cada experiencia de laboratorio el estudiante deberá entregar algunos resultados de su trabajo. Estas entregas se harán en la sección de “Entregas” que aparece en Moodle. Hoy cada estudiante practicará una entrega individualmente.

Instrucciones

1. Abre el enlace de “Entregas” en Moodle y entrega el archivo main.cpp. Recuerda utilizar buenas prácticas de programación incluyendo el nombre de los programadores como comentario al inicio de tu programa.