Proyecto ShinFDuran Home: Día 1 Planificación inicial

Hoy tocaba realizar al menos el índice de contenidos.  Si bien al final sólo le he dedicado 2-3 horas al menos he comenzado ya y he empezado a plasmar mis ideas en conceptos más concretos.

Objetivos de la página

Lo primero que hay que definir es por qué se va a realizar la página.

Objetivo principal de la página
    Ser una especie de presentación online de mi persona.

Objetivos secundarios

• Adquirir experiencia en el uso de Node.JS, Express.js, Stylus y MongoDB entre otros.
• Usar este proyecto como forma de medir mi tiempo y organizarme en la realización de un proyecto y asentar el hábito.  Y tenerlo como referencia, para al finalizar analizarlo y ver qué es posible mejorar.
• Facilitar información (tanto con los post como con el código) a otras personas para que les ayude en sus propios desarrollos.

Inventario de contenido

Un menú/nav que nos permitirá acceso a las 5 secciones principales:

• Inicio: Página que se carga al acceder a la web.
• Sobre mí: Página en la que hago un resumen de mi forma de ser, mis habilidades e información adicional.
• Portfolio: Listado con los proyectos que he realizado y una pequeña descripción.
• Contacto: Información para facilitar el contacto conmigo.
• Blog: Link al blog, considero que el blog tiene tanto peso como para estar en el menú.

Esto da lugar a 4 páginas y en el caso de portfolio hará falta una plantilla adicional para cargar los proyectos en detalle, ahora hay que analizar página por página más en detalle.

Inicio

• Web que se carga inicialmente al escribir la ruta de la web.
• De primeras sería correcto un mensaje de bienvenida o saludo breve.
•  ¿Presentación o breve introducción sobre mí?
•  Explicar qué es lo que se va a encontrar en la web o los objetivos.

Sobre mí

• Más información sobre mí.
• Una introducción sobre quién soy y hacia dónde quiero enfocarme.
• Habilidades/conocimientos que dispongo actualmente.
• ¿Qué estoy aprendiendo o quiero aprender?
• Información adicional, puede que aficiones.

Portfolio

• Primero un listado con los proyectos que he realizado.
• Una imagen pequeña acompañadada de una breve descripción del proyecto.
• Funciones desempeñadas, conocimientos aplicados.  ¿Una de las dos o ambas?
• Link para ir directamente al proyecto
• Al pulsar sobre el nombre del proyecto nos cargará sólo ese proyecto pero con información ampliada.

Contacto

• Creación de un formulario que al enviarlo.
• Debe comprobar que exista: Nombre, email (y que sea válido) y mensaje.
• Mostrar otras posibles vías de contacto (email, teléfono, twitter,...)

Otras notas

• Los botones sociales no se si añadirlos sólo en el contacto o en toda la web.

Desarrollo de la web

Lo habitual no es (o no debería ser) esto, es decir, hacer una web y usar una serie de tecnologías porque sí, sino que pensamos en una web, sus necesidades y a partir de ahí vemos las mejores tecnologías para esa web en cuestión.  De hecho, para esta web con WordPress y alguna plantilla se podría hacer mucho más rápido y probablemente más estético.

¿Entonces? El objetivo principal no es hacer una web para algo, sino ganar experiencia y familiarizarme con una serie de tecnologías.  Pero en lugar de hacerlas en plan prueba con diferentes webs temporales usarlas en un proyecto real.

En la creación de la página web usaré Node.JS con el framework express y para gestionar la información de los proyectos del portfolio una base de datos MongoDB, sí, es una chorrada crear una base de datos MongoDB para esa mínima cantidad de información, el hacerlo directamente sin base de datos me ahorraría una cantidad de tiempo enorme, pero como he dicho el objetivo no es hacer una web en un plis (para eso usaría WordPress u otros) sino para aprender y consolidar conocimientos y por eso quiero hacerlo con MongoDB.  Además, quiero generar el CSS a partir de Stylus.

Para el diseño se usará Flat Design y buscar un estilo dinámico en la web no sólo mediante el diseño responsive sino en posibles animaciones o efectos.

Finalmente, cuando la web esté terminada se buscará por un lado que el código sea limpio y esté debidamente comentado para que su comprensión y mantenimiento posterior sea fácil.  Además se optimizará la web para que tenga una carga rápida.