{"id":267863,"date":"2018-03-05T12:38:55","date_gmt":"2018-03-05T19:38:55","guid":{"rendered":"http:\/\/css-tricks.com\/?p=267863"},"modified":"2018-03-05T12:38:55","modified_gmt":"2018-03-05T19:38:55","slug":"react-native-better-dom","status":"publish","type":"post","link":"https:\/\/css-tricks.com\/react-native-better-dom\/","title":{"rendered":"React Native: A Better DOM?"},"content":{"rendered":"
\n

How do we convince web developers that React Native has already solved many of the hardest GUI problems for them? Go back in time and release React Native before React DOM? Is there an easier way\u2026<\/p>\n

— Nicolas (@necolas) March 1, 2018<\/a><\/p><\/blockquote>\n

Like a lot of people in this Twitter thread, I didn’t really understand that React Native was even for<\/em> building on the web. I thought it was a way to write React<\/em> to build native mobile apps. Nicolas has a whole “React Native for Web” repo<\/a> though, explaining otherwise. Plus a conference talk.<\/a><\/p>\n

It probably doesn’t help that the tagline is “Build native mobile apps using JavaScript and React.”<\/em> I suppose, it does do that (e.g. build an iOS or Android app), but it also<\/em> can build your web app, which could mean… single code base? <\/p>\n

Several of the replies suggest “a better DOM” which is interesting. Or, as Nicolas points out, it’s kinda like “web: the good parts” as much of it is an intentionally limited subset of the involved platforms in order to simplify things and make them interoperable.<\/p>\n

Obviously, this isn’t for every project. But, if you have a React-based website already, and either have or want a native mobile app, then it seems like this is worth exploring. <\/p>\n","protected":false},"excerpt":{"rendered":"

How do we convince web developers that React Native has already solved many of the hardest GUI problems for them? Go back in time and release React Native before React DOM? Is there an easier way\u2026 — Nicolas (@necolas) March 1, 2018 Like a lot of people in this Twitter thread, I didn’t really understand […]<\/p>\n","protected":false},"author":3,"featured_media":267885,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"sig_custom_text":"","sig_image_type":"featured-image","sig_custom_image":0,"sig_is_disabled":false,"inline_featured_image":false,"c2c_always_allow_admin_comments":false,"footnotes":"","jetpack_publicize_message":"","jetpack_is_tweetstorm":false,"jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":[]},"categories":[17],"tags":[557],"jetpack_publicize_connections":[],"acf":[],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2018\/03\/react-native.jpg?fit=1200%2C600&ssl=1","jetpack-related-posts":[],"_links":{"self":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/267863"}],"collection":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/comments?post=267863"}],"version-history":[{"count":6,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/267863\/revisions"}],"predecessor-version":[{"id":267886,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/267863\/revisions\/267886"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media\/267885"}],"wp:attachment":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media?parent=267863"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/categories?post=267863"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/tags?post=267863"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}