15 General Interview Questions for a Frontend Developer in 2019
Tags: interview, frontend, javascript, frontendinterviews
Published: 2019-08-21 13:47:46

---
cover_image: 'https://thepracticaldev.s3.amazonaws.com/i/q0u3xuis00934b3wp672.png'

title: 15 General Interview Questions for a Frontend Developer in 2019
published: true
description: A set of typical questions put to a beginner in frontend development
tags: interview, frontend, javascript, frontend interviews
---


**1. How would you implement a TIC TAC TOE game, in you preferred language?**
You can use the Minimax Algorithm in Game Theory. [Refer](https://www.geeksforgeeks.org/minimax-algorithm-in-game-theory-set-3-tic-tac-toe-ai-finding-optimal-move/) this post from [GeeksforGeeks](https://www.geeksforgeeks.org/).

**2. How important is unit testing?**
Unit testing reduces the number of bugs released during deployment, making it critical to effective software development. Here’s a look at this type of testing and why you should check with your development team to make sure it’s making it into the software development cycle.

**3. Explain Aglie vs Waterwall model in software development.**
  
|                               Agile                                |                                            Waterfall                                            |
|--------------------------------------------------------------------|-------------------------------------------------------------------------------------------------|
| It separates the project development lifecycle into sprints        | Software development process is divided into distinct phases.                                   |
| Agile methodology is known for its flexibility                     | Waterfall is a structured software development methodology so most times it can be quite rigid. |
| Agile can be considered as a collection of many different projects | Software development will be completed as one single project.                                   |
| Test plan is reviewed after each sprint                            | The test plan is rarely discussed during the test phase.                                        |
**4. What is TDD and BDD?**
  
|                                                                Test Driven Development (TDD)                                                                |                                             Behavior Driven Development (BDD)                                              |
|-------------------------------------------------------------------------------------------------------------------------------------------------------------|----------------------------------------------------------------------------------------------------------------------------|
| A developer, based on requirement documents, writes an automated test case.                                                                                 | Behavior of the user is defined by a product owner/business analyst/QA in simple English.                                  |
| Automated test scripts are run against what is currently developed and the tests fail, as they should since none of the features have been implemented yet. | These are then converted to automated scripts to run against functional code.                                              |
| Development team functional code to ensure the automated test script gives them a green light.                                                              | The development team then starts writing the functional code to ensure the automated test script gives them a green light. |
| The development team can then refactor and organize the code to produce a tested deliverable at the end of the sprint.                                      | The development team can then refactor and organize the code to produce a tested deliverable at the end of the sprint.     |

**5. What is a CNAME?**
A Canonical Name record (abbreviated as CNAME record) is a type of resource record in the Domain Name System (DNS) which maps one domain name (an alias) to another (the Canonical Name)

**6.How would you make sure your page is optimized for performance and SEO?**

 - Enable compression Minify CSS, JavaScript, and HTML 
 - Reduce redirects
 - Use a content distribution network Improve server response time
 - Optimize images

**7. What do you understand by Web accessibility and ARIA?**
WAI-ARIA, the Accessible Rich Internet Applications Suite, defines a way to make Web content and Web applications more accessible to people with disabilities. It especially helps with dynamic content and advanced user interface controls developed with Ajax, HTML, JavaScript, and related technologies.
Aria roles, properties and states help screen readers identify what content is displayed on the screen. Examples :

    <label aria-required="true"></label>
    <input type="checkbox" aria-disabled="true">
    <input type="search" role="search">
    <nav role="navigation" aria-labelledby="navigation"></nav>

**8. What latest frontend frameworks have you worked upon lately?**
Here you explain your projects done during internship or in industry so far. Explain the tech stack you used and what all roles you exhibited.

**9. What is a MVC model/framework?**
The Model View Controller (MVC) design pattern specifies that an application consist of a data model, presentation information, and control information. The pattern requires that each of these be separated into different objects.
MVC is more of an architectural pattern, but not for complete application. MVC mostly relates to the UI / interaction layer of an application. You’re still going to need business logic layer, maybe some service layer and data access layer.
The Model contains only the pure application data, it contains no logic describing how to present the data to a user.
The View presents the model’s data to the user. The view knows how to access the model’s data, but it does not know what this data means or what the user can do to manipulate it.
The Controller exists between the view and the model. It listens to events triggered by the view (or another external source) and executes the appropriate reaction to these events.

**10. What is docker?**
Docker is a tool designed to make it easier to create, deploy, and run applications by using containers. Containers allow a developer to package up an application with all of the parts it needs, such as libraries and other dependencies, and ship it all out as one package.
 
 **11. What is CDN?**
A content delivery network (CDN) refers to a geographically distributed group of servers that work together to provide fast delivery of Internet content. The goal is to provide high availability and high performance by distributing the service spatially relative to end-users.

 **12. What is web browser?**
A web browser is a software program that allows a user to locate, access, and display web pages. In common usage, a web browser is usually shortened to “browser.” Browsers are used primarily for displaying and accessing websites on the internet, as well as other content created using languages such as Hypertext Markup Language (HTML) and Extensible Markup Language (XML).
Browsers translate web pages and websites delivered using Hypertext Transfer Protocol (HTTP) into human-readable content. They also have the ability to display other protocols and prefixes, such as secure HTTP (HTTPS), File Transfer Protocol (FTP), email handling (mailto:), and files (file:). In addition, most browsers also support external plug-ins required to display active content, such as in-page video, audio and game content.

**13. What browser engines are used in chrome, Firefox and IE?**

 - Safari — Webkit 
 - Chrome — Blink
 - Firefox — Gecko 
 - IE — Trident

 **14. How would you make your code is cross browser compatible?**
 - Define Valid Doctype
 - Using CSS Resets like Eric Meyerweb’s reset.css or normalize.css
 - Conditional Comments to separate stylesheets for browsers
    ```
    <link type=”text/css” href=”style.css” />
    <! — [If IE]>
    <link type=”text/css” href=”IEHacks.css” />
    <![endif] →
    <! — [if !IE]>
    <link type=”text/css” href=”NonIEHacks.css” />
    <![endif] →
    ```

**15. Do you understand design patterns? What all design patterns have you used?**
- Structural Patterns: They describe how objects and classes can be combined to form larger structures. Examples are: Adapter, Bridge, Composite, Decorator

- Creational Patterns: All the creational patterns define the best possible way in which an object can be instantiated. These describes the best way to CREATE object instances. There are five types of Creational Patterns namely :Factory Pattern, Abstract Factory Pattern, Builder Pattern, Prototype Pattern and Singleton Pattern

- Behavioral Patterns: Behavioral patterns are those which are concerned with interactions between the objects. The interactions between the objects should be such that they are talking to each other and still are loosely coupled. The loose coupling is the key to n-tier architectures. In this, the implementation and the client should be loosely coupled in order to avoid hard-coding and dependencies. The behavioral patterns are: Data Access Object Pattern, Command Pattern, Mediator Pattern and Strategy Pattern