fråga SQL Server med nod.js

Låt oss komma igång

Jag antar att du har nod.JS installerat men om inte, det kan laddas ner här.

vi börjar med att ställa in vår nod.JS webbserver och testa den. Lägg sedan till liknande kod som tidigare för att ansluta till och fråga vår SQL Server-databas.

Vi kommer att använda den minimalistiska Webbserverramen för nod.JS, Express. Det installeras som ett npm-paket.

som med många saker finns det alltid mer att lära sig så när jag har du skriver ett kommando, läs säkert mer om kommandot och det är alternativ.

komma igång

1. för projektet, skapa en katalog / mapp.
2. öppna Visual Studio Code (VSCode) och öppna mappen.
3. öppna ett nytt terminalfönster och skriv,
   npm init
   accepterar standardinställningarna för att skapa ditt paket.json.

4. Skapa en fil i VSCode och spara den som index.js. Om du tittar i ditt paket.json-fil, du kommer att se var du kan ändra standardfilen ”main”.

5. I Terminalfönstertypen,
start npm
detta startar noden.js server.

webbservern

i Terminalfönstertypen,
npm install express

detta installerar Webbramen.

Vi är redo att rocka och rulla!

kärnan i webbservern är att kräva expresspaketet och tilldela det till en hållare (variabel eller const.) Alla referenser till webbservern kommer att ske genom denna innehavare.

Vi måste starta webbservern och låta den lyssna på en HTTP-port, jag väljer 5000. 8080 är vanligt, bara något tillgängligt.

vi vill att webbservern åtminstone ska svara på en HTTP get-metod. Detta gör det möjligt att ”sparka däcken” och se till att det fungerar. Det finns mer i HTTP-metoder här på MDN. Vi kommer att använda GET och POST.

• GET används för att hämta från en resurs.
• POST används för att skicka till en resurs.

Ange följande kod och vi kommer att diskutera det.

webbserver exempel

• Vi kräver expresspaketet, som lagrar referensen i express By convention, men namnge det som önskat.
• initiera en instans av express, lagra referensen i appen efter konvention, men namnge den som önskat.
• i rad 11 lagrar vi en hänvisning till var vår webbserver kommer att lyssna. Port 5000.
• i rad 5 använder vi HTTP GET with out-instansen på webbservern med app.få. Detta ser som standard ut för att få data från rotkatalogen (’/’). Återuppringningsfunktionen är ganska viktig eftersom den innehåller Request (req) och Response (res) – objekten. Namnen req och res är enligt konvention.

begäran och svar

• begäran kommer från vår webbläsares url. Mer information finns här.
• svar är svaret på en begäran. Mer kan hittas här.

i ett nötskal kommer vår webbläsare att göra en förfrågan och vi skickar tillbaka ett svar.

sparka däcken

1. i VSCode, slå F5 (kort för start Felsökning i felsökningsmenyn.) Din konsol ska se ut som följer.

2. Gå till din webbläsare och skriv LocalHost:5000 och tryck Enter. Du bör se följande.

din webbläsare gjorde en GET-begäran och vi skickade tillbaka ett svar med res.send.

nod SQL Server-anslutning

(valfritt om det görs tidigare.) I terminalfönstret skriver du
npm install mssql
detta installerar SQL Server-drivrutinerna.

Databasexempel

detta är exakt samma startkod som min tidigare artikel så jag kommer inte att gå igenom den i detalj. Det är dock position i appobjektet som är viktigt.

ett par saker att notera som kommer att skilja sig från tidigare, efter vårt första test,

• utförandet av våra anställda kommer att skickas från en webbsida (Postad.)
• resultatet av frågan kommer att matas ut till en webbsida med svar.

databasanslutning/frågeexempel

Ange koden nedan.

något viktigt att notera är att vi har en webbserver och en databasanslutning och fråga. Men de interagerar inte. Än!

Run it with by stopping and starting the web server or refreshing

and you will see the web server is running och det finns konsolutmatning av data från frågan. Men vi får inte något från webbservern eller skickar något ut till en webbsida.

figcaption>

HTML

vi behöver en sida för att tjäna upp när användaren går till vår webbplats. Den här sidan tillåter dem att skicka en parameter (PerformanceRating) som kan användas i databasfrågan.

