Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

What is proper way to store code/functions that are used by both the frontend and backend?

My frontend Reactjs app is stored in one repository.
My backend Node.js app is stored in another repository.

There are some functions used by both. Where should store those functions so that both repositories can access them?

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

>Solution :

You can create a library that exports all of the functions you’ll be needing, then publish it to NPM and add it to the dependencies of both projects’ package.json. With NPM you can set your packages as private, too, in case you don’t want your code/package to be publicly available.

The starting point would be to create a directory with all the functions you need, export them all in an index.js, and run npm init to create a package.json for your new project. You’ll be guided for naming and assigning a version number, then publish with npm publish (you may need to create an account and run npm login first). Then in your frontend and backend projects you simply npm install <your-package> like any other npm package.

Your project directory may be as simple as…

myFunctions.js
index.js
package.json

myFunctions.js:

export const functionA = () => {
  return "a"
}

export const functionB = () => {
  return "b"
}

index.js:

export * from './myFunctions.js'

package.json (can be created with npm init:

{
  "name": "my-functions",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}

Then in the directory run npm publish, and in your other projects you can run npm install my-functions.

And finally, in your other projects:

import { functionA } from 'my-functions';

// ...

functionA() // returns "a"
Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading