travelingtonic/Practice Mock Interview

## Practice Mock Interview
General questions
  What are your greatest strengths as a web developer?
    // I like to learn and try new things. When I'm coding I like to think of multiple approaches to tackling a feature.
  What experience do you have working in a fast-paced environment?
    // Currently working for a healthcare IT company. Requires responsiveness because someone's health is waiting on our ability to deliver.
    // Previously worked for an eCommerce company. Time is money so systems had to post data quickly and accurately to get the most sales.
  What technologies are you most excited to learn?
    // React - it's used in my company by our frontend teams to build patient and provider portals.

Technical questions
  What is the purpose of the doctype command? (Lesson 1.1)
    // DOCTYPE tells the browser how to parse the code for the page. DOCTYPE html means the page is written in html.
  What is a <head> element? (Lesson 1.1)
    // The head tag appears above the body in HTML. It is used to specify any metadata about the page. You would include links to resources needed to parse the page, like CSS or JavaScript files.
  What is semantic HTML, and why is it important? (Lesson 1.2)
    // Semantic HTML is using HTML elements that indicate the meaning of the content within them. Instead of a div or span, if the text is an article, use article element. Or header for text that is the page header.
  What is the difference between classes and IDs in HTML and CSS? (Lesson 1.3)
    // Classes and IDs are both methods for naming and identifying an element. Classes are reusable, IDs must be unique.
  What does * { box-sizing: border-box; } do? What are its advantages? (Lesson 1.3)
    // Box-Sizing border-box is used in CSS to tell the browser to render all elements to the exact dimensions provided (including margins and padding).
    // This CSS is applying that styling to all elements. Benefit is you can set the exact dimensions of each element.
    // Without box-sizing set to border-box, the dimensions would apply to the element and margin and padding would be additional to that.
  How is an inline element different from a block level element? (Lesson 1.4)
    // Inline and block describe how an element is positioned.
    // An inline element will appear in the same line as other inline elements around it.
    // A block element will appear on its own line.
  What's an example of a situation where you would use a <form> element? (Lesson 1.5)
    // Forms are used to capture input from someone on your page. Examples include: contact us, registration, or data entry.
  What are media queries? (Lesson 1.6)
    // @media tags in CSS are used as in responsive design to apply CSS rules in certain conditions.
    // For example applying rules that should only be used when the display/viewport is less than 600px wide.
  Why are grids valuable? (Lesson 1.6)
    // Grids in CSS are used in responsive design to adjust the display of content based on the viewport size.
    // For example, content is laid out in rows and columns and the sizing of those rows and columns are adjusted in size and position.
  What is a function? (Lesson 2.2)
    // A function in JavaScript is used to specify some code that will be run when the function is called.
    // Functions are good for organizing code into small, purposeful chunks.
    // They're good for writing logic or behavior that's reusable.
  What is DOM manipulation? (Lesson 3.1)
    // DOM stands for Document Object Model. The DOM is the JavaScript interface for interacting with HTML.
    // DOM manipulation is used to modify html elements from within JavaScript.
    // Once you traverse the DOM and find an element(s), it can be used to show, hide, or edit change elements and content.
  What is an event listener? (Lesson 3.1)
    // An event listener is used in JavaScript to listen for a certain event and then take some action when that event occurs.
    // For example, you can set an event listener for a button click and when that click occurs you can show or hide elements on the page.
  What is spaghetti code? How can you avoid it, and why should you? (Lesson 3.2)
    // Spaghetti code is HTML and/or JavaScript code that's all tangle together so that it's not easy to see what the code is doing.
    // It makes it difficult to understand and re-use code which can lead to a lot of duplication.
    // You can avoid it by thinking through the use cases you need to solve for and writing out pseudocode to structure your code
    // before you start writing the actual code.

