SlideShare a Scribd company logo
1 of 46
Download to read offline
NPM THE GUIDE
By Kameron Tanseli @kamerontanseli
1
Who is this book for?
This book accommodates for beginners however the ideal
reader is one who has a working knowledge of the
command line and JavaScript as well as Node.js installed.
Don’t be put off however if you do not have that much
experience as most of the examples in the book are not
that hard to follow.
2
Contents
1. Book cover
2. Who is this book for?
3. Contents
4. Npmjs.org description
5. Statistic of how many downloads
6. Installing npm
7. Chapter One
8. Pablo Picasso quote
9. How to install a package
10. How to globally install a package
11. How to uninstall a package
12. Creating package.json and saving packages to it
13. Structure of package.json
14. Install all listed packages
15. How to require packages
16. Chapter two
17. How to update packages
18. Choosing which version
19. Checking what to update
20. Chapter Three
21. Jquery.extend
22. Underscore
23. CoffeeScript
24. Colors
25. Chapter Four
26. Registering up
27. Using npm config ls
28. How to structure a custom
package
29. Publishing a package
30. The process of creating
31. Updating custom packages
32. Chapter Five
33. List of all npm commands
34. Useful npm commands - P1
35. Useful npm commands - P2
36. Npm explore
37. Chapter Five
38. Npm.load()
39. Npm.commands
40. Using packages with npm
41. Image of finished script
42. Chapter Seven
43. Statistics of npm
44. What you have learnt
45. Credits
3
“npm makes it easy for
JavaScript developers to share
and reuse code, and it makes it
easy to update the code that
you're sharing” - npmjs.org
4
1,908,826,857
Total number of installs last month
at the time of writing this.
5
Installing and updating npm
Npm comes with the
installation of Node.js.
To update npm simple type
6
1.
Using npm
● npm install
● --save
● require( );
7
“
Good artists copy; great
artists steal - Pablo
Picasso.
8
npm install
Here are 3 easy steps to installing a
package:
1. Go to npmjs.org,
2. Search for the package name you want, for
e.g: “underscore”.
3. Then simply type on the command line:
9
What if i need it installed
everywhere?
Add -g to then end of your npm
install to make the package globally
available!
10
npm uninstall
Just use npm uninstall just like npm
install to remove a package. To remove a
global package just add -g the end of
npm uninstall.
11
npm init
This command creates a file
called ‘package.json’ this
holds a list of all your
packages installed.
npm install --save
<p_name>
This parameter added to the
end of a npm install adds the
package name to the
package.json. You will need
to run npm init before using
--save.
npm init and --save
npm uninstall --save
<p_name>
This removes the package
from the ‘package.json’.
12
package.json
Where our
packages
are installed
What
version of
the package
do we need
13
Manually added packages to
package.json?
Just use npm install without
specifying a package name to install
all of them!
14
Where to use it?
Require is placed inside files
that are to be run by Node.js
and that “require” a package to
work. Require is strictly for
the server side code unless
you are using Browserify!
require( );
How to use it?
First we store our required
modules in a variable, then we call
the require function with the
name of our package in the
brackets.
15
2.
Updating and checking
● npm update
● npm outdated
16
npm update
If you want to update
all the packages in
package.json simply
type npm update.
However you can also
just add a package
name to update a
single package.
For global packages
you just have to
reinstall the package
globally.
17
Stable
This is the safest
option as this
has no further
changes
Legacy
You might want
this if you need
to support older
libraries
Edge
This is the latest
version and the
most unstable as
it is new and still
being developed.
What kind of version of a package do you need?
18
npm outdated
Use npm outdated
to check whether any
packages need to be
updated.
19
3.
Libraries to
check out
● jQuery.extend
● Underscore
● CoffeeScript
● Colors
20
jQuery.extend
Although you may not be able to select DOM elements, jQuery’s useful $.
extend() method can easily help to simplify inheritance on the server side.
npm install jquery.extend
Extending objects for
inheritance.
It only offers one
method.
21
Underscore
The npm package explains this perfectly.
Underscore.js is a utility-belt library for JavaScript that provides support
for the usual functional suspects (each, map, reduce, filter...) without
extending any core JavaScript objects.
npm install underscore Offers a full library of
useful functions.
Do you really need all
of them?
22
CoffeeScript
CoffeeScript is a language that compiles into JavaScript, it’s syntax
follows that of a mix of Ruby and Python. CoffeeScript is an attempt to
expose the good parts of JavaScript in a simple way.
Example:
npm install coffee-script
More readable and
cleaner than JS.
Debugging is a pain.
23
Colors
Add coloured text to your Node.js console.
npm install colors
YOU GET COLOURS!
Nothing colours rule.
24
4.
Publishing your own package
● npm adduser
● npm publish
● npm unpublish
25
npm adduser
To add a package we need to create an account. We can
do this easily with npm adduser.
You should see the fields outputted when ran:
■ Username
■ email
■ password
Fill out the fields and continue, you should now be
registered.
26
use npm config ls to check
whether your credentials are
saved on your system.
27
Simple package - Default file name “index.js”
Requiring it after publishing
28
Publishing
npm init
Run npm init to create a
package.json file, remember
to add any dependencies you
installed as you made the
package.
Publishing
After setting up the package.
json simply type npm publish
./ this will publish the
package in the current
directory to npmjs.org.
29
npm adduser npm init npm publish
The process is simple
30
Updating the package
Version
npm will reject an update
with the same version code as
the published package, so
remember to change the
version code.
npm publish again
As your credentials are saved
on your system you do not
need to relogin, so to publish
the update simply run the
npm publish command.
31
5.
Extra npm commands
● npm view
● npm root
● npm search
● npm help-search
● ...
32
List of all npm commands
● access
● adduser
● bin
● bugs
● build
● bundle
● cache
● completion
● config
● dedupe
● deprecate
● dist-tag
● docs
● edit
● explore
● help
● help-search
● init
● install
● link
● logout
● ls
● npm
● outdated
● owner
● pack
● ping
● prefix
● prune
● publish
● rebuild
● repo
● restart
● rm
● root
● run-script
● search
● shrinkwrap
● star
● stars
● start
● stop
● tag
● test
● uninstall
● unpublish
● update
● version
● view
● whoami
Dont panic you don’t need to use around 70%!
33
Helpful npm commands
npm view
This command
shows data about
a package and
prints it to the
console.
npm search
Search npm to
check whether a
package exists.
npm root
Displays the path
in the directory to
the node_modules
folder.
● npm view <p_name>
● npm search <p_name>
● npm root
34
Helpful npm commands - part 2
npm edit
This opens the
selected package
in your default
editor, after saving
npm rebuilds the
package.
npm docs
This command
tries to guess at
the likely location
of a package's
documentation
URL, and then tries
to open it in the
browser.
npm ls
Prints out all the
packages installed
as well as their
dependencies in a
tree like structure.
● npm edit <p_name>
● npm docs
● npm ls
35
npm explore <p_name>
This command will open a subdirectory in
the command line to the package in the
node_modules folder. Super useful!
36
6.
Programming with npm
● npm.commands
● npm.load
37
Setting up our script
We will call our file “test.js”, then require
the “npm” module.
First we must load our environment, we can
do this via npm.load(). The method takes 2
parameters a
configuration object
and a callback when
npm is ready.
38
Calling commands
Inside npm.load’s callback we can use npm.
commands to execute some command line
methods. For example we will use the npm
ls method to list out all our packages.
39
Using other packages in conjunction
We will use the prompt package to allow user input. To install it run npm install prompt, then
require it in our test.js.
We use prompt.start() to start prompting, then we run prompt.get() and pass in an array with our
field names (the use of “_” will result in a space in the command line) and a callback with the
parameters err and result.
Our results are stored in the result object, to access them use the same name in your array as a
property. For e.g: [“package_name”] will equal results.package_name .Then we substitute our field
(“package_name”) into npm.commands.explore.
Full size image next page.
40
test.js with the prompt package integrated (top), program running in cmd (bottom).
41
7.
END
● Credits
42
170, 699
That’s a lot of packages
100%
Guaranteed to speed up your workflow
Around 30k installs a day
And a lot of updates
43
Let’s review what you learnt
Install and
uninstall
You learnt how to use npm install,
npm uninstall, the --save and -g param
and the structure of package.json.
Updating and
checking
You learnt how to update packages
locally and globally as well as how to
update all packages. You also learnt
how to check if updates are needed
using npm outdated.
Some libraries
You learnt about the positives and
negatives of using certain packages
and how to install them.
Publishing your
own package
You learnt how to write a basic
package and how to upload it to the
npm registry. You also learnt how to
update the package and what
requirements must be met before
updating.
Extra npm
commands
You learnt some useful npm
commands to help speed up your
workflow.
Programming
with npm
You learnt how to require npm and
use it in an example project to explore
files.
44
Credits
Special thanks to all the people who made and released
these awesome resources for free:
■ Design by SlidesCarnival
45
Blurb
Learn how to use npm to install packages and
update them. Delve deeper into more
command line commands to help speed up
workflow and finally use npm in your scripts
to utilise npm’s additional features.
46

