bradwestfall / css-tricks-react-series Goto Github PK

I'm concerned about the store variable export

https://github.com/bradwestfall/CSS-Tricks-React-Series/blob/master/guide-3-redux/app/store.js#L5

It is used, for example, here:

https://github.com/bradwestfall/CSS-Tricks-React-Series/blob/master/guide-3-redux/app/api/user-api.js#L36

where the dispatch function is not available.

Broadly speaking, this happens when, after a write operation, you want to refresh the application state, for example refreshing the user list.

Is this a good practice for large application?

Hi i'm getting the following issue when attempting to run gulp on a mac. I think i've installed all the necessary dependencies. any tips ? thk

[09:42:25] Using gulpfile ~/Desktop/Projects/CSS-Tricks-React-Series/guide-3-redux/gulpfile.js
[09:42:25] Starting 'serve:node'...
[09:42:25] Starting 'restore-database'...
[09:42:25] [nodemon] 1.10.0
[09:42:25] [nodemon] to restart at any time, enter rs
[09:42:25] [nodemon] watching: server.js
[09:42:25] [nodemon] starting /Users/Nico/Desktop/Projects/CSS-Tricks-React-Series/guide-3-redux/node_modules/.bin/babel-node ./server.js
sh: /Users/Nico/Desktop/Projects/CSS-Tricks-React-Series/guide-3-redux/node_modules/.bin/babel-node: No such file or directory
[09:42:25] [nodemon] failed to start process, "/Users/Nico/Desktop/Projects/CSS-Tricks-React-Series/guide-3-redux/node_modules/.bin/babel-node ./server.js" exec not found
events.js:146
throw err;
^

Error: Uncaught, unspecified "error" event. (127)
at emit (events.js:144:17)
at ChildProcess. (/Users/Nico/Desktop/Projects/CSS-Tricks-React-Series/guide-3-redux/node_modules/gulp-nodemon/node_modules/nodemon/lib/monitor/run.js:116:11)
at emitTwo (events.js:87:13)
at ChildProcess.emit (events.js:172:7)
at Process.ChildProcess._handle.onexit (internal/child_process.js:200:12)

Hi,
first of all thank you very much for this series of 3 tutorials. Great work and effort from your side.
I just started a brand new project based on your 2nd tutorial and needed some time to figure out
why i got an error message like this on startup:

import express from 'express';
^^^^^^
SyntaxError: Unexpected reserved word

A stackoverflow tip mentioned to create the file .babelrc in the root directory.
I would add a sentence on your main page too which mentions this aspect in order that Babel starts working.

Brad,

Appreciated your fix promptly in user-profile.js for typo error. However, i downloaded the fix again to find the problem still there. It looked as if the change was ignored by Webpack. After trying with installing gulp globally and running npm start and gulp watch in two terminals. The browser slowly reflected what it should be. However, i really not sure whether it needs these to Webpack to effect the change. I only know that doing gulp watch can rebuild the bundle.js from webpack for change made to any file as the bundle.js is necessary for browser to refresh after changes. Please suggest what i did is right or not. Thanks.

Its a little detail, but:

The line:

Because if not, if you navigate to users, click on an user, and then click on Widgets, you get an incorrect URL of the form:
/users/widgets.

Then if you hit Refresh (F5) you get an incorrect component.

Nice article, nice pictures, nice css ... nice all.

but i'd like go a little bit forward.
Just to ask if it will be a next article on porting your stuff to mdl, or any other material design css frameworks.
I am really frustrated on my own work to merge react-router with this framework.

I have change the index like this index

On main-layout i translated some of the samples in this, but i don't know how to link the menu with the Link component of react-router, and show the result in the 'container'

Thanks in advance

Is this intentionally not became a Stateless Functional Component?

Thank you

I recently came across this series on css-tricks and I have to say it's one of the best React tutorials I've found. This isn't really an issue as it is more of a question. I'm currently working on converting my website over to React using this tutorial. I have a layout component with Nav, Header, Footer components all of which are stateless functional components. Some of my pages do not use the header, and the ones that do need to have a class on them designating a background image to use. My question is, without making a separate layout without the header component, what is the best way to pass props from the router to the header component to either add a class, or not show it at all? Or is passing props from the router not a viable approach?

Hi,

I try to run your app Guide-3 on my local server, and it doesn't work at all. Any idea?

Thanks,

I try to run it on chrome and other browser and it works completely fine, but when I use IE the users and widgets on the list is zero, or no list of user/widget at all.

is there any other way to dispatch store using IE ?

Would love to build the final project in guide 3 from scratch without using the code in the repo. Which start kit would you recommend for such undertaking?

Thanks a lot for the wonderful guide. It makes the redux bit much clearer in my head.

Is there a simple solution to these PropTypes warnings to ensure that the code doesn't crash in future React versions?

The json-server is not starting for windows if there are spaces in the path.

c:\program' is not recognized as a command

Errors are coming from the gulpfile.js. It's working for me at the moment if I'm adding quotes to the __dirname, but I guess that's not the right solution.
gulpfile.js:43&54 var serverPath = path.join('"'+__dirname+'"', 'node_modules/.bin/json-server');

Big thumps up for the tutorial/article! 👍