Project reflection
  Tell me about a problem you encountered while working on this project and how you solved it.
    // Initially my event handlers for button clicks were firing multiple times. I used Google Dev Tools to find the handlers firing.
    // The cause was that I placed the event handlers in the functions that I called to determine which page to render.
    // To resolve I split the handlers into their own functions and I call them in my startup function so they are only called once.
  If you were given an extra week on this project, what would you add or change?
    // I would add global variables to handle the state of the quiz (where the user is in the quiz)
    // I would then re-write the render() function to use those variables instead of passing in strings for the view to render
  What are you most proud of in regards to this project?
    // I was able to find a randomizer function on stackoverflow and implement it so it worked properly in my quiz.
	General questions
	What are your greatest strengths as a web developer?
	// I like to learn and try new things. When I'm coding I like to think of multiple approaches to tackling a feature.
	What experience do you have working in a fast-paced environment?
	// Currently working for a healthcare IT company. Requires responsiveness because someone's health is waiting on our ability to deliver.
	// Previously worked for an eCommerce company. Time is money so systems had to post data quickly and accurately to get the most sales.
	What technologies are you most excited to learn?
	// React - it's used in my company by our frontend teams to build patient and provider portals.

	Technical questions
	What is the purpose of the doctype command? (Lesson 1.1)
	// DOCTYPE tells the browser how to parse the code for the page. DOCTYPE html means the page is written in html.
	What is a <head> element? (Lesson 1.1)
	// The head tag appears above the body in HTML. It is used to specify any metadata about the page. You would include links to resources needed to parse the page, like CSS or JavaScript files.
	What is semantic HTML, and why is it important? (Lesson 1.2)
	// Semantic HTML is using HTML elements that indicate the meaning of the content within them. Instead of a div or span, if the text is an article, use article element. Or header for text that is the page header.
	What is the difference between classes and IDs in HTML and CSS? (Lesson 1.3)
	// Classes and IDs are both methods for naming and identifying an element. Classes are reusable, IDs must be unique.
	What does * { box-sizing: border-box; } do? What are its advantages? (Lesson 1.3)
	// Box-Sizing border-box is used in CSS to tell the browser to render all elements to the exact dimensions provided (including margins and padding).
	// This CSS is applying that styling to all elements. Benefit is you can set the exact dimensions of each element.
	// Without box-sizing set to border-box, the dimensions would apply to the element and margin and padding would be additional to that.
	How is an inline element different from a block level element? (Lesson 1.4)
	// Inline and block describe how an element is positioned.
	// An inline element will appear in the same line as other inline elements around it.
	// A block element will appear on its own line.
	What's an example of a situation where you would use a <form> element? (Lesson 1.5)
	// Forms are used to capture input from someone on your page. Examples include: contact us, registration, or data entry.
	What are media queries? (Lesson 1.6)
	// @media tags in CSS are used as in responsive design to apply CSS rules in certain conditions.
	// For example applying rules that should only be used when the display/viewport is less than 600px wide.
	Why are grids valuable? (Lesson 1.6)
	// Grids in CSS are used in responsive design to adjust the display of content based on the viewport size.
	// For example, content is laid out in rows and columns and the sizing of those rows and columns are adjusted in size and position.
	What is a function? (Lesson 2.2)
	// A function in JavaScript is used to specify some code that will be run when the function is called.
	// Functions are good for organizing code into small, purposeful chunks.
	// They're good for writing logic or behavior that's reusable.
	What is DOM manipulation? (Lesson 3.1)
	// DOM stands for Document Object Model. The DOM is the JavaScript interface for interacting with HTML.
	// DOM manipulation is used to modify html elements from within JavaScript.
	// Once you traverse the DOM and find an element(s), it can be used to show, hide, or edit change elements and content.
	What is an event listener? (Lesson 3.1)
	// An event listener is used in JavaScript to listen for a certain event and then take some action when that event occurs.
	// For example, you can set an event listener for a button click and when that click occurs you can show or hide elements on the page.
	What is spaghetti code? How can you avoid it, and why should you? (Lesson 3.2)
	// Spaghetti code is HTML and/or JavaScript code that's all tangle together so that it's not easy to see what the code is doing.
	// It makes it difficult to understand and re-use code which can lead to a lot of duplication.
	// You can avoid it by thinking through the use cases you need to solve for and writing out pseudocode to structure your code
	// before you start writing the actual code.

	Project reflection
	Tell me about a problem you encountered while working on this project and how you solved it.
	// Initially my event handlers for button clicks were firing multiple times. I used Google Dev Tools to find the handlers firing.
	// The cause was that I placed the event handlers in the functions that I called to determine which page to render.
	// To resolve I split the handlers into their own functions and I call them in my startup function so they are only called once.
	If you were given an extra week on this project, what would you add or change?
	// I would add global variables to handle the state of the quiz (where the user is in the quiz)
	// I would then re-write the render() function to use those variables instead of passing in strings for the view to render
	What are you most proud of in regards to this project?
	// I was able to find a randomizer function on stackoverflow and implement it so it worked properly in my quiz.