Cum să construiți un site web pe un Raspberry Pi, cu Node.js, Express și MongoDB Partea 1: 6 pași

2024 Autor: John Day | [email protected]. Modificat ultima dată: 2024-01-30 11:45

Bine ați venit la PARTEA 1 a tutorialului meu pentru aplicația web node.js. Partea 1 va trece prin software-ul necesar pentru dezvoltarea aplicației node.js, cum să utilizați redirecționarea porturilor, cum să creați o aplicație folosind Express și cum să vă rulați aplicația. A doua parte a acestui tutorial va trece peste tot codul și structura aplicației mele web complete. Dacă sunteți gata pentru asta, vizitați-l aici.

Deci, în timp ce îmi construiam pagina personală de lansare, mi-a fost foarte greu să ies din buruieni. Există mai multe pe internet decât chiar voi înțelege vreodată despre construirea unei pagini web.

Aceasta este o prezentare a modului de utilizare a Node.js, Express și Mongodb. pentru a crea o pagină web.

Codul pentru toate acestea este aici.

Pagina mea web se numește Internet. Vă rugăm să vizitați dacă doriți o privire mai interactivă pe un site personal.

Am început această pagină pentru a avea o prezență personală pe internet cu proiectele pe care le-am realizat, cu linkuri către proiectele mele instructabile pentru mai multe detalii.

Acest site este găzduit în casa mea pe un pi zero W.

Pasul 1: Lucruri de care aveți nevoie

1 timp. Nu pot sublinia că dezvoltarea unui site și înțelegerea cu adevărat a funcționării interioare este un proces îndelungat. Am o diplomă în inginerie electrică, cu un accent în microelectronică și o dragoste pentru codificare, iar acest lucru mi-a luat încă luni de zile pentru a realiza.

Acest tutorial va fi un bun element de construcție, dar vă rugăm să citiți mai multe documente online pentru a înțelege fiecare piesă.

2. Raspberry pi - orice model va face. De asemenea, orice computer care rulează Linux va face. De fapt, orice computer va funcționa, doar intru în mai multe detalii despre cum să-l rulez pe un pi.

3. Conexiune la internet - dacă intenționați să găzduiți acest lucru în lume. Un router sau un comutator de rețea este necesar pentru a configura redirecționarea portului.

4. Software - Orice platformă de codare va funcționa, Sublime, Webstorm, Notepadd ++, Visual Studios sau orice altceva. Am folosit în principal Webstorm sau Sublime.

Pasul 2: redirecționarea portului pe Raspberry Pi

Deci, voi presupune că aveți deja configurat piul dvs. de zmeură. Dacă nu, consultați acest tutorial ușor aici.

Pi-ul meu rulează Jessie lite și este terminal. Avantajul acestui lucru este că nu am o mulțime de procese care rulează în fundal, care ar putea face ca serverul meu să ruleze mai lent cu trafic mare. Permiteți-mi să afirm acum că acest tutorial este pentru site-uri cu trafic redus. Orice site cu trafic mare va fi lent pe un pi și ar putea face ca serverul dvs. să se blocheze.

Port forwarding

Odată cu configurarea pi, va trebui să activați redirecționarea porturilor pe router sau comutator. Pentru a face acest lucru, găsiți setările de redirecționare a porturilor în router. Fiecare router este diferit, îmi arăt GUI-ul Linksys Velop aici.

Site-ul meu este configurat la portul 3000, acesta poate fi modificat în codul sursă din fișierul app.js sau www.

De asemenea, am configurat portul 22 pentru redirecționare, astfel încât să pot SSH în pi, acest lucru poate fi configurat în setările pi. SSH este o modalitate de a utiliza terminalul de pe pi în timp ce nu se află în aceeași rețea și, de asemenea, în timp ce nu utilizați afișajul de pe pi. Acest lucru îmi permite să îmi actualizez site-ul web de pe un computer diferit și să împing modificările pe pi.

Urmați imaginile pentru a configura redirecționarea portului.

Serviciul DNS

Veți avea nevoie de un serviciu care vă conectează adresa IP la un nume de adresă web. Veți putea introduce adresa IP globală a routerelor, urmată de numărul portului pentru a accesa site-ul dvs. Cu toate acestea, acest lucru este dificil mai ales dacă ip-ul dvs. global se schimbă. Ceea ce face un serviciu DNS este să urmărească și să actualizeze aceste modificări, astfel încât numele dvs. web și adresa IP să fie conectate. Aleg să folosesc un serviciu gratuit prin no-ip. Sunteți binevenit să plătiți pentru orice doriți. Acesta este doar un mod gratuit pe care îl cunosc.

www.noip.com/

