Code Monkey home page Code Monkey logo

2020-04-17-personal-npm-package's Introduction

Today's Objective: A personal NPM Utility library

Prize

$25 CAD Amazon gift card + bragging rights.

Tip: Read the General Information Document for more info on how to get started and submit.

Objective

Today's objective is to build and publish a personal NPM package.

As developers learn and grow, they acquire habits. They start solving problems in tried-and-tested ways, eventually becoming very familiar with certain design patterns over others. As they work across projects, they write the same solutions over and over again, sometimes even copying-pasting old solutions from previous projects into new ones. Like fingerprints, they leave a trail of these similar design patterns behind them as they move through their careers.

Instead, wouldn't it be nice if you could just create a lightweight package that you could npm install into any project?

That is what we will do today.

Requirements

  1. Create a personal npm library.
  2. Fill it with methods you would find useful in future projects.
  3. Publish it to npm (you may have to sign up for an npm account).
  4. Demonstrate that it can be required right from npm, by building a project using Runkit or Codepen

Special requirements for today's hackathon:

Aesthetics: There is no visual component to today's project. Your score will be determined by your module's beauty. i.e. by the method names, number of parameters, whether they are functions or classes, namespaces within your package, and how lightweight the imported module is, etc.

The more methods you put in your package, the better.

Deployment:

Videos and screenshots will not be accepted. You must leave links to:

  1. Your NPM package
  2. A deployed project on Runkit or Codepen.

Your deployment options for #2 above are:

  1. Runkit - You will have to sign up and create a new notebook. See the example Runkit Notebooks.
  2. Codepen - You can import your project into Codepen using unpkg

Bonus points

Bonus points will be awarded for:

  • Creating a typescript-compatible project
  • Creating unit tests
  • Using a precompiler (only if appropriate, i.e. if you are using Typescript or Babel, or if you are creating a React library)
  • Leaving detailed instructions for local development on Readme.md
  • Writing documentation (for your future self's benefit)

Frameworks:

Any or none. You can create a personal library with just plain JavaScript. You can also create a personal library that contains common React/Vue/Angular components that you find yourself using often across projects.

Restrictions

  • Your project must use JavaScript.
  • You must follow deployment instructions above.

There are no other restrictions.

Tips for success:

  1. The project is intentionally simple so you can focus on code quality.
  2. The requirements are intentionally minimalistic so you can get as creative as you'd like.
  3. You get a LOT of time for code review comments. So you can win even if you feel your project isn't great, simply on the strength of your code review comments!
  4. Keep in mind, 33% of your score is based on aesthetic appeal!

Resources

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.