Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Serverless Front-End Deployments using npm

Serverless Front-End Deployments using npm

What are serverless front-end deployments? How can you and your team make them a reality using the new Warehouse.ai? Presented at Node.js Interactive North America 2016.

Charlie Robbins

November 30, 2016
Tweet

More Decks by Charlie Robbins

Other Decks in Technology

Transcript

  1. app.use(express.static(‘public’)); YOUR NODE.JS APP <script src=‘/js/app.min.js’></script> YOUR INDEX.HTML ANY FRONT-END

    CHANGE STILL REQUIRES <script src=‘https://yourcdn.com/app.min.js’></script> A SERVER CHANGE
  2. UNVERSIONED THE ASSET IS <script src=‘https://yourcdn.com/app.min.js’></script> NO UNIQUE VERSION <script

    src=‘https://yourcdn.com/1.2.3/app.min.js’></script> UNIQUE VERSION – SEMVER
  3. UNVERSIONED THE ASSET IS <script src=‘https://yourcdn.com/app.min.js’></script> NO UNIQUE VERSION <script

    src=‘https://yourcdn.com/1.2.3/app.min.js’></script> UNIQUE VERSION – SEMVER <script src=‘https://yourcdn.com/a023ffe/app.min.js’></script> UNIQUE VERSION – ASSET SHA
  4. SERVERLESS DEPLOYMENTS? HOW TO APPROACH DEVELOPERS WRITE CODE ASSETS SERVERS

    GETS NEW VERSION NEW ASSETS TO APP USERS / VISITORS PUSHED TO CDN
  5. SERVERLESS DEPLOYMENTS? HOW TO APPROACH DEVELOPERS WRITE CODE ASSETS SERVERS

    GETS NEW VERSION NEW ASSETS TO APP USERS / VISITORS PUSHED TO CDN HOW DOES THE SERVER RECEIVE NEW VERSIONS?
  6. SCIENCE CAT SAYS “GOOD QUESTION” <script src=‘https://yourcdn.com/a023ffe/app.min.js’></script> HOW DOES YOUR

    APP KNOW TO SERVE THIS? <script src=‘https://yourcdn.com/b347aa0/app.min.js’></script> INSTEAD OF THIS?
  7. SCIENCE CAT SAYS “GOOD QUESTION” <script src=‘https://yourcdn.com/a023ffe/app.min.js’></script> HOW DOES YOUR

    APP KNOW TO SERVE THIS? <script src=‘https://yourcdn.com/b347aa0/app.min.js’></script> INSTEAD OF THIS? <script src=‘https://yourcdn.com/ff03598/app.min.js’></script> OR PERHAPS THIS?
  8. SERVER-LESS FRONT-END DEPLOYMENTS REQUIRES AN EXTERNAL SERVICE KNOWING WHAT VERSION(S)

    SHOULD BE RUNNING IN WHAT ENVIRONMENTS FOR ANY OR ALL LOCALES
  9. GOT IT? Great! SERVER-LESS FRONT-END DEPLOYMENTS REQUIRES AN EXTERNAL SERVICE

    KNOWING WHAT VERSION(S) SHOULD BE RUNNING IN WHAT ENVIRONMENTS FOR ANY OR ALL LOCALES
  10. NPM WIRE API NPM-REGISTRY-COUCHAPP IS STILL THE BEST DOCUMENTATION OF

    THE TRY IT YOURSELF NPM C SET LOGLLEVEL INFO
  11. { _id: 'test-publish03', name: 'test-publish03', description: 'Just a test', 'dist-tags':

    { latest: '1.0.0' }, versions: { '1.0.0': { name: 'test-publish03', version: '1.0.0', description: 'Just a test', main: 'index.js', scripts: [Object], author: '', license: 'ISC', readme: 'ERROR: No README data found!’, gitHead: 'c3a43b57be250d6debeeedefff150add7cc0c184' _id: '[email protected]', _shasum: '6e78734fff0347a9596abb5d3b0360fda6f1a899', _from: '.', _npmVersion: '3.7.1', _nodeVersion: '4.2.2', _npmUser: [Object], maintainers: [Object], dist: [Object] } }, readme: 'ERROR: No README data found!', maintainers: [ { name: 'garbage!!user', email: '[email protected]' } ], _attachments: { 'test-publish03-1.0.0.tgz': { content_type: 'application/octet-stream', data: '{{BIG-BASE64-TARBALL}}', length: 568 } } }
  12. TRIGGER A NEW BUILD PROMOTE A BUILD TO ENV ROLLBACK

    A BUILD IN ENV LIST BUILDS ACROSS ENVS
  13. TRIGGER A NEW BUILD PROMOTE A BUILD TO ENV ROLLBACK

    A BUILD IN ENV LIST BUILDS ACROSS ENVS NPM PUBLISH
  14. TRIGGER A NEW BUILD PROMOTE A BUILD TO ENV ROLLBACK

    A BUILD IN ENV LIST BUILDS ACROSS ENVS NPM PUBLISH NPM DIST-TAG ADD NPM DIST-TAG ADD
  15. TRIGGER A NEW BUILD PROMOTE A BUILD TO ENV ROLLBACK

    A BUILD IN ENV LIST BUILDS ACROSS ENVS NPM PUBLISH NPM DIST-TAG ADD NPM DIST-TAG ADD NPM DIST-TAG LS
  16. WAREHOUSE.AI ENABLES SERVERLESS-DEPLOYS OF YOUR FRONT-END CODE BY PROVIDING AUTOMATED

    BUILDS PUSHED TO ANY S3-COMPATIBLE CDN THROUGH A SIMPLE
  17. WAREHOUSE.AI ENABLES SERVERLESS-DEPLOYS OF YOUR FRONT-END CODE BY PROVIDING AUTOMATED

    BUILDS PUSHED TO ANY S3-COMPATIBLE CDN THROUGH A SIMPLE NPM-BASED WORKFLOW
  18. MAY THE SOURCE BE WITH YOU {github, twitter}.com/indexzero [email protected] THANKS.

    Q&A TIME. GITHUB.COM/GODADDY/WAREHOUSE.AI GITHUB.COM/GODADDY/CARPENTERD