Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • Dec 01 07:11
    lqminh268 commented #3071
  • Dec 01 07:08
    lqminh268 commented #3071
  • Dec 01 07:07
    lqminh268 commented #3071
  • Nov 12 16:13

    dependabot[bot] on npm_and_yarn

    Bump minimatch from 3.0.4 to 3.… (compare)

  • Nov 12 16:13
    dependabot[bot] labeled #3072
  • Nov 12 16:13
    dependabot[bot] opened #3072
  • Oct 12 16:02
    code-by edited #3071
  • Oct 10 17:19
    theumairriaz commented #3067
  • Oct 06 05:52

    dependabot[bot] on npm_and_yarn

    Bump css-what from 2.1.0 to 2.1… (compare)

  • Oct 06 05:52
    dependabot[bot] labeled #3070
  • Oct 06 05:52
    dependabot[bot] opened #3070
  • Sep 27 23:32
    binaryfire commented #2906
  • Sep 15 12:34
    huwaizatahir2 opened #3067
  • Aug 17 17:58
    Pavan90 commented #2912
  • Aug 16 23:42
    SauveJeanLuc opened #3065
  • Jul 22 15:39
    MokonyanaT commented #2929
  • Jul 22 11:17
    harishydav closed #3042
  • Jul 18 07:18
    Techi-Dev commented #3062
  • Jul 18 07:13
    Techi-Dev commented #3062
  • Jul 06 17:04
    close-issue-app[bot] closed #3064
Michael Cuneo
@michaelcuneo
The difference is just some simple logic
Mathias Hoffmann
@liitfr
haha no need to be pedantic if it's that trivial !
jose sebastian manunta
@smanunta
@cumibulat hey thanks for the response.. follow up question. after running the build, inside my build folder i have about 30 files with all encoded names. some are .js, .png, .ttf, and then the index.html. My questions are do those files sound correct and should i be able be to render the app by just opening the index.html OR does it need to run through a server first?
nikjohn
@nik-john

Hi, I'm new to this room but have been using react-boilerplate for a while now. I have a query about nested Redux states and would really appreciate it if someone can help me figure this out.

As per the redux docs, it's most advisable to keep the redux state separated as domains.

{
    simpleDomainData1: {....},
    simpleDomainData2: {....},
    entities : {
        entityType1 : {....},
        entityType2 : {....}
    },
    ui : {
        uiSection1 : {....},
        uiSection2 : {....}
    }
}

How do achieve this data structure in react-boilerplate? I have been creating my Containers using the built-in generators, and keeping them all at the same level like so:

App
|__ Components
|__ Containers
      |__ Container1
      |__ Container2
      |__ Container3
      |__ Container4
      :
      :

My redux state is super normalized like so:

{
  route: {
    location: {
      ....
    }
  },
  container1: {
    data: {}
  },
  container2: {
    data: {}
  },
  container3: {
    data: {}
  },
  container4: {
    data: {}
  }
}

But I am now at a place where I need to nest Containers 2 and 3 within Container 1 (according to the business logic). How can I also mirror this structure on my redux store?

{
  route: {
    location: {
      ....
    }
  },
  container1: {
    data: {
          container2: {
                 data: {...}
           },
           container3: {
                data: {...}
           },
       }
  },
  container4: {
    data: {}
  }
}

How can we use injectReducer to implement nested states? Or is there another approach that you all use? TIA!!

nikjohn
@nik-john
@mxstbr I'm not sure if the norm is to tag you personally, so sorry if I'm breaking protocol here. Would love to hear your input on this. I saw a few discussions on GitHub but nothing pertaining to this exact issue. There was one issue on Stackoverflow that went unanswered as well. I realize this is a basic question, but I somehow don't seem to be able to wrap my head around it
nikjohn
@nik-john

I have tried having all of the reducers for Container1 defined under /Container1, thereby giving me control of the whole state, but that seems like an anti-pattern

I haven't yet tried nesting Containers 2 and 3 inside Container1 because I couldn't figure out how the injectReducer util would work under those circumstances.

cumibulat
@cumibulat
@smanunta yes you need server to serve your app.
saeedjalali
@saeedjalali1
Hi everyone.
I have a question about the new version of Babel.
I found in dev branch you adding babel 7. Is it possible to use together Typescript file and JavaScript file?
rayman1104
@rayman1104
Hi!
I'm using react-boilerplate for almost half a year. And my question is... Do I really need reducers & saga asynchronous injections?
Seems like that is very small part of code, but sometimes it's very inconvenient when I can't use reducers from other component that is not loaded.
Maybe someone can explain what's the point of not loading all sagas and reducers when user is logging in to the app? Is there real performance difference?
Troy Dietz
@troydietz
@rayman1104 You do not need to load reducers and sagas async that live and die with components. They included the more complicated approaches (withReducers, withSagas), but you do not need to use them. I personally have several use cases where global sagas and global reducers make sense, and thats exactly how I implemented it.
rayman1104
@rayman1104
@troydietz Thank you for the answer! I'll drop "reducers and sagas that live and die with components" pattern and will group them more wisely.
Maybe I should use provider-components that won't render anything and only have some reducers and sagas logic? For example authProvider component that has all auth reducers and sagas and I can include it wherever I want. Or only include its saga, reducers with injectSaga({ key: 'authProvider', saga });
Troy Dietz
@troydietz
@rayman1104
Troy Dietz
@troydietz
I don’t think you should create components for the simple purpose of implementing a global reducer or saga. Components are intended to be a mechanism for implementing things you can see, like html. In my opinion, you should add global reducers in the reducers.js file. I don’t have my repo open at the moment so I can’t check, but I’m pretty sure there’s one example in react-boilerplate already. I think it’s the language reducer or route reducer. I’d follow that pattern. As far as global sagas, react-boilerplate does not have architecture for that yet. This is an acknowledged missing feature. This issue has been raised in the past and the contributors are aware of its common use case. However, no one has created a PR that implements global sagas. I have my own implementation. I created a sagas.js file, much like the reducers.js file that comes with react-boilerplate. If you follow the redux-saga docs, it’s not hard to implement your own. If you’d like to see how I did it, send me your email. I also may attempt to open my implementation as a PR on the react-boilerplate in the future.
rayman1104
@rayman1104
@troydietz Ok, but I can't understand where is the line between making all reducers and sagas global and making some sagas-reducers global, some local. Is it ok to have all reducers in global scope or is it bad design? Looks like there is no big performance gain in loading reducers-sagas only when a user opens the exact page.
BTW, if you think that putting sagas-reducers in the dumb component is a bad idea, what do you think about using TopBar for such purposes? :) I have TopBar on all pages in the dashboard, so I can put all sagas-reducers in this component as a dirty hack.
Arnaldo Gabriel
@agmm
How can I get the url parameters from a React component?
nikjohn
@nik-john

