adyontech

Front-end interview experience

This is a post about my personal interview preparation & experience with more than a dozen companies.

DISCLAIMER: I never prepared for JS specific interview, my goal was to land a backend role, but KARMA SUCKS :P

Go to resources

TODO: ADD MORE INFO HERE.

adyontech

function Shape(){
      this.x = 0;
      this.y = 0;
  }


Shape.prototype.move = function (x, y){
  this.x += x;
 this.y += y;

adyontech

import { useState, useRef, useEffect } from 'react'
import copyToClipboard from 'copy-to-clipboard'

const useClipboard = () => {
  const [hasCopied, setHasCopied] = useState(false)
  const timeoutRef = useRef<NodeJS.Timeout | null>(null)

 useEffect(() =&gt; {

adyontech

Correct implementation:-

import React from "react";

const throttle = (callback, limit) => {
  var wait = false;

  return function(...arg) {
    if (!wait) {

adyontech

AsyncLoadFile.jsx

import React, { Component } from 'react';

export default function asyncComponent(importComponent) {
    class AsyncComponent extends Component {
        /**
        * @constructor
        * @desc Represents AsyncComponent component
        * @param props Properties passed from parent component

adyontech

(function () {
  'use strict';
  //Check if share API is supported or not
  if (navigator.share !== undefined) {
    document.addEventListener('DOMContentLoaded', function() {
      var shareBtn = document.querySelector('.share');
      //Share button event listener
      shareBtn.addEventListener('click', function(event) {
 //Web share API

adyontech

(function () {
  'use strict';

  var headerElement = document.querySelector('header');
  var metaTagTheme = document.querySelector('meta[name=theme-color]');

  //After DOM Loaded
  document.addEventListener('DOMContentLoaded', function(event) {
 //On initial load to check connectivity

adyontech

Enzyme :- creates virtual DOM for testing.
 has better toolkit, like jquery selectors.
 - (shallow rendering) render component only one level deep, i.e it will render parent but will keep placeholder for children.
 - Manipulate values of state and props.
 
 
 Type of test:-
 unit - integration - acceptance-end-to-end
 
 Test behaviour not implementation.

adyontech

.prettierignore

dist
node_modules
coverage
.next
build

adyontech

Why do I call BeeOcean my all web dev coding knowledge source and outcome?

Hello 😊 , thanks for finding time to navigate here. In the following Gist I will be bragging 😉 about my skills and all the cool concept I have applied to this project (BeeOcean.com, formerly proworktree.com).

If you are a non-dev person, I request you is to read through and grow your knowledge about web apps 💥, let's go a bit deeper by knowing how complex and cool it is to work on a website. 😍

I am sure after going through you won't say that a website creation is just putting some HTML-CSS together 😛...

Credits :- As a single developer in the project it would have been really difficult if this guy 👉 Rud156 had not picked up my calls for queries ( Many times ) .

Ok, Let's start now.

Business logic

This is a SaaS product, therefore there is a need to incorporate the f