Skip to content

Nx monorepo setup with React Native, and Next.js (utilizing RN Web).

License

Notifications You must be signed in to change notification settings

egueiros/nx_rn_next_monorepo

Repository files navigation

Workspace

👋 🙌 👌

This us a boilerplate workspace that uses Nx and includes a React Native and a Next.js that has been setup to be used with RN Web

This repo is meant to be instructional as well, therefore the work has been broken down in branches so you can see incremental updates.

Branches

Checkout the step3 branch for the final result.

  • The main branch is the starting point. It contains both apps but they don't share any resource.
  • The step2 branch contains the work done for RN Web to work in the Next.js app.
  • The step3 branch contains a home feature and a button component in a shared library used by both apps.

Start the app

  • To start the development server run yarn nx serve web. Open your browser and navigate to http://localhost:4200/.
  • To start the mobile app run yarn nx run mobile, this will start the metro bundler.

Generate code

If you happen to use Nx plugins, you can leverage code generators that might come with it.

Run nx list to get a list of available plugins and whether they have generators. Then run nx list <plugin-name> to see what generators are available.

Learn more about Nx generators on the docs.

Running tasks

To execute tasks with Nx use the following syntax:

nx <target> <project> <...options>

You can also run multiple targets:

nx run-many -t <target1> <target2>

..or add -p to filter specific projects

nx run-many -t <target1> <target2> -p <proj1> <proj2>

Targets can be defined in the package.json or projects.json. Learn more in the docs.

Want better Editor Integration?

Have a look at the Nx Console extensions. It provides autocomplete support, a UI for exploring and running tasks & generators, and more! Available for VSCode, IntelliJ and comes with a LSP for Vim users.

Ready to deploy?

Just run nx build demoapp to build the application. The build artifacts will be stored in the dist/ directory, ready to be deployed.

Set up CI!

Nx comes with local caching already built-in (check your nx.json). On CI you might want to go a step further.

Connect with us!

About

Nx monorepo setup with React Native, and Next.js (utilizing RN Web).

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published