Aan de slag met Node.js voor de PHP-ontwikkelaar

Je bent een PHP-ontwikkelaar. Ik snap het. Ik ook. Mijn reis naar PHP verliep niet via de normale weg die de meeste PHP ontwikkelaars afleggen in hun zoektocht naar de perfecte programmeertaal. Ik begon aanvankelijk als Java ontwikkelaar en leefde ruwweg 10 jaar in dat land. Ik was een van die die hard Java ontwikkelaars die, wanneer PHP in een gesprek werd geïntroduceerd, dingen begon te roepen als enterprise, schaalbaarheid en andere onzin.

Ik begon ongeveer 5 jaar geleden te werken aan een open source project dat een social web front-end nodig had en het team moest een programmeertaal kiezen voor de site. Ik onderzocht Java en de meeste andere talen maar koos voor PHP om een aantal redenen. Het was moeilijk om mijn trots in te slikken en te beginnen coderen in PHP, maar wat er gebeurde tijdens dat project was niets minder dan een mirakel. Ik werd verliefd op de taal en begon hem te gebruiken voor zoveel mogelijk projecten als ik kon vinden, terwijl ik mijn Java roots in het stof liet verdwijnen. PHP heeft me de laatste 5 jaar goed gediend, maar ik was nog steeds op zoek naar de heilige graal van een programmeertaal die snel is om in te ontwikkelen, ondersteund wordt door bedrijven, performant en schaalbaar is en ook een sterke gemeenschap van ontwikkelaars heeft. Ik geloof dat Node.js voldoet aan al mijn eisen, terwijl het nog steeds een snel groeiende en evoluerende taal is.

Het eerste wat je moet begrijpen is dat Node.js niet alleen voor de hipster ontwikkelaars of early adopters is. Het wordt gebruikt door een aantal van de meest bezochte website op het internet vandaag de dag en blijft winnen ontwikkelaars hart en geest. Het is echt op een punt waar je het kunt vertrouwen voor zelfs de meest ingewikkelde systemen.

Node.js is JavaScript##

Als je denkt dat je een hele nieuwe taal moet leren om productief te zijn met Node.js, heb je het waarschijnlijk mis. De meeste ontwikkelaars zijn al bekend met JavaScript en dat is de taal en semantiek waarmee u zult werken bij het coderen in Node.js. In feite, een recent artikel gepubliceerd door Red Monk dat probeert om zin te geven aan github projecten om de meest populaire talen te bepalen heeft JavaScript als de koning. De top drie talen zijn als volgt:

• JavaScript
• Java
• PHP

Gezien de populariteit van JavaScript en zijn wijdverspreide adoptie in onze industrie, als je er nog niet mee vertrouwd bent, is het waarschijnlijk tijd om je schouders eronder te zetten en te beginnen het te leren.

Als Node.js gewoon JavaScript gebruikt, wat is het dan precies?##

In een notendop, Node.js is een platform voor server side activiteiten. Het maakt gebruik van de Javascript programmeertaal en heeft een overvloed aan bibliotheken beschikbaar als npm modules. U kunt denken aan deze npm modules als bibliotheek afhankelijkheden die kunnen worden voldaan met Composer als u afkomstig bent uit PHP land. In feite is het standaard dependencies management systeem voor PHP (Composer) geïnspireerd door Node.js volgens de officiële site. De kans is groot dat als je een beetje functionaliteit nodig hebt en geen zin hebt om alle code zelf te schrijven, er een npm-module beschikbaar is die al de functies biedt die je zoekt.

Node-applicaties worden normaal gesproken geïmplementeerd wanneer je de efficiëntie moet maximaliseren door gebruik te maken van non-blocking I/O en asynchrone gebeurtenissen. Een gotcha voor PHP-ontwikkelaars om te weten is dat Node.js-toepassingen in een enkele thread draaien. Backend Node.js code gebruikt echter meerdere threads voor operaties zoals netwerk- en bestandstoegang. Hierdoor is Node perfect voor toepassingen waar een bijna real-time ervaring gewenst is.

Aan de slag met een voorbeeldproject##