Pasul 3: Instalarea software-ului necesar pe Pi

Dacă ați descărcat codul meu GitHub, nu va trebui să faceți altceva decât să rulați o simplă comandă npm start pentru a rula site-ul. Cu toate acestea, deoarece acesta este un tutorial detaliat, voi explica cum să instalez toate software-urile și pachetele necesare.

În timp ce vă aflați pe computerul dvs. pi sau Linux (vor exista comenzi diferite pentru utilizarea Windows), rulați următoarele comenzi.

I-am împărțit ca pași individuali pentru a face mai ușor de urmat.

1. Instalați node.js și npm

Node.js este practic scriptul java care creează serverul. NPM este un manager de pachete de noduri și gestionează toate produsele intermediare necesare cu node.js.

Rulați următoarele comenzi pe o mașină Linux sau Mac pentru instalare.

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

Pentru a descărca pe Windows, utilizați doar exe-ul găsit aici.

Acest link este pentru ajutor Linux, dacă nu pe un raspberry pi.

2. Instalați MongoDB

MongoDB este doar asta, o bază de date. O folosesc pentru o porțiune de conectare și contorizare a traficului din pagina mea web.

Rulați următoarele comenzi pe o mașină Linux sau Mac pentru instalare.

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

Pentru a descărca pe Windows, utilizați doar exe-ul găsit aici.

Acest link este pentru ajutor Linux, dacă nu pe un raspberry pi.

3. Instalați Grunt

Grunt este ca npm, deoarece îl puteți folosi împreună cu alte pluginuri. Nu îl folosesc pentru aplicația mea, cu toate acestea este foarte util atunci când automatizează sarcinile. Acest pas poate fi omis complet pentru ca aplicația dvs. să funcționeze.

Pentru Windows, Mac sau Linux utilizați următoarea comandă.

npm instala -g grunt-cli

4. Instalați Express

Express este o modalitate ușoară de a utiliza cadrul nodului js. Vom instala un generator expres. Acest lucru creează cadrul ușor de utilizat al unei aplicații web.

Pentru Windows, Mac sau Linux utilizați următoarea comandă.

npm instala express-generator -g

Pasul 4: creați o aplicație Express Node.js

Navigați la locația folderului în care intenționați să aveți aplicația. Odată aici toate instalările viitoare vor fi în acest folder.

Rulați următoarele comenzi pe o mașină Linux sau Mac pentru a schimba directorul.

sudo cd / home / pi / myapp

Pentru Windows:

cd C: / Users / pi / Desktop / myapp

Utilizați generatorul expres pentru a crea cadrul de nod js necesar.

exprimă numele myapp

Acest lucru va crea un proiect bare node.js, puteți edita caracteristicile acestuia în acest pas, găsind diferite comenzi așa cum se vede mai jos folosind comanda -h. Sau puteți edita manual șablonul generat, așa cum am și eu. Voi discuta acest lucru mai detaliat în partea 2. Puteți adăuga alte variabile la acest cod pentru a modifica setările din aplicația dvs., cum ar fi utilizarea html, ghidon, jad și altele. Pentru aceasta executați comanda:

exprimă -h

Continuați să configurați aplicația web node.js executând următoarele comenzi:

cd nameofmyapp

instalare npm

Aceasta instalează toate pachetele necesare pe care aplicația dvs. web node.js va trebui să le ruleze și altele disponibile pentru utilizare.

În acest exemplu calea fișierului pentru aplicație ar fi:

/ home / pi / myapp / nameofmyapp

Acest lucru se datorează faptului că generatorul expres creează un fișier pe baza șirului pe care îl plasați după el. Dacă sunteți deja în directorul dorit, utilizați doar expres.

Pasul 5: Rulați aplicația dvs. web

Pentru a rula aplicația dvs. web node.js, rulați comanda:

npm start

Pentru a-l face mai eficient în timpul codificării, astfel încât aplicația noastră să se actualizeze automat după ce facem modificări, vom instala nodemon.

npm install -g nodemon

Aici, cele mai multe tutoriale vă vor spune să vă distrați construind și să vă lăsați să vă dați seama de munca dificilă. În pașii următori, vă voi plimba, totuși, cum mi-am construit aplicația.

Pasul 6: Credit

Nu este un pas, dar vreau să-mi listez sursele și inspirația pentru acest tutorial.

Acest Github ReadMe a fost scris de un bun prieten în timp ce lucra la proiectul nostru de design senior și a servit pentru o mulțime de inspirație cu privire la modul de creare a site-ului meu.

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

Acest tutorial a fost un instrument util în procesul de creare a unei aplicații web.

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

Pentru mai multe informații despre un site node.js, vizitați Partea 2.