All solutions

My second solution to this challenge. This time I implemented it using Redux state.

I did it some time ago but remembered about it just now. This was my first project on Redux but now I don't have any questions regarding this project though there may be some issues which I haven't revised.

The first solution had an issue which appeared when you tried to delete a comment and you could end up deleting several at once.

Any comment would be appreciated)

Thank you for stopping by!

In this project on top of React I tried to implement Stitches library and now I have some questions for those who had a chance of working with it or with Styled components.

Could you please tell me how you set margins on elements? Because I think such things have to be set outside the component's description because in case they are moved you should be able to just change a couple of words inside component's call and you are done. I did this by writing margins using css={{}} inside of component's call but I bumped into an issue when I tried to change margins depending on a class name that I added for animations using JS because css={{}} is like an inline css and have precedence over anything else.

And the next question, how do you handle animations with such a library? With plain CSS I could just add custom class using JS to a component that needs to be animated and describe its animation states inside CSS file.

Thank you!

This is my first project where I work with external REST API resources. For this task I decided to use Redux'es createAsyncThunk because it gives you an opportunity to easily handle different states the application is in at the moment of hooking from external API. Working with React components again I found it quite disastrous to make styles for every component in a separate file and eventually I always got lost. So, I need to find any solution to alleviate my struggles during such projects. Any code review would be amazing. Thank you!

My second SPA using Redux (the first one isn't deployed yet). I wouldn't say that I found it easy to handle this JS library, but it is definitely better than passing props throughout the React components. But still, I'm not sure that such implementation as you can see here is a rational approach since even for the sidebar I had to create a separate state in the Redux store (some adjacent components needed access to the same state).

It took me muuuuuch longer than I expected since it's my first React project. The main problem with this project is that I needed to use useState of all messages in main App component and then pass it to next components, but instead I tried to update the exact message inside of it. I understood it when I asked myself: "How would I send the whole pack of messages to the server if I had to? Did all my messages array get updated?". I figured it out by just placing a mock button at the end of the page with console logging the last message of my messages array from main App component. The result showed me that the main array of messages didn't get updated and because of that the function getId() in App component failed to assign a unique ID for new replies. Unfortunately I realized it too late and I got tired of the project so I leave it for a better days. P.S. Probably Redux could help me avoid this mistake. I'll check it in next projects!

Hello everyone! I would really appreciate your contribution if you looked at my code! This is my first solution so, please, no offense) Some issues bother me. First is BEM. Did I do it well or there are approaches that could help avoid repetative code? Second is JS. I have doubts about how I implemented showing sum of money. I needed to add innerHTML inside the block I didn't pick by .querySelector() and I chose a bandle of parentNode.nextElementSibling.innerHTML and I'm not sure whether this approach is okay or not. Any other recommendations are welcome! Thank you