back

by ed_balls·9y ago·view on hn ↗
What React is missing is a set of idioms and patterns. When you inherit Angular or Django project it's quite easy to understand it and be productive if someone follows the philosophy.

Create-React-App is a great step, but what next? How to handle AJAX and state if I have a simple app and don't really need Redux. How to structure it so it would be easy to add it.

4 comments
There _are_ many patterns that exist already, and have been widely discussed in the React world (such as "Higher Order Components" for code reuse).

You may be interested in several of the sections in my React/Redux links list at https://github.com/markerikson/react-redux-links . In particular, check out the "React Architecture", "React Component Patterns", "React State Management", "React and AJAX", "Redux Architecture", and "Project Structure" sections.

To pick out a few specific links related to your questions:

- http://reactpatterns.com/

- https://github.com/vasanthk/react-bits

- https://medium.com/@dan_abramov/smart-and-dumb-components-7c...

- https://daveceddia.com/ajax-requests-in-react/

- https://daveceddia.com/visual-guide-to-state-in-react/

- https://hackernoon.com/redux-step-by-step-a-simple-and-robus...

Thanks for that. Really helpful.

Is there a great mid-size open-source project that was created with Create React App? Any input on UI frameworks? I'm currently using React-Bootstrap, but I'm thinking about using Material-UI.

Mmm... not sure about apps specifically built with CRA. I do have a list of a few selected interesting-looking apps built with Redux (and React) in my Redux ecosystem catalog [0] . Haven't updated that section in a while, though, and it's definitely not comprehensive, but there's a useful variety of apps to look at.

I personally am using Semantic-UI-React [1] in a work project, as well as in the sample app for my "Practical Redux" tutorial series [2] [3]. I also frequently recommend a tutorial series called "Building a Simple CRUD App with React + Redux" [4] as another "real-world" tutorial/example. That tutorial doesn't use CRA, but my "Practical Redux" sample app does.

[0] https://github.com/markerikson/redux-ecosystem-links/blob/ma...

[1] http://react.semantic-ui.com/

[2] https://github.com/markerikson/project-minimek

[3] http://blog.isquaredsoftware.com/series/practical-redux/

[4] http://www.thegreatcodeadventure.com/building-a-simple-crud-...

Perhaps the React ecosystem is a powerful set of tools for experienced developers that don't need idioms to patterns to build upon?
The best solution would probably be to bubble up state mutations to a single place per data model area, and factor out the http calls per data model area, grouping as needed. I'd rather just use redux with thunks that use async/await though personally than write this from scratch.
would be cool to have some more patterns, but I think that's an easy one to solve with a quick search.

i.e. you can just do it inside the component: https://gist.github.com/mentrie/8632e81ae2960df8d02947b8b743...