Where communities thrive

  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
Repo info
    Tomasz O.
    Hi guys, I just released my dashboard based on Bootstrap 4 and React 16 - Airframe. It is available as Open Source (MIT License). I will be grateful for the feedback. Repo: https://github.com/0wczar/airframe-react Thanks.
    Suraj Gupta
    Hello I need some help regarding react component, can anyone give me some kisckstart about how can I use react component in plain html pages, I have created a sample component using this - https://neutrinojs.org/packages/react-components/
    @0wczar If I'm being honest, I wish I found this about 2 months ago when I started working on a new project of mine. It would have saved me $30 (because I was too lazy to build a dashboard myself and purchased a license for one instead)

    Is there a way for one rendered element to reference another rendered element outside of react itself, but use react functionality? -- What I mean is this...

    ReactDOM.render(<Calendar listRef={ListRef} />, {id1});
    ReactDOM.render(<List />, {id2});

    Is there some way to create this ListRef reference outside of React?

    Miguel Murillo
    Maybe HOC can help
    Or React.cloneElement
    Well one thing I thought about was having a global refs object that holds the references, and I set the ref to that global ref.. but its kind of quirky.
    Miguel Murillo
    I don’t understand what are you trying to do
    Well I have multiple entry points for multiple types of react components that are independent from each other. By independent, I mean, they don't actually require each other. However, two of them are related, if they are both present on the page. -- I have a list component that I need to be able to execute a function on a calendar component (if they are both present).
    A solution, would be to create a wrapper component that displays both of them together, but I want to try to avoid that if possible.
    This isn't a conventional react app, if you couldn't tell already, haha
    I actually think I figured out exactly what I need -- ReactDOM.render() returns the instance which is what I need to reference I believe, so in theory, I could store that instance somewhere to reference??
    Manoj Kumar
    Hi everybody, I have discovered an interesting trick in React, which allowed me to update the state of a table with 10000 cells at the speed of more than 1 cell per every millisecond! I thought that it is an very powerful technique, which is not exploited by any of the popular state management libraries. So, I have put some effort to come up with the generic version of the library for modern, high-performance, no-boilerplate state management in react. It is Hookstate and the performance demos are for huge table grid and huge form. I appreciate if you could review it and provide me some feedback. I am interested in to know if it useful and how it could be improved and brought up to the next level.
    Subroto Biswas
    Roy Mor
    How can I use useMemo where in my dependencies list I want to use something like [model.user[].name] where only the name of a user inside a user list is updated (I want to re-run the Memoization method for any name update in the user list but not when other user properties are updated in another component. How can I do that?
    Basically something like [model.user[0].name, model.user[1].name, .... model.user[n].name]
    So when other user property is updated I still use the cached value
    Hi @Kashio Not the exact answer to your question, but is your model data stored is some local or global state? If yes, have look at Hookstate (for example: https://hookstate.netlify.com/local-complex-from-documentation): it re-renders a component only when the used segment of the data is changed WITHOUT useMemo.
    If you still want to useMemo, do this as an argument for useMemo: JSON.stringify(users.map(u => u.name)) - it is slower than what Hookstate does, but will do what you want to do.
    Owais Ali
    formik and tcomb are both libraries for form. which one is better, anybody who has used both in react native apps please suggest?
    Keshav Bathla
    Hello, I need one help
    I wants to ask one thing, how to call function for some events
    <View onPressed={this.function_name}>
    <View onPressed={( ) => this.function_name}>
    Out of 2 which is correct
    for custom components 1st one is used, while for inbuilt components later one is used.
    Is i am correct ? And if yes, then why 2 different approaches ?
    Hi guy, if you working on forms, please check out React Hook Form. This lib probably going to make your life easier :) https://react-hook-form.com/
    @ows-ali would you like to check this lib? https://react-hook-form.com/
    Jarod Burchill
    Stephen Hogan

    @import-keshav Someone can correct me if I’m wrong but both approaches are correct. It mostly depends on the type of information this.function_name needs. If, for example, this.function_name is expecting the same parameters as you would get from an onPressed event then you can do option one since they will be passed implicitly to the function. If you need external information that you need to pass to this.function_name then you would need to do approach 2. And actually, you aren’t ever calling the this.function_name in example two since you left off the parenthesis. For that to work you would need to do something like this:
    <View onPressed={() => this.function_name()}>

    An example of something you would need to pass in is something specific to the component possibly:
    <View onPressed={() => this.function_name(‘view_1’)> where this.function_name needs to know which component triggered the onPressed event.

    Pierre Marais
    What's the simplest way of bootstrapping a small react app that has a few pages with examples of different components (i.e. forms/login or register screen, etc.)?
    Mel Macaluso
    This message was deleted
    Iwan Aucamp
    is there some convention to store client state with url fragments in react
    or do people fake urls
    where /some/location results in same response from server as /other/location but is actually used by client?

    Wrote an article on how to dockerize you react app? https://blog.quicklyreact.com/how-to-dockerize-reactjs/

    Do let me know what you guys think.

    Ahmed Rebai
    Hi everyone
    We want at our company to create our own framework and create reusable components to be used for all our internal project
    how it can be achieved
    how can I get started ?
    there are any ressources to start with ?
    Jason Stokes
    Hey just created a new platform to help developers find jobs. Sign up for an account @ www.quirkycoders.com so that employers can find you.
    M4H3NDR4N 5P4RK3R
    Hi everyone,. How to enable XSS Protection in webpack for react project?
    Aaron Beall
    Is there a way with react-router v3 (or v4 but I'm not yet using it due to large refactoring effort) to render a matched route as a 404 page? My use case is that a valid URL might reference an object id that is not found, like /book/1234 where /book/:id is valid, but book 1234 doesn't exist and I find that out after an API call triggered by mounted the BookView route component.
    Charles Vigneault

    Hi, I just started to learn React and while learning HOC I tried first to find a solution to the problem without reading how to do it with HOC and came with a solution using cloneElement and this.props.children instead. I found a thread on StackOverFlow from 2016 talking about both solutions but I was wondering if in 2019 React community found problems with one or another solution (Which one is best practice).

    const HOC = ComposedComponent => class extends React.Component {
        ... lifecycle, state, etc;...
        render() {
          return (<ComposedComponent {...this.state} />);


    class ParentComponent extends React.Component {
        ... lifecycle, state, etc;...
        render() {
          return (
              {React.cloneElement(this.props.children, { ...this.state })}  
    Nav Saini
    Hi all! Can I use the same package.json for a react/express project?
    my main concern is if the react bundler will ignore the server related packages?
    (when bundling js assets)
    Hi All , added few docker compose stacks on github. If that help’s to anyone and also please contribute to it if anyone has anything.
    Hi guys what is the CSS code to avoid words breaking between lines.. so if the word is too long would write the word on the next line… so no hyphens, no word break thanks!