React Lessons. Lesson 4. Homework.

Let’s talk about our homework. We shall notice, that in development of decorators / mixins all of logic in most cases work perfectly. It was implemented by us in the class. To complete our homework, the last thing that needs to be done is to put this logic into decorator and mixin. So that’s how our decorator will look like (src/decorators/oneOpen.js):

Decorators and mixins created to allow you to reuse your code, other words writing it once you will be able to use it in different places. What works today for articles will work tomorrow for comments, the authors or whatever. Therefore, when assigning the names of your entities create more universal (abstract) names. For example: openItem, openElement. To complete an optional part of our homework is enough to compare our received id with one we’ve  kept in the state. If so, this means that we need to close the article, to do this we can simply assign it to null, otherwise we’ll just change the id:

Our mixin (src/mixins/oneOpen.js) will be as follows:

Also ArticleList.js will be changed the following way:

ArticleListOld.js will look like this:

Please add following inscription in app.js, and delete import  of an  ArticleList:

Please compare our code with yours, and we will go further. Please check this repository for the right commits.


We are looking forward to meeting you on our website

Make your remote work more effective – Hire your first remote professional today!

Please enter correct name
Looks good!
Please enter correct email
Looks good!
Please confirm that you agree

Related articles


Top 15 Node.js Interview Questions | Theory and Practice for 2019

Node.js, a JavaScript run-time environment used by countless remote professionals today, is a hot topic in the web development sphere. To ace your>>>

Human Resources

Security, Back-End & Front-End Frameworks, Mobile Dev, Python, WordPress Podcasts — Part 3

Part 3 of podcast series on hot topics in web development; security, back- and front-end frameworks, mobile dev, WordPress, and>>>


JavaScript and React Podcasts: The Ultimate Guide to Web Development Podcasts — Part 1

This is the first blog post on React and JavaScript in a number of blog posts covering podcasts on web dev and engineering>>>

Never miss a story from Soshace
Looks good!
Please enter correct name
Please enter correct email
Looks good!
Please confirm to subscribe!