☂️ Improve React Native onboarding experience

Description

Hi everyone!

This is an umbrella issue to collect a set of tasks aimed to improve the React Native onboarding experience. Onboarding experience as part of the DX pillar aims to improve user workflows like :

• creating or starting their first React Native app;
• trying out built-in React Native APIs for the first time;
• installing their first third-party package in a React Native project;
• collaborating on a React Native project with others for the first time;
• setting up a new machine to work on an existing React Native app

We believe that everyone would benefit by improving the core developer experience, hence this umbrella issue to help us cleanup and restructure some of our codebase.

How to Test

It’s crucial that you test the changes you submit. The proper way of doing this is:

1. Build cli codebase using : node ./scripts/build.js && yarn build:debugger
2. Link the cli-doctor using : yarn link
3. In the example React Native app(Awesome Project), run yarn link "@react-native-community/cli-doctor"
4. Run the CLI Doctor using : npx @react-native-community/cli doctor

The Tasks

The following is a list of tasks we think might aid the bootstrapping experience of React Native. The list is a living one: the more we improve with the situation, the more patterns we can discover. Whenever we found some pattern that we can add, we will attach this to the list.

If you want to tackle some specific task which is not listed, feel free to post a comment with a brief description of the task and I'll make sure to add it to the list of tasks so it is tracked.

Please comment below if you're willing to take the stance on any of those task and wait for a confirmation before start working on it. Please note that if you claim a task, but don't submit a PR within 2 week, we're going to free up that task for someone else.

• feat : Custom Adb ports #1864

cli-doctor :

• feat : detect wrong app dependencies #1848
  Assigned to @tarunrajput Commit https://github.com/react-native-community/cli/pull/1983/commits/ce0ae4ca7f9c6e87b832e4c297801f8d5db92e6d
• Java version check in versionRanges should be [11 - 18] (i.e. 19 is not supported).
  Assigned to @tarunrajput Commit https://github.com/react-native-community/cli/pull/1940/commits/06ffb36e989110a353f77d1934662d38a14306d0
• Node version check in versionRanges should be >= 18.
  Assigned to @Shubham1429 Commit https://github.com/react-native-community/cli/commit/be7e6e2e747b62c9cb72bbc9bf9ea53d34630a60
• feat : doctor should detect & report if packager is running correctly :
  https://github.com/react-native-community/cli/blob/main/packages/cli-tools/src/isPackagerRunning.ts
  Assigned to @tarunrajput Commit https://github.com/react-native-community/cli/commit/a2e90fd10c5397e273ca831b45d69650ee37e936
• fix : Gracefully handle errors in doctor in case of TODOs
  https://github.com/react-native-community/cli/blob/16ec7a39514b8ccfea682c843dfbd1f7cad4bf7e/packages/cli-doctor/src/tools/runAutomaticFix.ts#L96-L98
  https://github.com/react-native-community/cli/blob/16ec7a39514b8ccfea682c843dfbd1f7cad4bf7e/packages/cli-doctor/src/commands/doctor.ts#L257-L260
  Assigned to @jeferson-sb Commit https://github.com/react-native-community/cli/commit/4650a8d41c5f9851e0f6bf5939a1bd8f4326c990
• Have CLI doctor check permissions on gradlew script #2127

Open ended discussions :

• Reduce “Installing Bundler” step noise

During the “Installing Bundler” step, seemingly unnecessary warnings are printed, e.g.
error Ignoring unf_ext-0.0.7.6 because its extensions are not built. Try: gem pristine unf_ext —version 0.0.7.6. This distracts from the actionable parts of init’s output. Reported in #1832

• Investigate the build output reported by Gradle to "beautify" the error message for the user in CLI

Start by reviewing the linked task issues, especially the CLI Doctor work and the open-ended discussions. Build the CLI with node ./scripts/build.js && yarn build:debugger, link @react-native-community/cli-doctor, and run npx @react-native-community/cli doctor in the example app. Done means completing one confirmed task and verifying its onboarding impact.