Kako izgraditi web stranicu na Raspberry Pi -u s Node.js, Express i MongoDB 1. dio: 6 koraka

2024 Autor: John Day | [email protected]. Zadnja izmjena: 2024-01-30 08:07

Dobro došli u 1. DIO mog vodiča za node.js web aplikaciju. Prvi dio će proći kroz potreban softver koji se koristi za razvoj aplikacije node.js, kako koristiti prosljeđivanje portova, kako izgraditi aplikaciju pomoću Expressa i kako pokrenuti vašu aplikaciju. Drugi dio ovog vodiča će se baviti cijelim kodom i strukturom moje potpune web aplikacije. Ako ste za to spremni, posjetite ga ovdje.

Dakle, dok sam stvarao svoju ličnu početnu stranicu, bilo mi je jako teško da se izvučem iz korova. Na internetu postoji više nego što ću ja ikada razumjeti o izradi web stranice.

Ovo je šetnja o tome kako koristiti Node.js, Express i Mongodb. za kreiranje web stranice.

Kôd za sve ovo je ovdje.

Moja web stranica se zove Internet. Posjetite ako želite interaktivniji pogled na ličnu web stranicu.

Započeo sam ovu stranicu kako bih imao lično prisustvo na internetu sa projektima koje sam radio, sa vezama do mojih projekata za više detalja.

Ova stranica je hostirana u mom domu na pi nula W.

Korak 1: Stvari koje trebate

1. Vrijeme. Ne mogu naglasiti da je razvoj web stranice i istinsko razumijevanje unutrašnjeg rada dugotrajan proces. Imam diplomu elektrotehnike sa fokusom na mikro elektroniku i ljubav prema kodiranju, a za to su mi bili potrebni mjeseci.

Ovaj će vodič biti dobar gradivni blok, ali pročitajte više dokumentacije na internetu kako biste razumjeli svaki dio.

2. Malina pi - bilo koji model će odgovarati. Takođe će poslužiti bilo koji računar sa Linux -om. Zapravo, bilo koji računar će raditi, samo idem u više detalja o tome kako ga pokrenuti na pi.

3. Internet veza - ako ovo planirate ugostiti svijetu. Za konfiguriranje prosljeđivanja portova potreban je usmjerivač ili mrežni prekidač.

4. Softver - Svaka platforma za kodiranje će raditi, Sublime, Webstorm, Notepadd ++, Visual Studios ili bilo što drugo. Uglavnom sam koristio Webstorm ili Sublime.

Korak 2: Prosljeđivanje portova na vašem Raspberry Pi

Dakle, pretpostavit ću da ste već postavili svoj malinovi pi. Ako ne, pogledajte ovaj jednostavan vodič ovdje.

Moj pi pokreće Jessie lite i sav je terminal. Prednost ovoga je što nemam mnogo procesa u pozadini koji bi mogli usporiti rad mog poslužitelja s velikim prometom. Dopustite mi da sada kažem da je ovaj vodič za web stranice s malim prometom. Svaka stranica s velikim prometom bit će spora na pi i mogla bi uzrokovati rušenje vašeg poslužitelja.

Prosljeđivanje portova

Kad je vaš pi postavljen, morat ćete omogućiti prosljeđivanje portova na usmjerivaču ili prekidaču. Da biste to učinili, u usmjerivaču pronađite postavke prosljeđivanja portova. Svaki usmjerivač je drugačiji, ovdje pokazujem svoj Linksys Velop GUI.

Moja web lokacija je konfigurirana na port 3000, to se može promijeniti u izvornom kodu u datoteci app.js ili www.

Takođe imam port 22 postavljen za prosljeđivanje kako bih mogao SSH u svoj pi, to se može postaviti u postavkama pi. SSH je način korištenja terminala na vašem pi -u dok niste na istoj mreži, a i dok ne koristite izlaz za prikaz sa pi -a. To mi omogućava da ažuriram svoju web stranicu s drugog računara i prebacim promjene na svoj pi.

Slijedite slike za postavljanje prosljeđivanja portova.

DNS usluga

Trebat će vam usluga koja povezuje vašu IP adresu s imenom web adrese. Moći ćete unijeti globalnu ip adresu usmjerivača nakon koje slijedi broj porta za pristup vašoj web lokaciji. To je, međutim, teško, posebno ako se vaš globalni IP promijeni. Ono što DNS usluga radi je praćenje i ažuriranje ovih promjena tako da su vaše web ime i ip povezani. Odlučujem se koristiti besplatnu uslugu putem no-ip-a. Možete platiti sve što želite. Ovo je samo besplatan način za koji ja znam.

www.noip.com/

Korak 3: Instaliranje potrebnog softvera na Pi

