sharing code between react js and react native expo - reactjs

I want trying to figure out is it possible to share code between reactjs and react native expo. I want to build an app for production. If yes then what should be the structure of project. I tried to do alot of google search but could find any article or tutorial on using react native expo with reactjs. Any one please help me to figure this out.

Probably the easiest way is to just write React code in Expo and then use Expo web to make the website.
It is possible to share code between a React DOM project and an Expo project but there are some caveats and gotchas. There are a bunch of blog posts out there that outline some techniques to do this. Here is one example: https://codeburst.io/reusing-code-between-react-js-and-react-native-effectively-12bb4fbf7a70

Related

Is Redux the same for React and React native?

I am currently studying RN by myself, without prior knowledge in React. A lot of things seem to exist in both such as Redux and hooks. Many of the resources I find refer to React in the title (e.g "Redux Crash Course With React").
My question is: where does the line cross between React and React Native? Would I be fine studyig form these resources that refer to React, or would that just confuse me?
I'm trying to understand a go to approach to understand which resource I'd be fine with and which would be irrelevant.
React Native contains React library to use it as front-end library.
Most of usages of React are the same for React-Native. And it is same for Redux too.
React-Native must have other libraries to build applications that can run on both of Android and iOS.
Also it has middleware libraries that allow us to use most of native libraries' functionalities. As an example you can check Alert directory out. It is used for to show native Android alert dialogs.
Good luck..
Both react and react native use javascript to create the user interface we need but the difference is in the rendering, style and bundling and you should know that react native is a framework itself but react.js is a library. the main difference:
---React-Native doesn’t use HTML to render the app, but provides alternative components that work in a similar way. Those React-Native components map the actual real native iOS or Android UI components that get rendered on the app.
---With React-Native, you’ll have to learn a completely new way to animate the different components of your app with Javascript.
--- navigating between pages are totally different!!!
so we conclude that it's better to study references based on RN not react.js . but some functionalities such as redux or hooks or a lot of it's components are exactly the same and you can study react.js references for them. only the 3 differents that i said above are important.

Tutorial to Set Up Isomorphic SSR with Ejected Create React App

I have unsuccessfully found a tutorial for setting up isomorphic server side rendering with an ejected create react app.
I know of react SDK, but this isn't ejected, and there are quite a few tutorials on non-ejected created react apps.
Could anyone help locate one, or link to a project that is an example of ejected app now an isomorphic SSR? Ideally without redux for simplicity.
webpack-isomorphic-tools provides clues but it really doesn't do much more than that.
Check out Paragons. It's a great Universal React SPA starting point. Plus it has Code Splitting all ready to go, SEO support, Sass, React Router v4, and much much more...
you can check this on
it is being ejected
https://github.com/agungsb/create-react-app-ssr-pwa

React for web, react native for mobile app development

I am looking into hybrid development. After some googling, it points to me that there are some potential in investing some time learning React and React native. Dont ask me about Angular, hated Angular due to its complexity. My question is does learning React helps in developing mobile apps with React native?
Regards,
Xing
React-native : This is Mobile Application Development(Hybrid mobile Apps)
React: This is Web Application Development.
Now in this Case those React and React-native Component life cycle Same.
but your using Some methods and components are Different then react to react-native. But mostly both are same. Except Components.
So , Finally if you are learned react and react native Definitely you will develop in this both.
But If you learned React you will Develop Only WebApps
Yes, when I started learning React Native, I had to get the concepts used in React. Basically you will take on React first, before proceeding into any offshoots. A solid foundation in the React style of programming will help a lot in React Native.
The following link is a good guideline. Read this for a start. And also the Facebook documentation for React. This may take some time, so if you have the time, you can proceed. Else try to cut it short when it comes to maybe webpack and stuff like that.
https://github.com/petehunt/react-howto
And then there are many tutorials in React Native. You can again start with the Facebook documentation for that.

React native advantage? how to create both web and app?

how to create web and android application using react. can I use both reactJs and react native. If I create web app by using reactJs, how to convert web into android application (reactjs into react native).
Thanks in advance...
I personally in my projects have not seen a way of doing this automatically. There are some things that you might wish to look at however.
https://github.com/necolas/react-native-web - Seems to allow you to use the same components from react native directly in a react project. So the idea being you write your react native project and then import this package for the web build and voila.
I have ended up manually managing the proccess. If you layout your application keeping your application logic completely seperate from any display component logic the process really isn't that painful. Not sure if there is a better guide but this might give you an idea http://jkaufman.io/react-web-native-codesharing/
You could also use something like webpack to automate this process of swapping components / packages out for native / web.

React + React Native starter kit

I am going to develop a web + mobile application using React and React Native. I'd like to share as much code as possible between React and React Native. I was looking for some starter kits, but found only este. However, for me, it seems to be an overkill as it has too many dependencies (also I wasn't able to make it work for Android - when I fix some error, I run into another one).
I'd like to have just React + React Native + Redux + web bundling etc. Are there any other alternatives? Or at least very simple example apps that I could use?
Did you check the awesome React-native list ?
As I said in this thread, as long as you follow the component / container pattern with Redux; you are able to reuse a lot of code.
The pattern encourages you to separate every presentational code into the comopnent. The container holds all the logic.
Then when you want to reuse the code, you just have to rewrite the component.
Here is a great explanation on how to implement it.
Also, you may want to check React-native-web. It allows you to code in react-native for the .... browser.
Update: I now know why there aren't almost any starter kits that would combine React + React Native. The reason is that it is not a good idea to combine web React and React Native. Just create two separate apps, you'll save yourself a lot of headaches. For those still interested in combining the two platforms, have a look at React Native for Web instead.
So in the end, I've created my own started kit. You can find it here: https://github.com/gina-system/react-starter
why do not you check out https://github.com/teallabs/react-native-init
pretty amazing react-native starter kit with codepush, google signin, sentry, react-navigations and all setup steps.

Resources