I am using React JS (not native) to create a web application. I understand that there default table tags in React such as <table>, <tr>, and <tbody>. When creating these tables I want to be able to manipulate them by dragging them to the side. This application will be used on tablet devices as well as the PC which is why this is necessary.
I need to avoid installing libraries so if this can be done natively all the better. A link to a tutorial would be best.
Thank you
Related
I have created two create-react-app projects one for mobile UI and other for desktop UI because of some conditions. I want to integrate both of them and put on server so appropriate UI is loaded on devices. Is their way to integrate their builds while putting on server or any other way?
My objective is to add new UI screens based on React JS on an existing (JSP based) J2EE application running on local tomcat server. Yes, the ask is to add new screens using modern javascript/clientside technologies, but to retain the existing screens as it is.
I downloaded individual react.js and react-dom.js, added them to my J2EE project content, referenced them to the html page. In this way(Without having to install node JS or setup react dev environment), i'm able to achieve my objective, but i could use only plain javascript React.createElement to create the UI components.
But, i would also need to use the JSX syntax to speed up my developments. Now, to use JSX features, i learned that i had to do setup of Node JS, Babel, etc and have to build the application. This will not fit to my objective, as i don't need a standalone React application, but only need to create additional screens based on react to existing J2EE application.
So, I need experts recommendations to accomplish this. My questions are
If i setup the react+babel development environment and build an app, can i get the transcompiled JS files easily, so that i can take them and deploy to my tomcat server?
If so, is this the only way to achieve my objective OR is there a better alternative for quicker development?
You don't need expert recommendations its easy.
1) You can use create react app from create react app boiler plate from Facebook which gives everything from out of box.
https://github.com/facebook/create-react-app
2) React app needs a div to load js.
Keep generated js bundle from above step in J2EE application and load script on JSP page using script tags.
<script src="/reactbundle.js"></script>
<div id="root"> </div> // create this div in existing J2EE application in HTML or JSP file.
ReactDOM.render(<App />,document.getElementById('root')
);
I have really big concern on my web project architecture which will have separate mobile and desktop web app.
I already finished to develop web version based on "create-react-app" project template and for mobile version, I want to reuse my exists web version component as much as possible.
We will serve these with separate url "www" for desktop and "m" for mobile.
I am thinking of two possible ways.
Just build another create-react-app project for mobile and share the common code.
In exists web client create-react-app project src folder, make mobile version codes like component.js component.web.js component.mobile.js. But in this case I am worrying about the size of bundle js file.
I also thought about the responsive web design, but we have totally different layout and components.
Rendering two different layout within a component by the size of viewport or url(www/m) might be another possible way but it is highly possible for me to use server-side-rendering...
What would be the good approach to solve this problem....
I would approach this as follows:-
Move all business logic to a common package and use it in both mobile and web. This would make your logic common.
Move all the common components/config/colors etc. to a common package and use them in both the apps.
Handle view part for both the apps separately.
I also thought about the responsive web design, but we have totally
different layout and components.
If you have totally different layout and components I would suggest to keep mobile and web segregated. Its not only about the bundle size, you can get around it by lazy loading, but your code complexity can increase.
You can use the same code and build mobile application using Cordova Framework
as your web code will be the one to generate application.
As well you can create for multiple platforms.
Go through official website.
https://cordova.apache.org/docs/en/latest/guide/cli/index.html
This question is little bit confusing but i need to use React Native in AngularJs.
My requirement is a simple. I am developing website which create Mobile Application without code.(ref: www.ibuildapp.com). For that, I need to display mobile simulator and update mobile application constantly as per user drag and drop action, and last Apk and ipa will gerenate using react native. So in meantime user actions i need to update mobile simulator views so i have to use react native component and my site will be in Angular.
My question is that is it possible to use Angular + react-native simultaneously.
I hope you understand my requirement if need more detail comment me.
Thank you in advance.
Key mirror is a simple package which is used to create an object with values equal to its key names. It is first used in facebook react project.
From a comment here, it seems to me that this package only makes sense when being applied to react web project, as it can survive google closure advanced mode to make web load faster. I am wondering if anyone use it in a react native project, as I tend to think there's no point using it in app development.
thanks :)