Voor de rest van deze blog post, ga ik u laten zien hoe u op snelheid kunt komen met Node.js komende vanuit een PHP achtergrond. De voorbeeld applicatie die we gaan schrijven is een eenvoudige backend service die de locatie van elke Walmart winkel zal geven. Ik koos Walmart voor dit voorbeeld omdat het eenvoudigweg de heilige graal is van alle warenhuizen. Als Walmart het niet heeft, hoef je het niet.

Aan het einde van deze blog post, zult u zien hoe snel en eenvoudig het is om een REST gebaseerde API met behulp van Node.js die wordt aangedreven door de populaire MongoDB database te maken. Ik koos dit REST-gebaseerde voorbeeld omdat het maken van een backend API snel een veel voorkomende use case is geworden in de meeste moderne applicaties.

Ik was oorspronkelijk van plan om dezelfde applicatie in zowel PHP als Node.js te maken om de overgang voor u te vergemakkelijken, maar om alle verschillende kaders en manieren van het maken van REST-gebaseerde diensten in PHP te dekken, zou het een heel boek rechtvaardigen en kan gewoon niet worden gedekt in een enkele blog post. Ik dacht er toen aan om gewoon het Laravel framework te gebruiken, aangezien dat in populariteit blijft groeien. Ik zou echter nog steeds slechts een kwart van de PHP ontwikkelaars bereiken. Persoonlijk is mijn favoriete framework CodeIgniter, maar het verliest snel terrein en vertegenwoordigt nu nog maar minder dan 8% van de PHP ontwikkelaarspopulatie. Sitepoint publiceerde onlangs een artikel waarin precies dit wordt besproken en geeft de volgende grafiek met de frameworks die de meeste belofte voor 2014 laten zien.

Gezien de grote verschillen in hoe databaseverbindingen te configureren en REST-services te maken voor elk framework, ga ik ervan uit dat je weet hoe je dit voor je framework in PHP moet doen en zal ik me in plaats daarvan alleen richten op de Node.js code.

Het maken van onze Node.js applicatie##

Voor de rest van deze post, gaan we de Walmart locator applicatie maken met behulp van het LoopBack API framework van StrongLoop. Als een toegevoegde bonus, zal ik je helpen met het installeren van Node.js op OSX. Dus pak je kop koffie, leun achterover, ontspan, en laten we aan de slag gaan.

Stap 1: Node.js installeren##

De makkelijkste manier om Node.js te installeren is via een van de beschikbare binaire pakketten die beschikbaar zijn voor de meeste besturingssystemen. Richt uw browser op de volgende URL en download het juiste pakket voor uw besturingssysteem:

http://nodejs.org/download/

Als deze pagina eenmaal is geladen, zou u het volgende moeten zien:

Als u Mac OSX gebruikt, klikt u op het universele .pkg-bestand. Hiermee wordt het installatieprogramma op uw lokale computer opgeslagen. Zodra het bestand is gedownload, start u het installatieprogramma door te dubbelklikken op het gedownloade .pkg-bestand. U krijgt dan het installatiedialoogvenster te zien:

Voltooi het installatieproces met behulp van alle standaardinstellingen en klik tenslotte op de knop Sluiten om het programma af te sluiten zodra de installatie is geslaagd. Makkelijk, hè?

Stap 2: LoopBack installeren met NPM

Nu we Node.js op ons lokale systeem hebben geïnstalleerd, willen we de LoopBack pakketten installeren die worden geleverd door StrongLoop. LoopBack is een open source API framework dat functionaliteit biedt die je leven makkelijker maakt als je begint te leren hoe je software schrijft en inzet die geschreven is in Node.js.

Om LoopBack te installeren, zullen we het npm commando gebruiken dat deel uitmaakt van de core Node.js distributie. NPM is de officiële package manager voor het installeren van bibliotheken of modules waar je applicaties van afhankelijk zijn. Aangezien deze post geschreven is voor PHP ontwikkelaars, is een gemakkelijke manier om aan NPM modules te denken het te relateren aan Composer. Door gebruik te maken van het Composer dependencies systeem, kunnen ontwikkelaars dependencies specificeren in hun composer.json bestand. Zodra de pakketten zijn gedefinieerd in het composer.json-bestand, hoeft een PHP-ontwikkelaar alleen maar het installatiecommando uit te voeren, dat er ongeveer als volgt uitziet:

$ php composer.phar install

NPM-modules werkt op dezelfde manier en maakt gebruik van het package.json-bestand om de afhankelijkheden voor een bepaalde toepassing te specificeren. Je kunt ook afhankelijkheden installeren vanaf de opdrachtregel om ze beschikbaar te maken op je lokale systeem. Maak je geen zorgen als je dit nog niet begrijpt, want we zullen het package.json bestand in meer detail behandelen in een latere stap.

Om LoopBack te installeren, kunnen we een enkel commando uitvoeren dat alle afhankelijkheden die we nodig hebben voor het pakket zal downloaden en installeren. Open uw terminalvenster en voer het volgende commando uit:

$ npm install -g strongloop

Note: het kan zijn dat u sudo moet gebruiken, afhankelijk van uw installatie

Wat is er zojuist gebeurd? We hebben npm verteld dat we het strongloop-pakket willen installeren, terwijl we ook de optie -g hebben opgegeven. De -g optie maakt het pakket beschikbaar als een globaal pakket voor iedereen op het systeem om te gebruiken en is beschikbaar voor alle applicaties. Zodra je het bovenstaande commando uitvoert, zal NPM het pakket downloaden, alsook alle afhankelijkheden die nodig zijn. Afhankelijk van de snelheid van uw systeem, kan dit enkele minuten duren.

Stap 3: Onze toepassing maken##

Het maken van een toepassing met de LoopBack API is heel eenvoudig en rechttoe rechtaan. Open gewoon uw terminalvenster en voer het volgende commando uit om een nieuwe toepassing te maken met de naam locatewalmart.

$ slc loopback _-----_ | | .--------------------------. |--(o)--| | Let's create a LoopBack | `---------´ | application! | ( _´U`_ ) '--------------------------' /___A___\ | ~ | __'.___.'__ ´ ` |° ´ Y ` Enter a directory name where to create the project: locatewalmart create locatewalmart/ info change the working directory to locatewalmart

Het hulpprogramma slc zal nu een nieuw LoopBack-gebaseerd project maken met de naam locatewalmart en het project configureren. Wanneer om de naam van de toepassing wordt gevraagd, kunnen we de standaardnaam behouden.

What's the name of your application? locatewalmart

Na het uitvoeren van het bovenstaande commando wordt een nieuwe directory voor uw project aangemaakt voor uw toepassing. Ga naar de directory voor de toepassing met het commando cd:

$ cd locatewalmart

Nu we onze toepassing hebben gemaakt, willen we ondersteuning voor MongoDB toevoegen als een datasource voor loopback.

Stap 4: Onze datasource definiëren##

Om met MongoDB te kunnen communiceren, moeten we een datasource aan onze toepassing toevoegen. We doen dat door het uitvoeren van:

$ slc loopback:datasource mymongo Enter the data-source name: mymongo Select the connector for mymongo:PostgreSQL (supported by StrongLoop)Oracle (supported by StrongLoop)Microsoft SQL (supported by StrongLoop)❯ MongoDB (supported by StrongLoop)SOAP webservices (supported by StrongLoop)REST services (supported by StrongLoop)Neo4j (provided by community)(Move up and down to reveal more choices)

Stap 5: Wijzen naar de echte datasource##

Om te kunnen communiceren met MongoDB, moeten we de datasource wijzen naar de werkelijke MongoDB-instantie. LoopBack definieert alle datasource configuratie in het datasource.json bestand dat zich in uw applicaties root/server directory bevindt. Open dit bestand en voeg een datasource voor MongoDB toe zoals in de volgende code wordt weergegeven:

{ "db": { "name": "db", "connector": "memory" }, "mymongo": { "name": "mymongo", "connector": "mongodb" "url": "mongodb://localhost:27017/locatewalmart" }}

Note: zorg ervoor dat u de juiste verbindingsURL voor uw MongoDB-database opgeeft. Voor dit voorbeeld heb ik een database lokaal gemaakt genaamd locatewalmart die ik wil gebruiken voor mijn datasource.

