Best NPM Packages used by MERN Stack Developers in their real projects in 2020

When you want to start the coding with MERN stack as a beginner, you will find that a lot of developers recommend in their tutorials some packages that are used to develop their own projects, but a lot of new developers get confused especially when it come to choose between all these bunch of packages, but they don’t put some criteria when they want to choose best Recommended tools for their own projects.

in this article we will try to show the best tools for developing awesome MERN Stack Applications, and also you will see packages of each stack (Front, Back, Testing, Security, Dev-ops).

Some criteria to put in mind before choosing between all these packages :

Package Support : make sure that all these needed tools are having a great technical support that will help you to find a lot of solution for your possible problems.

Package Documentation : a lot of packages, especially in MERN Stack are having a great documentation, even a noob could read it and get knowledge from it.

Github Repos : make sure that these tools are having a lot stars in github, and are not having a lot of issues and vulnerabilities, also you should check if the packages are maintained. and package size is acceptable.

React packages :

Axios : is a promise based package to send HTTP Request, also you could send Asynchronously requests to your server-side, and also you can use it in the server-side.

link : https://github.com/axios/axios

Reactstrap : is a package for the bootstrap components for react javascript framework

link : https://reactstrap.github.io/

Yup : Yup is a JavaScript schema builder for value parsing and validation. Define a schema, transform a value to match, validate the shape of an existing value, or both. Yup schema are extremely expressive and allow modeling complex, interdependent validations, or value transformations.

link : https://github.com/jquense/yup

Formik : a package for creating react form easily

link : https://formik.org/docs/overview

React Router : is a routing library, for client-side routing dynamically.

link : https://reactrouter.com/

Redux : is a state management react package, for storing data in root state and access it via other react UI components.

link : https://redux.js.org/

jwt-decode : is a library for decoding the jsonwebtoken into json format and get data from it.

link : https://github.com/auth0/jwt-decode

moment : is package for date and time formating

link : https://momentjs.com/

redux-thunk : Thunk middleware for Redux.

link : https://github.com/reduxjs/redux-thunk

classnames : is a package for joining classnames in your javascript code.

link : https://github.com/JedWatson/classnames

react-moment : is a package for date react component.

link : https://github.com/headzoo/react-moment

Node.js packages for server-side :

concurrently : Run multiple commands concurrently. Like npm run watch-js & npm run watch-less but better.

link : https://github.com/kimmobrunfeldt/concurrently

bodyparser : Node.js body parsing middleware. Parse incoming request bodies in a middleware before your handlers, available under the req.body property.

link : https://github.com/expressjs/body-parser

express : Fast, unopinionated, minimalist web framework for node.

link : http://expressjs.com/

express-validator : An express.js middleware for validator.

link : https://express-validator.github.io/

nodemon : nodemon is a tool that helps develop node.js based applications by automatically restarting the node application when file changes in the directory are detected.

link : http://nodemon.io/

mongoose : Mongoose is a MongoDB object modeling tool designed to work in an asynchronous environment. Mongoose supports both promises and callbacks.

link : https://mongoosejs.com/

cors : CORS is a node.js package for providing a Connect/Express middleware that can be used to enable CORS with various options.

link : https://github.com/expressjs/cors

passport : Passport is Express-compatible authentication middleware for Node.js.

link : http://passportjs.org/

bcryptejs : Optimized bcrypt in JavaScript with zero dependencies. Compatible to the C++ bcrypt binding on node.js and also working in the browser.

link : https://github.com/dcodeIO/bcrypt.js

jsonwebtoken : An implementation of JSON Web Tokens.

link : https://github.com/auth0/node-jsonwebtoken

dot-env : By requiring dot-env into your source, your current working directory is scanned for a .env.json file to merge into your process.env runtime variables.

link : https://github.com/supershabam/dot-env

config : Node-config organizes hierarchical configurations for your app deployments.

link : http://lorenwest.github.com/node-config

gravatar : is package for generating gravatar url in nodejs Based on gravatar specs

link : https://github.com/emerleite/node-gravatar

validate : is package for validate javascript objects

link : https://validatejs.org/

multer : Multer is a node.js middleware for handling multipart/form-data, which is primarily used for uploading files.

link https://github.com/expressjs/multer

Server-side Security :

cookie-parser : Parse Cookie header and populate req.cookies with an object keyed by the cookie names. Optionally you may enable signed cookie support by passing a secret string, which assigns req.secret so it may be used by other middleware.

link : https://github.com/expressjs/cookie-parser

xss-clean : Node.js Connect middleware to sanitize user input coming from POST body, GET queries, and url params. Works with Express, Restify, or any other Connect app.

link : https://github.com/jsonmaur/xss-clean

express-rate-limit : Basic rate-limiting middleware for Express. Use to limit repeated requests to public APIs and/or endpoints such as password reset.

link : https://github.com/nfriedly/express-rate-limit

mongo-sanitize : For the passionately lazy, a standalone module that sanitizes inputs against query selector injection attacks

link : https://github.com/vkarpov15/mongo-sanitize

Testing packages :

jasmine : Jasmine is an open-source testing framework for JavaScript

link : https://jasmine.github.io/

jest : Jest is a JavaScript testing framework maintained by Facebook.

link : https://jestjs.io/

mocha : Mocha is a JavaScript test framework for Node.js programs, featuring browser support, asynchronous testing, test coverage reports, and use of any assertion library.

link : https://mochajs.org/

chai : is a BDD / TDD assertion library for nodejs and the browser that can be delightfully paired with any javascript testing framework.

link : https://www.chaijs.com/

cypress : Fast, easy and reliable testing for anything that runs in a browser. Install Cypress in seconds and take the pain out of front-end testing.

link : https://www.cypress.io/

cucumber : is a tool for running automated tests written in plain language. Because they’re written in plain language, they can be read by anyone on your team.

link : https://cucumber.io/docs/installation/javascript/

istanbul : instruments your ES5 and ES2015+ JavaScript code with line counters, so that you can track how well your unit-tests.

link : https://istanbul.js.org/

karma : The main goal for Karma is to bring a productive testing environment to developers.

link : https://karma-runner.github.io/latest/index.html

enzyme : is a JavaScript Testing utility for React that makes it easier to test your React Components’ output.

link : https://github.com/enzymejs/enzyme

sinon : Standalone test spies, stubs and mocks for JavaScript. Works with any unit testing framework.

link : https://sinonjs.org/

phantom : is a headless web browser scriptable with JavaScript. It runs on Windows, macOS, Linux, and FreeBSD. Using QtWebKit as the back-end

link : https://phantomjs.org/

nightwatch : Write efficient end-to-end tests in Node.js and run them against W3C WebDriver.

link : https://nightwatchjs.org/

some Dev-ops Tools for MERN Stack Apps :

git : is a distributed version-control system for tracking changes in source code during software development.

link : https://git-scm.com/

github : GitHub, Inc. is an American multinational corporation that provides hosting for software development and version control using Git

link : https://www.github.com/

docker : Docker is a set of platform as a service products that use OS-level virtualization to deliver software in packages called containers.

link : https://www.docker.com/

kubernetes : is an open-source container-orchestration system for automating computer application deployment.

link : https://kubernetes.io/

heroku-cli : command line for deploying and managing your applications.

link : https://devcenter.heroku.com/articles/heroku-cli

circleCI : Get the best continuous integration and delivery platform for Linux, macOS, and Android, in the cloud or self-hosted.

link : https://circleci.com/

sources : wikipedia, npmjs, github, google.