More Related Content

What's hot

What is Node.js | Node.js Tutorial for Beginners | Node.js Modules | Node.js ...
What is Node.js | Node.js Tutorial for Beginners | Node.js Modules | Node.js ...What is Node.js | Node.js Tutorial for Beginners | Node.js Modules | Node.js ...
What is Node.js | Node.js Tutorial for Beginners | Node.js Modules | Node.js ...Edureka!
 
Sync async-blocking-nonblocking-io
Sync async-blocking-nonblocking-ioSync async-blocking-nonblocking-io
Sync async-blocking-nonblocking-ioCheoloh Bae
 
ASP.NET Core MVC + Web API with Overview
ASP.NET Core MVC + Web API with OverviewASP.NET Core MVC + Web API with Overview
ASP.NET Core MVC + Web API with OverviewShahed Chowdhuri
 
Introduction to Node JS.pdf
Introduction to Node JS.pdfIntroduction to Node JS.pdf
Introduction to Node JS.pdfBareen Shaikh
 
Angular server side rendering - Strategies & Technics
Angular server side rendering - Strategies & Technics Angular server side rendering - Strategies & Technics
Angular server side rendering - Strategies & Technics Eliran Eliassy
 
Intro to react native
Intro to react nativeIntro to react native
Intro to react nativeModusJesus
 
