Smart, Extensible Build Framework

Nx helps architect, test, and build at any scale:

integrations with modern frameworkscomputation cachingsmart rebuilds of affected projectsdistributed task executionpowerful code generatorseditor supportGitHub appsand more.

Get Started

/workspace ➜

npx create-nx-workspace ludicrous-narwhals

What to create in the new workspace react [a workspace with a single React application]

❯

empty [an empty workspace with a layout that works best for building apps]
react [a workspace with a single React application]
angular [a workspace with a single Angular application]
next.js [a workspace with a single Next.js application]
nest [a workspace with a single Nest application]
express [a workspace with a single Express application]
web components [a workspace with a single app built using web components]
(Use arrow keys)

Application name tuxboard

Default stylesheet format styled-components [https://styled-components.com]

❯

CSS
SASS(.scss) [https://sass-lang.com]
Stylus(.styl)[https://stylus-lang.com]
LESS [https://lesscss.org]
styled-components [https://styled-components.com]
emotion [https://emotion.sh]
styled-jsx [https://www.npmjs.com/package/styled-jsx]
(Use arrow keys)

Use Nx Cloud? (It's free and doesn't require registration.) Yes

❯

Yes
No
(Use arrow keys)

NX Nx is creating your workspace. To make sure the command works reliably in all environments, and that the preset is applied correctly, Nx will run "yarn install" several times. Please wait.

Creating your workspace

NX SUCCESS Nx has successfully created the workspace.

NXNOTE First time using Nx? Check out this interactive Nx tutorial.
https://nx.dev/react/tutorial/01-create-application
Prefer watching videos? Check out this free Nx course on Egghead.io.
https://egghead.io/playlists/scale-react-development-with-nx-4038

Powering leading companies like

Best-in-Class Support for Monorepos

Nx builds a project graph by analyzing your workspace, which it then uses to only rebuild what is necessary and to never run the same computation twice. Nx also helps establish structured code sharing and ownership management to keep the workspace maintainable.

Smart rebuilds

Nx only rebuilds and retests what is affected by your change.

Project graph

Nx analyzes your workspace to improve performance and developer experience.

Distributed task execution

Nx distributes any command across multiple machines without any configuration.

Computation caching

Nx never rebuilds or tests the same code twice.

Easy code sharing

Nx simplifies extracting and refactoring shared libraries.

Ownership management

Nx statically enforces the separation of shared and app-specific code.

Integrated Development Experience

Nx provides a modern integrated dev experience. It has a high-quality VS Code plugin, interactive visualizations, GitHub integration and more.

Editor plugins

Nx-aware autocompletion and refactoring.

GitHub & CI

Searchable and filterable CI outputs, analytics, and more.

Powerful code generation

Nx automates repeatable tasks and refactorings.

Interactive visualizations

An evergreen architecture diagram to help explore and understand your workspace.

Workspace generators

Nx helps enforce best practices and organizational standards.

Nx Devkit

Nx enables a custom dev experience to match the needs of your organization.

Rich Plugin Ecosystem

The core of Nx is generic, simple, and unobtrusive. Nx Plugins are completely optional, but they can really level up your productivity.

Plugins for everything

React, React Native, Angular, NativeScript, Cypress, Nest.js, Storybook, Ionic, Go among others.

Consistent DX

Nx improves dev mobility, experimentation and collaboration.

Automatic upgrades.

Nx updates your source code to work with the newest versions of popular tools.

Repeatable migrations

Nx enables large scale refactorings.

Large community

A community of more than 600k developers, doubling every year.

Open source

MIT-licensed, clear roadmap and transparency.

Monorepo done right

Works for Projects of Any Size

Whether you have one project or one thousand, Nx will keep your CI fast and your workspace maintainable.

Build and Test Only What is Affected

Nx is smart. It analyzes your workspace and figures out what can be affected by every code change. That's why Nx doesn't rebuild and retest everything on every commit - it only rebuilds what is necessary.

Learn about "nx affected"

/workspace ➜

nx affected:test --parallel

> NXNOTE Affected criteria defaulted to --base=master --head=HEAD

> NX Running target test for 3 project(s):
- nx-dev
- nx-dev-ui-common
- nx-dev-feature-doc-viewer
———————————————————————————————————————————————
> nx run nx-dev:test RUNS nx-dev
RUNS nx-dev nx-dev/nx-dev/specs/index.spec.tsx

Explore Visually

Nx comes with an interactive dependency diagram to help explore and understand your workspace.

Learn about "nx dep-graph"

Visual Studio Code Plugin

Nx Console adds Nx-aware autocompletion and code lenses. It helps you generate components in folders, refactor your projects, construct commands, and much more.

Install Nx Console

Next Gen Cloud Support

Share links with your teammates where everyone working on a project can examine detailed build logs and get insights about how to improve your project and build.

Enable Nx Cloud

Nx is Fast

Nx uses its distributed task execution and computation caching to keep your CI time the same, whether you build one project or a thousand.

Up to

0 x

reduction in CI time for mid-size projects with standard CI setups

Up to

0 x

reduction in CI time for large projects with standard CI setups

Up to

0 %

reduction in CI time for large projects with highly-optimized distributed CI setups

Average

0.0 x

reduction in computation time

Open Platform

The core of Nx is generic, simple, and unobtrusive. Nx Plugins are completely optional, but they can really level up your productivity.You can use Nx with any technology either by using Nx Core or by using of one of many Nx plugins.

Getting Started

TypeScript, React, Angular, Node and more

Nx has first-class support for many frontend and backend technologies, so its documentation comes in multiple flavours.

Create a TypeScript/JavaScript Workspace with Nx

Create an empty workspace where you can create TypeScript or JavaScript projects. You can build/test/lint them either yourself or using Nx plugins.

TypeScript/JavaScript (follow our Nx Core tutorial)

Lerna migration

Follow this guide to migrate from Lerna to Nx

migration/lerna-yarn-pnpm

Free Courses and Videos

For visual learners we have created high-quality courses walking you through building real-world examples step by step.

Scale React Developmentwith Nx

Free course on egghead.io

Start learning now

A dedicatedYoutube Channel

Get the latest news and video tutorials for free. Like and subscribe, you know the drill.

Check the Nx Youtube channel

Premium coursesto know everything

We recorded a complete set of courses to make sure you will be proficient as fast as possible. They cover all the Nx features to take control of your workspace.

Check the courses on NxPlaybook

Community

Used by Popular Open Source Projects

Nx works equally well for the teams building apps and for the communities building open source libraries and tools.

Smart, Extensible Build Framework

Nx helps architect, test, and build at any scale:

Best-in-Class Support for Monorepos

Integrated Development Experience

Rich Plugin Ecosystem

Monorepo done right

Build and Test Only What is Affected

Explore Visually

Visual Studio Code Plugin

Next Gen Cloud Support

Nx is Fast

Open Platform

Getting Started

Create a TypeScript/JavaScript Workspace with Nx

TypeScript/JavaScript (follow our Nx Core tutorial)

Scale React Developmentwith Nx

A dedicatedYoutube Channel

Premium coursesto know everything

Community

Storybook

FluentUi (Microsoft)

NgRx

NativeScript

Typescript eslint

HomeBridge UI

NGX Bootstrap

WooCommerce