Mis on Express.js ja miks peaksite seda kasutama?

Express.js (või "Express") on NodeJS-i veebiraamistik, mida kasutatakse veebisaitide ja veebirakenduste taustal (või serveripoolsel küljel). Express on paindlik ja minimalistlik, mis tähendab, et sellel ei ole ulatuslikku tarbetute teekide ja pakettide kogu ega määra, kuidas peaksite oma rakendust koostama.

Expressi raamistik loob API-sid, mis hõlbustavad suhtlust HTTP-päringute ja vastuste kaudu. Üks tähelepanuväärseid asju Expressi juures on see, et see annab arendajatele täieliku kontrolli taotluste ja vastuste üle, mis on seotud iga selle rakenduse meetodiga.

Sellest õpetusest saate teada, kuidas ja miks peaksite oma projektides Expressi kasutama.

Expressi installimine teie projekti

Enne Expressi raamistiku kasutamist peate selle oma projektikataloogi installima. See on lihtne protsess, mis nõuab NodeJS-i ja npm-i.

Esimene asi, mida peate tegema, on luua a package.json faili (teie projekti kataloogis/kaustas), kasutades järgmist käsku:

npm init

Ülaltoodud käsu täitmine käivitab protsessi, mis palub teil sisestada järgmised sisendid:

• Paketi nimi
• Versioon
• Kirjeldus
• Sisenemispunkt
• Testi käsk
• Märksõnad
• Autor
• Litsents

Paketi nime, versiooni, sisenemispunkti ja litsentsi väljadel on kõik vaikeväärtused, mida saate lihtsalt oma väärtuste sisestamisega alistada. Kui aga soovite vaikeväärtusi säilitada, võite selle asemel kasutada lihtsalt järgmist käsku:

npm init -y

Ülaltoodud käsu täitmine genereerib järgmise package.json faili oma projekti kataloogis:

{
"nimi": "minurakendus",
"version": "1.0.0",
"kirjeldus": "",
"main": "index.js",
"skriptid": {
"test": "echo \"Viga: testi pole määratud\" && välju 1"
},
"märksõnad": [],
"autor": "",
"litsents": "ISC",
}

Nüüd saate Expressi installida järgmise käsuga:

npm install express --save

Expressi installimine loob a package-lock.json fail kui ka a sõlme_moodulid kausta.

Faili package.json mõistmine

Põhjus, miks peate looma a package.json fail enne Expressi installimist on see package.json fail toimib hoidlana, mis salvestab teie kohta olulisi metaandmeid NodeJS projektid.Sõltuvused on ühe nendest metaandmeväljadest nimi ja Express on a sõltuvus.

Expressi installimine oma projektikataloogi värskendab automaatselt teie package.json faili.

Värskendatud fail package.json

{
"nimi": "minurakendus",
"version": "1.0.0",
"kirjeldus": "",
"main": "index.js",
"skriptid": {
"test": "echo \"Viga: testi pole määratud\" && välju 1"
},
"märksõnad": [],
"autor": "",
"litsents": "ISC",
"sõltuvused": {
"express": "^4.17.1"
}
}

Nüüd on teil väli „sõltuvused”, millel on üks sõltuvus – Express. Ja sõltuvused objekt salvestab tarkvara, mille korrektseks toimimiseks teie projekt sõltub, milleks antud juhul on Expressi raamistik.

Serveri loomine Expressiga

Andmete salvestamist ja teisaldamist haldava API olemasolu on iga täispinu rakenduse nõue ning Express muudab serveri loomise protsessi kiireks ja lihtsaks.

Vaadake tagasi package.json faili ülal ja näete välja „peamine”. See väli salvestab teie rakenduse sisenemispunkti, mis on ülaltoodud näites "index.js". Kui soovite käivitada oma rakendust (või antud juhul serverit, mida kavatsete luua), peate käivitama index.js faili kasutades järgmist käsku:

sõlme indeks.js

Enne täitmisetappi jõudmist peate siiski looma index.js (või serverirakenduse) faili oma projekti kataloogis.

Faili index.js loomine

const express = nõuda('ekspress');
const app = express();
const port = 5000;
app.get('/', (req, res) => {
res.send('Teie server töötab')
})
app.listen (port, () => {
console.log(`Server töötab aadressil: http://localhost:${port}`);
})

Ülaltoodud fail impordib Expressi ja kasutab seda seejärel Expressi rakenduse loomiseks. Seejärel pakub Expressi rakendus juurdepääsu saada ja kuulake meetodid, mis on osa Expressi moodulist. The app.listen() meetod on esimene, mille peate seadistama. Selle eesmärk on loetleda ühendused konkreetses hostarvuti pordis, mis on port 5000 ülaltoodud näites.

Eesmärk app.get() meetod on andmete hankimine konkreetsest ressursist. Sellel meetodil on kaks argumenti: tee ja tagasihelistamise funktsioon. Ülaltoodud näites teeargumendil on kaldkriips, mis tähistab juurasendit. Seetõttu navigeerides lehele http://localhost: 5000 URL (mis on teie rakenduse juur), kui ülaltoodud rakendus index.js töötab, annab teie brauseris järgmise väljundi:

The app.get() meetodi tagasihelistamise funktsioon genereerib ülaltoodud väljundi. Sellel tagasihelistamisfunktsioonil on kaks argumenti – taotlus ja vastus. Vastus (mis on res ülaltoodud näites) on HTTP-objekt, mille Express-rakendus saadab pärast HTTP-päringut (seda saate teha, tippides brauserisse ülaloleva URL-i).

