Maksim IvanovProgramming tutorials

Basic Webpack React Setup

22 June, 2019 · React

Usually is enough to create new React applications, and if you need to have some specific settings - you can always and alter its webpack…

What Is DOM

03 June, 2019 · HTML

DOM (Document Object Model) is a programming api for your HTML (or XML) documents. Basically it is an object representing parsed code of…

Fullstack GraphQL Beginner Tutorial - Instagram Clone

20 May, 2019 · Graphql

In this tutorial, we’ll build a simple Instagram clone using React and GraphQL. In our version, it will only contain cat pictures.GraphQL…

Automate Git With Hooks And Husky

01 May, 2019 · Git

Git provides an interface to run some code as reaction on specific triggers. Those triggers are called githooks (hooks used by git). You can…

Promises In Javascript

14 April, 2019 · Javascript

In Javascript Promises are special sort of objects that serve as a proxy for data that is initially unknown.The concept is not unique for…

React PropTypes

02 April, 2019 · React

Javascrpt is dynamic language, it doesn’t have static typechecking. You can’t syntactically specify that you function works only with…

React Context API

29 March, 2019 · React

In React application data and event handlers are passed down to children components through props. But sometimes you need to make some data…

For Loop In Javascript

24 March, 2019 · Javascript

Sometimes you need to do some action repeatedly.For example here, for whatever reason I want to output “Hello loops” five times.Loops offer…

Handling Errors In React

10 March, 2019 · React

One of the problems you might face when working on your React application is that some error happens in one of your components - it breaks…

Controlled And Uncontrolled Forms In React

10 March, 2019 · React

There are two ways of working with forms in React. Controlled and uncontrolled.Let’s see when should you use each of them.Uncontrolled…

React Synthetic Events

10 March, 2019 · React

The events that you get when your event handlers get triggered are actually - an abstraction around browser events provided by React.It has…

React Pure Components

10 March, 2019 · React

By default, a plain has set to return . You can write your own implementation of this method to avoid unnecessady re-renders.What Is…

React Functional Components

10 March, 2019 · React

The simplest way to define a component in React is to use function.You just declare a function that receives and returns some JSX layout…

Pure Functions And Side Effects

10 March, 2019 · Programming

In computer programming pure function is a function that satisfies two conditions:It is deterministic, which means that for any given input…

React Lifecycle Methods

10 March, 2019 · React

ReactJS provides a bunch of methods that are executed during different stages of components life.Those are called lifecycle methods…

How To Add Named Anchor In Markdown

10 March, 2019 · Markdown

Sometimes you might want to have a link to an item inside your markdown document. It can pe especially useful when you create table of…

What Is The Difference Between Let, Const and Var In Javascript

09 March, 2019 · Javascript

One of the most important things in programming is to clearly express your intent.With release of ES6 we got two new keywords to define…

React Concept - Virtual DOM

08 March, 2019 · React

Unlike many other frameworks - React doesn’t update DOM directly on every change and uses VirtualDOM to to optimize re-renders.What Is…

How To Localize React Application Using `react-intl`

28 February, 2019 · React

In this tutorial we’ll localize React application from start to finish using react-intl made by Yahoo.We’ll use to generate a new…

React Dev Tools

27 February, 2019 · React

To develop React applications effectively - you’ll need to use React DevTools browser extension. It’s available for both Chrome and Firefox…

Javascript `this`

26 February, 2019 · Javascript

A lot of people find keyword in Javascript very confusing. Depending on where is it used and defined it can have different value.This In…

Handling Events In ReactJS

25 February, 2019 · React

Handling events in ReactJS is very similar to how it’s done on DOM elements. There are a few differences though.Event names are camelCased…

React Props

24 February, 2019 · React

In ReactJS is how components get data from their parent. When you add a tag to your JSX code and pass it some attributes - the components…

Html Entities

23 February, 2019 · HTML

HTML entities are strigns inside HTML code that start with ampersand and end with semicolon . They allow you to add wide variety of…

Typescript Constructor Shorthand