Basic Concept of Node.js & NPM
Basic Concept of Node.js & NPMBasic Concept of Node.js & NPM
Basic Concept of Node.js & NPMBhargav Anadkat
 
Nginx internals
Nginx internalsNginx internals
Nginx internalsliqiang xu
 
NGINX: Basics and Best Practices EMEA
NGINX: Basics and Best Practices EMEANGINX: Basics and Best Practices EMEA
NGINX: Basics and Best Practices EMEANGINX, Inc.
 
Introduction to Node.js
Introduction to Node.jsIntroduction to Node.js
Introduction to Node.jsRob O'Doherty
 
File upload using multer in node.js and express.js [2021 tutorial]
File upload using multer in node.js and express.js [2021 tutorial]File upload using multer in node.js and express.js [2021 tutorial]
File upload using multer in node.js and express.js [2021 tutorial]Katy Slemon
 
Django Introduction & Tutorial
Django Introduction & TutorialDjango Introduction & Tutorial
Django Introduction & Tutorial之宇 趙
 
스프링 부트와 로깅
스프링 부트와 로깅스프링 부트와 로깅
스프링 부트와 로깅Keesun Baik
 
Workshop 4: NodeJS. Express Framework & MongoDB.
Workshop 4: NodeJS. Express Framework & MongoDB.Workshop 4: NodeJS. Express Framework & MongoDB.
Workshop 4: NodeJS. Express Framework & MongoDB.Visual Engineering
 
AngularJS: an introduction
AngularJS: an introductionAngularJS: an introduction
AngularJS: an introductionLuigi De Russis
 
카카오 광고 플랫폼 MSA 적용 사례 및 API Gateway와 인증 구현에 대한 소개
카카오 광고 플랫폼 MSA 적용 사례 및 API Gateway와 인증 구현에 대한 소개카카오 광고 플랫폼 MSA 적용 사례 및 API Gateway와 인증 구현에 대한 소개
카카오 광고 플랫폼 MSA 적용 사례 및 API Gateway와 인증 구현에 대한 소개if kakao
 

What's hot (20)

What is Node.js | Node.js Tutorial for Beginners | Node.js Modules | Node.js ...
What is Node.js | Node.js Tutorial for Beginners | Node.js Modules | Node.js ...What is Node.js | Node.js Tutorial for Beginners | Node.js Modules | Node.js ...
What is Node.js | Node.js Tutorial for Beginners | Node.js Modules | Node.js ...
 
Sync async-blocking-nonblocking-io
Sync async-blocking-nonblocking-ioSync async-blocking-nonblocking-io
Sync async-blocking-nonblocking-io
 
Angular Lifecycle Hooks
Angular Lifecycle HooksAngular Lifecycle Hooks
Angular Lifecycle Hooks
 
ASP.NET Core MVC + Web API with Overview
ASP.NET Core MVC + Web API with OverviewASP.NET Core MVC + Web API with Overview
ASP.NET Core MVC + Web API with Overview
 
Rest api with node js and express
Rest api with node js and expressRest api with node js and express
Rest api with node js and express
 
Server side rendering review
Server side rendering reviewServer side rendering review
Server side rendering review
 
Introduction to Node JS.pdf
Introduction to Node JS.pdfIntroduction to Node JS.pdf
Introduction to Node JS.pdf
 
Angular server side rendering - Strategies & Technics
Angular server side rendering - Strategies & Technics Angular server side rendering - Strategies & Technics
Angular server side rendering - Strategies & Technics
 
Intro to react native
Intro to react nativeIntro to react native
Intro to react native
 
Basic Concept of Node.js & NPM
Basic Concept of Node.js & NPMBasic Concept of Node.js & NPM
Basic Concept of Node.js & NPM
 
Nginx internals
Nginx internalsNginx internals
Nginx internals
 
NGINX: Basics and Best Practices EMEA
NGINX: Basics and Best Practices EMEANGINX: Basics and Best Practices EMEA
NGINX: Basics and Best Practices EMEA
 
Introduction to Node.js
Introduction to Node.jsIntroduction to Node.js
Introduction to Node.js
 
File upload using multer in node.js and express.js [2021 tutorial]
File upload using multer in node.js and express.js [2021 tutorial]File upload using multer in node.js and express.js [2021 tutorial]
File upload using multer in node.js and express.js [2021 tutorial]
 
Nodejs presentation
Nodejs presentationNodejs presentation
Nodejs presentation
 
Django Introduction & Tutorial
Django Introduction & TutorialDjango Introduction & Tutorial
Django Introduction & Tutorial
 
스프링 부트와 로깅
스프링 부트와 로깅스프링 부트와 로깅
스프링 부트와 로깅
 
Workshop 4: NodeJS. Express Framework & MongoDB.
Workshop 4: NodeJS. Express Framework & MongoDB.Workshop 4: NodeJS. Express Framework & MongoDB.
Workshop 4: NodeJS. Express Framework & MongoDB.
 
AngularJS: an introduction
AngularJS: an introductionAngularJS: an introduction
AngularJS: an introduction
 
카카오 광고 플랫폼 MSA 적용 사례 및 API Gateway와 인증 구현에 대한 소개
카카오 광고 플랫폼 MSA 적용 사례 및 API Gateway와 인증 구현에 대한 소개카카오 광고 플랫폼 MSA 적용 사례 및 API Gateway와 인증 구현에 대한 소개
카카오 광고 플랫폼 MSA 적용 사례 및 API Gateway와 인증 구현에 대한 소개
 

Viewers also liked

Working with npm packages
Working with npm packagesWorking with npm packages
Working with npm packagesTomasz Bak
 
Yarn package management
Yarn package managementYarn package management
Yarn package managementrudiyardley
 
3Camp Tech 2016/11/15 - Front-end tooling: package managers
3Camp Tech 2016/11/15 - Front-end tooling: package managers3Camp Tech 2016/11/15 - Front-end tooling: package managers
3Camp Tech 2016/11/15 - Front-end tooling: package managersMichał Michalczuk
 
Deploying NPM packages with the Nix package manager
Deploying NPM packages with the Nix package managerDeploying NPM packages with the Nix package manager
Deploying NPM packages with the Nix package managerSander van der Burg
 
Introduction to node.js
Introduction to node.jsIntroduction to node.js
Introduction to node.jsjacekbecela
 
Functional Reactive Angular 2
Functional Reactive Angular 2 Functional Reactive Angular 2
Functional Reactive Angular 2 Tomasz Bak
 
Introduction to Node.js
Introduction to Node.jsIntroduction to Node.js
Introduction to Node.jsVikash Singh
 

Viewers also liked (9)

Nodejs intro
Nodejs introNodejs intro
Nodejs intro
 
Working with npm packages
Working with npm packagesWorking with npm packages
Working with npm packages
 
Yarn package management
Yarn package managementYarn package management
Yarn package management
 
3Camp Tech 2016/11/15 - Front-end tooling: package managers
3Camp Tech 2016/11/15 - Front-end tooling: package managers3Camp Tech 2016/11/15 - Front-end tooling: package managers
3Camp Tech 2016/11/15 - Front-end tooling: package managers
 
Deploying NPM packages with the Nix package manager
Deploying NPM packages with the Nix package managerDeploying NPM packages with the Nix package manager
Deploying NPM packages with the Nix package manager
 
Yarn
YarnYarn
Yarn
 
Introduction to node.js
Introduction to node.jsIntroduction to node.js
Introduction to node.js
 
Functional Reactive Angular 2
Functional Reactive Angular 2 Functional Reactive Angular 2
Functional Reactive Angular 2
 
Introduction to Node.js
Introduction to Node.jsIntroduction to Node.js
Introduction to Node.js
 

Similar to NPM THE GUIDE

