Slide 1
Slide 1 text
Evolution of a
Web Application
the story of js.com
npm
brought to you by @rockbot
Slide 2
Slide 2 text
@rockbot #scriptconf
an overview of
npm
Slide 3
Slide 3 text
@rockbot #scriptconf
for JavaScript
npm is a
package manager
Slide 4
Slide 4 text
@rockbot #scriptconf
npm is a
package manager
Slide 5
Slide 5 text
@rockbot #scriptconf
our #1 priority is to
reduce friction
Slide 6
Slide 6 text
@rockbot #scriptconf
started out as
open source
Slide 7
Slide 7 text
@rockbot #scriptconf
0
20,000,000
40,000,000
2012-10-22 2013-01-10 2013-03-31 2013-06-19 2013-11-25
weekly downloads
Slide 8
Slide 8 text
@rockbot #scriptconf
0
15,000
30,000
45,000
60,000
12/14/2011 12/13/2012 12/13/2013
number of packages
Slide 9
Slide 9 text
@rockbot #scriptconf
became a company
in 2014
Slide 10
Slide 10 text
@rockbot #scriptconf
the npm website:
the gory details
Slide 11
Slide 11 text
@rockbot #scriptconf
7-day rolling
0
200,000
400,000
600,000
800,000
2014/1/6 2015/1/5 2016/1/4 2017/1/2
Users New Users
users on the website
Slide 12
Slide 12 text
@rockbot #scriptconf
DESIGN
Slide 13
Slide 13 text
@rockbot #scriptconf
Slide 14
Slide 14 text
@rockbot #scriptconf
Slide 15
Slide 15 text
@rockbot #scriptconf
Slide 16
Slide 16 text
@rockbot #scriptconf
Slide 17
Slide 17 text
@rockbot #scriptconf
Slide 18
Slide 18 text
@rockbot #scriptconf
npm
Slide 19
Slide 19 text
@rockbot #scriptconf
npm
Slide 20
Slide 20 text
@rockbot #scriptconf
npm
Slide 21
Slide 21 text
@rockbot #scriptconf
Slide 22
Slide 22 text
@rockbot #scriptconf
Slide 23
Slide 23 text
@rockbot #scriptconf
SEARCH
Slide 24
Slide 24 text
@rockbot #scriptconf
Slide 25
Slide 25 text
@rockbot #scriptconf
Slide 26
Slide 26 text
@rockbot #scriptconf
Slide 27
Slide 27 text
@rockbot #scriptconf
Slide 28
Slide 28 text
@rockbot #scriptconf
FRONT-END
JAVASCRIPT
Slide 29
Slide 29 text
@rockbot #scriptconf
Slide 30
Slide 30 text
@rockbot #scriptconf
Slide 31
Slide 31 text
@rockbot #scriptconf
Slide 32
Slide 32 text
@rockbot #scriptconf
vs
Slide 33
Slide 33 text
@rockbot #scriptconf
Slide 34
Slide 34 text
@rockbot #scriptconf
Slide 35
Slide 35 text
@rockbot #scriptconf
Slide 36
Slide 36 text
@rockbot #scriptconf
FRAMEWORKS
Slide 37
Slide 37 text
@rockbot #scriptconf
function showProfile (req, res, showprofile) {
// …
req.model.end(function (er, m) {
var td = { showprofile: showprofile
, profile: req.model.profile
, fields: showprofile.fields
, title: showprofile.name
, hiring: req.model.whoshiring
, packages: req.model.packages
, starred: req.model.starred
}
res.template('profile.ejs', td)
})
}
Slide 38
Slide 38 text
@rockbot #scriptconf
vs
Slide 39
Slide 39 text
@rockbot #scriptconf
Slide 40
Slide 40 text
@rockbot #scriptconf
TESTING
Slide 41
Slide 41 text
@rockbot #scriptconf
tests?
Slide 42
Slide 42 text
@rockbot #scriptconf
(hapi ecosystem
test framework)
Slide 43
Slide 43 text
@rockbot #scriptconf
(selenium wrapper)
Slide 44
Slide 44 text
@rockbot #scriptconf
Slide 45
Slide 45 text
@rockbot #scriptconf
node-tap
Slide 46
Slide 46 text
@rockbot #scriptconf
WHAT’S NEXT?
Slide 47
Slide 47 text
@rockbot #scriptconf
clean up
Slide 48
Slide 48 text
@rockbot #scriptconf
grow the team
Slide 49
Slide 49 text
@rockbot #scriptconf
adapt
Slide 50
Slide 50 text
@rockbot #scriptconf
npm
loves you
Slide 51
Slide 51 text
Raquel Vélez
@rockbot
http://rckbt.me
raquel@ js.com