22 February, 2019 · Typescript

Here is a thing, in Typescript there is a shorthand to create and assign class properties from constructor params.Imagine you have following…

React Components

21 February, 2019 · React

Introduction to ReactJS Components.What Is ComponentA component is an isolated piece of interface. It contains some piece of layout…

Lists And Keys In React

20 February, 2019 · React

How to display lists of elements in React?You can use method to loop through an array of items and then use curly braces to insert it into…

Javascript Generators

19 February, 2019 · Javascript

ES6 brought a bunch of new functions to deal with asynchronous data streams. Generator functions and async/await syntax among them…

Conditional Rendering In JSX

18 February, 2019 · React

There are many ways to have conditional expressions in your JSX code. Let’s look at them.If StatementThe easiest way to have condition in…

Starting With JSX

17 February, 2019 · React

Today we continue to learn ReactJS. In this React tutorial for beginners you’ll get familiar with JSX - syntax used in React applications to…

What's New in ES10? Javascript Features ES2019

16 February, 2019 · Javascript

It is 2019, and there is a bunch of new features that got approved by the TC39 consortium and soon will become part of ES10 standard.Array…

How To Install ReactJS

16 February, 2019 · React

How to install React?ReactJS is a Javascript library so by asking how to install it - you most likely mean “How to setup a React project…

Introduction To ReactJS

15 February, 2019 · React

An introduction to ReactJS for beginners.What Is ReactJS?ReactJS is a Javascript Library for building User Interfaces. It was initially…

How do you serve a page with content in multiple languages?

03 February, 2019 · HTML

How do you serve a page with content in multiple languages?Serving webpages in multiple languages is a very big topic and for me it breaks…

What is doctype in HTML documents? And why do you have to specify the doctype?

30 January, 2019 · HTML

If you open any webpage, and look at it’s source code, you’ll always see a little thingy just before the opening html tag. So what is it…

React App Video Course, Parts 6-10

10 August, 2018 · React

I’m super proud of myself, managed to deliver an episode daily so far. And the best part is that it’s getting easier with each one.#6#7#8#…

React App Video Course, Parts 1-5

05 August, 2018 · React

Initially I was going to just use this app as an example in my basicreact.com course. But then I decided to make a separate series on…

Git Stash

12 July, 2018 · Git

Sometimes you have uncommited changes and you need to switch to another branch. Here is where is very handy.Basic UsageWhen switching…

Life Updates 2018

13 June, 2018 · Random

For me 2018 is a year of dramatic changes. New people, new places, new projects. Let me share what happened to me during these months.I…

How To Comment React JSX Code

13 May, 2018 · React

Sometimes you need to comment out some code or just add some informative comment to your layout. How to do it?First problem is that is not…

What Is React?

06 May, 2018 · React

This article is part of react course I’m currently working on. It will be free beginners course published on Udemy. This is an introduction…

My First Javascript Talk

21 April, 2018 · Random

Last Tuesday I had my first talk in Stockholm and actually ever in life.Recently (3 months ago) I moved to Stockholm. Now I work in 0+x as a…

Js Statements Vs Expressions

20 April, 2018 · Javascript

Let’s talk about statements and expressions. It’s very important to understand difference between them.I’ve checked several articles on this…

Do You Need Static Type Checking?

08 April, 2018 · Javascript

We’ll talk about types and static type checking in Javascript. Why you might want it and how to apply it.WAT? Javascript Has No TypesWATWell…

CryptoKitties Clone Part 3 Adding Frontend

28 March, 2018 · Ethereum

In last part we added an auction contract. Now we can buy and sell our GradientTokens. Let’s add some nice UI for that.This is what we’ll be…

React 16 Course - Managing State

22 March, 2018 · React

in react is a plain Javascript object used to manage data specific to some component. Keep in mind that only data that is going to be…

CryptoKitties Clone Part 2 Adding An Auction

19 March, 2018 · Ethereum

In last part we created our own non-fungible token. For the sake of simplicity, we didn’t create as many fields as CryptoKitties have and…

