# Get started with TensorFlow.js

TensorFlow.js is a JavaScript library for training and deploying machine
learning models in the web browser and in Node.js. This tutorial shows you how
to get started with TensorFlow.js by training a minimal model in the browser and
using the model to make a prediction.

The example code is available on
[GitHub](https://github.com/tensorflow/tfjs-examples/tree/master/getting-started).

## Prerequisites

To complete this tutorial, you need the following installed in your development
environment:

- Node.js ([download](https://nodejs.org/en/download/))
- Yarn ([install](https://yarnpkg.com/en/docs/install))

## Install the example

Get the source code and install dependencies:

1. Clone or download the [tfjs-examples](https://github.com/tensorflow/tfjs-examples) repository.
2. Change into the `getting-started` directory: `cd tfjs-examples/getting-started`.
3. Install dependencies: `yarn install`.

If you look at the `package.json` file, you might notice that TensorFlow.js is
not a dependency. This is because the example loads TensorFlow.js from a CDN.
Here's the complete HTML from
[`index.html`](https://github.com/tensorflow/tfjs-examples/blob/master/getting-started/index.html):

    <html>
      <head>
        <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@latest"> </script>
      </head>
      <body>
        <h4>Tiny TFJS example<hr/></h4>
        <div id="micro-out-div">Training...</div>
        <script src="./index.js"> </script>
      </body>
    </html>

The `<script>` element in the head loads the TensorFlow.js library, and the
`<script>` element at the end of the body loads the machine learning script.

For other ways to take a dependency on TensorFlow.js, see the
[setup tutorial](https://www.tensorflow.org/js/tutorials/setup).

## Run the example

Run the example and check out the results:

1. In the `tfjs-examples/getting-started` directory, run `yarn watch`.
2. Navigate to `http://127.0.0.1:1234` in your browser.

You should see a page title and beneath that a number like **38.31612014770508**.
The exact number will vary, but it should be close to 39.

## What just happened?

When
[`index.js`](https://github.com/tensorflow/tfjs-examples/blob/master/getting-started/index.js)
is loaded, it trains a
[`tf.sequential`](https://js.tensorflow.org/api/latest/#sequential) model using
$ x $ and $ y $ values that satisfy the equation $ y = 2x - 1 $.

    // Create a simple model.
    const model = tf.sequential();
    model.add(tf.layers.dense({units: 1, inputShape: [1]}));

    // Prepare the model for training: Specify the loss and the optimizer.
    model.compile({loss: 'meanSquaredError', optimizer: 'sgd'});

    // Generate some synthetic data for training. (y = 2x - 1)
    const xs = tf.tensor2d([-1, 0, 1, 2, 3, 4], [6, 1]);
    const ys = tf.tensor2d([-3, -1, 1, 3, 5, 7], [6, 1]);

    // Train the model using the data.
    await model.fit(xs, ys, {epochs: 250});

Then it predicts a $ y $ value for the unseen $ x $ value `20` and updates the
DOM to display the prediction.

    // Use the model to do inference on a data point the model hasn't seen.
    // Should print approximately 39.
    document.getElementById('micro-out-div').innerText =
        model.predict(tf.tensor2d([20], [1, 1])).dataSync();

The result of $ 2 \* 20 - 1 $ is 39, so the predicted $ y $ value should be
approximately 39.

## What's next

This tutorial provided a minimal example of using TensorFlow.js to train a model
in the browser. For a deeper introduction to training models with JavaScript,
see the TensorFlow.js [guide](https://www.tensorflow.org/js/guide).

## More ways to get started

Here are more ways to get started with TensorFlow.js and web ML.

### Watch the TensorFlow.js web ML course

If you're a web developer looking for a practical introduction to web ML, check
out the Google Developers video course Machine Learning for Web Developers. The
course shows you how to use TensorFlow.js in your websites and applications.

[Go to the web ML course](https://youtube.com/playlist?list=PLOU2XLYxmsILr3HQpqjLAUkIPa5EaZiui)

### Code ML programs without dealing directly with tensors

If you want to get started with machine learning without managing optimizers or
tensor manipulation, then check out the ml5.js library.

Built on top of TensorFlow.js, the ml5.js library provides access to machine
learning algorithms and models in the web browser with a concise, approachable
API.

[Check Out ml5.js](https://ml5js.org)

### Install TensorFlow.js

See how to install TensorFlow.js for implementation in the web browser or
Node.js.

[Install TensorFlow.js](https://www.tensorflow.org/js/tutorials/setup)

### Convert pretrained models to TensorFlow.js

Learn how to convert pretrained models from Python to TensorFlow.js.

[Keras Model](https://www.tensorflow.org/js/tutorials/conversion/import_keras)
[GraphDef Model](https://www.tensorflow.org/js/tutorials/conversion/import_saved_model)

### Learn from existing TensorFlow.js code

The `tfjs-examples` repository provides small example implementations for
various ML tasks using TensorFlow.js.

[View tfjs-examples on GitHub](https://github.com/tensorflow/tfjs-examples)

### Visualize the behavior of your TensorFlow.js model

`tfjs-vis` is a small library for visualization in the web browser intended
for use with TensorFlow.js.

[View tfjs-vis on GitHub](https://github.com/tensorflow/tfjs/tree/master/tfjs-vis)
[See Demo](https://storage.googleapis.com/tfjs-vis/mnist/dist/index.html)

### Prepare data for processing with TensorFlow.js

TensorFlow.js has support for processing data using ML best practices.

[View Documentation](https://js.tensorflow.org/api/latest/#Data)