Nu dat we onze database gedefinieerd, zijn er een paar extra dingen die we moeten doen. Allereerst moeten we specificeren dat onze applicaties afhankelijk zijn van het loopback-connector-mongodb pakket. Om een afhankelijkheid te specificeren, wijzig je het package.json bestand, wat vergelijkbaar is met het bewerken van het composer.json bestand in PHP. Open het package.json bestand dat zich in de root directory van je applicatie bevindt en voeg de loopback-connector-mongodb toe aan de dependency sectie. Daarna kunt u npm install.

uitvoeren. Als alternatief kunt u ook gewoon:

$ npm install loopback-connector-mongodb --save

Dit zal de package.json automatisch bijwerken. De sectie zou er als volgt uit moeten zien:

"dependencies": { "compression": "^1.0.3", "errorhandler": "^1.1.1", "loopback": "^2.0.0", "loopback-boot": "^2.0.0", "loopback-connector-mongodb": "^1.4.1", "loopback-datasource-juggler": "^2.0.0", "serve-favicon": "^2.0.1" }

Stap 6: Gegevens importeren in MongoDB##

Nu we onze datasource geconfigureerd hebben, moeten we de dataset in onze MongoDB database laden.

Het eerste wat we willen doen is een JSON bestand downloaden dat alle gegevens bevat die we willen retourneren. U kunt dit op de volgende URL:

https://dl.dropboxusercontent.com/u/72466829/walmart.json

Als je eenmaal hebt de dataset gedownload, gewoon importeren in uw database met behulp van de mongoimport commando zoals hieronder weergegeven:

$ mongoimport --jsonArray -d locatewalmart -c store --type json --file walmart.json -h yourMongoHost --port yourMongoPort -u yourMongoUsername -p yourMongoPassword

U moet de volgende resultaten te zien:

connected to: 127.0.0.12014-08-17T13:07:26.301-0400 check 9 31762014-08-17T13:07:26.305-0400 imported 3176 objects

Stap 7: Ons Store-model maken##

Een model kan op dezelfde manier worden opgevat als je in PHP-land aan modellen denkt als je een MVC-framework gebruikt. Het is een representatie van een Object dat in dit geval een Walmart winkel is. LoopBack biedt een handige manier om model-objecten te maken met behulp van de commandoregel. Open uw terminalvenster, ga naar de projectmap en voer het volgende commando uit:

$ slc loopback:model

Dit zal een interactieve sessie starten waarin u uw model kunt definiëren. Het eerste wat je zal worden gevraagd is de databron waarmee je het model wilt associëren. Wij zullen de mymongo datasource selecteren die we zojuist hebben gemaakt. Vervolgens wordt er gevraagd naar de meervoudige naam voor het model. Laten we de standaardnaam (stores) gebruiken en op enter drukken.

 Enter the model name: store Select the data-source to attach store to:db (memory)❯ mymongo (mongodb) Expose store via the REST API? Yes Custom plural form (used to build REST URL):

Als u op enter drukt, wordt u gevraagd om de eigenschappen van het winkelmodel op te geven. Je kunt dit zien als var(s) die je in PHP in een klasse definieert.

Enter an empty property name when done. Property name:

De eigenschappen die we willen toevoegen zijn het type winkel, de openingsdatum, de breedtegraad en de lengtegraad.

 Property name: opendate invoke loopback:property

Als je eenmaal op enter drukt, wordt je gevraagd om het gegevenstype voor elke opgegeven eigenschap op te geven. Het eerste item zal opendate zijn en we willen selecteren dat het van het type datum is. Selecteer datum en druk op enter.

 Property type: string number boolean object array❯ date buffer geopoint (other)

Dan wordt u gevraagd of u deze eigenschap als een vereiste voor schema validatie wilt. We zullen “ja” invullen.

 Required? (y/N) : y

U wordt dan gevraagd naar het gegevenstype voor elke resterende eigenschap. Geef de volgende antwoorden:

 Property name: type_store invoke loopback:property Property type: (Use arrow keys)❯ string number boolean object array date buffer geopoint (other) Required? (y/N) : yLet's add another store property.Enter an empty property name when done. Property name: latitude invoke loopback:property Property type: (Use arrow keys)❯ string number boolean object array date buffer geopoint (other) Required? (y/N) : yLet's add another store property.Enter an empty property name when done. Property name: longitude invoke loopback:property Property type: (Use arrow keys)❯ string number boolean object array date buffer geopoint (other) Required? (y/N) : y

Typ “ja” in en druk op de Enter-toets.

Gefeliciteerd! U hebt zojuist uw eerste modelobject gemaakt met LoopBack in combinatie met Node.js. Om te zien wat er werkelijk is gemaakt onder de dekmantel, open het store.json bestand dat zich bevindt in de root/common/models directory van uw applicatie directory. Zoek de stores entry die er als volgt uitziet:

{ "name": "store", "base": "PersistedModel", "properties": { "opendate": { "type": "date", "required": true }, "type_store": { "type": "string", "required": true }, "latitude": { "type": "string", "required": true }, "longitude": { "type": "string", "required": true } }, "validations": , "relations": {}, "acls": , "methods": }

Zoals u kunt zien, hebben we een model gemaakt en de eigenschappen die we hebben gedefinieerd zijn toegewezen aan het store model. Het veld public specificeert dat we dit model aan de wereld willen blootstellen via een REST web service.

De toewijzing van het model aan de datasource is gedefinieerd in de model-config.json onder de app root/server map. Het veld datasource specificeert de datasource die dit model zal gebruiken voor CRUD-bewerkingen.

"store": { "dataSource": "mymongo", "public": true }

Stap 8: Test de REST-gebaseerde API##

Wat denk je? U hebt zojuist uw eerste REST-gebaseerde webdienst gemaakt met Node.js. Dat was toch niet zo slecht? Laten we het controleren door onze browser te richten op de applicatie die we net hebben gemaakt. U kunt dit doen door naar de volgende URL te gaan:

http://0.0.0.0:3000/api/stores/

U krijgt een JSON-weergave te zien van alle Walmart-winkels die we in de database hebben geïmporteerd, zoals te zien is in de volgende afbeelding:

Gebruik de StrongLoop Explorer##

Wel, dat is geweldig. We hebben een REST endpoint dat alle Walmart stores in de database terugstuurt, maar er lijkt nog het een en ander aan te mankeren omdat we geen management interface hebben om met de data te werken of om te controleren of alle CRUD operaties werken. Gelukkig biedt StrongLoop een handige browser waarmee je alle endpoints die je applicatie heeft kunt verkennen. Om dit te testen opent u uw browser en gaat u naar de volgende URL:

http://0.0.0.0:3000/explorer/

Als de Explorer-pagina is geladen, vouwt u de stores API uit om alle beschikbare bewerkingen te zien die zijn toegestaan op het modelobject. Dit is te zien in de volgende afbeelding:

Als voorbeeld van wat u kunt doen met de Verkenner, vouwt u de /stores/findOne API uit en klikt u op de Try it out! link die een query zal uitvoeren in de database en één record zal retourneren, zoals te zien is in de volgende afbeelding:

De zaken een beetje verder brengen door een kaartrepresentatie toe te voegen##

Hoooi, we hebben een REST-gebaseerd eindpunt gemaakt dat een lijst van alle Walmart-winkels in onze database zal retourneren. Om verder te illustreren hoe snel men volledige applicaties kan ontwikkelen met StrongLoop, laten we een responsive front end bouwen dat een kaart bevat met pins voor elke Walmart winkel.

Stap 1: Maak de publieke directory##

Zoals gespecificeerd in het app.js bestand van het project, zullen standaard alle bestanden in de publieke directory in de applicaties root directory geserveerd worden aan de aanvrager. Het kan echter zijn dat deze directory standaard niet bestaat, dus moeten we hem aanmaken. Open uw terminal en ga naar de root directory van uw applicatie en voer het volgende commando uit:

$ mkdir public

Stap 2: Maak de responsive map##

