ACA 400 — Week 5 Questions

Redux and React, a hard to learn, easy to follow structure.

Sean Yager
3 min readSep 10, 2020
Photo by Christopher Rusev on Unsplash

React and Redux are great, together they make a fantastic development environment, that’s well structured and scale-able. React isn’t easy to learn as your first build tool, so if you’re unfamiliar with frameworks it’s going to take some hard work and dedication to learn the ins and outs.

Discuss in words something you learned in class today or this week.

Containers, Actions, Mutations, mapStateToProps, mapDispatchToProps, and the list goes on. That’s Redux in a condensed and in-exhaustive nutshell. mapStateToProps and mapDispatchToProps are core parts of Redux, allowing our Components to access “actions” and the “state” of the Redux store.

What is Redux?

Redux is a state management system for React.

What is ‘Store’ in Redux?

The store is the source of truth in Redux. It is a Javascript file containing an object called “state” which holds all instances of our data in a JSON tree.

How is state changed in Redux?

To change state in Redux, we use setState(), which allows the state to be reactive.

What is the difference between a Presentational component and a Container component?

The article written by Dan Abramov on this subject will explain their relationship much better than I could, but here’s my take:

Presentational components are front end components, they are pretty “functional components”. Presentational components are usually smaller in scope. Container components are concerned with how things work in the JavaScript. They provide the data to other components and are usually larger in scope than Presentational components. This is all a simplification of these types of components though, and should be taken with a grain of salt, and the full explanation via Dan above.

What is the second argument that can optionally be passed to setState and what is its purpose?

It’s an optional callback that is triggered once the setState() call is completed. React recommends not using this callback option though, and instead using componentDidUpdate() for most cases.

Which (if there is) node library method could you use to solve the algorithm problem you solved last night in your pre-homework.

Again and again and again this question is a nightmare of vague nonsense.

Which (if there is) node library method could you use to solve the algorithm problem you solved in class tonight?

What is your opinion of currently popular frameworks/libraries? List and provide your thoughts.

Love Vue, and I’m learning to love React. As someone who learned Vue first, re-training my brain to work with React has been difficult. I find React to be more convoluted and abstract than Vue. Reacts component system is more modular and focused on the abstractions of data into variables, where as Vue is more concerned with the components being more self contained and declarative in their data.

React uses an expansive folder network and focuses on the JavaScript to handle styling, with makeStyle and object-ified CSS. I prefer the simplicity of Vue’s scoped <style> tags in their components. It’s much more direct and doesn’t abstract the CSS out any further. I’m obviously new to React and have a better understanding of Vue than React so I may be mis-speaking for React, but my experience is valid non the less.

Austin Coding Academy

--

--

Sean Yager

Comics artist and web developer located in Austin, TX telling stories and making up fantasy worlds for fun.