I need to create this React component:
I'm very new working with React but I know react-calendar (https://www.npmjs.com/package/react-calendar) is one of the most popular options.
Is there any way to create a short version of the calendar as displayed in the wireframe? Would anybody recommend another library?
I recommend using the Material-UI library. It has many ready-made components and their customization is easy
Related
I've been stuck to convert the Figma project given by one of my client, to React using Anima. I've tried but, finding it hard to implement. Any resources or suggestions is highly appreciated. Thanks in advance
I also struggled with anima, but in the end I managed to get some React code exported. They have some documentation in the Advanced section of the Guides.
See if you have better success with Desech Studio which also imports figma and exports react.
Here's their github repo for react.
You can try the pxCode plugin, which also converts Figma into React component.
pxCode support some React features such as
pure component
sub-render
naming props
I want to use the same component lib on web and mobile with react. I know that semantic-ui-react fits to web, but tried to use it in a react-native project without success.
Am I missing some specific config, or it does not work in both platforms?
You're not missing any configuration. Semantic UI React only generates elements using react-dom. The only way to use it with React Native would be if the entire library was updated to render native elements for other target environments. This is not something that Semantic UI supports... and would represent a significant, likely breaking, refactor to do.
Maybe this package meet your need in react-native
https://www.npmjs.com/package/#muratoner/semantic-ui-react-native
I'm looking for a good sortable table to display data--mostly numbers-- in React Native. I've found react-native-data-table, however I'm a little hesitant to use this library since it's built on listView which is deprecated.
Does anyone have any suggestions?
Try react-native-table-component. Easy to use and performatic.
Is there any recomended way how to style third-party components such as react-paginate
with Material-UI primitives (bars, buttons)?
Is it possible at all?
One of the best ways to do this today is use styled-components. These allow you to pass in any 3rd party component and style them to your needs. Here is any example of how to do this with antd. Would be similar for you, except using Material UI components.
Im trying to create an application targettng both web and mobile. The idea is to create react components that differ on how they render but share the logic.
React v.014 blog post stated "we’re splitting the main react package into two: react and react-dom. This paves the way to writing components that can be shared between the web version of React and React Native.
The react package contains React.createElement, .createClass, .Component, .PropTypes, .Children, and the other helpers related to elements and component classes. We think of these as the isomorphic or universal helpers that you need to build components."
I've found a great example (http://blog.benoitvallon.com/projects/a-mobile-desktop-and-website-app-with-the-same-code/) that uses the same concept and accomplished the result (react-native 0.13.6 and react 0.14.2).
In this code, you will see nothing special just a smart idea on how to extend react-native naming conventions system to include a web version. The minute I upgrade to latest react-native, it complaints about any component that uses React.Component from the react package instead of react-native.
This is confusing since 0.14 release seem to indicate that was exactly the point moving fw. Let React create components, let react-dom deal with the DOM and let react-native deal with ios/android views.
I think this is a brilliant idea but I cant seem to pass this particular problem. Any thoughts, ideas will be greatly appreciated.
Thanks
The transition to make react native work this way is underway but incomplete. See AMA.
We are working hard to stop using our fork such that people can use require('react') and work the same as require('react-native'), this will make it possible for all the third party plugins to work on both places without doing anything.
Right now we can't use relay on the open source version of react-native without forking it, which is a huge shame and we're working on fixing that.