Surviving The Javascript Type System

12 March, 2018 · Javascript

“Everything is crooked. Reality is poison. I want to go back, I hate this. I can’t live like this.” - Morty from the Morty’s Mindblowers…

React 16 Course - Component Lifecycle Methods

11 March, 2018 · React

Like everything in existence – react components follow their natural cycle of creation, existence and destruction. This article is part of…

CryptoKitties Clone In 20 minutes. Non-fungible Token Tutorial

05 March, 2018 · Ethereum

If you’ve read previous articles about Ethereum DAPPs (First, Second) – you already have your very own ERC20 compliant token. Today we’ll…

Firebase React Authentication Tutorial

04 March, 2018 · React

Sometimes you just need to make a fast prototype and you don’t want to mess with back end, authentication, authorization and all of that…

Quick D3 Voronoi Example

28 February, 2018 · Javascript

Today I saw a tweet from @levelsio where he asked how to draw areas on his HoodMaps project as vector curves instead of blocks. Here is my…

Ethereum Distributed App With React Tutorial – Part 2

14 February, 2018 · Ethereum

So, we have a token. Time to create front end part and try to send it between accounts.This article has two parts:How to create ERC2…

Ethereum Distributed App With React Tutorial

13 February, 2018 · Ethereum

ICO’s, crypto, blockchain, DAPPs. Everyone is discussing it nowadays (or at leas heard). Today I’m going to show you how to create your…

React Native Mobx Tutorial - Part 2

13 February, 2018 · ReactNative

This is second part of the MobX tutorial series, today we’ll setup project and add our MobX stores.Table Of ContentsWhat is MobXMaking…

React Native Mobx Tutorial - Part 1

01 January, 2018 · ReactNative

MobX is state management solution that is gaining popularity very fast. I’ll show you how to create a simple React-Native app using MobX…

React Native E2E Testing With Detox

29 November, 2017 · ReactNative

When you develop for web you have a lot of options to set up your e2e tests. Protractor, CasperJS, PhantomJS, DalekJS and a lot of others…

Reducers VS Transducers

28 November, 2017 · Javascript

Sweet chunk of functional paradigm for you today. I don’t know why did I write “versus” while they compliment each other. Anyway, let’s get…

Why Should You Use Transform Class Properties Plugin

27 November, 2017 · Javascript

In my previous post I used pretty interesting syntax to define class methods for my component. I was able to use arrow functions to change…

Popup With ReactJS For Jekyll Blog

23 November, 2017 · React

Once upon a time (yesterday) I decided that my blog lacks a good old pop up. You know, the one that unannoyingly asks to join the mailing…

Open/Closed Principle

13 November, 2017 · Programming

OCP states that software entities (classes, modules, functions) should be open for extension, but closed for modification. Let’s figure out…

Don't Mock What You Don't Own

11 November, 2017 · Programming

I was refactoring specs of some Rails application when I decided to mock the class of CarierWave. I wanted to be able to check for specific…

Liskov Substitution Principle

10 November, 2017 · Programming

In 1988 Barbara Liskov wrote something that now stands for L in SOLID principles. Let’s dive in and learn what is it and how does it relate…

Basic Karma JS Tutorial

08 October, 2017 · Javascript

Psst, do you write Javascript that runs in browser? I have something for you, it’s called Karma, you’ll like it.When you write Javascript…

Add Specific Lines With Git Patch

07 October, 2017 · Git

You know that adds files to index. But did do you know that it can add specific lines of files? Or even add files, ignoring their contents…

Getting Schwifty With Pull Requests

01 October, 2017 · Git

Once I was working on a big feature. Everything was going fine until I got carried away and started to commit everything in one branch…

7 Skills Of An Effective Developer

30 September, 2017 · Random

When you see the term effective developer, you probably imagine a person who does a lot of stuff. If yes, then well, you are wrong.To be…

Magical Mystery Guide For Async/Await In Javascript

28 September, 2017 · Javascript

Hey there! Today we are going to look at async and await keywords that allow you to pause functions execution, and therefore let you write…