Building a desktop admin panel for react native app - reactjs

I am building a react native app with firebase auth and cloud storage, and I was just wondering if it is possible to make a dashboard for desktops to administrate the users/app? And if it does, how do I do this? Is it in the same build, or do I have to build a new "app" for adminpanel/dashboard?
This is my first time building the adminpanel/backend xD

While it's possible to build web apps with React Native, I wouldn't recommend it. The Layout of a desktop is just way too different from phones to build React Native Apps including web without constantly using Platform.OS. In your question, you even mention that you wan't the dashboard to just be available on the desktop but not on the Phone (which makes sense in my opinion). Since you seem to know a bit about React Native, it should be an easy thing for you to build the Dashboard as a different Application with React for the web only.

Related

Pluginable cross-platform software design for react & react native

I want to design a cross-platform (Android, iOS, and Web) plugin-able software that means everyone can easily develop a plugin for it and users can pick plugins from the marketplace and install it. Every plugin can:
Share data in the back-end side with the core application
Have a custom UI in Apps and Web that ideally using a standard UI-kit for consistency (for example Shopify polaris)
In the back-end, there are many best practices in software design like OAuth. but in the frontend, the problem is not straightforward:
Is there any cross-platform UI-kit for react and react-native? for example, using Expo v33+ or ReactNativeWeb we can build the code for android/ios and web but I can't find any cross-platform UI-kit. (NativeBase, Elements or similar cross-platform UI-kits are only for Android and iOS)
In the Frontend, how plugins can share UI using react and react-native (or ideally a cross-platform UI kit) somehow that render in the core dynamically (without needing any update, for example, the plugin provide an endpoint and return a react/native component and the core will render it)
1 - As far as I know there are few of them, like React Universal UI
2 - With the above UI Kit, the distinction on how components are built (imports remain the same) is done at runtime in the boilerplate:
Web (React)
$ ruui dev
IOS (React Native)
$ react-native run-ios
Android (React Native)
$ react-native run-android
If you want you component to be imported at runtime, well, this is possible for sure in web env (you can do it also with react-create-app, with dev server turned on and no prod static build).
For Android and IOS you'll need an additional build and subscribe your app for the review before going up again to the store (AppStore and Google Play)

Migrate React web app to Electron

We are considering development of a web app using ReactJS (probably, we will use npm's create-react-app feature). Also, we are thinking if it will be possible in future to easily transform the web app to a desktop application using Electron. Since we have no experience with both technologies, we like to ask about this combination, whether it is a good option, and if it is possible to turn a React web app into a desktop Electron-powered app.
I was googling any working tutorial how to build an app using both technologies but no one worked for me.
So, to sum up, is it good choice to start developing a web app with React when we would like to have the opportunity to transform it into a desktop application built with Electron? If not, are there any better technologies?
You should look into how exactly your solutions are built, instead of focusing on the technology itself. If your team builds your backend with this in mind, you can create APIs that your clients(React Web App, Electron Desktop App) can connect to.
To answer the question: No, it is not a good choice to begin development of your web app project without considering future implications of your design. Focus your time on how your backend talks to your front end.
Moreover, ReactJS is only a front end library, you can use it with Electron, Check out some GitHub Hug Repos like: Re-Electron , React-Electron-Starter, Electron-React

React Web App to React Native

I currently have a web app/api built using React, Node, Mongo & Express. I would also like to develop a react native clien that shares an API. Does having an existing react web client make the react-native mobile development any easier? My biggest concern is authentication & authorization. Can you recommend any tutorials, frameworks, packages that could make it easier? As you can tell.. I am very new to development.
You can utilize the same backend that you use for your Web app, in React-Native.
You can even use the same packages like Axios or superagent.
React-Native's built in one is called Fetch().
You are simply pinging your RESTful backend from a different device.
React-Native code is not at all a one for one with React Code. They are very different and only follow the same architecture Design Principals.
This question has been asked many times.

reactjs for both web and mobile applications

I need to develop the application which will be same for mobile app and web application. I was researching on reactjs.
Can I convert my reactjs code for web-app to react native for mobile application? The way we do in ionic framework(angular)
You can definitely use cordova \ phonegap in order to create an app out of your website, which will make it hybrid but not native (suitable for most site types)
You cannot 'convert' or re-transpile your code to react-native. You have to re-build it using react native. It will be much easier ofcourse because you have a running react system, but still.
I would recommend trying the first option. Good luck!

Previewing react-native views using ReactJS in a web browser

(Disclaimer: I'd have asked this question in a forum but the react-native website encourages us to ask it on SO.)
Is there a known tool to visually preview xml layouts in a browser? I'm developping a scaffolding tool to generate basic templates so I can prepare applications for customers quicker, and I'd like it to be a web app. Since the layout is very similar between react-native and reactJS, I'd think the effort to show a react-native layout as a reactJS layout is minimal?
A framework for building web apps with React Native compatible API
https://github.com/taobaofed/react-web

Resources