ML in JavaScript
Tags: javascript, machinelearning, react
Published: 2022-11-07 21:22:22

Learning machine learning in Python might be reasonable if you are first in machine learning. Python's eco-environment is plentiful, and the community is widespread.

Building machine learning models in JavaScript is beneficial, especially in mono-language application systems like React.js and Node.js run in JavaScript; no need to make another backend server in Python.

"TensorFlow.js" is a popular library for machine learning in JavaScript, able to use ML directly in the browser or Node.js.

**Step 1 - Set Up a Node** 

Initialize the Project
```
$ npm init -y
```
Configure the TypeScript Compiler
```
npm install --save-dev typescript
```
Install ambient Node.js types for TypeScript
```
npm install @types/node --save-dev
```
Install the pure JavaScript version
```
npm install @tensorflow/tfjs
```
Create a tsconfig.json file
```
touch tsconfig.json
```
Add following JSON to tsconfig.json
```
{
  "compilerOptions": {
    "module": "commonjs",
    "esModuleInterop": true,
    "target": "es5",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "sourceMap": true,
    "rootDir": "src",
    "outDir": "dist",
    "allowJs": true,
    "strict": true,
    "noImplicitAny": true,
    "skipLibCheck": true,
  },
  "lib": ["es6"]
}
```
Create a Minimal TypeScript Express Server
```
npm install --save express
npm install -save-dev @types/express
```
Install Environment Variables
```
npm install dotenv --save
```
Create a file called .env
```
NODE_ENV = development
PORT = 3000
```
create an src folder in the root directory
```
mkdir src
```
create a TypeScript file named index.ts
```
touch src/index.ts
```
Open up the index.ts file and paste in the following code snippet
```
import express from 'express';
const app = express();

if (process.env.NODE_ENV !== 'production') {
  require('dotenv').config();
}

const port = parseInt(process.env.PORT) || 3000;

app.get('/', (req, res) => {
  res.send('Hello World!');
});

app.listen(port, () => {
  return console.log(`Express is listening at http://localhost:${port}`);
});
```
Install nodemon
```
npm install --save-dev ts-node nodemon
```
Add a nodemon.json config
```
{
  "watch": ["src"],
  "ext": ".ts,.js",
  "ignore": [],
  "exec": "ts-node ./src/index.ts"
}
```
Add a script to package.json
```
"start:dev": "nodemon",
```
Run the server
```
npm run start:dev
```
Install rimraf, a cross-platform tool
```
npm install --save-dev rimraf
```
Add a script to package.json
```
"build": "rimraf ./build && tsc",
"start": "npm run build && node build/index.js"
```
Install ESLint
```
npm install --save-dev eslint @typescript-eslint/parser @typescript-eslint/eslint-plugin
```
Create a .eslintrc file
```
touch .eslintrc
```
Add a JSON to .eslintrc
```
  "root": true,
  "parser": "@typescript-eslint/parser",
  "plugins": [
    "@typescript-eslint"
  ],
  "extends": [
    "eslint:recommended",
    "plugin:@typescript-eslint/eslint-recommended",
    "plugin:@typescript-eslint/recommended"
  ],
  "rules": { 
    "no-console": 0
  }
}
```
Create an .eslintignore
```
touch .eslintignore
```
Add the thing to be ignored to .eslintignore
```
node_modules
dist
```
Add a script to the package.json
```
"lint": "eslint . --ext .ts",
"lint:fix": "eslint . --ext .ts --fix"
```
Run lint
```
npm run lint
```