Node Basics oneserve co uk

Node Basics Oneserve Co Uk-PDF Download

  • Date:22 Nov 2019
  • Views:133
  • Downloads:0
  • Pages:29
  • Size:782.62 KB

Share Pdf : Node Basics Oneserve Co Uk

Download and Preview : Node Basics Oneserve Co Uk


Report CopyRight/DMCA Form For : Node Basics Oneserve Co Uk


Description:

That seems overwhelming at first but if you take it line by line you can see that a lot of the attributes created here make it easier for other developers to jump into the project

Transcription:

idle processes and 100 requests come in some users may experience a connection timeout until. some of those processes are freed up Of course there are several ways to handle this scalability. more efficiently but in general Apache will use one thread per request so to support more and. more users you will eventually need more and more servers . This is where Node js shines Node is an event driven language that can play the same role as. Apache It will interpret the client side code to produce the web page They are similar in that. each new connection fires a new event but the main distinction comes from the fact that Node is. asynchronous and single threaded Instead of using multiple threads that sit around waiting. for a function or event to finish executing Node uses only one thread to handle all requests . Although this may seem inefficient at first glance it actually works out well given the. asynchronous nature of Node , Node let s us build real time open APIs that we can consume and use with our applications . Transferring data or applications like chat systems status updates or almost any other scenario. that requires quick display of real time data is where Node does its best . Some Example Node Uses, Chat client, Real time user updates like a Twitter feed . Online Shop, Polling App, Now that we have a brief overview of Node let s dive in and build two applications . A very simple app to show the basics of starting a Node project. A more fully fledged application where we display our latest Instagram pictures. Getting Started,Installing Node, Make sure you have Node http nodejs org and npm Node s package manager installed npm. comes bundled with Node so as long as you install Node you ll have access to npm . Once you ve installed Node make sure you have access to Node and npm from the command. line Let s verify installation by checking version numbers Go into your command line application. and type node v and npm v You should see the following . If you have trouble with the installation process try restarting your computer and making sure that. Node is in your PATH Check the Node installation page. https github com joyent node wiki installation installing on windows and npm install page. https github com npm npm wiki Troubleshooting for more troubleshooting . Now that we have Node and npm installed let s get to our first app . A Very Simple Node App, Code for this example found here https github com scotch io node booklet .
code tree master app1 https github com scotch io node booklet code tree master app1 . Node applications are configured within a file called package json You will need a package json. file for each project you create This file is where you configure the name of your project versions . repository author and the all important dependencies Here is a sample package json file . name node app , version 1 0 0 , description The code repository for the Node booklet . main server js , repository , type git , url https github com scotch io node booklet code . dependencies , express latest , mongoose latest , author Chris Sevilleja . license MIT , homepage https scotch io , That seems overwhelming at first but if you take it line by line you can see that a lot of the. attributes created here make it easier for other developers to jump into the project We ll look. through all these different parts later in the book but here s a very simple package json with. only the required parts , name node booklet code , main server js .
These are the most basic required attributes , main tells Node which file to use when we want to start our applications We ll name that file. server js for all of our applications and that will be where we start our applications . For more of the attributes that can be specified in our package json files here are the. package json docs https www npmjs org doc files package json html . Initialize Node App, The package json file is how we will start every application It can be hard to remember exactly. what goes into a package json file so npm has created an easy to remember command that let s. you build out your package json file quickly and easily That command is npm init . Let s create a sample project and test out the npm init command . 1 Create a folder mkdir awesome test,2 Jump into that folder cd awesome test. 3 Start our Node project npm init, It will give you a few options that you can leave as default blank or customize as you wish For. now you can leave everything default except for the main entry point file Ours will be called. server js , You can see that our new package json file is built and we have our first Node project .
Since we have a package json file now we can go into our command line and type node. server js to start up this Node app It will just throw an error since we haven t created the. server js file that we want to use to begin our Node application Not very encouraging to see an. error on our first time starting a Node server Let s change that and make an application that does. something , Now we will need to create the server js file The only thing we will do here is console log out. some information console log is the way we dump information to our console We re going to. use it to send a message when we start up our Node app . Here is our server js file s contents , console log Wow A tiny Node app . Now we can start up our Node application by going into our command line and typing node. node server js, We should see our message logged to the console Remember that since Node is JavaScript on. the server the console will be on our server This is in contrast with the client side console that. we ll find in our browser s dev tools ,TIP Restarting a Node Application on File Changes. By default the node server js command will start up our application but it won t. restart when file changes are made This can become tedious when we are developing. since we will have to shut down and restart every time we make a change . Luckily there is an npm package that will watch for file changes and restart our server when. changes are detected This package is called nodemon. https github com remy nodemon and to install it just go into your command line and. npm install g nodemon, The g modifier means that this package will be installed globally for your system Now .
instead of using node server js we are able to use . nodemon server js, Feel free to go into your server js file and make changes Then watch the magic happen. when application restarts itself , We ll be using nodemon for the rest of this booklet . Running an HTTP Server with Node, Code for this example found here https github com scotch io node booklet . code tree master app2 https github com scotch io node booklet code tree master app2 . Node doesn t just have the ability to process JS files like we just did it can also create an HTTP. server We re going to look at setting up an HTTP server with Express a Node framework to. serve an HTML file , In the first app we only logged something to the console Moving forward we will take what we. learned a step further so that we can serve a website to our users We ll be another step closer to. fully fledged web applications , Let s stick with the same application add the Express framework and deliver an HTML file We ll.
need the same files package json server js and we ll add a new index html file . Express A Node Framework, One of the biggest strengths of Node is that it has support for many packages The community. submits many packages to npm https www npmjs com and at the time of this writing there. are 311 863 packages with over 201 817 776 downloads in the last day That s a lot of. Packages extend the functionality of our application and there are packages for so many different. use cases You may have heard of task runners like Grunt http gruntjs com and Gulp. http gulpjs com or even CSS processors like LESS can be packages . Express is a lightweight platform for building web apps using NodeJS It helps organize web apps. on the server side The ExpressJS website http expressjs com describes Express as a. minimal and flexible node js web application framework . Express hides a lot of the inner workings of Node which allows you to dive into your application. code and get things up and running a lot faster It s fairly easy to learn and still gives you a bit of. flexibility with its structure There is a reason it is currently the most popular framework for Node . Some of the big names using Express are , Segment io. For a full list of Express users visit the Express list. http expressjs com en resources companies using express html . Express comes with several great features that will add ease to your Node development . Handling Requests, Application Settings, Middleware. Don t worry if these terms are new to you just know that Express makes Node development. much easier and is a joy to work with ,Installing Express. The packages for a specific Node application are defined in its package json To get packages. installed you can employ one of two methods , Method 1 Write it into package json.
Method 2 From the command line using npm install, We re going to use method 2 here Go into your command line and type . npm install express save, The save modifier will let npm know that it should write that package to your package json. file If you run that command and go look in the package json file you ll notice it will be in a. dependencies section of your file You ll also notice that a new folder called node modules is. created This is where Node stores the packages for a certain project . This is what makes sharing projects between developers and collaborators very easy Just send. other users your project and they run npm install to install everything in the dependencies. Since we now have Node and Express ready let s use both to create an HTTP server and serve. up an HTML file to our users ,Creating an HTTP Server and Serving an HTML File. Let s get the easy part out of the way the HTML file In your project create a new index html file. and place the following inside , DOCTYPE html , html lang en . meta charset UTF 8 , title My Node App title , CSS .
link rel stylesheet , href maxcdn bootstrapcdn com bootstrap 3 3 2 css bootstrap min css . body padding top 50px , body class container , div class jumbotron . h1 My App h1 , We ll be linking to the CSS framework Bootstrap http getbootstrap com through Bootstrap. CDN http bootstrapcdn com to help us get quick CSS styling for this demo . Let s move forward and create our HTTP server in Node using Express Delete everything in your. server js file and here is what we will need , grab express. var express require express , create an express app.
var app express , create an express route for the home page. http localhost 8080 , app get function req res , res sendFile dirname index html . start the server on port 8080, app listen 8080 , send a message. console log Server has started , That file is all that is required to use Express to start an HTTP server and send an HTML file . require is the main way that we call packages in Node Once we have created an Express. application in app we can define routes on it using the HTTP variable app get creates a. GET route for , When creating routes we will always have access to the req request and res response The.
request contains information from the browser like HTTP agent information passed in and more . The response is what we will send back to the user We are using sendFile there are more. things that can be done like sending back JSON data using res json . We can start the server using app listen and passing in the port that we want 8080 . Let s make sure everything works by going into the command line to process this file and start our. nodemon server js, Then we can view our site in our browser at http localhost 8080 http localhost 8080 . Whenever we start a server with Node it will be placed at http localhost PORT NUMBER . This is a very easy and quick way to create an HTTP server and start developing Node and. Express can be used to build amazing applications or if you need it it can just create a simple. server to work on , Great We ve done a lot with Node already . Installed Node, Processed a very simple file, Used npm to install a package. Create an HTTP server with Express, Serve an HTML file. Let s take this a step further and create an application that actually shows relevant data . Our First Node App, Code for this example found here https github com scotch io node booklet .
code tree master app3 https github com scotch io node booklet code tree master app3 . For this Node application we ll be building upon the concepts we ve already learned in this. booklet A common task when building out any sort of application is to use third party data We. will be connecting to the Instagram API and grabbing data from there to show our most recent. Requirements, Use Express as the Node framework, Use the Instagram Developer API. Use the instagram node https www npmjs com package instagram node package. View our Instagram photos, Template a Node app with EJS http www embeddedjs com and the EJS package. https www npmjs com package ejs ,Directory Structure. public , css , style css, pages , index ejs, partials . head ejs, header ejs, footer ejs, package json, server js.
We have the same structure to start our Node application package json and server js are. still there We will be serving public files CSS JS images from the public folder . You ll notice that our views are separated into partials and pages Partials will be reusable. components like the header and footer of our site It s good practice to separate these out so that. we can keep our code DRY http en wikipedia org wiki Don 27t repeat yourself . EJS https www npmjs com package ejs will be the templating engine and it is very commonly. used within Node applications This helps in a number of ways over having plain HTML files We. are able to , Display dynamic data sent from the server. Repeat over variables and lists, Template our applications. Let s work with the Instagram data in Node first in our server js file Once we have the. Instagram data that we need we ll move over to our view files to display it . Setting Up Our Application, Let s create a new folder for this application It will be a good practice to start from scratch so we. can get used to making Node applications ,package json. Once your new folder is created jump into the command line and start your Node application. npm init, Fill in your information however you like and then we ll install the packages that we need .
npm install express ejs instagram node save, This will install these three packages into the node modules folder and add them to the. dependencies section of package json , We will now create our server js file The main things we need to do in this file are . Grab the packages we need Express EJS instagram node . Configure these packages, Set Instagram API access token. Set EJS as our templating engine, Set Express assets directory for CSS . Create a route for the home page, Grab our Instagram images.
Pass to our views, Start the server, GRAB THE PACKAGES VARIABLES WE NEED. , var express require express , var app express , var ig require instagram node instagram . CONFIGURE THE APP, , tell node where to look for site resources. app use express static dirname public , set the view engine to ejs. app set view engine ejs , configure instagram app with your access token.
we ll get to this soon, SET THE ROUTES, , home page route our profile s images. app get function req res , use the instagram package to get our profile s media. render the home page and pass in our profile s images. res render pages index , START THE SERVER, , app listen 8080 . console log App started Look at http localhost 8080 . We have grabbed our packages set the configurations that we need to created one home page. route and started our server This can be done quickly in Node since we have the ability to. app use and app set on our Express application , These configurations can be found on the Express and ejs package pages and usually packages. will provide very clear instruction on their GitHub repository or npm page . While we used res sendfile earlier ejs provides the res render function By default . Express and ejs will look in a views folder so we don t have to specify views pages index . pages index will be enough , We will also grab and create an ig object using require instagram node instagram .
You can find these instructions on the instagram node. https www npmjs com package instagram node npm page . View Files, Before we can test this server to make sure that everything is working we ll need a view file to. show We re going to move quickly through the view files since these aren t the main focus of our. Node application ,views partials head ejs, meta charset UTF 8 . title My First Node App title , CSS , link rel stylesheet . href maxcdn bootstrapcdn com bootswatch 3 3 7 cosmo bootstrap min css . link rel stylesheet href css style css , We re grabbing Bootstrap http getbootstrap com from a CDN http bootstrapcdn com for. quick styling We picked one of the Bootstrap files from the Bootswatch. http bootstrapcdn com bootswatch tab section of the site to switch up from the default. Bootstrap styling , We are also loading a stylesheet css style css It is in our public css folder and since we set.
express static in server js our application will serve assets from the public folder . views partials header ejs, nav class navbar navbar inverse . div class container fluid , div class navbar header . a href class navbar brand , span class glyphicon glyphicon picture span . My Instagram Photos, Nothing too crazy here Just a Bootstrap navbar with a link back to the home page The span is. one of the Bootstrap glyphicons http getbootstrap com components glyphicons .

Related Books