¿Cómo publicar un sitio web creado por Node.js en páginas de Github?

104

Hice un sitio web usando Node.js como servidor. Como sé, el archivo node.js debería comenzar a funcionar escribiendo comandos en la terminal, por lo que no estoy seguro de si Github Pages es compatible con node.js-hosting. ¿Entonces qué debo hacer?

dyzdyz010
fuente
2
Eche un vistazo también a github.com/assemble/assemble , es un generador de sitios estáticos basado en grunt.js. Básicamente, simplemente ejecute, grunt assembleluego git commit y presione a la rama gh-pages y estará listo y funcionando.
jonschlinkert
Heroku puede ayudarte heroku.com
Achraf

Respuestas:

102

Las páginas de GitHub alojan solo páginas HTML estáticas. No se admite ninguna tecnología del lado del servidor, por lo que las aplicaciones Node.js no se ejecutarán en las páginas de GitHub. Hay un montón de proveedores de alojamiento, que se enumeran en el wiki Node.js .

App fog parece ser la más económica, ya que proporciona alojamiento gratuito para proyectos con 2GB de RAM (lo cual es bastante bueno si me preguntas).
Como se indica aquí , AppFog eliminó su plan gratuito para nuevos usuarios.

Si desea alojar páginas estáticas en GitHub, lea esta guía . Si planeas usar Jekyll , esta guía será muy útil.

Akshat Jiwan Sharma
fuente
1
¿Qué pasa con este ejemplo entonces ?: idflood.github.io/ThreeNodes.js/public/index.html . Que está en Node.js si echas
Lilian A. Moraru
4
@ LilianA.Moraru Esa es una página de proyecto. Para las páginas de proyecto, se debe crear una rama especial llamada gh-pages. Echa un vistazo a la rama gh-pages del repositorio. Contiene archivos html puros. Así que todo lo que ves en el el enlace es en realidad de la rama gh-pages.
Akshat Jiwan Sharma
Buen repositorio por cierto.
Akshat Jiwan Sharma
@Akshat_Jiwan_Sharma Tienes razón. Eso también es lo que estaba sabiendo, pero hoy vi este sitio en github y pensé que realmente se puede usar Node.js. No observé que era solo un repositorio en la organización. Si fuera la organización en sí, entonces habría estado en la rama maestra ...
Lilian A. Moraru
1
repl.it ahora es compatible con el alojamiento de aplicaciones gratuito, aunque no estoy seguro de cuánta memoria tiene, o incluso cómo conectarlo a los repositorios de Git. Sin embargo, podría ser útil para proyectos pequeños.
Neil Chowdhury
32

Nosotros, los amantes de Javascript, no tenemos que usar Ruby (Jekyll u Octopress) para generar páginas estáticas en páginas Github, podemos usar Node.js y Harp , por ejemplo:

Estos son los pasos . Resumen:

  1. Crear un nuevo repositorio
  2. Clonar el repositorio

    git clone https://github.com/your-github-user-name/your-github-user-name.github.io.git
  3. Inicialice una aplicación Harp (localmente):

    harp init _harp

asegúrese de nombrar la carpeta con un guión bajo al principio; Cuando implementas en Páginas de GitHub, no quieres que se sirvan tus archivos de origen.

  1. Compila tu aplicación Harp

    harp compile _harp ./
  2. Implementar en Gihub

    git add -A
    git commit -a -m "First Harp + Pages commit"
    git push origin master

Y este es un tutorial genial con detalles sobre cosas agradables como diseños, parciales, Jade y Less.

Johann Echavarria
fuente
3
Soy un amante del rubí, pero lo engañaré un poco. ¡La combinación de las páginas de harp + google es increíble!
Alter Lagos
3
¡Tenga cuidado al instalar arpa en un proyecto ya existente!
Mehul Tandale
1

Pude configurar acciones de github para enviar automáticamente los resultados de un comando de compilación de nodo ( yarn builden mi caso, pero también debería funcionar con npm) en la gh-pagesrama cada vez que se envía una nueva confirmación al maestro.

Si bien no es completamente ideal, ya que me gustaría evitar comprometer los archivos compilados, parece que esta es actualmente la única forma de publicar en páginas de github.

Basé mi flujo de trabajo en esta guía para una biblioteca de reacciones diferente y tuve que hacer los siguientes cambios para que funcionara para mí:

  • actualicé el paso del "nodo de configuración" para usar la versión que se encuentra aquí, ya que la de la muestra en la que me basé arrojaba errores porque no podía encontrar la acción correcta.
  • elimine la línea que contiene yarn exportporque ese comando no existe y no parece agregar nada útil (es posible que también desee cambiar la línea de compilación que se encuentra arriba para satisfacer sus necesidades)
  • También agregué una envdirectiva al yarn buildpaso para poder incluir el hash SHA del compromiso que generó la compilación dentro de mi aplicación, pero esto es opcional

Aquí está mi acción completa de github:

name: github pages

on:
    push:
        branches:
        - master

jobs:
    deploy:
        runs-on: ubuntu-18.04
        steps:
        - uses: actions/checkout@v2

        - name: Setup Node
            uses: actions/setup-node@v2-beta
            with:
            node-version: '12'

        - name: Get yarn cache
            id: yarn-cache
            run: echo "::set-output name=dir::$(yarn cache dir)"

        - name: Cache dependencies
            uses: actions/cache@v2
            with:
            path: ${{ steps.yarn-cache.outputs.dir }}
            key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
            restore-keys: |
                ${{ runner.os }}-yarn-
        - run: yarn install --frozen-lockfile
        - run: yarn build
            env:
            REACT_APP_GIT_SHA: ${{ github.SHA }}

        - name: Deploy
            uses: peaceiris/actions-gh-pages@v3
            with:
            github_token: ${{ secrets.GITHUB_TOKEN }}
            publish_dir: ./build

Solución alternativa

Los documentos de next.js también proporcionan instrucciones para configurar con Vercel, que parece ser un servicio de alojamiento para aplicaciones de node.js similar a las páginas de github. Sin embargo, no he probado esto y, por lo tanto, no puedo hablar de lo bien que funciona.

Código moral
fuente
-26

Son pasos muy simples para impulsar su aplicación de nodo js de local a GitHub.

Pasos:

  1. Primero crea un nuevo repositorio en GitHub
  2. Abra Git CMD instalado en su sistema (Instale GitHub Desktop )
  3. Clone el repositorio en su sistema con el comando: git clone repo-url
  4. Ahora copie todos los archivos de su aplicación a esta biblioteca clonada si no está allí
  5. Prepara todo para comprometerte: git add -A
  6. Confirme los cambios registrados y los prepara para que se envíen a un repositorio remoto: git commit -a -m "First Commit"
  7. Envíe los cambios en su repositorio local a GitHub: git push origin master
RAM
fuente
14
Todo lo que hizo fue mostrar cómo cargar archivos en el repositorio de Github a través de git, primero comprenda las preguntas antes de dejar sus respuestas, para hacer contribuciones significativas en StackOverflow
Precious Tom
1
Entendiste completamente la pregunta
Christopher Thomas
Respuesta incorrecta, esto no es lo que se pregunta
Mr_Hmp