illustration for Scale React Development with Nx

Scale React Development with Nx

1h 40m closed-captioning
Updated 2 months ago
Star icon$$$
Star icon$$$
Star icon$$$
Star icon$$$
Star icon$$$
4.7
104
people completed
Bookmark
Download
RSS

On the surface, starting a project sounds easy. First you make some directories, install some dependencies, then you write some code.

But there's a bit more to it than just those three steps.

The type of project you're working on impacts the decisions you make. It gets more complicated when you're working on multiple projects that are related. For example, maybe you have a customer-facing frontend app, an admin dashboard app, and a single backend used for both.

How does this change your directory structures? How should you share code between projects? What happens when you add a Design System into the mix?

It can get hard to keep things straight in your head.

Nx is a tool that aims to solve these problems for you, whether you're working solo on a small full-stack app or on a dev team of thousands.

It's not just an opinionated folder structure. When you create an app with Nx, it generates unit and e2e test setups as well as preparing bundling and code-splitting with Webpack, and stubbing out common features like routing.

One of the coolest features of Nx is its Dependency Graph. The graph can visually show you the relationship between the parts of your application, and is optimized to ensure that compiling, testing, and linting only happens in the affected areas of your project.

In this course, Juri Strumpflohner demonstrates these features and more through the iterative creation of a React + Storybook + Express app. Don't worry if this isn't your preferred stack! Nx supports the most popular frameworks & libraries on the web.

More importantly, the focus of this course is more on the workflow than the implementation.

Watch Juri's course, and see if the Nx tooling & workflow is right for you and your team!

Free Community Resource

A Community Resource means that it’s free to access for all. The instructor of this lesson requested it to be open to the public.

Listen to Juri Strumpflohner tell you about this course:

What you'll learn

  • Generating projects from scratch with Nx
  • Add Storybook to a React app
  • Creating & sharing libraries between apps
  • Generating a backend API with a proxy for local development
  • Exploring an app's relationships via the Dependency Graph visualizer
  • Preparing for unit testing with Jest and e2e testing with Cypress

Prerequisites

  • Command line familiarity
  • Node.js & npm installed
  • Familiarity with React & Express will be helpful

Learner Reviews

  • Jaygiri
    2 months ago
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    What did you like about this course?

    This is a perfect course!

    I was totally new to NX and after going through this course now I am ready to try NX.

    This course is perfectly designed and edited. It has everything I wanted to know about managing projects with NX.

    Thank you Juri for the awesome course.

    If possible I would like to see two more points covered:

    1. NX with NextJS
    2. List of other items that you have not covered here but I should take a look before using NX.
  • Richard Romberg
    3 months ago
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    What did you like about this course?

    Juri brings the benefits of Nx perfectly to the point. He addresses all topics and provides a suitable example without a lot of frills.

  • Learner
    3 months ago
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    What did you like about this course?

    he show the code and explaing each step

  • Ernst Salzmann
    3 months ago
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    What did you like about this course?

    short and sweet but still comprehensive!

  • Rich
    4 months ago
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    What did you like about this course?

    The right level of detail and quick pace

  • David
    4 months ago
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    What did you like about this course?

    I liked the content and the sequence of the lessons in order to explain how powerful this tool is. I liked the pace as well. Thanks, Juri!

Course Content

1h 40m • 24 lessons

    You might also like these resources:

    illustration for Introduction to Cloudflare Workers

    Introduction to Cloudflare Workers

    Kristian Freeman・36m・Course

    Become familiar with the Workers CLI wrangler that we will use to bootstrap our Worker project. From there you'll understand how a Worker receives and returns requests/Responses. We will also build this serverless function locally for development and deploy it to a custom domain.

    illustration for Create an eCommerce Store with Next.js and Stripe Checkout

    Create an eCommerce Store with Next.js and Stripe Checkout

    Colby Fayock・1h 4m・Course

    This is a practical project based look at building a working e-commerce store using modern tools and APIs. Excellent for a weekend side-project for your developer project portfolio

    illustration for Practical Git for Everyday Professional Use

    Practical Git for Everyday Professional Use

    Trevor Miller・1h・Course

    git is a critical component in the modern web developers tool box. This course is a solid introduction and goes beyond the basics with some more advanced git commands you are sure to find useful.