@agmm If you are in a component wrapper in withRouter, you can just do something like this:

function Component(props) {
console.log(props.match, props.location);
}
.
.
export default withRouter(Component);

If your component is wrapper in the withRouter HoC, match, location etc will be passed in as props

Arnaldo Gabriel
@agmm
@nik-john Thanks. I will give it a try.
trung-pham
@trung-pham
is there anyway i could use multiple FormattedMessage with Helmet ?
Ghulam Hussain
@ghulamhussain
is there any resources to convert react-boiler plate app to react-native app.
BaptisteGarcin
@BaptisteGarcin
Hi, how can I add hot reloading to the server directory, I tried nodemon but it prevents the page from automatically refresh
BaptisteGarcin
@BaptisteGarcin
@nik-john
Sean
@Globolobo
@BaptisteGarcin Checkout the hot reload middleware's github page, they have some links there to do it
Kamran Nazir
@Kamran1122
Hello guys is it possible to use css-modules and sass together in react-boilerplate?
BaptisteGarcin
@BaptisteGarcin
@Globolobo I read the doc and tried to pass webpack-hot options in addDevMiddlewares.js withotu succcess
Swapnil Bukkawar
@swapbuk
Hi, I am trying to add antd module to react-boilerplate 3.6.0 , but its not working . is anybody having such issue ?
Swapnil Bukkawar
@swapbuk
How to add third party lib in react-boilerplate ?
Jim Lesperance
@cooljl31
Hi @swapbuk please read the Doc Specifying dependencies
Swapnil Bukkawar
@swapbuk
@cooljl31 thanks Jim
Carlos Santiago
@csantiago132
hi, how exactly the server gets added to the buil?
Gabriel Fernandez
@hotdesc

Hello everyone,

Could someone explain to me the best way to integrate the admin-lte template with boilerplate? I was very much in doubt about the best way to add deployments like jquery and bootstrap

Karma Drukpa
@coderkarma
learning react now.
how can I render a component into the DOM?
Any help will be appreciated.
Tobias Winkler
@hurrtz
hey folks, i am wondering: why does react boilerplate use .js files over .jsx? is there a specific reason for this decision?
Tobias Winkler
@hurrtz
howardya
@howardya
has anyone has seen a pwa version of this boilerplate with service worker setup?
liujian zhang
@ziaochina
React that can't see the jsx.makajs.org
Jack
@jackdh
Hey, have I broken someting or is state not meant to persist when hot reloading?
Đặng Xuân Quang
@xquangdang
Hi there. Anyone having problem with content download is too slow?
My main.js is about 800kB (~200kB gzip) but it take almost 0.5s to download the content
Jason
@xoxoj
Hello

Anyone, in combination with semantic ui in the react-boilerplate (https://react.semantic-ui.com/usage), I executed the yarn add semantic-ui-react in the root directory of the react-boilerplate
There was an error:

Error /home/atom/FormalProject/react-boilerplate/node_modules/pngquant-bin: Command failed.
Exit code: 1
Command: node lib/install.js
Arguments:
Directory: /home/atom/FormalProject/react-boilerplate/node_modules/pngquant-bin
Output:
⚠ The /home/atom/FormalProject/react-boilerplate/node_modules/pngquant-bin/vendor/pngquant binary doesn't seem to work correctly
Png pngquant pre-build test failed
i compiling from source
Png pngquant pre-build test passed successfully
✖ Error: pngquant failed to build, make sure that libpng-dev is installed

Jason
@xoxoj
ok. I solved it
Davidmycodeguy
@Davidmycodeguy
Hi what react-boilerplate think about organizing by features instead of components and containers.
Liu Zhiheng
@ZaynJarvis
Hi, have anyone setup Github pages of react-boiler plate by Travis?
Jorge Gomez
@jorexe
Hi, does anybody worked with firebase and this boilerplate? I want to try to work with push notifications online and offline.
Jason
@xoxoj
Can someone discuss the following with me about store integration?
Jason
@xoxoj
i cant find rootSaga
sol404
@sol404
Hi$