Ako ste preuzeli moj GitHub kod, nećete morati ništa učiniti osim pokretanja jednostavne naredbe npm start da biste pokrenuli web lokaciju. Međutim, budući da je ovo dubinski vodič, objasnit ću kako instalirati sav potreban softver i pakete.

Dok ste na svom pi ili linux računaru (postoje različite komande za korišćenje prozora), pokrenite sledeće komande.

Raščlanio sam ih na pojedinačne korake kako bih ih lakše slijedio.

1. Instalirajte node.js i npm

Node.js je u osnovi java skripta koja kreira poslužitelj. NPM je upravitelj paketa čvorova i obrađuje svu srednju opremu potrebnu s node.js.

Pokrenite sljedeće naredbe na linux ili mac mašini za instalaciju.

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

Za preuzimanje na Windows, upotrijebite exe koji se nalazi ovdje.

Ova veza je za linux pomoć ako nije na maline pi.

2. Instalirajte MongoDB

MongoDB je upravo to, baza podataka. Koristim ovo za dio svoje web stranice za prijavu i brojač prometa.

Pokrenite sljedeće naredbe na linux ili mac mašini za instalaciju.

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

Za preuzimanje na Windows, upotrijebite exe koji se nalazi ovdje.

Ova veza je za linux pomoć ako nije na maline pi.

3. Instalirajte Grunt

Grunt je poput npm -a, jer ga možete koristiti zajedno s drugim dodacima. Ne koristim je za svoju aplikaciju, no vrlo je korisna pri automatizaciji zadataka. Ovaj korak možete potpuno preskočiti da bi vaša aplikacija funkcionirala.

Za Windows, Mac ili Linux koristite sljedeću naredbu.

npm install -g grunt -cli

4. Instalirajte Express

Express je jednostavan način korištenja node js okvira. Ugradit ćemo ekspresni generator. Ovo stvara okvir za web aplikaciju koji se lako koristi.

Za Windows, Mac ili Linux koristite sljedeću naredbu.

npm install express -generator -g

Korak 4: Kreirajte Express Node.js aplikaciju

Idite na lokaciju mape u kojoj planirate imati svoju aplikaciju. Ovdje će sve buduće instalacije biti unutar ove mape.

Pokrenite sljedeće naredbe na linux ili mac stroju za promjenu direktorija.

sudo cd/home/pi/myapp

Za Windows:

cd C: / Users / pi / Desktop / myapp

Upotrijebite ekspresni generator za stvaranje potrebnog node js okvira.

ekspresno ime aplikacije

Ovo će stvoriti goli izraziti node.js projekt, možete urediti njegove značajke tijekom ovog koraka pronalaženjem različitih naredbi kao što je dolje prikazano pomoću naredbe -h. Ili možete ručno urediti generirani predložak, poput mene. O ovome ću detaljnije govoriti u drugom dijelu. Možete dodati druge varijable ovom kodu za promjenu postavki u vašoj aplikaciji, kao što je upotreba html -a, upravljača, jadea i drugih. Za ovo pokrenite naredbu:

express -h

Nastavite s postavljanjem vaše node.js web aplikacije pokretanjem sljedećih naredbi:

cd nameofmyapp

npm install

Ovo instalira sve potrebne pakete koje će vaša aplikacija node.js morati pokrenuti i više dostupnih za upotrebu.

U ovom primjeru putanja datoteke za aplikaciju bila bi:

/home/pi/myapp/nameofmyapp

To je zato što ekspres generator stvara datoteku na osnovu niza koji postavite nakon nje. Ako ste već u željenom direktoriju, samo koristite express.

Korak 5: Pokrenite svoju web aplikaciju

Da biste pokrenuli svoju node.js web aplikaciju, pokrenite naredbu:

npm start

Kako bismo učinili učinkovitijim tijekom kodiranja, tako da se naša aplikacija automatski ažurira nakon što unesemo promjene, instalirat ćemo nodemon.

npm install -g nodemon

Evo gdje bi vam većina vodiča rekla da se zabavite u izgradnji i ostavila vas da shvatite naporan rad na nogama. U sljedećim koracima ću vas provesti kako sam izgradio svoju aplikaciju.

Korak 6: Kredit

To zapravo nije korak, ali želim navesti svoje izvore i inspiraciju za ovaj vodič.

Ovaj Github ReadMe je napisao dobar prijatelj dok je radio na našem višem dizajnerskom projektu i poslužio je za mnogo inspiracije za kreiranje moje web stranice.

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

Ovaj vodič je bio koristan alat u procesu izrade web aplikacije.

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

Za više informacija o node.js web stranici posjetite moj dio 2.