Het volgende wat we moeten doen is een mooie representatie van de data maken. Aangezien we de lengte- en breedtegraad van elke winkel hebben, zou het geweldig zijn om deze inhoud uit te drukken met een kaart die de gebruiker kan rondslepen, in- en uitzoomen, enz. Deze taak is eigenlijk veel eenvoudiger dan je zou verwachten als we gebruik maken van een aantal bestaande bibliotheken. Aan het eind van het maken van deze responsive view, zal het resultaat er als volgt uitzien:

Daarnaast zal de gebruiker in staat zijn om in te zoomen op een zeer gedetailleerd niveau van de kaart om de dichtstbijzijnde Walmart te bekijken, zoals te zien is in de volgende afbeelding:

De code voor de web view van de applicatie maakt gebruik van de lengte- en breedtegraad eigenschappen die we gedefinieerd hebben op ons model object en geïmporteerd hebben in de database. We maken ook gebruik van de populaire Leaflet-bibliotheek voor het maken van de kaart en het plaatsen van de pins, of markers, op de kaart.

Om deze kaart te maken, maakt u een nieuw bestand in de public directory met de naam locatewalmart.html en voegt u de volgende JavaScript-code toe:

<!doctype html><html lang="en"><head> <title>Walmart Stores</title> <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.5.1/leaflet.css" /><!--> <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.5.1/leaflet.ie.css" /><!--><script src="https://code.jquery.com/jquery-2.0.0.min.js"></script><link href='http://fonts.googleapis.com/css?family=oswald' rel='stylesheet' type='text/css'><meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /><style type="text/css">body { padding: 0; margin: 0;}html, body, #map { height: 100%; font-family: 'oswald';}.leaflet-container .leaflet-control-zoom { margin-left: 13px; margin-top: 70px;}#map { z-index: 1;}#title { z-index: 2; position: absolute; left: 10px; }</style></head><body><h1>Walmart Stores</h1><div></div><script src="http://cdn.leafletjs.com/leaflet-0.5.1/leaflet.js"></script><script>center = new L.LatLng(39.83, -98.58);zoom = 5;var map = L.map('map').setView(center, zoom);var markerLayerGroup = L.layerGroup().addTo(map);L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {maxZoom: 18,attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>'}).addTo(map);function getPins(e){url = "http://0.0.0.0:3000/api/stores";$.get(url, pinTheMap, "json")}function pinTheMap(data){//clear the current pinsmap.removeLayer(markerLayerGroup);//add the new pinsvar markerArray = ;var lastNumber = 0;for (var i = 0; i < data.length; i++){store = data;if(store.latitude.length > 0 && store.longitude.length>0) {markerArray.push(L.marker());}}markerLayerGroup = L.layerGroup(markerArray).addTo(map);}map.whenReady(getPins)</script></body></html>

Zoals u kunt zien, bestaat de code gewoon uit standaard-HTML en JavaScript. Het interessante deel is de getPins(e) functie waar we een REST oproep maken naar de API die we eerder in deze blog post hebben gemaakt. We itereren dan over elke winkel en maken een pin met de lengte- en breedtegraad van elke winkel. Best handig, hè?

Conclusie##

In deze blog post heb ik je laten zien hoe je een REST gebaseerde web service kunt maken die een lijst van Walmart winkels in de Verenigde Staten retourneert. Nadat we de web service hadden gemaakt met Loopback, voegden we een front end representatie van de gegevens toe. Met heel weinig werk waren we in staat om een volledig functionerende toepassing te ontwikkelen, veel sneller dan iemand zou kunnen met hun huidige taal naar keuze. We bespraken ook enkele van de overeenkomsten tussen Node.js en PHP. Hoewel ik PHP nog steeds als een geweldige taal beschouw, heb ik persoonlijk ontdekt dat Node.js een geweldige volgende taal is om te leren, gezien het rijke ecosysteem van bibliotheken en de snelheid waarmee ik in staat ben om applicaties te maken.

Ik heb een snelle tabel opgenomen die u kunt raadplegen wanneer u Node.js vergelijkt met PHP.

• Klaar om API’s te ontwikkelen in Node.js en ze te verbinden met uw gegevens? Kijk dan eens naar het Node.js LoopBack framework. We hebben het gemakkelijk gemaakt om lokaal of op uw favoriete cloud aan de slag te gaan, met een eenvoudige npm install.