Native Mobile Editor Moves to Core Gutenberg Repo

This post covers topics relevant to developers interested in the Gutenberg block editor and development efforts for extending the benefits of GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. to native Android and iOSiOS The operating system used on iPhones and iPads. applications. For background information on the Gutenberg Mobile effort, see the following posts:

The main takeaway from this post is that you can now build, run, and test the native mobile blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. editor as a React Native Demo App on Android and iOS, right from the core Gutenberg GitHub repository, also used by Gutenberg web contributors.

The new capabilities resulting from this change are significant because they empower developers working on Gutenberg coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. to run continuous integration automated tests simultaneously on Web, Android, and iOS, as well as run the block editor on all three platforms for development and debugging purposes, all from a single code repository. 

Nothing special needed to run the Web, Android, and iOS tests together on CI, just open a PR against the Gutenberg repo and tests will run

The mobile block editor achieved this move closer to core Gutenberg development with this Pull Request which moved 7,234 commits(squashed) and 31,000 lines of codeLines of Code Lines of code. This is sometimes used as a poor metric for developer productivity, but can also have other uses. from gutenberg-mobile to the gutenberg GitHubGitHub GitHub is a website that offers online implementation of git repositories that can easily be shared, copied and modified by other developers. Public repositories are free to host, private repositories require a paid subscription. GitHub introduced the concept of the ‘pull request’ where code changes done in branches by contributors can be reviewed and discussed before being merged be the repository owner. repository. For instructions on running the mobile editor on iOS and Android see Getting Started for the React Native Based Mobile Gutenberg in the Block Editor Handbook. See a quick excerptExcerpt An excerpt is the description of the blog post or page that will by default show on the blog archive page, in search results (SERPs), and on social media. With an SEO plugin, the excerpt may also be in that plugin’s metabox. on running the demo apps below:

nvm install --latest-npm; npm install
npm run native start

// With the packager running, open another terminal window 
// and use the following commands to compile and run the app:

npm run native android
npm run native ios

Looking forward, this multi-platform development repository setup reinforces the Gutenberg project goal of creating a cross-platform ecosystem where developers will be able to code Editor Blocks using JavaScript that will be usable by content creators on the Web, as well as in native Android and iOS applications.  While the “code an editor block once, run it anywhere” goal is not a reality yet, as native specific files are needed in most blocks today, this move to a web + native “monorepo” setup will help make that reality more achievable, from both a practical and organizational standpoint. 

For more information on native mobile Gutenberg and the new repository setup, see React Native Based Mobile Gutenberg under the Code Contributions section of the Block Editor Handbook. If you have any questions or want to get involved, feel free to discuss in the comments or find us in the #core-editor and #mobile rooms in Slack.

#core-editor, #gutenberg, #mobile