-
Notifications
You must be signed in to change notification settings - Fork 4.5k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Refactoring The New Architecture Guide #3037
Conversation
✅ Deploy Preview for react-native ready!
To edit notification comments on pull requests, go to your Netlify site settings. |
7def18b
to
e2f2e34
Compare
e2f2e34
to
75ab7e4
Compare
@Simek I added a few redirects in the file you suggested here. I'm not sure they were needed, I have run a quick search on when and where @cortinico I updated the sidebar with a new page (the codegen) and putting back the appendix at the same level as the troubleshooting, as discussed here |
Thank you for the updates, but I think that I have failed to explain and analyze this properly earlier. 😅 The guides are versioned, In this PR there are no moved pages nor changed IDs for old pages. This PR only adds new pages and restructurize the sidebar, which should not affect the URLs. I think that I was fixated earlier on added In other words this PR doesn't need any redirect entries, sorry for the confusion! |
75ab7e4
to
9d37c2a
Compare
@Simek Don't worry! I updated the PR, removing those changes! ;) |
@cipolleschi Are there any updates here? I think a revised guide would make migration easier and encourage many users and library maintainers to do so. I would especially like to see the section on creating backwards-compatible code merged soon. |
We're actively working on this and it's pretty high on our agenda. We'll merge the whole work as soon as we feel we reached a shippable state 👍 Thanks for asking though. |
docs/the-new-architecture/backward-compatibility-troubleshooting.md
Outdated
Show resolved
Hide resolved
7e9dc7b
to
0744757
Compare
Ok, I have no idea why the deploy fails. I tried in different ways and locally, the links work. @Simek, whenever you have time, could you have a look at what I'm doing wrong here? 🙏 |
docs/the-new-architecture/backward-compatibility-fabric-components.md
Outdated
Show resolved
Hide resolved
I feel also like, after the refactor, sidebar section became growth to the height, in which it would be nice to consider splitting it into smaller section for the UX (especially on the smaller screens). Maybe "migration" part could be extracted into top level category? It's fine if such split is not preferred, it is just the quick idea. |
0425154
to
8a9b70f
Compare
dcc9a9f
to
5caf900
Compare
c4a12aa
to
444ec53
Compare
7793999
to
8dcff86
Compare
* Start new template guide This is a first iteration. I want to get feedback on a few aspects, so starting from here as a baseline. * Update title * Use tabs for target OS Set up matching the style of "Getting Started", except I kept the headers inside the tabs for now as it makes for a useful right-hand TOC. * Capitalize New Architecture, simplify * Preliminary section for Hermes Add section for recommending enabling Hermes. Not sure of contents yet, and still have to test. * Reword to emphasize importance of Hermes usage * Show new arch in use * Add build speed article link * Add pro tip for pod install alias * Restructure, repeat less Favor linking to original setup guide instead of repeating content. * Note about Expo * Include command on uninstalling global CLI * How to learn more * Remove headers in tabs They don't work correctly with the righthand TOC. * Make header more clear * Use quote block less often There was way too much yellow. * Opt for instructions using XCode Because `xcodebuild clean` already failed me once when XCode GUI clean worked. * Fix lint issue * Improve wording * Use product name * Fix line wraps * Reword based on feedback * Note use of bundle install * Pod removal instructions Also standardize on using yarn scripts from template for commands, it's a little confusing to see the mix of `npx` and `yarn` once we start referring to `yarn pod-install` * Convert quotes to admonitions * Convert Note: to admonitions * Feedback: Change admonitions to caution * PR feedback
* First draft of landing page * Add migration and backwards compatibility links * lint fix * Restructure slightly, leaning more on context from Why a New Architecture * Don't need md in links * Suggested rewording * Rephrase pillar summaries
* [Feat] Add intro for Fabric Components * feat: add guide to create a Fabric Component
* [Feat] Add intro for Fabric Components * feat: add guide to create a Fabric Component * Beginning of guide/folder structure * WIP JS Spec * specification section * Configuration * native code intro * Must be named Spec * Best stab at iOS native code, but I don't know how to describe what's going on in the code very well. Extrapolated what I could. * Android instructions iOS isn't working for me. Builds, but can't load module. Writing up Android auto-linking next because the steps I tested did work. * Include linking instructions from RNNArch repo * Add example JavaScript * native modules link * Address quick feedback items * Remove, fix for rebased branch * fix TM parameter on Android * Revert to 'Codegen' casing * Revert folly version change 2021.07.22 is for current version on main * fix typo * getTurboModule explainer * Sentence edits - Fix acronym bolding - Change wording to "recommended" because "standard" has other connotations of possibly being required - Parentheses unnecessary, distracting * Remove TODO for now Getting inconsistent results here, not sure if this is wrong or not; removing TODO for now so it doesn't block anything * ABI rephrase, more in line with new Fabric guide wording * Explain shared C++ code more * feat: add guide to create a Fabric Component * feat: add guide to create a Fabric Component * package.json description * Lint fixes * fix: Move JS constants to reduce changes * fix: Remove newline * feat: add required step for Android Codegen * fix: use the proper links Co-authored-by: Riccardo Cipolleschi <[email protected]>
e9b6600
to
ff7d4bd
Compare
088f55a
to
dab2285
Compare
* [Do Not Merge] Refactoring The New Architecture (#3029) * [Guide - The New Architecture] What Backward Compatibility Is (#3038) * Guide to creating a New Architecture app from template (#3056) * Start new template guide This is a first iteration. I want to get feedback on a few aspects, so starting from here as a baseline. * Update title * Use tabs for target OS Set up matching the style of "Getting Started", except I kept the headers inside the tabs for now as it makes for a useful right-hand TOC. * Capitalize New Architecture, simplify * Preliminary section for Hermes Add section for recommending enabling Hermes. Not sure of contents yet, and still have to test. * Reword to emphasize importance of Hermes usage * Show new arch in use * Add build speed article link * Add pro tip for pod install alias * Restructure, repeat less Favor linking to original setup guide instead of repeating content. * Note about Expo * Include command on uninstalling global CLI * How to learn more * Remove headers in tabs They don't work correctly with the righthand TOC. * Make header more clear * Use quote block less often There was way too much yellow. * Opt for instructions using XCode Because `xcodebuild clean` already failed me once when XCode GUI clean worked. * Fix lint issue * Improve wording * Use product name * Fix line wraps * Reword based on feedback * Note use of bundle install * Pod removal instructions Also standardize on using yarn scripts from template for commands, it's a little confusing to see the mix of `npx` and `yarn` once we start referring to `yarn pod-install` * Convert quotes to admonitions * Convert Note: to admonitions * Feedback: Change admonitions to caution * PR feedback * New Architecture landing page (#3072) * First draft of landing page * Add migration and backwards compatibility links * lint fix * Restructure slightly, leaning more on context from Why a New Architecture * Don't need md in links * Suggested rewording * Rephrase pillar summaries * [Guide - The New Architecture] Why A New Architecture (#3043) * [Guide - The New Architecture] Pillars (#3046) * [Guide - The New Architecture] TurboModules as Native Modules (#3039) * [Guide - The New Architecture] Fabric Components as Native Components (#3040) * [FEAT][TNA] Fabric Component Guide (#3132) * [Feat] Add intro for Fabric Components * feat: add guide to create a Fabric Component * Add page on codegen (#3155) * [FEAT] TurboModules guide (#3168) * [Feat] Add intro for Fabric Components * feat: add guide to create a Fabric Component * Beginning of guide/folder structure * WIP JS Spec * specification section * Configuration * native code intro * Must be named Spec * Best stab at iOS native code, but I don't know how to describe what's going on in the code very well. Extrapolated what I could. * Android instructions iOS isn't working for me. Builds, but can't load module. Writing up Android auto-linking next because the steps I tested did work. * Include linking instructions from RNNArch repo * Add example JavaScript * native modules link * Address quick feedback items * Remove, fix for rebased branch * fix TM parameter on Android * Revert to 'Codegen' casing * Revert folly version change 2021.07.22 is for current version on main * fix typo * getTurboModule explainer * Sentence edits - Fix acronym bolding - Change wording to "recommended" because "standard" has other connotations of possibly being required - Parentheses unnecessary, distracting * Remove TODO for now Getting inconsistent results here, not sure if this is wrong or not; removing TODO for now so it doesn't block anything * ABI rephrase, more in line with new Fabric guide wording * Explain shared C++ code more * feat: add guide to create a Fabric Component * feat: add guide to create a Fabric Component * package.json description * Lint fixes * fix: Move JS constants to reduce changes * fix: Remove newline * feat: add required step for Android Codegen * fix: use the proper links Co-authored-by: Riccardo Cipolleschi <[email protected]> * wip: migration guide review (#3200) Co-authored-by: Lizzi Lindboe <[email protected]>
* Add a few Microsoft apps to the showcase (facebook#3203) * fix artsy icon * add microsoft office mobile * add outlook mobile * add teams * add xbox * remove placeholder link * Correct minor mistake in native-components-android.md (facebook#3210) * Update fast-refresh.md (facebook#3208) Co-authored-by: Bartosz Kaszubowski <[email protected]> * Fixed Artsy logo and infoLink of oculus in webiste/showcase (facebook#3199) * Wrap "Android SDK Build-Tools" with backticks (facebook#3206) * Update keyboardavoidingview.md (facebook#3202) * Update debugging.md (facebook#3209) * Add the blogpost for Hermes as the Default engine (facebook#3212) * Add the blogpost for Hermes as the Default engine * Update website/blog/2022-07-08-hermes-as-the-default.md Co-authored-by: Bartosz Kaszubowski <[email protected]> * Update website/blog/2022-07-08-hermes-as-the-default.md Co-authored-by: Bartosz Kaszubowski <[email protected]> Co-authored-by: Nicola Corti <[email protected]> Co-authored-by: Bartosz Kaszubowski <[email protected]> * Update iOS data in Hermes default blog post (facebook#3216) * Update the contributing section docs (facebook#3221) Co-authored-by: Nicola Corti <[email protected]> Co-authored-by: Bartosz Kaszubowski <[email protected]> * Bump terser from 5.12.1 to 5.14.2 (facebook#3219) Bumps [terser](https://github.com/terser/terser) from 5.12.1 to 5.14.2. - [Release notes](https://github.com/terser/terser/releases) - [Changelog](https://github.com/terser/terser/blob/master/CHANGELOG.md) - [Commits](https://github.com/terser/terser/commits) --- updated-dependencies: - dependency-name: terser dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * docs: add build tools to Table of Contents (facebook#3228) * Update build-speed.md (facebook#3223) Removed duplicated sentence from docs * Remove Uber Eats from showcase (facebook#3229) * docs: add two sections to the New Architecture (facebook#3230) * Note on connecting to React Native simulator. (facebook#3214) Co-authored-by: LeoTM <[email protected]> Co-authored-by: Nicola Corti <[email protected]> * Fix a couple of problems on the release runbook (facebook#3222) * Improving UX: replace videos and links with SnackPlayers, update examples (facebook#3231) * Fix extra whitespace on debugging.md (facebook#3233) * Add more info to Prerequisites for Libraries guide (facebook#3238) * Add spaces in the example * Add section about codegen types * Correct section title * Add information about requireNativeComponent * [Docs] iOS Simulator version & UDID (facebook#3225) Co-authored-by: Bartosz Kaszubowski <[email protected]> * Add retrospective as a copilot responsibility (facebook#3242) * update release related docs page (facebook#3240) * update crew composition and remove testers/supporters * add note about testing async * Update website/contributing/release-roles-responsibilites.md Co-authored-by: Riccardo <[email protected]> * Update website/contributing/release-roles-responsibilites.md Co-authored-by: Riccardo <[email protected]> * refactor note into a snipper * Update website/contributing/release-roles-responsibilites.md Co-authored-by: Marek Fořt <[email protected]> * yarnlock change? * clean up document based on feedback * more words at the start Co-authored-by: Riccardo <[email protected]> Co-authored-by: Marek Fořt <[email protected]> * Update image.md (facebook#2850) This is missing, but this is an important information. Imagine a view sized 100x150 and an image sized 200x300. The old description could be interpreted in a way, that the image doesn't scale at all! * Fix lint * chore: Specify return vs resolve (facebook#3236) When dealing with functions which return Promises, it's helpful to be clear about whether something _returns_ a value, or whether the returned Promise will _resolve to_ a value. * update Docusaurus and other dependencies (facebook#3218) * Add kotlin examples in new-architecture-app-modules-android.md (facebook#3241) * change links in main home (facebook#3244) * Refactoring The New Architecture Guide (facebook#3037) * [Do Not Merge] Refactoring The New Architecture (facebook#3029) * [Guide - The New Architecture] What Backward Compatibility Is (facebook#3038) * Guide to creating a New Architecture app from template (facebook#3056) * Start new template guide This is a first iteration. I want to get feedback on a few aspects, so starting from here as a baseline. * Update title * Use tabs for target OS Set up matching the style of "Getting Started", except I kept the headers inside the tabs for now as it makes for a useful right-hand TOC. * Capitalize New Architecture, simplify * Preliminary section for Hermes Add section for recommending enabling Hermes. Not sure of contents yet, and still have to test. * Reword to emphasize importance of Hermes usage * Show new arch in use * Add build speed article link * Add pro tip for pod install alias * Restructure, repeat less Favor linking to original setup guide instead of repeating content. * Note about Expo * Include command on uninstalling global CLI * How to learn more * Remove headers in tabs They don't work correctly with the righthand TOC. * Make header more clear * Use quote block less often There was way too much yellow. * Opt for instructions using XCode Because `xcodebuild clean` already failed me once when XCode GUI clean worked. * Fix lint issue * Improve wording * Use product name * Fix line wraps * Reword based on feedback * Note use of bundle install * Pod removal instructions Also standardize on using yarn scripts from template for commands, it's a little confusing to see the mix of `npx` and `yarn` once we start referring to `yarn pod-install` * Convert quotes to admonitions * Convert Note: to admonitions * Feedback: Change admonitions to caution * PR feedback * New Architecture landing page (facebook#3072) * First draft of landing page * Add migration and backwards compatibility links * lint fix * Restructure slightly, leaning more on context from Why a New Architecture * Don't need md in links * Suggested rewording * Rephrase pillar summaries * [Guide - The New Architecture] Why A New Architecture (facebook#3043) * [Guide - The New Architecture] Pillars (facebook#3046) * [Guide - The New Architecture] TurboModules as Native Modules (facebook#3039) * [Guide - The New Architecture] Fabric Components as Native Components (facebook#3040) * [FEAT][TNA] Fabric Component Guide (facebook#3132) * [Feat] Add intro for Fabric Components * feat: add guide to create a Fabric Component * Add page on codegen (facebook#3155) * [FEAT] TurboModules guide (facebook#3168) * [Feat] Add intro for Fabric Components * feat: add guide to create a Fabric Component * Beginning of guide/folder structure * WIP JS Spec * specification section * Configuration * native code intro * Must be named Spec * Best stab at iOS native code, but I don't know how to describe what's going on in the code very well. Extrapolated what I could. * Android instructions iOS isn't working for me. Builds, but can't load module. Writing up Android auto-linking next because the steps I tested did work. * Include linking instructions from RNNArch repo * Add example JavaScript * native modules link * Address quick feedback items * Remove, fix for rebased branch * fix TM parameter on Android * Revert to 'Codegen' casing * Revert folly version change 2021.07.22 is for current version on main * fix typo * getTurboModule explainer * Sentence edits - Fix acronym bolding - Change wording to "recommended" because "standard" has other connotations of possibly being required - Parentheses unnecessary, distracting * Remove TODO for now Getting inconsistent results here, not sure if this is wrong or not; removing TODO for now so it doesn't block anything * ABI rephrase, more in line with new Fabric guide wording * Explain shared C++ code more * feat: add guide to create a Fabric Component * feat: add guide to create a Fabric Component * package.json description * Lint fixes * fix: Move JS constants to reduce changes * fix: Remove newline * feat: add required step for Android Codegen * fix: use the proper links Co-authored-by: Riccardo Cipolleschi <[email protected]> * wip: migration guide review (facebook#3200) Co-authored-by: Lizzi Lindboe <[email protected]> * fix: Fix typo in the sidebar (facebook#3247) * Delete ubereats.png (facebook#3246) Redundant image data * Fixed pod install instructions (facebook#3243) * Fixed pod install instructions Yarn must be run prior to pod install, otherwise pod install fails with "Error: Cannot find module 'mkdirp'" * yarn start is not necessary anymore * Refer to rntester readme * Update android studio screenshot (facebook#3253) * Adding Android 13 Permissions into PermissionsAndroid (facebook#3254) * TextInput: Add cursorColor Android prop (facebook#3255) * Update Android Studio screenshot (Windows) (facebook#3257) * docs (releases): small refactoring and updating templates (facebook#3256) * Update documentation for keyboard events on Android (facebook#3259) facebook/react-native@1e48274 fixed keyboard events on Android 11+ when an activity has set `android:windowSoftInputMode` to `adjustNothing`. Update the documentation to reflect the change. * Update to Docusaurus stable release, fix alert admonition styling (facebook#3248) * Change asks to ask (grammar) (facebook#3262) * contributing: remove old references (facebook#3263) * adding accessibilityLabelledBy to documentation (facebook#3249) * Update references to Expo / Expo CLI (facebook#3267) * feat(images): Adding iOS Image Cache Limits (facebook#3258) Co-authored-by: Bartosz Kaszubowski <[email protected]> * feat: update instructions around automatic linking (facebook#3269) * Follow up from facebook#3267 with minor fixes (facebook#3270) * nit: fix typo in new architecture docs (facebook#3261) * fix typo * fix: typescript example * fix: lint * make text optional * fix(images): move app-transport-security reference (facebook#3271) * fix(images): move app-transport-security reference * feat(images): updating link references * fix(network): change network app transport security reference * fix(docs): updating versioned docs link reference * Showcase page refresh (facebook#3235) Co-authored-by: Lorenzo Sciandra <[email protected]> * fix: moving the Using forwardRef and Using a getter to a lower hierarchy level (facebook#3282) * Upgrade toast Android example to camelCase (facebook#3283) * Fix link in Introduction (facebook#3290) * Fix link in Introduction * Use new page title (potentially renaming that is a separate discussion) * fix: push steps in a lower hierarchy level (facebook#3296) * fix type in the new architecture pillars section (facebook#3297) * cut 0.70 docs (take 2) (facebook#3295) * Blog post for 0.70 RN release (facebook#3298) * Blog post for 0.70 RN release * Fixes and TOC * Update my GH handle * Update my GH handle * Apply suggestions from code review Co-authored-by: Riccardo <[email protected]> * Update @Titozzz Twitter handle * Add example for javaPackageName * Update commits count * Minor fixes to the wording Co-authored-by: Dmytro Rykun <[email protected]> Co-authored-by: Riccardo <[email protected]> Co-authored-by: Lorenzo Sciandra <[email protected]> Co-authored-by: Marcin Kozubek <[email protected]> Co-authored-by: Malachi Gruenhagen <[email protected]> Co-authored-by: Bartosz Kaszubowski <[email protected]> Co-authored-by: Pushkar Yadav <[email protected]> Co-authored-by: Muhammad Ovi (Owais) <[email protected]> Co-authored-by: rj-jones <[email protected]> Co-authored-by: fbmal7 <[email protected]> Co-authored-by: Nicola Corti <[email protected]> Co-authored-by: neildhar <[email protected]> Co-authored-by: Lorenzo Sciandra <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Yvan Zhu <[email protected]> Co-authored-by: Mileta Dulović <[email protected]> Co-authored-by: Ricky <[email protected]> Co-authored-by: Andrew <[email protected]> Co-authored-by: LeoTM <[email protected]> Co-authored-by: Nicola Corti <[email protected]> Co-authored-by: Oskar Kwaśniewski <[email protected]> Co-authored-by: Furkan Arabacı <[email protected]> Co-authored-by: Marek Fořt <[email protected]> Co-authored-by: Riccardo <[email protected]> Co-authored-by: Władysław Raczek <[email protected]> Co-authored-by: Luna Wei <[email protected]> Co-authored-by: Evan Charlton <[email protected]> Co-authored-by: Tushar Varshney <[email protected]> Co-authored-by: Riccardo <[email protected]> Co-authored-by: Lizzi Lindboe <[email protected]> Co-authored-by: Jessej Samuel <[email protected]> Co-authored-by: Seph Soliman <[email protected]> Co-authored-by: Kimiyasu Morikawa <[email protected]> Co-authored-by: Agastya Darma <[email protected]> Co-authored-by: Nick Gerleman <[email protected]> Co-authored-by: denis-tsoi-mox <[email protected]> Co-authored-by: fabriziobertoglio1987 <[email protected]> Co-authored-by: Brent Vatne <[email protected]> Co-authored-by: Michał Pierzchała <[email protected]> Co-authored-by: nishan (o^▽^o) <[email protected]> Co-authored-by: Lorenzo Sciandra <[email protected]> Co-authored-by: Lucas Alves <[email protected]> Co-authored-by: dan <[email protected]> Co-authored-by: Dmytro Rykun <[email protected]>
Goal
This PR contains a proposal for a new structure of The New Architecture section on the website. This section lives in the Guides tab, therefore it contains mostly tutorials and examples. For more technical information on specific topics, it points to the Architecture tab. The proposed structure covers some topics that are currently missing, and it refactors part of the documentation that already exists.
You can look at the added files or you can look at the preview generated by the CI to see how it will be rendered.
The content of each section is a description of what should be written in other PRs that have this PR as their starting point!
Context
At the moment of writing, The New Architecture guide’s section is a migration guide from the old architecture to the new one. It does not explain the basic context needed to understand it (what the new architecture is and what are their main benefits) and there is no section that describes how the new architecture’s components and modules should look like. For the old architecture, these topics are presented in Native Module and Native Components sections.
Currently, the guide does not suggest any approach to create backward compatible code, and it does not show how to use the new app template.