Cómo construir un sitio web en una Raspberry Pi, con Node.js, Express y MongoDB Parte 1: 6 pasos

2024 Autor: John Day | [email protected]. Última modificación: 2024-01-30 08:43

Bienvenido a la PARTE 1 de mi tutorial de la aplicación web node.js. La parte 1 va a analizar el software necesario que se usa para el desarrollo de la aplicación node.js, cómo usar el reenvío de puertos, cómo construir una aplicación usando Express y cómo ejecutar su aplicación. La segunda parte de este tutorial repasará todo el código y la estructura de mi aplicación web completa. Si estás listo para eso, visítalo aquí.

Entonces, mientras construía mi página de lanzamiento personal, me resultó muy difícil salir de la maleza. Hay más en Internet de lo que yo jamás entenderé sobre la creación de una página web.

Este es un tutorial sobre cómo usar Node.js, Express y Mongodb. para crear una página web.

El código para todo esto está aquí.

Mi página web se llama Internet. Visítelo si desea una visión más interactiva de un sitio web personal.

Comencé esta página para tener una presencia personal en Internet con los proyectos que he realizado, con enlaces a mis proyectos de instructables para obtener más detalles.

Este sitio está alojado en mi casa en un pi zero W.

Paso 1: Cosas que necesita

1 vez. No puedo enfatizar que desarrollar un sitio y comprender verdaderamente el funcionamiento interno es un proceso largo. Tengo un título en ingeniería eléctrica con un enfoque en microelectrónica y un amor por la codificación, y esto todavía me tomó meses lograrlo.

Este tutorial será un buen componente básico, pero lea más documentación en línea para comprender cada pieza.

2. Raspberry pi: cualquier modelo servirá. También servirá cualquier computadora que ejecute Linux. En realidad, cualquier computadora servirá, solo entro en más detalles sobre cómo ejecutarlo en un pi.

3. Conexión a Internet: si planea alojar esto en todo el mundo. Se necesita un enrutador o un conmutador de red para configurar el reenvío de puertos.

4. Software: funcionará cualquier plataforma de codificación, Sublime, Webstorm, Notepadd ++, Visual Studios o cualquier otra cosa. Usé principalmente Webstorm o Sublime.

Paso 2: reenvío de puertos en su Raspberry Pi

Entonces, voy a suponer que ya tiene configurado su Raspberry Pi. De lo contrario, consulte este sencillo tutorial aquí.

Mi pi está ejecutando Jessie lite, y es todo terminal. El beneficio de esto es que no tengo muchos procesos ejecutándose en segundo plano que puedan hacer que mi servidor funcione más lento con mucho tráfico. Permítanme decirles ahora que este tutorial es para sitios con poco tráfico. Cualquier sitio con mucho tráfico será lento en un pi y podría hacer que su servidor se bloquee.

Reenvío de puertos

Con su pi configurado, deberá habilitar el reenvío de puertos en su enrutador o conmutador. Para hacer esto, busque la configuración de reenvío de puertos en su enrutador. Cada enrutador es diferente, estoy mostrando mi GUI de Linksys Velop aquí.

Mi sitio está configurado para el puerto 3000, esto se puede cambiar en el código fuente en el archivo app.js o www.

También tengo el puerto 22 configurado para el reenvío, por lo que puedo SSH en mi pi, esto se puede configurar en la configuración de pi. SSH es una forma de usar el terminal en su pi mientras no está en la misma red, y también mientras no usa la salida de pantalla del pi. Esto me permite actualizar mi sitio web desde una computadora diferente y enviar los cambios a mi pi.

Siga las imágenes para configurar el reenvío de puertos.

Servicio DNS

Necesitará un servicio que vincule su dirección IP a un nombre de dirección web. Podrá escribir la dirección IP global de su enrutador seguida del número de puerto para acceder a su sitio. Sin embargo, esto es difícil, especialmente si cambia su IP global. Lo que hace un servicio de DNS es rastrear y actualizar estos cambios para que su nombre web y su IP estén vinculados. Elijo utilizar un servicio gratuito a través de no-ip. Puedes pagar por lo que quieras. Esta es solo una forma gratuita que yo conozco.

www.noip.com/

Paso 3: Instalar el software necesario en Pi

Si ha descargado mi código de GitHub, no tendrá que hacer nada más que ejecutar un simple comando npm start para que el sitio funcione. Sin embargo, dado que este es un tutorial detallado, explicaré cómo instalar todo el software y los paquetes necesarios.

