Creación e implementación de la aplicación Rails en Heroku



En esta publicación crearemos un sitio web personal usando rieles y lo implementaremos en Heroku. Heroku es una plataforma de aplicaciones en la nube: una nueva forma de implementar aplicaciones web

En esta publicación crearemos un sitio web personal usando rieles y lo implementaremos en Heroku. Heroku es una plataforma de aplicaciones en la nube, una nueva forma de crear e implementar aplicaciones web. Lo mejor de Heroku es que no tiene que pagar por alojar aplicaciones web básicas, ya que Heroku las ha categorizado como gratuitas. Construiremos una aplicación de rieles de una sola página y será un sitio web estático que se puede utilizar como cartera.





A continuación se muestra la instantánea de la aplicación de rieles (implementada en Heroku Aquí )



Comencemos a crear esta aplicación Rails. Supongo que ya ha instalado Ruby y Rails. Asegúrese de tener Ruby 2.0 y Rails 4.2.2. Puede verificar la versión desde el símbolo del sistema.

Nota: Usaremos Ruby 2.0 y Rails 4.2.2. Si tiene algunas versiones diferentes de Ruby y Rails, es posible que algunos de los pasos que se muestran en esta publicación no funcionen para usted.



Creando el Proyecto:

Nombraremos nuestro proyecto como sitio web. Para crear el proyecto, use el comando Rails new website

Rails generará automáticamente todos los archivos y también instalará todas las gemas necesarias ejecutando el paquete de ejecución instalado automáticamente como se muestra a continuación

Ahora verá una carpeta de sitio web debajo de su unidad C: (la ubicación desde donde ejecutamos el comando del nuevo sitio web de Rails). Abramos la carpeta del sitio web en algún IDE. Tengo Brackets IDE de Adobe. Puedes usar cualquier otro ya que no importa.

Estructura del proyecto :

La estructura del proyecto generada se verá a continuación

Aunque no hayamos escrito ningún código, puede ejecutar la aplicación del sitio web ahora mismo. Para ejecutar la aplicación del sitio web, ejecute el comando de Rails desde la carpeta del sitio web como se muestra a continuación

Como puede ver en la instantánea anterior, la aplicación de nuestro sitio web se implementó enhttp: // localhost: 3000

Podrá ver la siguiente pantalla al acceder a la URLhttp: // localhost: 3000

Pero queremos mostrar la página principal de nuestra aplicación al acceder a la URLhttp: // localhost: 3000 /.Para eso, creemos una página index.html en la carpeta pública de nuestro proyecto de sitio web.

Nota: Rails servirá automáticamente la página index.html al acceder a la URL raíz.http: // localhost: 3000

Por el momento, solo tenemos una línea en la página index.html.

Accedamos a la URL raízhttp: // localhost: 3000

Ahora, démosle vida a nuestra página index.html agregando algunas imágenes: JS y CSS genial. Usaremos el tema en escala de grises desde el inicio de bootstrap.

Tema Bootstrap de inicio en escala de grises

A continuación se muestra la instantánea del tema de arranque de inicio en escala de grises que usaremos. Personalizaremos este tema para cumplir con nuestros requisitos.

Puede descargar este tema desde http://startbootstrap.com/template-overviews/grayscale/

Descargue el tema en escala de grises y copie CSS, font-awesome, fonts, img, JS e index.html en el directorio público del proyecto del sitio web. A continuación se muestra la instantánea del proyecto después de agregar CSS, JS, fuentes, carpeta de imágenes y página index.html en el directorio público del proyecto del sitio web.

Ejecutemos nuestro proyecto de sitio web ahora:

Al ejecutar el proyecto, se le presentará una atractiva página temática en escala de grises.

Modificaremos la página index.html (en el directorio público del proyecto del sitio web) para darle un aspecto profesional.

A continuación se muestra la instantánea del proyecto del sitio web después de realizar los cambios en la página index.html. Acabamos de cambiar las imágenes y editar parte del texto para que sea específico para un individuo.

Puede modificar index.html y grayscale.CSS como desee. Ahora, estamos listos para implementar nuestra aplicación de sitio web en Heroku.

Empujando el código a Github:

Antes de implementar la aplicación en Heroku, necesitamos enviar nuestro código a un repositorio remoto de Github. Para eso necesitas una cuenta de Github. Si no tiene una cuenta de Github, vaya y cree una en www.github.com .

