ACA 400 — Week 8

So long, and thanks for all the phishing advice.

Sean Yager
4 min readOct 2, 2020
Photo by Sebastian Pena Lambarri on Unsplash

This last week of Coding Bootcamp felt great, it was a lot of self guided work. More than usual and the free reign over our capstone projects gave me the sense that I could finally call myself a Full Stack Web Developer. Something about being turned loose to build whatever web app I wanted completely eliminated any imposter syndrome I’d been feeling.

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

This penultimate week featured a lot of learning at our own pace. While I didn’t feel like class taught me anything in particular, I did learn a bit about Debugging in the pre-course material. Debugging is something that can be handled externally or internally with your code. You can code in your own debugging, often with error logs but sometimes the tried and true console.log is all you need.

Explain the use cases for, and differences between — bind, apply and call.

It all boils down to this. No this isn’t a “Who’s on First” bit, this in JavaScript refers to context when looking through the lens of an Object Oriented Coding Language. I won’t get into the complexity of this and instead for now focus on answering bind, apply, and call.

Really these three musketeers are used to set what the this keyword refers to. For brevity, I’ll explain each of the three keywords in a single sentence.

Using Bind

Bind() simply sets the this scope of a function to the argument (typically an object) you pass in. This usage makes a copy of the function and applies the this scope to the new function. For example:

const howOld = () => {
console.log(`${this.name} the ${this.species} is ${this.age} years old`);
}
const shrek = {
name: 'Shrek',
species: 'Ogre'
age: 30,
};
const shreksAge = howOld.bind(shrek);shreksAge();
//Shrek the Ogre is 30 years old.

Using Call

call is the same usage as bind but does not make a copy of the original function, and executes the function immediately.

const howOld = () => {
console.log(`${this.name} the ${this.species} is ${this.age} years old`);
}
const shrek = {
name: 'Shrek',
species: 'Ogre'
age: 30,
};
const shreksAge = howOld.bind(shrek);shreksAge();
//Shrek the Ogre is 30 years old.

Using Apply

apply is essentially builds off of call and accepts, not a comma separated list of arguments but an array instead.

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

Oh this poor dead horse.

How do you handle code organization?

It’s a big question, that could be paragraphs on paragraphs of answers. But here’s the bullet points.

  • Use a Framework
  • Keep a solid, intuitive folder structure
  • Don’t repeat yourself
  • Keep important code commented
  • Use a linter
  • Use object destructuring with your imports

How do you handle dependency management?

I usually just let VScode handle my package management. I haven’t delved too deep into manually managing dependencies. Use only what you need. Do your research, and read the package documentation. Keep the most important dependencies in your main.js

What is React.cloneElement? And the difference with this.props.children?

Say you want to take a component that displays different images based on props passed down to it. Using React.cloneElement() allows you to provide new props to the same component and reuse the functionality of that component.

this.props.children is an additional way of reusing a function. It’s syntax sugar as far as I can tell. If you have a component named <Pictures/> you could use that component with opening and closing tags rather than using it as a self closing tag. Anything placed between those tags could be used as props. Something like this:

<Pictures>
<img src="source1.png">
<img src="source2.png">
</Pictures>

Walk us through the process of creation of an application or website you’ve built.

More bullet points, cause I’m not up for writing a short novel. I’ll use my recently built website for an Indiana rehab company as an example.

  • Start by planning out the layout, functionality, and perceived challenges you’ll run into during app creation.
  • Lay out the site based on wireframing and include reusable components where you can — like headers, footers, and navbars.
  • Use a Material.UI plugin. Either CSS framework or other similar rapid development tool.
  • Go slow at first and build a clean base to expand off of.
  • Make it work to an acceptable level.
  • Tweak and perfect the app.

What are the differences between functional and imperative programming styles, and explain your preference, if any.

I don’t know enough to describe the differences without research and want to spend some time to research properly. I’ll come back to this question sometime in the future and revise this response.

That’s a wrap, entirely! I’m planning on coming back to the fray in a few weeks and re-answering all these interview questions with my new knowledge. Thanks for coming along on this journey and allowing me to learn and grow without judgement.

Austin Coding Academy

--

--

Sean Yager

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