In order to spread my work and look for a job related to programming, I decided to make a website where I could expose information about myself, my studies and my work experience, my portfolio and my contact information.
It is completely responsive and was made using, as a base, a template downloaded from BootstrapMade, to which personal modifications and additions were made.
In it we can find the following sections:
It shows a simple page, with my full name and a one-line description. If viewed from a widescreen device, below is the navigation bar, with links to the different sections that make up the site, otherwise it is folded and can be expanded from the icon located in the upper right corner.
Immediately below the navigation bar, on wide screens, or the description, on mobile screens, you can find icons to access my LinkedIn profile, my Github profile and download the PDF version of my resume respectively.
In this section there is a cover letter and a photo, followed by my skills with different programming languages, represented by progress bars.
Then the Python's libraries and frameworks that I know, and finally the languages I know, represented in the same way as my skills.
To the right of the section title we can find an icon through which the user can download the PDF version of the resume. Then we find two columns, on the left a small professional summary about me is displayed, followed by all the information related to my programming education, ordered from the most recent to the oldest.
On the left side is, ordered in the same way as education, all the information regarding my work experience, including only those jobs that exceed a certain stability and formality.
On mobile screens, the columns are not displayed next to each other, but the one related to work experience is below the one that refers to education.
In this section you can find my programming projects for productive purposes.
Each of these is presented through an image through which you can enter its individual page, where you can find all its information, sample images and a link to its respective Github repository.
If the user wishes, they can filter the projects according to their status: In production, in development or paused.
In the last section of the site you can find all my contact information: Current location (city), external links (LinkedIn, Github and a WhatsApp chat), email and cell phone.
Then you can find a contact form, through which the user can contact directly without leaving the site. In it, he must indicate:
- Full name of the user.
- Email address where to receive the response.
- Subject or reason for contact, which must be selected from a drop-down list.
- If
Otheris selected from the dropdown list, the reason must be specified in the new text field that appears.- Body of the message to be sent.
Throughout the navigation of the site you can find, at the bottom of it, the flags of Spain and the U.K. representing the Spanish and English languages respectively. By clicking them you can select to navigate the site in the corresponding language.
The site has pages for cases in which the server returns the following errors to the user: 403, 404, 500 and 503. They consist of a simple page where the error code is displayed and a navigation bar from which the error description can be accessed in either Spanish or English. Depending on the device from which the site is being accessed, it may be folded, following the same dynamic as the main navigation bar in the rest of the site.
In the case of errors 500 and 503, since the user is unable to access the site as they represent a server error, contact information is provided so that he can communicate through other means.
Con motivo de difundir mi trabajo y buscar empleo relacionado con la programación, decidí realizar un sitio web en donde pudiera exponer información sobre mí, sobre mis estudios y mis experiencias laborales, mi portfolio y mis datos de contacto.
El mismo es completamente responsive y se realizó utilizando, como base, un template descargado de BootstrapMade, al cual se le hicieron modificaciones y agregados personales.
En él podemos encontrar las siguientes secciones:
Aquí se muestra una página simple, con mi nombre completo y una descripción de una sóla línea. Si se visualiza desde un dispositivo con pantalla ancha, debajo se encuentra la barra de navegación, con los enlaces a los distintas secciones que componen el sitio, sino la misma se encuentra replegada y se puede expandir desde el ícono ubicado en la esquina superior derecha.
Inmediatamente debajo de la barra de navegación, en pantallas anchas, o la descripción, en pantallas móviles, se pueden encontrar íconos para acceder a mi perfil de LinkedIn, mi perfil de Github y descargar la versión en PDF de mi curriculum vitae respectivamente.
En esta sección se encuentra una carta de presentación, acompañada de una foto, seguida por mis habilidades con distintos lenguajes de programación, representadas a través de barras de progreso.
Luego las distintas librerías y frameworks de Python de las cuales tengo conocimiento y, por último, los idiomas que conozco, representados de la misma forma que mis habilidades.
A la derecha del título de la sección podemos encotrar un ícono a través del cual podemos descargar la versión en PDF del curriculum vitae. Luego encontramos dos columnas, por la izquierda se desplega un pequeño resumen profesional sobre mí, seguido por toda la información relacionada a mi educación relacionada a la programación, ordenada de manera cronológica desde la más reciente hasta la más antigua.
Del lado izquierdo se encuentra, ordenada de la misma forma que la educación, toda la información respecto a mi experiencia laboral, incluyendo sólo aquellos empleos que superen cierta estabilidad y formalidad.
En pantallas móviles las columnas no se visualizan una al lado de la otra, sino que la relacionada a la experiencia laboral se encuentra debajo de la que remite a la educación.
En esta sección se encuentran mis proyectos de programación con fines productivos.
Cada uno de éstos es presentado a través de una imagen a través de la cual se puede ingresar a la página individual del mismo, dónde podemos encontrar toda su información, imágenes de muestra y un enlace hacia su respectivo repositorio en Github.
Si el usuario lo desea, puede filtrar los proyectos según su estado: En producción, en desarrollo o pausado.
En la última sección del sitio se pueden encontrar todos mis datos de contacto: Ubicación actual (ciudad), enlaces externos (LinkedIn, Github y un chat por Whatsapp), email y teléfono celular.
Luego se puede encontrar un formulario de contacto, mediante el cuál el usuario puede contactarse directamente sin necesidad de salir del sitio. En el mismo se debe indicar:
- Nombre completo del usuario.
- Dirección de email donde recibir la respuesta.
- Asunto o motivo de contacto, el cuál se debe seleccionar de una lista desplegable.
- Si se selecciona
Otroen la lista desplegable, se debe aclarar el motivo en el nuevo campo de texto que aparece.- Cuerpo del mensaje que se desea enviar.
Durante toda la navegación del sitio se puede encontrar, en la parte inferior del mismo, las banderas de España y el Reino Unido representando al idioma español e inglés respectivamente.
A través de ellas se puede navegar el sitio en el idioma correspondiente.
El sitio dispone páginas para los casos en que el servidor devuelve al usuario los siguientes errores: 403, 404, 500 y 503.
Las mismas consisten en una página simple donde se muestra el código de error y una barra de navegación desde la cuál se puede acceder a la descripción del error ya sea en español como en inglés. Dependiendo el dispositivo desde el cual se está ingresando al sitio, ésta puede estar replegada, siguiendo la misma dinámica que la barra de navegación principal en el resto del sitio.
En el caso de los errores 500 y 503, debido que el usuario se encuentra imposibilitado de acceder al sitio ya que éstos representan un error del servidor, se le provee los datos de contacto para que pueda comunicarse a través de otros medios.