También necesitas instalar Github en tu Windows. Descarga el Github para Windows desde https://windows.github.com/ .

Una vez que haya descargado e instalado Github en su máquina, abra la aplicación Github y configure sus credenciales de Github y elija Git Bash shell como su shell predeterminado (puede elegir cualquier otra opción también como desee) y luego guarde los cambios.

Necesita crear un repositorio en Github, donde guardaremos nuestro proyecto de sitio web de forma remota. Para crear un repositorio, inicie sesión en Github y haga clic en la nueva opción de repositorio que se muestra en el botón verde.

Nombre su repositorio (en este caso lo hemos llamado railtoheroku) y haga clic en el enlace crear repositorio como se muestra a continuación.

Github proporcionará la URL remota ( https://github.com/eMahtab/railtoheroku.git en este caso) para el repositorio railtoheroku, que será necesario al enviar el código de la máquina local a Github.

Ahora, estamos listos para enviar el código del proyecto de nuestro sitio web a Github. Siga los pasos a continuación para enviar el código a Github.

Abra Git shell y use el comando Git init para inicializar el directorio del sitio web como se muestra a continuación:

que es awt en java

Ahora, agregue todos los archivos en el directorio del sitio web bajo el control de versiones ejecutando Git add.

Confirme todos los archivos ejecutando Git commit –m 'Final Commit'

Agregue el repositorio remoto como se muestra a continuación:

Ahora el último paso que realmente enviará el código al repositorio de Github:

Hemos terminado con Github. La siguiente parte es la implementación real de la aplicación en Heroku.

Implementar la aplicación en Heroku:

Cree una cuenta de Heroku en https://www.heroku.com/

Nota : Tenemos que hacer algunos cambios para la implementación de la aplicación en Heroku. Heroku no es compatible con SqLite 3, sino que tiene una base de datos PostgreSQL. Entonces tenemos que eliminar la dependencia sqlite3 de gemfile. Heroku requiere la gema rails_12factor, que Heroku utiliza para servir activos estáticos como imágenes y hojas de estilo. Los dos cambios necesarios en Gemfile se resumen a continuación:

Elimine la gema de línea 'sqlite3' de Gemfile

Agregue las siguientes líneas a Gemfile

grupo: desarrollo,: prueba hacer #<<<< not in production gem 'sqlite3' end group :production do gem 'pg', '0.17.1' gem 'rails_12factor', '0.0.2' end

Comprobemos si todo funciona bien después de realizar los cambios en Gemfile. Guarde el Gemfile y ejecute instalación del paquete con una bandera especial (sin producción) para evitar la instalación local de gemas de producción.

Confirmemos los cambios realizados en Gemfile en el repositorio remoto de Github:

Empuje los cambios al repositorio remoto de Github:

Creando una nueva aplicación en Heroku:

Inicie sesión en Heroku y cree una nueva aplicación. He nombrado a mi aplicación railtoheroku. Puedes nombrarlo como quieras. Haga clic en crear aplicación para crear la aplicación con nombre.

Conectando el repositorio de Github a la aplicación Heroku:

El siguiente paso es vincular su repositorio de Github a Heroku.

A continuación, hemos conectado nuestro repositorio de Github railtoheroku

Una vez que conectamos nuestro repositorio de Github a Heroku, estamos listos para implementar nuestra aplicación. Para implementar la aplicación, desplácese hacia abajo hasta la opción de implementación manual y haga clic en la opción de implementación de la rama.

Implementación de la aplicación:

Una vez que haga clic en Implementar rama, Heroku comenzará a instalar las gemas de Gemfile en producción:

Una vez que todas las gemas estén instaladas y la aplicación esté implementada, verá el mensaje de felicitación de Heroku que dice: 'Su aplicación se implementó correctamente'.

Para ver su aplicación implementada, simplemente haga clic en el botón Ver y podrá ver su aplicación implementada correctamente.

Si tiene algún problema mientras sigue alguno de los pasos anteriores, comente a continuación. Espero que hayas disfrutado de esta publicación.

Tienes una pregunta para nosotros? Menciónelo en la sección de comentarios y nos pondremos en contacto con usted.

Artículos Relacionados:

Analizar archivos XML con SAX Parser