Staatilise veebisaidi teenindamine teie ekspressserveriga

Serverid mängivad olulist rolli API-de väljatöötamisel, mis aitavad salvestada ja edastada dünaamilisi andmeid ning see on koht, kus te tõenäoliselt kasutate oma projektides Express serverit.

Kuid Express-server võib teenindada ka staatilisi faile. Näiteks kui soovite luua staatilise veebisaidi (nt personaaltreeneri, elutreeneri või stilisti jaoks), saate veebisaidi majutamiseks kasutada oma Expressi serverit.

Staatilise HTML-i veebisaidi näide

 Kodu 







Tere tulemast

Lorem ipsum dolor sit amet, consectetur adipisicing eliit. Possimus rerum officia quibusdam mollitia deserunt animi soluta laudantium. Quam sapiente a dolorum magnam necessitatibus quis tempore facere totam. Dolor, sequi differentio!

Vaata teenuseid

Ülaltoodud HTML-kood loob isikliku stilisti veebisaidi meeldiva staatilise kodulehe, lingides järgmise style.css faili:

*{
marginaal: 0;
polsterdus: 0;
box-sizing: border-box;
}
keha {
fondiperekond: 'Lato', sans-serif;
joone kõrgus: 1,5;
}
a {
värv: #333;
tekst-kaunistus: puudub;
}
ul {
loendi stiil: puudub;
}
p {
veeris: .5rem 0;
}
h1{
veeris-vasak: 2rem;
}
/* Utiliit */
.container {
maksimaalne laius: 1100 pikslit;
veeris: auto;
polsterdus: 0 2rem;
ülevool: peidetud;
}
.btn {
ekraan: inline-block;
piir: puudub;
taust: #910505;
värv: #fff;
polster: 0,5rem 1rem;
piiri raadius: 0,5rem;
}
.btn: hõljutage {
läbipaistmatus: 0,9;
}
/* Navibar */
#navbar {
taust: #fff;
asend: kleepuv;
ülemine: 0;
z-indeks: 2;
}
#navbar .container {
ekraan: ruudustik;
ruudustik-mall-veerud: 6fr 3fr 2fr;
polster: 1rem;
joonda-elemendid: keskel;
}
#navbar h1 {
värv: #b30707;
}
#navbar ul {
end õigustama: end;
ekraan: flex;
veeris-parem: 3,5rem;
}
#navbar ul li a {
polster: 0,5rem;
fondi kaal: paks;
}
#navbar ul li a.current {
taust: #b30707;
värv: #fff;
}
#navbar ul li a: hõljutage {
taust: #f3f3f3;
värv: #333;
}
#navbar .social {
õigustama ennast: keskpunkt;
}
#navbar .sotsiaalne i {
värv: #777;
veeris-parem: .5rem;
}
/* Kodu */
#Kodu {
värv: #fff;
taust: #333;
polster: 2rem;
asend: suhteline;
}
#home: enne {
sisu: '';
taust: url ( https://source.unsplash.com/random) kordumatu keskpunkt/kate;
positsioon: absoluutne;
ülemine: 0;
vasakule: 0;
laius: 100%;
kõrgus: 100%;
läbipaistmatus: 0,4;
}
#home .showcase-container {
ekraan: ruudustik;
grid-template-columns: kordus (2, 1fr);
õigustama-sisu: keskpunkt;
joonda-elemendid: keskel;
kõrgus: 100vh;
}
#home .showcase-content {
z-indeks: 1;
}
#home .showcase-content p {
veeris-alumine: 1rem;
}

Veebisaidi teenindamine Express Serveriga

const express = nõuda('ekspress');
const app = express();
const port = 5000;
app.use (express.static('public'));
app.get('/', (req, res) => {
res.sendFile('index.html')
})
app.listen (port, () => {
console.log(`Server töötab aadressil: http://localhost:${port}`);
})

Ülaltoodud HTML- ja CSS-failid on projekti põhikataloogi avalikus kaustas. HTML-faili asukoht muudab selle Express-serverile ja selle funktsioonidele juurdepääsetavaks.

Üks ülaltoodud Expressi serveri uutest funktsioonidest on app.use() meetod. See kinnitab express.static() vahevara, mis teenindab staatilisi faile. See võimaldab kasutada res.sendFile() funktsioon staatilisuse teenindamiseks index.html ülaltoodud faili.

Navigeerimine lehele http://localhost: 5000 asukoht teie brauseris kuvab midagi sarnast järgmise väljundiga:

Tutvuge taustaprogrammi arendamisega

Expressi raamistik võimaldab teil teha konkreetseid HTTP-päringuid ja saada asjakohaseid vastuseid, kasutades eelnevalt määratletud meetodite komplekti. See on ka tänapäeval üks populaarsemaid taustaraamistikke.

Expressi raamistiku kasutamise õppimine on suurepärane samm. Kuid kui soovite tõesti saada professionaalseks taustaarendajaks, peate veel palju õppima.

Siit saate teada, kuidas saada 2021. aastal taustaprogrammi arendajaks

Kui teie südameasjaks on IT-alane karjäär, saate teha hullemini, kui omandada taustaarendajaks vajalikud oskused.

Loe edasi

Autori kohta