GitPlanet

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Created with love in Canada, visit hostnodejs.com today

Feel like to post an Ad? Learn Details
All Projects → HBandesh → reusingCode

HBandesh / reusingCode

Licence: MIT license
This POC is intended to demonstrate an approach to reuse the code between React and React Native.

Programming Languages

javascript
184084 projects - #8 most used programming language
CSS
56736 projects
HTML
75241 projects

Labels

reactreact-nativecode-reusecode-sharecode-sharing

Projects that are alternatives of or similar to reusingCode

vscode-extension
Link your code and commits to a video recording and explain your code with video.
Stars: ✭ 67 (+17.54%)
Mutual labels:  code-sharing
Flutter hooks
React hooks for Flutter. Hooks are a new kind of object that manages a Widget life-cycles. They are used to increase code sharing between widgets and as a complete replacement for StatefulWidget.
Stars: ✭ 1,973 (+3361.4%)
Mutual labels:  code-reuse
flhooks
React like Hooks implementation for Flutter.
Stars: ✭ 38 (-33.33%)
Mutual labels:  code-reuse
Guanciale
🥓 Grab info needed by Carbonara from executables and disassemblers databases
Stars: ✭ 14 (-75.44%)
Mutual labels:  code-reuse
codesnip
A code bank designed with Pascal in mind
Stars: ✭ 62 (+8.77%)
Mutual labels:  code-sharing
kotlin-native-mobile-multiplatform-example
Code sharing between iOS and Android with Kotlin native
Stars: ✭ 52 (-8.77%)
Mutual labels:  code-sharing

resuingCode

Projects often fall into a scenario where they need to make a platform which can be reused both in React (for website) and React Native (for mobile Apps). This question of reusing code between the two is, in fact, one of the hot topics among React and React native developers all over the world. The approach which I am going to take is based on the fact that React Native can load platform specific Javascript modules based on their extensions.

I have made this application as an example of my article "https://codeburst.io/reusing-code-between-react-js-and-react-native-effectively-12bb4fbf7a70". You can read more about the concept and approach in the blog.

Installation

  1. Run npm install.
  2. Install the Expo client app on your iOS or Android phone.

Running

  1. For web -> Run 'npm start'

  2. For Mobile App -> a. Run 'npm run app'. b. Install the Expo client app on your iOS or Android phone and connect to the same wireless network as your computer. On Android, use the Expo app to scan the QR code from your terminal to open your project. On iOS, follow the on-screen instruction to get a link.

Screenshots

WEB:

alt text

App:

alt text

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].