Microsoft teams work across many large codebases, often organized as monorepos with packages that depend on one another. React Native spread from Skype’s greenfield app to brownfield experiences in products such as Outlook and Teams. Teams build those experiences in their own repositories, then integrate them into host apps.
Improve all the repos – exploring Microsoft’s DevExp
Speakers
Microsoft engineers and React Native maintainers Lorenzo Sciandra and Tommy Nguyen explain how Microsoft improves React Native developer experience across many repositories at Callstack’s RNEU 2021.
Sciandra describes the challenge of developing an experience without giving every developer access to a large host app codebase or requiring lengthy builds. React Native Test App provides a local sandbox that approximates the host environment while hiding much of the native setup. Nguyen demonstrates setting it up for React Native WebView, then changing the React Native version from 0.62.3 to 0.63.4.
Nguyen introduces Dep Check, a CLI that reads package dependencies and applies curated profiles. It can correct React dependency and peer dependency configuration, suggest a compatible WebView version, and recommend a React Native upgrade. Teams can run it across a repository, apply changes with a write option, or use it in CI to report suggestions on pull requests.
Sciandra explains that shared Dep Check profiles help separate monorepos stay aligned on compatible package versions. Teams can export custom profiles for their packages and use them in other repositories. The speakers describe React Native Test App and Dep Check as open source tools available in their respective repositories.
Takeaways
- A small local test app can let library developers iterate without building a large host application.
- Centralizing native setup and upgrades can reduce repeated maintenance across teams.
- Use dependency profiles to make package compatibility rules consistent across repositories.
- Run dependency checks in CI and surface suggested fixes where developers review changes.
- Share custom compatibility profiles when multiple repositories consume the same packages.
Mentioned in this talk
Search inside this talk
What was claimed 10
- role atTommy Nguyen is principal software engineer at
Microsoft“I'm a principal software engineer at Microsoft.”
0:08inOur Journey of Making React Native a Preferred ChoiceYouTube Verified3 sources· Talk
- usesMicrosoft uses React Nativein brownfield apps
“how Microsoft is using React Native at scale”
0:09inReact Native at Scale: How Microsoft is betting big on React Native to target BILLIONS of usersYouTube Verified14 sources· Talk
- role atLorenzo Sciandra is senior software engineer atMicrosoft
“I'm a senior software engineer in the Office organization with Tommy.”
0:24inOur Journey of Making React Native a Preferred ChoiceYouTube Verified5 sources· Talk
- built
“we made this test app and a bunch of tools around it”
2:00inCommunity is stronger than everYouTube Verified4 sources· Talk
- featureReact Native Test App: Provides a local sandbox for developing and testing React Native code while hiding much of the native toolchain complexity.
“something you have locally in your codebase that replicates the environment of the final host app well enough for you to develop in isolation”
YouTube Unverified1 source· Talk
- featureReact Native Test App: Supports iOS, Android, macOS, and Windows.
“It works on iOS, Android, macOS, and Windows”
YouTube Unverified1 source· Talk
- built
“We've decided to call this tool, this antenna, Dep Check.”
YouTube Unverified1 source· Talk
- featureDep Check: Reads package dependencies and can modify package.json using curated profiles.
“It understands the structure and dependencies in a package.json and can modify it based on a series of curated profiles.”
YouTube Unverified1 source· Talk
