GithubHelp home page GithubHelp logo

npm-workshop's Introduction

npm guide

Pre-workshop

Slides

Slides link

login

As we are going to publish packages into npm and we don't want to polute our company account, start by logging out:

npm logout

Login back into npm:

npm login

Checkout that you are logged in as npm-workshop by executing

npm whoami

Workshop

Exercise 1: Create a package.json file

We want to publish our addition module, therefore we need a package.json file. Create one.

After it's done, change the name property inside the package.json file in order to avoid collitions. For example, use your name initials (Bart Simpson would rename the package as addition-module-bs)

Exercise 2: Install dependencies and run scripts

We want to make sure that our test are working (npm run test fails right now). Install the jest dependency, which is our chosen javascript testing framework and edit the test script so it launches jest.

Bonus: run jest without using npm run

Exercise 3: Basic info about installed packages

After installing your fist dependency, the node_modules folder and the package-lock.json file have been created. Check what jest version has been installed without opening the package.json file

Exercise 4: Publish a package

After being able to check that our test works we feel confident enough to publish our first npm module. Checkout the log after running npm publish

Exercise 5: Use published package

Create a new project, execute npm init -y, install your recent published package and create a index.js file that requires the addition-module and uses it. Run it and checkout that it works

Exercise 6: Link packages

Add a new call to adds a third param to our exported function. Iterate our addition package so it is able to add 3 arguments. Link the packages so you are able to test it locally

Bonus: check out what happens if you unlink the addition-module and run you code

Exercise 7: Publish betas

Publish the recent changes to your addition-module as beta and install this version in your new module


Solutions

Exercise 1 solution

npm init -y

Change the name to addition-module-[your name initials]

{
  "name": "addition-module-jg",
  "version": "1.0.0",
  "description": "",
  "main": "sum.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "[email protected]:julian-gernun/workshop-npm.git"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

Exercise 2 solution

npm i --save-dev jest

Modify the test script inside the package.json file

{
  "name": "addition-module-jg",
  "version": "1.0.0",
  "description": "",
  "main": "sum.js",
  "scripts": {
    "test": "jest"
  },
  "repository": {
    "type": "git",
    "url": "[email protected]:julian-gernun/workshop-npm.git"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "jest": "^26.1.0"
  }
}
npm run test

// runs jest test

Bonus

npx jest

Exercise 3 solution

npm ls jest

Exercise 5 solution

mkdir new-module
cd new-module
npm init -y
npm install addition-module-jg
// index.js
const sum = require("addition-module-jg");

console.log(sum(1, 2));
// output: 3
// package.json
{
  "name": "use-addition-module",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "addition-module-jg": "^1.0.0"
  }
}

Exercise 6 solution

// index.js
const sum = require("addition-module-jg");

console.log(sum(1, 2, 3));
// output: 3
npm link # in the addition-module-jg folder
npm link addition-module-jg # in our new module folder
node index.js
// output: 6

Bonus

npm unlink addition-module-jg

Execution breaks as the package has been removed completely

Exercise 7 solution

npm version 1.0.0-beta.0 # in the addition-module-jg folder
// new module's package.json
{
  ...
  "dependencies": {
    "addition-module-jg": "beta"
  }
}
npm install # in the new module's folder

npm-workshop's People

Contributors

jcger avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.