I heard "grommet with reactjs" has good UI. So I want to try "grommet" on my environment. But I couldn't understand how to use "grommet". Because I expected this module can work on usual internet browser only. But sometime some websites explained "to use node.js" for grommet. Is this serverside module? Can't use "grommet" internet browser only?
https://v2.grommet.io/
I already read component's page but I wasn't able to understand.
https://v2.grommet.io/components
React is a framework for creating UI components.
Grommet is a set of components built with React. If you need a calendar in your application, you can use the calendar provided by Grommet instead of building your own.
Another example of a component library similar to Grommet is Blueprint.
You can use Grommet wherever you use React. React is meant to be displayed in a browser. React can also be rendered server-side (into static HTML) and then made 'dynamic' again on the client (browser side).
React is javascript, and if you want to see React in a browser, the browser needs to fetch the javascript and HTML from the website from a server/website. You can, but do not have to, use Node.js to serve your React/Grommet website.
Related
As the title suggests I am looking for a way to precompile a single or set of normal react components to plain html/js so I can inject this into my webview.
Since I am open to any solution I will give you some background on what I am trying to achieve. We are building a react native app and need to use Leafleft maps by customer requirement. Since Leaflet is not available for react native straight away we are looking for a way to implement it. Currently we are looking at compiling the leaflet react code to normal html/js and inject this into a webview. If there are other/ better ways by all means suggest them!
Thanks for your time 😄
I have created a website with react.js, Material-UI, and node.js. Now I want to create a mobile app for that website with React-native. I have used redux,react-redux, and saga on the website. I am new to react-native.
I want to know, Is it possible to create a mobile app and website in a single project structure, If possible then how? Because I don't want to repeat the same state and API calling procedure two times.
React.js uses HTML to render pages and React native doesn't support HTML so you can't use direct HTML.
You can buy react native theme that suits your need and you can re-use services and api call logic from react code.
Theme: https://codecanyon.net/search/react%20native
You can't just use your whole code into the react native app.
First and foremost, you must adhere to the react native architecture before creating your UI with react native components.
https://reactnative.dev/docs/getting-started
The most of the assistance will be found here.
There is also the option of creating a new react-native project and using webview to show your entire website there.
https://github.com/react-native-webview/react-native-webview
I am working on a react app with mapbox that gets data from a JSON file and adds the data on the app.. I have successfully built the app. But what I want now is that I want to be able to use my react-app as a web component. In a way that it will be usable in websites and web apps.
Think of it this way:
Your React application is the U-Haul truck that delivers everything from the Web Server (Back-End) to the Browser (Front-End)
Now you say you want everything wrapped in a (native) Web Component:
<move-house></move-house>
It is do-able, but you as the Developer have to develop all dependencies
It starts by fully understanding what React is and does, so you can wrap all its behaviour.
Unlike other Frameworks (Angular, Vue, Svelte) React has no "Make-it-a-Web-Component" option,
because React, with its virtual DOM, is a totally different (and rather outdated) beast that doesn't comply with modern Web Standards. (today [Dec2020] React only scores 71% on the Custom Elements Everywhere test)
See: https://custom-elements-everywhere.com/libraries/react/results/results.html
for what you as the developer have to fix, because React does not do that for you
Some say React compared to modern JavaScript technologies, Frameworks, Web Component libraries like Lit and Stencil or Svelte, is more like:
It is possible in react using direflow. https://direflow.io/
How can we use share components between react-native and react web projects. I have read react native can be derived from react. How is it possible to use same js code between two projects (fully or partially) ?
Take a look at the react-native-web library. It's pretty good:
https://github.com/necolas/react-native-web
As long as you only use react native components, e.g. View instead of div, and Text instead of p etc, you'll be able to share view components between your app and website. Then you can pass down all the data from API calls etc as props from within the individual mobile app/website code.
In my projects I have a common folder that contains all these shared view components, and only put the platform specific code inside mobile or web-app. It works pretty well that way.
I'm a newbie for React Native and I don't have native development experience(I only worked on several hybrid apps), while learning this react native framework, I get several questions which block my learning.
How to navigate from one page(component) to another page(component) without relying on navigatorIOS or navigator component? In Hybrid develop mode, it's so easy, just add element A with href attribute would work, but in React Native, how to do it? I read some examples, they all use navigator or navigateIOS component to do it.
Is there any interceptor mechanism in react native so that we could inject some logic before rendering or loading component, for example, we want to have interceptor to check whether user has been login?
How to save data globally (cross components)? In Hybrid mode, we have session, we have local storage, and if we angular JS framework, we could use Service or root Scope to save data, by using react native, how do we save data cross components?
Since I'm new to react native and new to native application development, these questions might be fairly stupid, if anyone could help on this.
I don't know i'm answering to your question but please check this router component for react
https://github.com/rackt/react-router
ComponentWillMount and ComponentDidMount can be used to perform some initial loading
You can use flux framework along with React which can do almost all like in angular js
https://facebook.github.io/flux/