Theory
JavaScript, હવે server પર
FestConnect નું front end બની ગયું છે. પણ front end જાતે data સાચવી શકતું નથી કે નિયમો લાગુ પાડી શકતું નથી; એને backend જોઈએ, એટલે કે server પર ચાલતો એવો program જેની સાથે front end વાત કરે. આ unit Node.js અને Express વડે backend બનાવે છે.
Node.js તમને JavaScript ને server પર ચલાવવા દે છે (ફક્ત browser માં નહીં), એટલે તમે આખો stack એક જ ભાષામાં લખો છો. Express એવું framework છે જે Node પર web API બનાવવાનું સ્વચ્છ અને ઝડપી કરી આપે છે. Node ની પાયાની વાતો તમે અગાઉ જોઈ હતી; અહીં તમે ખરેખરનું REST API બનાવો છો. આ પાઠ એની ગોઠવણ કરી આપે છે.
Theory
Node, Express અને REST
Node.js એ એવું runtime છે જે JavaScript ને browser ની બહાર ચલાવે છે. એને (version 20) install કર્યા પછી તમે node app.js વડે ફાઇલ ચલાવો છો, અને એ web server તરીકે કામ કરી શકે છે.
Express એ Node પર ચાલતું નાનું અને ખૂબ વપરાતું framework છે. એ HTTP ના ઝીણા ભાગ સંભાળી લે છે અને તમને થોડી વાંચી શકાય એવી લીટીઓમાં API વ્યાખ્યાયિત કરવા દે છે. તમે RESTful backend બનાવશો: એ API ની એવી શૈલી છે જેમાં URLs સાધનો દર્શાવે છે (જેમ કે /events) અને HTTP methods ક્રિયાઓ દર્શાવે છે (વાંચવા માટે GET, બનાવવા માટે POST). Express માં routes લખવાનું સ્વાભાવિક લાગે છે, અને એટલે જ એ Node ના APIs માટે પહેલી પસંદ છે.
Practical
સાવ સાદો Express server
// install first: npm install express
const express = require('express');
const app = express();
app.use(express.json()); // parse JSON request bodies
app.get('/api/events', (req, res) => {
res.json([{ name: 'Robotics Workshop' }]); // respond with JSON
});
app.listen(3000, () => console.log('API running on port 3000'));This example runs in Gri-Learn on the web, where you can edit it and see the output.
Formula
nodemon: હવે હાથે restart કરવાનું નહીં
સામાન્ય રીતે તમે server નો code બદલો ત્યારે અસર જોવા માટે node app.js ને બંધ કરીને ફરી ચાલુ કરવું પડે, જે કંટાળાજનક પણ છે અને ભૂલી જવાય એવું પણ. nodemon એ મુશ્કેલી દૂર કરે છે: એ ફાઇલો પર નજર રાખે છે અને તમે સાચવો કે તરત server ને આપોઆપ ફરી ચાલુ કરે છે.
તમે એને development ના સાધન તરીકે install કરો છો (npm install --save-dev nodemon) અને node app.js ને બદલે nodemon app.js ચલાવો છો. Development દરમિયાન આ નાનું સાધન અસંખ્ય વખતના હાથે restart બચાવે છે અને લખવા તથા ચલાવવાનું ચક્ર ઝડપી રાખે છે. એ ફક્ત development ની સગવડ છે; production માં તો તમે સાદા node થી જ ચલાવો છો.
Theory
Project ને માળખામાં ગોઠવવો
એક જ ફાઇલવાળો server બતાવવા પૂરતો ઠીક છે, પણ FestConnect નું backend વધવાનું છે, એટલે તમે એને જવાબદારી પ્રમાણે folders માં ગોઠવો છો. સામાન્ય ગોઠવણ આવી હોય છે:
- routes/: કયાં URLs છે અને દરેક કયા handler સાથે જોડાય છે એ નક્કી કરે છે.
- controllers/: દરેક route નો તર્ક સંભાળતાં functions.
- models/: data નાં સ્વરૂપો અને database સુધીની પહોંચ.
આમ છૂટું પાડવાથી codebase વધે તો પણ એમાં ફરવું સહેલું રહે છે, અને એ તો separation of concerns નો એ જ વિચાર છે જે તમે અગાઉ ઠેર ઠેર જોયો છે. પ્રવેશની ફાઇલ (app.js) એ બધાંને જોડે છે અને server ચાલુ કરે છે.
Quiz
Node ના backend માં Express.js ની ભૂમિકા શું છે?
- એ events સાચવતું database છે
- એ Node પર ચાલતું હળવું web framework છે, જે RESTful API બનાવવાનું સહેલું કરે છે (routes, requests, responses)
- એ browser માં JavaScript ચલાવે છે
- એ Node.js ની જગ્યા પૂરેપૂરી લઈ લે છે
Show the answer
એ Node પર ચાલતું હળવું web framework છે, જે RESTful API બનાવવાનું સહેલું કરે છે (routes, requests, responses)
Express એ Node.js ઉપર બેસતું નાનું web framework છે, જે web કે REST API બનાવવાનું સીધુંસાદું કરી આપે છે: routes નક્કી કરો, requests વાંચો, અને થોડી સ્વચ્છ લીટીઓમાં responses મોકલો. વિકલ્પ A ખોટો છે: Express database નથી; FestConnect સંગ્રહ માટે MongoDB વાપરે છે (પછીના પાઠમાં). વિકલ્પ C browser ના JavaScript ની વાત કરે છે, પણ Node (અને Express) JavaScript ને server પર ચલાવે છે, browser માં નહીં. વિકલ્પ D ખોટો છે: Express Node ની જગ્યા લેતું નથી; એ Node પર જ ચાલે છે અને HTTP ને વધુ સગવડભરી રીતે સંભાળવા Node ના runtime નો ઉપયોગ કરે છે. Node એ runtime છે; Express એ framework છે જે API લખવાનું સહેલું કરે છે.
Think first
Front end તો Angular છે જ, તો backend માટે Node કેમ?
Backend તમે Python, Java કે PHP માં પણ લખી શકો. તો Node સાથેનું full-stack JavaScript કેમ આકર્ષે છે? વિચારીને પછી tap કરો.
Show the answer
સૌથી મોટું આકર્ષણ એ છે કે આખા stack માં એક જ ભાષા રહે છે: Node સાથે front end (Angular અને TypeScript, જે JavaScript નું પ્રકારવાળું પિતરાઈ છે) અને back end, બંને JavaScript માં લખાય છે, એટલે તમારે સંદર્ભ ઓછા બદલવા પડે છે, વિચારવાની રીત વહેંચાય છે, અમુક code પણ વહેંચાય છે (જેમ કે તપાસનો તર્ક કે data ના આકાર), અને ટીમને ઓછાં જુદાં કૌશલ્યો શીખવાં પડે છે. આ સંવાદિતા development ને ઝડપી કરે છે અને ભાષાઓ વચ્ચે ભાષાંતર કરવાથી થતી ભૂલો ઘટાડે છે.
Web backends માટે Node ની પોતાની ખાસ તાકાત પણ છે: એ ઘટના આધારિત અને ન અટકાવનારું છે, એટલે એ એકસાથે ઘણાં જોડાણ કાર્યક્ષમ રીતે સંભાળે છે (ઝડપી requests કરતા ઘણા વપરાશકર્તાઓને પીરસતાં APIs માટે ઉત્તમ), અને એની પાસે packages નું વિશાળ તંત્ર (npm) છે જેમાં લગભગ દરેક કામ માટે library છે, અને Express પોતે પણ એમાં જ છે.
JSON, જે web APIs ની સહિયારી ભાષા છે, એ JavaScript નું પોતાનું સ્વરૂપ છે, એટલે front end, back end અને database વચ્ચે (ખાસ કરીને MongoDB જેવા JSON ને અનુકૂળ database સાથે) data ખસેડવો સાવ સરળ રહે છે.
આમાંનું કશું Python, Java કે PHP ને ખોટા ઠેરવતું નથી, દરેકનાં backends ઉત્તમ છે; પણ FestConnect જેવા JavaScript થી ભરેલા, API આધારિત અને લગભગ તત્કાળ ચાલતા app માટે Node અને Express વાળું full-stack JavaScript સ્વાભાવિક અને ફળદાયી મેળ છે. અને એ શીખવાથી Angular નાં કૌશલ્યો અને backend નાં કૌશલ્યો એકબીજાને મજબૂત કરે છે. એક ભાષા, વિચારવાની એક જ રીત, છેડેથી છેડા સુધી.
Summary
Key takeaways
- Backend Node.js પર ચાલે છે, જે JavaScript ને server પર ચલાવે છે (ફાઇલો node app.js વડે ચલાવો).
- Express.js એ Node પર ચાલતું હળવું framework છે, જે RESTful API બનાવવાનું સહેલું કરે છે.
- REST ની શૈલી: URLs સાધનો દર્શાવે છે (જેમ કે /api/events) અને HTTP methods ક્રિયાઓ દર્શાવે છે (GET, POST).
- સાવ સાદો server: express() બનાવો, routes નક્કી કરો, અને કોઈ port પર app.listen કરો.
- ફાઇલો બદલાય ત્યારે nodemon server ને આપોઆપ ફરી ચાલુ કરે છે, જેથી development નું ચક્ર ઝડપી બને (ફક્ત development માટે).
- Project વધે તેમ એને routes, controllers અને models folders માં ગોઠવો (separation of concerns).
- યાદ રાખવાની કડી: Node JS ને server પર ચલાવે, Express API બનાવે, અને nodemon એને ફરી load કરે.