OBS: Jag kommer inte att vara bekymrad över styling vår webbsida. Det kommer att vara enkelt och rakt på sak.

Vi sparar också allt i roten. En bästa praxis? Inte en chans! Men vi går för funktionalitet. Rengöring kan hända senare.

1. skapa följande webbsidor och namnge dem index.html och anställda.HTML.

• index.html kommer att vara vår huvudsakliga källsida.
• anställda.html kommer att vara där vårt resultat hamnar.

Note the <form action=”/Employees…
This is where our output will go.

Add the following to Employees.html

2. This next step is going to require a couple of things. En av dem är hur jag väljer att tjäna upp index.HTML. Andra källor du läser kan komma in i routing. Routing är ett mycket viktigt område, men utanför vår räckvidd. Vårt sätt är bara ett av många sätt. De nya tilläggen till vår kod kommer att vara,

• path — detta hjälper oss att använda res.sendFile för att servera upp filen vi vill ha när en besökare kommer till vår webbplats.
• bodyParser – gör formulärdata tillgängliga när ett inlägg är gjort
• sendFile — låter dig servera önskad standardsida.

gör följande ändringar i din kod,

kör det med genom att stoppa och starta webbservern eller uppdatera. I din webbläsare bör du se

använda HTML-formulärdata i vår fråga

För detta måste vi lägga till en app.inlägg. Detta kommer att engagera vad vi önskar när indexet.html för publiceras från webbsidan.

detta är ett viktigt steg. Vår databasanslutning och fråga måste vara inne i appen.post återuppringning funktion.

• linje 13 startar appen.inlägg. I kroppen av återuppringningen är våra databaskomponenter.
• linje 52 stänger appen.inlägg.

kan vi strukturera allt detta annorlunda, ja. Jag gör det på detta sätt för att ge oss en grund som kommer att fungera. Då kan vi/du utforska andra alternativ

använda formulärdata

använda formulärdata blir enkelt.

• linje 35, hämta formulärdata från select-elementet. bodyParser är det som hjälper oss här. req.kropp.elementnamn.
• linje 37, frågan, använder värdet från formuläret.
• linje 50 skickar råfrågad data till anställda.HTML.

kör det genom att stoppa och starta webbservern eller uppdatera.

1. gå till din webbsida och uppdatera.

2. Välj ”genomsnitt” från betygsrutan och klicka på”få resultat”

3. Du borde få produktion hos anställda.HTML. Inte attraktivt, men det är en början.

Json utgång från res.send

Vi har nu en anslutning från vår front-end till vår back-end till vår front-end. Det här är en stor sak.

sista stegen — städa upp utgången (lite.)

detta är den enklaste och svåraste delen. Hårdast eftersom det finns så många alternativ. Vi kommer att gå med grunderna i grunderna så att vi får en glimt av vad som händer innerst inne.

detta är ett område du kommer att vilja utforska mycket mer i detalj. Inte bara ytterligare metoder för res, men tanken på en ”view engine”.

och jag kommer att utforska några av dessa i framtida artiklar. I synnerhet en av mina favoriter, express-styret.

För nu ska vi konstruera vår produktion. Ja. Konstruera det själva. Bygg en tabell med våra data i kod och skicka den! Bara slinga igenom våra data.recordset och bygga.

se följande

div>

du vill lägga till rader 50-57.

utgången kommer att vara enligt följande när man frågar efter ”genomsnittlig”

Vad ska man göra nästa (ja du)

Spela med det, lägg till mer, ändra strukturen. Arbeta från grunderna och arbeta upp.

Vi arbetar med första principer för att hjälpa oss att förstå vad som händer bakom några av de lager som läggs till av JavaScript-mallar, ramar och bibliotek idag.

Vi har byggt på vårt eget, ett fullstacksystem. Ja, tro det eller ej vi har.

vad behöver mest arbete, utgången. Men hela denna övning öppnar en värld av utforskning och möjligheter. Så vi vill utöka begreppen,

• fler CRUD operationer
• Routing
• Visa motorer/mallar

Tack för att du tog denna resa och vi kommer att utforska mer.

Du kan också njuta av,