Interview Prep Flashcards
Tell me about a project that you’re particularly proud of.
–> my capstone project that completed with 2 of my colleagues at school.
Situation: We needed to build a full-stack application using the tech we had learned during our time at school and that solved a real-life problem in under 2 weeks.
Task: We set-out to create a journaling app for beginner developers, that allowed users to journal about the technologies and concepts that they are learning about on a daily basis.
Action: We created wireframes for the entire front-end, mapped out each of the routes we needed, built ERD diagrams for the database architecture and planned out most of the queries we were going to use to populate the app with data. After all the planning was done, we split up the initial work (I took the initial back-end setup) and once we had our basic CRUD operations working, we split up the remainder of the work by features.
Result: We ended up finishing the entire app 4 days early, which gave us ample time to prepare for our graduation presentation. Our team ended up having an amazing presentation, and we got a ton of praise from our peers and staff, and I’m just super proud of this cool app we built.
Tell me about a project or task that did not turn out the way you may have wanted. What would you change?
Situation
–> I was tasked with managing the development of an interactive on-boarding form that we used capture leads for our subscription program.
Task
–> Met with stakeholders to come up with feature requirements:
–> Klaviyo integration
–> Capture name, email, other personal info.
–> Lead to 3 unique subscription offerings a customer could then checkout with.
Result
–> While we were still working on finishing the MVP, stakeholders came back asking to add in a custom Google Tag Manager integration and the ability to incorporate unique discount codes into the form. I naively accepted the requests without properly vetting them.
–> Between the 2 new requests, our project had been set back by a month due to unforeseen issues with the form not playing nice with Google Tag manager since it was built as a single page application.
Change
–> If I could go back in time I wouldn’t have let scope-creep affect our project to the extent it did, and would have spent more time really nailing down the initial requirements, and built out and deployed the MVP before accepting any new requests.
Tell me about a time when you got stuck while coding. How did you work your way through the problem?
Situation
Was stuck trying to find a way re-use a form component in a React project to update as well as create a new database entry, and was not sure as to the best way to go about implementing it. I just knew that I should try and use the same component for both the create and update actions.
Action
–> first - referencd react documentation, but didn’t find much info on the specific problem.
–> Checked Stack Overflow for similar issues & approaches, and also referenced a few blog articles online through Google.
–> after some research, I was then able to come up with a hypothesis - I could have a create entry route that renders the component without passing props, and an edit route which fetches the data for a specific entry id, and passes all the data as props down to the component. Then I would have the component check to see if props exist or not to determine if it should update or create a form entry.
–> I was able to quickly test my hypothesis by console logging the contents of props between my create an update routes, while also using the React debugger in my browser to double check.
–> I then created a save function inside the form component that conditionally updated or created a new entry in the db based on the existence of props.id.
–> In the end I was able to use my single form component for both scenarios!
Describe a time when your program didn’t run. How did you troubleshoot your code?
Situation
I actually encountered this issue the other day when I was working on my portfolio website. I had a json file saved locally in my portfolio directory, that was holding details on each of the projects that I had worked on - project name, an array of technologies used, an array of file paths to project screenshots, and a project id.
Task
I was working on a function that used Node’s File System library to retrieve the contents of the json file, parse it and iterate over each of the projects and return the project with a specific id so I could display it on the page, but was having trouble getting any information back.
I quickly went to put console.logs at different parts of the function to see where the breakdown was occurring. I also made sure to include descriptions inside the console.logs so they were easy to pick-out in the terminal.
I found that was actually getting all the contents of the json file back as expected, and that the breakdown was occurring when I asked for a specific project with a project id.
By narrowing down my search to this specific part of the function, I then wanted to check what the project id was being returned as. I used the built JS method typeof to confirm that it was coming back in as a number, when the function expected a string.
I then added the toString method to the project id when I retrieved it and was finally able to display all the information as I had planned!
What is your approach to conflict management?
I typically like to manage conflict through compromise. And example of this is when:
I was dealing with excessive bloat on our website due to 3rd party scripts and apps that our marketing and design team had insisted we use - things like an instagram carousel banner, hot-jar, trust pilot, a chat widget, Klaviyo, facebook pixel and google analytics pixels, all while our store had a pretty bad lighthouse performance score ( it was somewhere in the 20s at the time”) and we new it was affecting conversion.
I knew we couldn’t get rid of all of these 3rd party scripts, especially some of the ad tracking pixels, so I wanted to come up with a compromise.
I created a document outlining all of the 3rd party apps and scripts that our site was using and went through each one with our marketing team. We were able to cut 1/3 of the apps front our storefront - some of which weren’t even being used!
In the end I think I did a good job at increasing our lighthouse score by a handful of points, all while keeping the marketing and design team happy by using comprise to manage our conflicts!
What do you know about Softdrive?
–> Softdrive allows it customers the ability to run resource intensive software on your everyday PC’s.
–> your platform helps to Extend the life of businesses hardware, reducing to spent on maintenance and provisioning and do it all in a secure way to protect data. Strong focus on the end user, and giving a great virtual desktop experience.
–> One round of funding in July 2021 through FF venture capital.
–> Started by Alan Daniels and Leonard Ivey
Why did you apply to this role?
–> Background in web development, e-commerce operations and process improvement ties in really nicely to the job requirements.
–> Looking to embed myself and work within a really close-knit team - which is something that I picked up on from the job positing. Mabel’s Labels is an innovative, inclusive and overall fun place to work!
–> Really enjoyed working on internal business tools at inkbox and would love to work on those types of projects again. Making other peoples lives easier + automating menial tasks.
Tell us a bit about your self
–> Just graduated from Lighthouse Labs full-stack web development bootcamp.
–> Have spent the last 6+ years working professional in the e-commerce start-up space, mostly in operations and process improvement.
–> Live in Niagara with my partner and 2 dogs and cat.
–> In my free-time I spend most of my time coding side-projects.
–> Trade english lessons for coding lessons with a Brazilian guy I met online. Meet weekly to go over leetcode problems and just chat.
–> Working on other hobbies - I had a 3D pixel art project I was working on for a bit, messing around with my Raspberry pi, laser engraving with a CNC machine I have in my garage.
Strengths
Ability to pickup on workflows and business processes pretty quickly.
example
- At wufers
- learned fullfillment process in 2 weeks
- documented everything
- consolidated inventory to 5 locations after noticing majority of the orders were in those areas
- was training other people on the processes in week 3
Weaknesses
I have a hard time saying no when someone asks for something, super hard to do in a small team where everyone wears a lot of hats.
I also build a list of priorities and set timelines on each to understand my own capacity and communicate that
Do you have any questions for us? (Engineering Manager)
- From what I can see it looks like you store is built on Magento/Adobe commerce, What kind of technology is your internal production software built-on?
- How much of your teams time is spent on the store vs internal systems right now and over the year?
- Do
- What are some of the toughest problems you are currently working on?
- What are you most excited to ship in 2023?
- I’d love to hear from both of you why do you like working at Mabel’s labels?
- What are the next steps in interview process.
Whats Object Oriented Programming (OOP)?
Object-oriented programming is a programming paradigm based on the concept of “objects”, which can contain data and methods specific to those objects.
Classes are used as “blueprints” for objects.
A new instance of a class (object) can be created using the “new [objectName]” command and they inherit all the properties and behaviours from the class, but each object will have different values for the properties.
Note: In a class, variables are called properties and functions are called methods!
example
class Fruit {
// Properties
public $name;
public $color;
// Methods
function set_name($name) {
$this->name = $name;
}
function get_name() {
return $this->name;
}
}
$apple = new Fruit();
$banana = new Fruit();
$apple->set_name(‘Apple’);
$banana->set_name(‘Banana’);
Whats Asynchronous Programming?
Asynchronous programming is a technique that enables your program to start a potentially long-running task and still be able to be responsive to other events while that task runs, rather than having to wait until that task has finished.
Examples of asynchronous tasks
–> fetching data from an api with fetch();
–> Accessing the user’s camera or microphone using getUserMedia();
Asking a user to select files using showOpenFilePicker();
Whats is the HTTP Protocol? How does it differ from HTTPS?
HTTPS stand for Hyper Text Transfer Protocol Secure and is a way of encrypting communication over a computer network. HTTPS is a common way to retrieve, create, update or delete the state of a resource on the server you are requesting it from.
Request methods
–> GET
–> PUT
–> POST
–> DELETE
–> HEAD
–> OPTIONS
What Are some new features in ES6 (javascript)
Some new features in ES6 include:
–> The use of “let” and “const” for variable declaration.
–> Arrow functions
–> Template literals
–> Promises
–> Classes
–> Modules
–> destructuring assignment
// destructing
let a, b, rest;
[a, b] = [10, 20];
console.log(a);
// Expected output: 10
console.log(b);
// Expected output: 20
[a, b, …rest] = [10, 20, 30, 40, 50];
console.log(rest);
// Expected output: Array [30, 40, 50]
// JS class declaration
// Declaration
class Rectangle {
constructor(height, width) {
this.height = height;
this.width = width;
}
}
