Sign in


Given a non-empty array of non-negative integers nums, the degree of this array is defined as the maximum frequency of any one of its elements.

Your task is to find the smallest possible length of a (contiguous) subarray of nums, that has the same degree as nums

Example 1:

Input: [1, 2, 2, 3, 1]
Output: 2
The input array has a degree of 2 because both elements 1 and 2 appear twice.
Of the subarrays that have the same degree:
[1, 2, 2, 3, 1], [1, 2, 2, 3], [2, 2, 3, 1], [1, 2, 2], [2, 2, 3], [2, 2]
The shortest length is 2. So return 2.

Example 2:

Input: [1,2,2,3,1,4,2]
Output: 6


In my previous post, we wrote snapshot tests for our components using Jest and Enzyme. So far, our todo app is not functional yet. To make it functional, we need to add codes that can handle the creation of new todos. Let’s take a look at that.

Firstly, let’s update our TodoForm component by adding two events:

  • onSubmit event: this event will be used in handling the creation of a new todo.
  • onChange event: this event will be used in updating the state of a new todo yet to be created.


Apart from adding these two events, we’ve…

Testing React components with Jest

In my previous post, we created our todo app components. We also used Styled Components to improve the UI of the todo app.

In this post, we will write a few snapshot tests using Jest, React Test Renderer and Enzyme.

Just like Jasmine and Mocha, Jest is a testing framework for JavaScript applications.

But why Jest?

Jest was specifically designed by Facebook to test React applications. It provides an easy out-of-box setup with zero configuration, allowing you to focus solely on writing tests. …

Styled Components — Visual primitives for the component age.

In the first post related to our todo app in React.js, we setup and configured Webpack and Babel.

In my previous post, we also setup and configured Eslint and Prettier for our project. We also setup a server to serve our static files, using Express.

In this post, we will start creating components, later in this post, we will make use of the Styled Components library to improve the UI of our todo app.

First, let create a folder named components inside the src directory which will host all our components. Next in the components directory, create a file TodoList.jsx

Configure Eslint and Prettier

In my previous post, we configured Webpack and Babel. In this post, we will setup Eslint, Prettier and a server with Express.

Let us install and configure Prettier to ensure that our code has the same format throughout this project. Next we will install Eslint which reports any syntax error in our code and enforces a real good code style. We will use the Airbnb Eslint config.

To install our dependencies, run the code below in your terminal

npm i --save-dev prettier eslint babel-eslint eslint-config-airbnb eslint-config-prettier eslint-config-react eslint-loader eslint-plugin-prettier eslint-plugin-jsx-a11y eslint-plugin-import eslint-plugin-react

I will be writing a full article to…

When JavaScript was first released in 1995 by Brendan Eich, no-one thought this programming language could become as popular as it is today.

One of the reasons for such popularity is the fact that JavaScript can be used for both frontend and backend app development.
In fact, JavaScript is mostly used for frontend development to build Single-page applications.

Simply put, a single-page application is a web application that loads a single HTML file which is dynamically updated as the user interacts with the app.

There are quite a number of frameworks or libraries used in building a single-page app. The…

Have you ever encountered a situation where you need to pass a dependency to a constructor which has nothing to do with that class?

Let us take this scenario. You have two classes as shown below:

//Author class
class Author {
private $firstName;
private $lastName;

public function __construct($firstName, $lastName){
$this->firstName = $firstName;
$this->lastName = $lastName;
} public function getFullName(){
return $this->firstName .' '. $this->lastName;
//Blog class
class Blog {
private $title;
private $author;
private $firstName;
private $lastName;
//Notice that both $firstName and $lastName have nothing to do inside the Blog Scope public function __construct($title, $authorFirstName, $authorLastName){$this->title =…

I’m trying to download a file via jQuery Ajax. The file is stored a file on Google Cloud Storage. My domain is http://localhost:8888/. My initial code is shown below:

$.ajax('https://my-awesome-bucket/my-file.txt', {
dataType: 'text', // type of response data
success: function (data,status,xhr) {
error: function (jqXhr, textStatus, errorMessage) {
console.log('Oops! An error has occurred.');

Obviously, the code above presents a Cross Origin issue since my domain (http://localhost:8888/) is different from the domain where the file that I’m trying to download is hosted. When I checked my browser console, I got an error message saying:

No 'Access-Control-Allow-Origin' header…


Software Engineer | Fullstack Web Dev | Node.js ~ Laravel ~ React.js

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store