Node js packages [#howto with npm]
Node js packages [#howto with npm]Node js packages [#howto with npm]
Node js packages [#howto with npm]Andrii Lundiak
 
ReactJS software installation
ReactJS software installationReactJS software installation
ReactJS software installationHopeTutors1
 
How to install ReactJS software
How to install ReactJS software How to install ReactJS software
How to install ReactJS software VigneshVijay21
 
Improving WordPress Theme Development Workflow - Naveen Kharwar.
Improving WordPress Theme Development Workflow - Naveen Kharwar.Improving WordPress Theme Development Workflow - Naveen Kharwar.
Improving WordPress Theme Development Workflow - Naveen Kharwar.Naveen Kharwar
 
Writing a npm module
Writing a npm moduleWriting a npm module
Writing a npm moduleHarsh Joshi
 
Yum package manager
Yum package managerYum package manager
Yum package managerLinuxConcept
 
Anton Cherednikov "Modules and Artifacts in NPM"
Anton Cherednikov "Modules and Artifacts in NPM"Anton Cherednikov "Modules and Artifacts in NPM"
Anton Cherednikov "Modules and Artifacts in NPM"LogeekNightUkraine
 
Newgenlib Installation on Ubuntu 12.04
Newgenlib Installation on Ubuntu 12.04Newgenlib Installation on Ubuntu 12.04
Newgenlib Installation on Ubuntu 12.04Rajendra Singh
 
Overview of Node JS
Overview of Node JSOverview of Node JS
Overview of Node JSJacob Nelson
 
Analysis of an exploited npm package
Analysis of an exploited npm packageAnalysis of an exploited npm package
Analysis of an exploited npm packageParth Parmar
 
How to Install Node.js and NPM on Windows and Mac?
How to Install Node.js and NPM on Windows and Mac?How to Install Node.js and NPM on Windows and Mac?
How to Install Node.js and NPM on Windows and Mac?Inexture Solutions
 
Node JS - A brief overview on building real-time web applications
Node JS - A brief overview on building real-time web applicationsNode JS - A brief overview on building real-time web applications
Node JS - A brief overview on building real-time web applicationsExpeed Software
 

Similar to NPM THE GUIDE (20)

Node js packages [#howto with npm]
Node js packages [#howto with npm]Node js packages [#howto with npm]
Node js packages [#howto with npm]
 
ReactJS software installation
ReactJS software installationReactJS software installation
ReactJS software installation
 
How to install ReactJS software
How to install ReactJS software How to install ReactJS software
How to install ReactJS software
 
Node.js
Node.jsNode.js
Node.js
 
Improving WordPress Theme Development Workflow - Naveen Kharwar.
Improving WordPress Theme Development Workflow - Naveen Kharwar.Improving WordPress Theme Development Workflow - Naveen Kharwar.
Improving WordPress Theme Development Workflow - Naveen Kharwar.
 
NodeJs Session03
NodeJs Session03NodeJs Session03
NodeJs Session03
 
Writing a npm module
Writing a npm moduleWriting a npm module
Writing a npm module
 
Npm: beyond 'npm i'
Npm: beyond 'npm i'Npm: beyond 'npm i'
Npm: beyond 'npm i'
 
Angular2 ecosystem
Angular2 ecosystemAngular2 ecosystem
Angular2 ecosystem
 
Backbase CXP Manager Setup
Backbase CXP Manager SetupBackbase CXP Manager Setup
Backbase CXP Manager Setup
 
Yum package manager
Yum package managerYum package manager
Yum package manager
 
Anton Cherednikov "Modules and Artifacts in NPM"
Anton Cherednikov "Modules and Artifacts in NPM"Anton Cherednikov "Modules and Artifacts in NPM"
Anton Cherednikov "Modules and Artifacts in NPM"
 
Newgenlib Installation on Ubuntu 12.04
Newgenlib Installation on Ubuntu 12.04Newgenlib Installation on Ubuntu 12.04
Newgenlib Installation on Ubuntu 12.04
 
Linux16 RPM
Linux16 RPMLinux16 RPM
Linux16 RPM
 
Overview of Node JS
Overview of Node JSOverview of Node JS
Overview of Node JS
 
Analysis of an exploited npm package
Analysis of an exploited npm packageAnalysis of an exploited npm package
Analysis of an exploited npm package
 
Understanding of node
Understanding of nodeUnderstanding of node
Understanding of node
 
How to Install Node.js and NPM on Windows and Mac?
How to Install Node.js and NPM on Windows and Mac?How to Install Node.js and NPM on Windows and Mac?
How to Install Node.js and NPM on Windows and Mac?
 
Node JS - A brief overview on building real-time web applications
Node JS - A brief overview on building real-time web applicationsNode JS - A brief overview on building real-time web applications
Node JS - A brief overview on building real-time web applications
 
Python
PythonPython
Python
 

Recently uploaded

Top 10 Interactive Website Design Trends in 2024.pptx
Top 10 Interactive Website Design Trends in 2024.pptxTop 10 Interactive Website Design Trends in 2024.pptx
Top 10 Interactive Website Design Trends in 2024.pptxDyna Gilbert
 
Q4-1-Illustrating-Hypothesis-Testing.pptx
Q4-1-Illustrating-Hypothesis-Testing.pptxQ4-1-Illustrating-Hypothesis-Testing.pptx
Q4-1-Illustrating-Hypothesis-Testing.pptxeditsforyah
 
PHP-based rendering of TYPO3 Documentation
PHP-based rendering of TYPO3 DocumentationPHP-based rendering of TYPO3 Documentation
PHP-based rendering of TYPO3 DocumentationLinaWolf1
 
办理多伦多大学毕业证成绩单|购买加拿大UTSG文凭证书
办理多伦多大学毕业证成绩单|购买加拿大UTSG文凭证书办理多伦多大学毕业证成绩单|购买加拿大UTSG文凭证书
办理多伦多大学毕业证成绩单|购买加拿大UTSG文凭证书zdzoqco
 
Potsdam FH学位证,波茨坦应用技术大学毕业证书1:1制作
Potsdam FH学位证,波茨坦应用技术大学毕业证书1:1制作Potsdam FH学位证,波茨坦应用技术大学毕业证书1:1制作
Potsdam FH学位证,波茨坦应用技术大学毕业证书1:1制作ys8omjxb
 
『澳洲文凭』买拉筹伯大学毕业证书成绩单办理澳洲LTU文凭学位证书
『澳洲文凭』买拉筹伯大学毕业证书成绩单办理澳洲LTU文凭学位证书『澳洲文凭』买拉筹伯大学毕业证书成绩单办理澳洲LTU文凭学位证书
『澳洲文凭』买拉筹伯大学毕业证书成绩单办理澳洲LTU文凭学位证书rnrncn29
 
Call Girls Near The Suryaa Hotel New Delhi 9873777170
Call Girls Near The Suryaa Hotel New Delhi 9873777170Call Girls Near The Suryaa Hotel New Delhi 9873777170
Call Girls Near The Suryaa Hotel New Delhi 9873777170Sonam Pathan
 
办理(UofR毕业证书)罗切斯特大学毕业证成绩单原版一比一
办理(UofR毕业证书)罗切斯特大学毕业证成绩单原版一比一办理(UofR毕业证书)罗切斯特大学毕业证成绩单原版一比一
办理(UofR毕业证书)罗切斯特大学毕业证成绩单原版一比一z xss
 
SCM Symposium PPT Format Customer loyalty is predi
SCM Symposium PPT Format Customer loyalty is prediSCM Symposium PPT Format Customer loyalty is predi
SCM Symposium PPT Format Customer loyalty is predieusebiomeyer
 
Call Girls In The Ocean Pearl Retreat Hotel New Delhi 9873777170
Call Girls In The Ocean Pearl Retreat Hotel New Delhi 9873777170Call Girls In The Ocean Pearl Retreat Hotel New Delhi 9873777170
Call Girls In The Ocean Pearl Retreat Hotel New Delhi 9873777170Sonam Pathan
 
Contact Rya Baby for Call Girls New Delhi
Contact Rya Baby for Call Girls New DelhiContact Rya Baby for Call Girls New Delhi
Contact Rya Baby for Call Girls New Delhimiss dipika
 
Font Performance - NYC WebPerf Meetup April '24
Font Performance - NYC WebPerf Meetup April '24Font Performance - NYC WebPerf Meetup April '24
Font Performance - NYC WebPerf Meetup April '24Paul Calvano
 
NSX-T and Service Interfaces presentation
NSX-T and Service Interfaces presentationNSX-T and Service Interfaces presentation
NSX-T and Service Interfaces presentationMarko4394
 
Film cover research (1).pptxsdasdasdasdasdasa
Film cover research (1).pptxsdasdasdasdasdasaFilm cover research (1).pptxsdasdasdasdasdasa
Film cover research (1).pptxsdasdasdasdasdasa494f574xmv
 
『澳洲文凭』买詹姆士库克大学毕业证书成绩单办理澳洲JCU文凭学位证书
『澳洲文凭』买詹姆士库克大学毕业证书成绩单办理澳洲JCU文凭学位证书『澳洲文凭』买詹姆士库克大学毕业证书成绩单办理澳洲JCU文凭学位证书
『澳洲文凭』买詹姆士库克大学毕业证书成绩单办理澳洲JCU文凭学位证书rnrncn29
 

Recently uploaded (17)

Top 10 Interactive Website Design Trends in 2024.pptx
Top 10 Interactive Website Design Trends in 2024.pptxTop 10 Interactive Website Design Trends in 2024.pptx
Top 10 Interactive Website Design Trends in 2024.pptx
 
Q4-1-Illustrating-Hypothesis-Testing.pptx
Q4-1-Illustrating-Hypothesis-Testing.pptxQ4-1-Illustrating-Hypothesis-Testing.pptx
Q4-1-Illustrating-Hypothesis-Testing.pptx
 
PHP-based rendering of TYPO3 Documentation
PHP-based rendering of TYPO3 DocumentationPHP-based rendering of TYPO3 Documentation
PHP-based rendering of TYPO3 Documentation
 
young call girls in Uttam Nagar🔝 9953056974 🔝 Delhi escort Service
young call girls in Uttam Nagar🔝 9953056974 🔝 Delhi escort Serviceyoung call girls in Uttam Nagar🔝 9953056974 🔝 Delhi escort Service
young call girls in Uttam Nagar🔝 9953056974 🔝 Delhi escort Service
 
办理多伦多大学毕业证成绩单|购买加拿大UTSG文凭证书
办理多伦多大学毕业证成绩单|购买加拿大UTSG文凭证书办理多伦多大学毕业证成绩单|购买加拿大UTSG文凭证书
办理多伦多大学毕业证成绩单|购买加拿大UTSG文凭证书
 
Potsdam FH学位证,波茨坦应用技术大学毕业证书1:1制作
Potsdam FH学位证,波茨坦应用技术大学毕业证书1:1制作Potsdam FH学位证,波茨坦应用技术大学毕业证书1:1制作
Potsdam FH学位证,波茨坦应用技术大学毕业证书1:1制作
 
『澳洲文凭』买拉筹伯大学毕业证书成绩单办理澳洲LTU文凭学位证书
『澳洲文凭』买拉筹伯大学毕业证书成绩单办理澳洲LTU文凭学位证书『澳洲文凭』买拉筹伯大学毕业证书成绩单办理澳洲LTU文凭学位证书
『澳洲文凭』买拉筹伯大学毕业证书成绩单办理澳洲LTU文凭学位证书
 
Call Girls Near The Suryaa Hotel New Delhi 9873777170
Call Girls Near The Suryaa Hotel New Delhi 9873777170Call Girls Near The Suryaa Hotel New Delhi 9873777170
Call Girls Near The Suryaa Hotel New Delhi 9873777170
 
办理(UofR毕业证书)罗切斯特大学毕业证成绩单原版一比一
办理(UofR毕业证书)罗切斯特大学毕业证成绩单原版一比一办理(UofR毕业证书)罗切斯特大学毕业证成绩单原版一比一
办理(UofR毕业证书)罗切斯特大学毕业证成绩单原版一比一
 
SCM Symposium PPT Format Customer loyalty is predi
SCM Symposium PPT Format Customer loyalty is prediSCM Symposium PPT Format Customer loyalty is predi
SCM Symposium PPT Format Customer loyalty is predi
 
Call Girls In The Ocean Pearl Retreat Hotel New Delhi 9873777170
Call Girls In The Ocean Pearl Retreat Hotel New Delhi 9873777170Call Girls In The Ocean Pearl Retreat Hotel New Delhi 9873777170
Call Girls In The Ocean Pearl Retreat Hotel New Delhi 9873777170
 
Contact Rya Baby for Call Girls New Delhi
Contact Rya Baby for Call Girls New DelhiContact Rya Baby for Call Girls New Delhi
Contact Rya Baby for Call Girls New Delhi
 
Font Performance - NYC WebPerf Meetup April '24
Font Performance - NYC WebPerf Meetup April '24Font Performance - NYC WebPerf Meetup April '24
Font Performance - NYC WebPerf Meetup April '24
 
Hot Sexy call girls in Rk Puram 🔝 9953056974 🔝 Delhi escort Service
Hot Sexy call girls in  Rk Puram 🔝 9953056974 🔝 Delhi escort ServiceHot Sexy call girls in  Rk Puram 🔝 9953056974 🔝 Delhi escort Service
Hot Sexy call girls in Rk Puram 🔝 9953056974 🔝 Delhi escort Service
 
NSX-T and Service Interfaces presentation
NSX-T and Service Interfaces presentationNSX-T and Service Interfaces presentation
NSX-T and Service Interfaces presentation
 
Film cover research (1).pptxsdasdasdasdasdasa
Film cover research (1).pptxsdasdasdasdasdasaFilm cover research (1).pptxsdasdasdasdasdasa
Film cover research (1).pptxsdasdasdasdasdasa
 
『澳洲文凭』买詹姆士库克大学毕业证书成绩单办理澳洲JCU文凭学位证书
『澳洲文凭』买詹姆士库克大学毕业证书成绩单办理澳洲JCU文凭学位证书『澳洲文凭』买詹姆士库克大学毕业证书成绩单办理澳洲JCU文凭学位证书
『澳洲文凭』买詹姆士库克大学毕业证书成绩单办理澳洲JCU文凭学位证书
 

NPM THE GUIDE

  • 1. NPM THE GUIDE By Kameron Tanseli @kamerontanseli 1
  • 2. Who is this book for? This book accommodates for beginners however the ideal reader is one who has a working knowledge of the command line and JavaScript as well as Node.js installed. Don’t be put off however if you do not have that much experience as most of the examples in the book are not that hard to follow. 2
  • 3. Contents 1. Book cover 2. Who is this book for? 3. Contents 4. Npmjs.org description 5. Statistic of how many downloads 6. Installing npm 7. Chapter One 8. Pablo Picasso quote 9. How to install a package 10. How to globally install a package 11. How to uninstall a package 12. Creating package.json and saving packages to it 13. Structure of package.json 14. Install all listed packages 15. How to require packages 16. Chapter two 17. How to update packages 18. Choosing which version 19. Checking what to update 20. Chapter Three 21. Jquery.extend 22. Underscore 23. CoffeeScript 24. Colors 25. Chapter Four 26. Registering up 27. Using npm config ls 28. How to structure a custom package 29. Publishing a package 30. The process of creating 31. Updating custom packages 32. Chapter Five 33. List of all npm commands 34. Useful npm commands - P1 35. Useful npm commands - P2 36. Npm explore 37. Chapter Five 38. Npm.load() 39. Npm.commands 40. Using packages with npm 41. Image of finished script 42. Chapter Seven 43. Statistics of npm 44. What you have learnt 45. Credits 3
  • 4. “npm makes it easy for JavaScript developers to share and reuse code, and it makes it easy to update the code that you're sharing” - npmjs.org 4
  • 5. 1,908,826,857 Total number of installs last month at the time of writing this. 5
  • 6. Installing and updating npm Npm comes with the installation of Node.js. To update npm simple type 6
  • 7. 1. Using npm ● npm install ● --save ● require( ); 7
  • 8. “ Good artists copy; great artists steal - Pablo Picasso. 8
  • 9. npm install Here are 3 easy steps to installing a package: 1. Go to npmjs.org, 2. Search for the package name you want, for e.g: “underscore”. 3. Then simply type on the command line: 9
  • 10. What if i need it installed everywhere? Add -g to then end of your npm install to make the package globally available! 10
  • 11. npm uninstall Just use npm uninstall just like npm install to remove a package. To remove a global package just add -g the end of npm uninstall. 11
  • 12. npm init This command creates a file called ‘package.json’ this holds a list of all your packages installed. npm install --save <p_name> This parameter added to the end of a npm install adds the package name to the package.json. You will need to run npm init before using --save. npm init and --save npm uninstall --save <p_name> This removes the package from the ‘package.json’. 12
  • 14. Manually added packages to package.json? Just use npm install without specifying a package name to install all of them! 14
  • 15. Where to use it? Require is placed inside files that are to be run by Node.js and that “require” a package to work. Require is strictly for the server side code unless you are using Browserify! require( ); How to use it? First we store our required modules in a variable, then we call the require function with the name of our package in the brackets. 15
  • 16. 2. Updating and checking ● npm update ● npm outdated 16
  • 17. npm update If you want to update all the packages in package.json simply type npm update. However you can also just add a package name to update a single package. For global packages you just have to reinstall the package globally. 17
  • 18. Stable This is the safest option as this has no further changes Legacy You might want this if you need to support older libraries Edge This is the latest version and the most unstable as it is new and still being developed. What kind of version of a package do you need? 18
  • 19. npm outdated Use npm outdated to check whether any packages need to be updated. 19
  • 20. 3. Libraries to check out ● jQuery.extend ● Underscore ● CoffeeScript ● Colors 20
  • 21. jQuery.extend Although you may not be able to select DOM elements, jQuery’s useful $. extend() method can easily help to simplify inheritance on the server side. npm install jquery.extend Extending objects for inheritance. It only offers one method. 21
  • 22. Underscore The npm package explains this perfectly. Underscore.js is a utility-belt library for JavaScript that provides support for the usual functional suspects (each, map, reduce, filter...) without extending any core JavaScript objects. npm install underscore Offers a full library of useful functions. Do you really need all of them? 22
  • 23. CoffeeScript CoffeeScript is a language that compiles into JavaScript, it’s syntax follows that of a mix of Ruby and Python. CoffeeScript is an attempt to expose the good parts of JavaScript in a simple way. Example: npm install coffee-script More readable and cleaner than JS. Debugging is a pain. 23
  • 24. Colors Add coloured text to your Node.js console. npm install colors YOU GET COLOURS! Nothing colours rule. 24
  • 25. 4. Publishing your own package ● npm adduser ● npm publish ● npm unpublish 25
  • 26. npm adduser To add a package we need to create an account. We can do this easily with npm adduser. You should see the fields outputted when ran: ■ Username ■ email ■ password Fill out the fields and continue, you should now be registered. 26
  • 27. use npm config ls to check whether your credentials are saved on your system. 27
  • 28. Simple package - Default file name “index.js” Requiring it after publishing 28
  • 29. Publishing npm init Run npm init to create a package.json file, remember to add any dependencies you installed as you made the package. Publishing After setting up the package. json simply type npm publish ./ this will publish the package in the current directory to npmjs.org. 29
  • 30. npm adduser npm init npm publish The process is simple 30
  • 31. Updating the package Version npm will reject an update with the same version code as the published package, so remember to change the version code. npm publish again As your credentials are saved on your system you do not need to relogin, so to publish the update simply run the npm publish command. 31
  • 32. 5. Extra npm commands ● npm view ● npm root ● npm search ● npm help-search ● ... 32
  • 33. List of all npm commands ● access ● adduser ● bin ● bugs ● build ● bundle ● cache ● completion ● config ● dedupe ● deprecate ● dist-tag ● docs ● edit ● explore ● help ● help-search ● init ● install ● link ● logout ● ls ● npm ● outdated ● owner ● pack ● ping ● prefix ● prune ● publish ● rebuild ● repo ● restart ● rm ● root ● run-script ● search ● shrinkwrap ● star ● stars ● start ● stop ● tag ● test ● uninstall ● unpublish ● update ● version ● view ● whoami Dont panic you don’t need to use around 70%! 33
  • 34. Helpful npm commands npm view This command shows data about a package and prints it to the console. npm search Search npm to check whether a package exists. npm root Displays the path in the directory to the node_modules folder. ● npm view <p_name> ● npm search <p_name> ● npm root 34
  • 35. Helpful npm commands - part 2 npm edit This opens the selected package in your default editor, after saving npm rebuilds the package. npm docs This command tries to guess at the likely location of a package's documentation URL, and then tries to open it in the browser. npm ls Prints out all the packages installed as well as their dependencies in a tree like structure. ● npm edit <p_name> ● npm docs ● npm ls 35
  • 36. npm explore <p_name> This command will open a subdirectory in the command line to the package in the node_modules folder. Super useful! 36
  • 37. 6. Programming with npm ● npm.commands ● npm.load 37
  • 38. Setting up our script We will call our file “test.js”, then require the “npm” module. First we must load our environment, we can do this via npm.load(). The method takes 2 parameters a configuration object and a callback when npm is ready. 38
  • 39. Calling commands Inside npm.load’s callback we can use npm. commands to execute some command line methods. For example we will use the npm ls method to list out all our packages. 39
  • 40. Using other packages in conjunction We will use the prompt package to allow user input. To install it run npm install prompt, then require it in our test.js. We use prompt.start() to start prompting, then we run prompt.get() and pass in an array with our field names (the use of “_” will result in a space in the command line) and a callback with the parameters err and result. Our results are stored in the result object, to access them use the same name in your array as a property. For e.g: [“package_name”] will equal results.package_name .Then we substitute our field (“package_name”) into npm.commands.explore. Full size image next page. 40
  • 41. test.js with the prompt package integrated (top), program running in cmd (bottom). 41
  • 43. 170, 699 That’s a lot of packages 100% Guaranteed to speed up your workflow Around 30k installs a day And a lot of updates 43
  • 44. Let’s review what you learnt Install and uninstall You learnt how to use npm install, npm uninstall, the --save and -g param and the structure of package.json. Updating and checking You learnt how to update packages locally and globally as well as how to update all packages. You also learnt how to check if updates are needed using npm outdated. Some libraries You learnt about the positives and negatives of using certain packages and how to install them. Publishing your own package You learnt how to write a basic package and how to upload it to the npm registry. You also learnt how to update the package and what requirements must be met before updating. Extra npm commands You learnt some useful npm commands to help speed up your workflow. Programming with npm You learnt how to require npm and use it in an example project to explore files. 44
  • 45. Credits Special thanks to all the people who made and released these awesome resources for free: ■ Design by SlidesCarnival 45
  • 46. Blurb Learn how to use npm to install packages and update them. Delve deeper into more command line commands to help speed up workflow and finally use npm in your scripts to utilise npm’s additional features. 46