Nota: La aplicación es responsive, sin embargo no deseo saturar el artículo con decenas de imagenes.

Usuario sin iniciar sesión.





Sesión activa




A tener en cuenta

Si bien explicaré como funciona la aplicación y los guiaré en todo momento, si deseas aprender más acerca del framework te recomiendo que investigues por tu cuenta, Ruby on Rails tiene miles de recursos de los cuales aprender.

Los comentarios no serán proporcionados por Disqus al final de la aplicación, si bien dialogue con Daniel al respecto, creo que tener una aplicación con mayor funcionalidad proporcionará mejor contenido del cuál aprender para los lectores.

No tengas miedo a sugerir alguna característica, si te gustaría ver la implementación de i18n, el uso de ActionCable (los websockets de Rails 5), etc. haz la sugerencia, y haremos cambios sobre la marcha.

Enlaces externos

Roadmap

Tranquilo, en minutos estarás creando la aplicación, sin embargo quiero que sepas qué vamos a crear.

  • Facts - Son los uploads del usuario, las imágenes o como desees llamarlas.
  • Users - Los usuarios del sitio, podrán editar sus propios facts y crear nuevos, los administradores pueden editar y eliminar los facts de cualquier usuario.
  • Likes - Los usuarios podrán dar like a los facts que sean de su agrado.
  • Comments - Los facts tendrán comentarios que podrán ser creados por los usuarios.
  • Notifications? - Si bien aún no estoy seguro de esto, he estado planeando su desarrollo, si el lector desea que sea implementado puede dejar un comentario con su sugerencia.

¿Podemos comenzar con la aplicación de una buena vez?

Paciencia, pero sí, es hora de comenzar. Asumo que tienes Rails 5 instalado, de no ser así, visita el enlace correspondiente a tu sistema operativo:

Let's do it!, comienza con generar un nuevo proyecto de Rails con el comando

  $ rails new scienterest

Yo he llamado mi aplicación scienterest, pero siéntete libre de llamarla como gustes. Una vez Rails termine de generar la estructura de tu aplicación, si no conoces acerca de la estructura de directorios de Rails, te recomiendo que leas esta rápida nota acerca de ello, por Jerzi J. Gangi.

Tiempo de cambiar directorio a nuestra aplicación e iniciar el servidor.

  $ cd scienterest
  $ rails s

Si navegas a localhost:3000 podrás ver tu aplicación, muy interesante para tan poco trabajo, eh?.

Tiempo de programar, instalaremos la gema Devise para generar nuestro modelo de usuario, abre tu archivo Gemfile y añade Devise.

Atención a la linea 33.

Hora de instalar la gema:

  $ bundle

Una vez bundle termine, debemos instalar devise con sus generadores: 

  $ rails g devise:install

Como puedes ver, nos da una lista de instrucciones que seguir para completar la instalación, primero abre el archivo config/environments/development.rb y añade config.action_mailer.default_url_options = { host: 'localhost', port: 3000 } debajo de la primera linea comentada, quedando algo así:

Abre el archivo config/routes.rb y añade la ruta raíz (root path):

La ruta asignada aún no existe, ¡pero lo hará muy pronto!

Crea un directorio llamado partials en app/views/ y una vez hecho, crea el archivo app/views/partials/_notification.html.erb

Los archivos que inician con guión bajo (underscore) son tratados como partials en Rails, siempre que desees crear un archivo de este tipo deberá iniciar con _

Debemos incluir el partial que acabamos de crear en el layout principal de nuestra aplicación, abre el archivo app/views/layouts/application.html.erb y arriba de <%= yield %> añade <%= render "partials/notification" %>:

El helper render puede tomar rutas relativas o absolutas, sin embargo podrás observar sus diferencias cuando creemos el formulario para nuestros Facts.

Para finalizar con la instalación, usa el siguiente comando para generar las vistas de Devise, así podremos personalizarlas en el futuro.

  $ rails g devise:views users

Una vez Devise genere las vistas, tendremos que habilitarlas, en el archivo config/initializers/devise.rb busca la linea config.scoped_views = false elimina el comentario y cámbialo a true.

Eso es todo por este artículo. Si bien parece que no hemos hecho mucho, cosas muy interesantes se cubrirán en esta serie. Stay tuned!

Goodbye world.