Trim your Redux Boilerplate with Redux Cornell
•
0 likes•95 views
Redux is awesome and is used in countless projects. However, using Redux does mean that there is a lot of boilerplate. Enter Redux Cornell. Named after the legendary singer Chris Cornell, Redux Cornell aims to remove most of the boilerplate which comes with using Redux, yet allows you to completely customize it. The library brings the concept of 'convention over configuration' into the JS world to help reduce boiler plate.
Recommended
Recommended
More Related Content
Similar to Trim your Redux Boilerplate with Redux Cornell
Similar to Trim your Redux Boilerplate with Redux Cornell (20)
Recently uploaded
Recently uploaded (20)
Trim your Redux Boilerplate with Redux Cornell
- 1. Trim Your Redux Boilerplate with Redux Cornell
- 2. Hello! I am Eyal Eizenberg Team Leader at Wix
- 3. Before we start... do you Redux?
- 4. Dan Abramov Creator of Redux
- 5. Why do I have to touch three files to get a simple feature working? You Might Not Need Redux Why indeed!
- 6. Redux’s Boilerplate Adding a single boolean attribute which needs to be toggled requires A LOT of code
- 7. Redux’s Boilerplate About 10 lines just to toggle a boolean Constant Selector Reducer Import everything across multiple files Actions
- 9. Is there a pattern here? How can we fix this?
- 10. Let’s rewind for a minute
- 11. Ruby On Rails relies on the convention over configuration and DRY concepts I used to develop with...
- 12. Software design paradigm used by frameworks that attempt to decrease the number of decisions that a developer using the framework is required to make, without necessarily losing flexibility Convention Over Configuration
- 13. Convention Over Configuration In other words… You only need to specify unconventional aspects of your application
- 14. A model called ‘User’ ◇ Will be in app/models/user.rb ◇ UsersController in users_controller.rb ◇ The table in the DB will be called ‘users’ ◇ Getters & setters according to the model’s properties ◇ users_helper.rb ◇ app/views/users/index.html ◇ Url will be /users/:id ◇ Customize if needed (but not recommended)
- 15. Pros ◇ Reduces boilerplate ◇ Easy to follow once you know it ◇ All apps are alike ◇ Customizable Cons ◇ Seems like voodoo ◇ You have to know the convention ◇ Difficult for noobs ◇ Customizable
- 16. Can we bring a similar concept into Redux?
- 18. Chris Cornell 1964 - 2017 ◇ Chief architect of the 1990s grunge movement ◇ 33 year long career ◇ Struggled with depression One of the best singers of all time
- 19. ~800,000 Suicides per year world wide 1 every 40 seconds! About 16,000,000 attempted suicides
- 21. Get Help! ◇ Talk to family/friend/professional ◇ www.eran.org.il ◇ www.talkspace.com ◇ www.betterhelp.com
- 22. github.com/wix/redux-cornell OSS library meant to reduce Redux’s biolerplate so you can focus on what matters most - your app!
- 23. ✔ Tiny, with zero dependencies ✔ Brings ‘Convention Over Configuration’ into Javascript ✔ Allows building complete apps without things like reducers, selectors, and consts ✔ Easy to customize Makes Redux great again!
- 24. The initialState object is analyzed by each key’s initial value How does it work? ◇ Selectors, action creators, constants are generated ◇ A ‘Super Reducer’ handles all relevant actions ◇ Does not bloat your app! Provide the main function with an initialState object ➠ ➠
- 25. Selectors getUsersAreVisible Action Creators toggleUsersAreVisible Super Reducer Will toggle users → areVisible to true/false initialState = { users: { areVisible: false } }
- 26. ◇ https://eyaleizenberg.github.io/imdb_list/index.html ◇ https://github.com/eyaleizenberg/imdb_list ◇ Sample app which uses Redux Cornell ◇ Fetches data, toggles, expands, text field... ◇ Created with react-create-app
- 28. Enough talk! Let’s see some code!
- 30. Wrap Up ◇ Write less code, focus on your app ◇ Logic inferred from data structure ◇ Convention Over Configuration ◇ What’s next?