Mientras esté en su computadora pi o linux (habrá diferentes comandos para usar Windows), ejecute los siguientes comandos.

Los he dividido como pasos individuales para que sea más fácil de seguir.

1. Instale node.js y npm

Node.js es básicamente el script java que crea el servidor. NPM es un administrador de paquetes de nodos y maneja todo el middleware necesario con node.js.

Ejecute los siguientes comandos en una máquina Linux o Mac para instalar.

curl -sL https://deb.nodesource.com/setup_6.x | sudo -E bash sudo apt-get install -y nodejs

Para descargar en Windows, simplemente use el exe que se encuentra aquí.

Este enlace es para ayuda de Linux si no está en una Raspberry Pi.

2. Instale MongoDB

MongoDB es solo eso, una base de datos. Utilizo esto para una parte de inicio de sesión y contador de tráfico de mi página web.

Ejecute los siguientes comandos en una máquina Linux o Mac para instalar.

sudo apt-key adv --keyserver hkp: //keyserver.ubuntu.com: 80 --recv 0C49F3730359A14518585931BC711F9BA15703C6

echo "deb https://repo.mongodb.org/apt/debian jessie / mongodb-org / 3.4 main" | sudo tee /etc/apt/sources.list.d/mongodb-org-3.4.list

sudo apt-get update

sudo apt-get install -y mongodb-org

Para descargar en Windows, simplemente use el exe que se encuentra aquí.

Este enlace es para ayuda de Linux si no está en una Raspberry Pi.

3. Instala Grunt

Grunt es como npm, ya que puede usarlo junto con otros complementos. No lo uso para mi aplicación, sin embargo, es muy útil para automatizar tareas. Este paso se puede omitir por completo para que su aplicación funcione.

Para Windows, Mac o Linux, use el siguiente comando.

npm install -g grunt-cli

4. Instale Express

Express es una forma fácil de usar el framework node js. Vamos a instalar un generador express. Esto crea el marco fácil de usar de una aplicación web.

Para Windows, Mac o Linux, use el siguiente comando.

npm instalar express-generator -g

Paso 4: Cree una aplicación Express Node.js

Navegue hasta la ubicación de la carpeta en la que planea tener su aplicación. Una vez aquí, todas las instalaciones futuras estarán dentro de esta carpeta.

Ejecute los siguientes comandos en una máquina Linux o Mac para cambiar de directorio.

sudo cd / home / pi / myapp

Para ventanas:

cd C: / Usuarios / pi / Escritorio / myapp

Utilice el generador express para crear el marco de node js necesario.

expresar nameofmyapp

Esto creará un proyecto simple express node.js, puede editar sus características durante este paso encontrando diferentes comandos como se ve a continuación usando el comando -h. O puede editar manualmente la plantilla generada, como yo. Discutiré esto con más detalle en la parte 2. Puede agregar otras variables a este código para cambiar la configuración en su aplicación, como usar html, manillar, jade y otros. Para esto, ejecute el comando:

expreso -h

Continúe configurando su aplicación web node.js ejecutando los siguientes comandos:

cd nameofmyapp

npm install

Esto instala todos los paquetes necesarios que su aplicación web node.js necesitará para ejecutar y más que están disponibles para usar.

En este ejemplo, la ruta del archivo para la aplicación sería:

/ home / pi / myapp / nameofmyapp

Esto se debe a que el generador rápido crea un archivo basado en la cadena que colocas después. Si ya se encuentra en el directorio deseado, simplemente use express.

Paso 5: Ejecute su aplicación web

Para ejecutar su aplicación web node.js, ejecute el comando:

inicio npm

Para hacerlo más eficiente durante la codificación para que nuestra aplicación se actualice automáticamente después de realizar cambios, instalaremos nodemon.

npm install -g nodemon

Aquí es donde la mayoría de los tutoriales te dirán que te diviertas construyendo y te dejen resolver el arduo trabajo. En los siguientes pasos, voy a explicarle cómo construí mi aplicación.

Paso 6: crédito

No es realmente un paso, pero quiero enumerar mis fuentes e inspiración para este tutorial.

Este Léame de Github fue escrito por un buen amigo mientras trabajaba en nuestro proyecto de diseño senior y me ha servido de mucha inspiración sobre cómo crear mi sitio.

github.com/SDP-DT04/Web-Application/blob/m…

Este tutorial fue una herramienta útil en el proceso de creación de una aplicación web.

kroltech.com/2013/12/29/boilerplate-web-app…

Para obtener más información sobre un sitio de node.js, visite mi Parte 2.