Short intro into Async development.

Photo by Gabriel Gusmao on Unsplash

To explain Async, I think it would be best to establish a metaphor! Let’s give a stab at it, shall we?

Let’s imagine a chef in a kitchen preparing a big meal. There’s only one chef in this kitchen. The chef could prepare a turkey, then prepare some potatoes, then prepare some bread, then prepare green beans, and then serve it.

Our diners would be treated to turkey, bread, green beans, and potatoes! This is not the goal. This meal was prepared in a synchronous model: one-thing-after-the-other. …


Photo by Anthony DELANOIX on Unsplash

As you may already know, JavaScript (based on the ECMAScript [ES] standard) is an evolving language. Over time we have had several iterations. For the most part, ECMAScript’s evolution has changed to incorporate more features and language constructs over time (think ES6 arrow functions, class syntax, let, and const vs. their absence in ES5!). What was needed was a way to move all, various standards of JavaScript usage to the same standard. That is what the Babel program does — it makes all JavaSript versions emit a common, standard code.

Less metaphorically, Babel gained popularity because it compiled/transpiled newer ES6…


Photo by David Ballew on Unsplash

The Problem

In arrays we are with ease able to locate the elements we are looking for. However there is a major issue with adding anything to the beginning of an array. We have to push over all the elements of (a possibly very large) array. Doing so would be a very costly procedure.

Linked-Lists to the rescue!

Linked Lists are a data structure that not only store the data associated with each element but also store a pointer to another address in memory where another element exists. We call these elements ‘nodes’. Linked lists are composed of nodes containing…


Photo by Genessa Panainte on Unsplash

Having gone to through Asyncrony in my last article, I want to go through Async and Await.

The basics of async/await

There are two parts to using async/await in your code.

The async keyword

First of all we have the async keyword, which you put in front of a function declaration to turn it into an async function. An async function is a function that knows how to expect the possibility of the await keyword being used to invoke asynchronous code.

Try typing the following lines into your browser’s JS console:

function hello() { return "Hello" };
hello();

The function returns “Hello” — nothing special, right?

But…


Photo by toine G on Unsplash

JavaScript is sometimes a bit confusing. It has a native type Object. How does that relate to Object-Orientation? And how does the desire to avoid repeating ourselves relate to them both?

Constructor Functions

It’s sometime handy to represent data with objects, which gives us key/value pairs. For example, we may represent a user as the following:

const bobby = {name: ‘bobby’, age: 20, hometown: ‘Philadelphia’}

Now imagine that we had a couple of users. This code will grow out of proportion very quickly! We would be repeating ourselves!

function User(name, age, hometown) {return {name, age,hometown,}}let bob…


Photo by Rob Schreckhise on Unsplash

Note: The following article assumes you have knowledge of Redux.

Introduction

Part of the value of using Redux is that it provides a centralized way to control the data of an application. In a standard React-Redux application, any child component can connect to the store directly from anywhere in the app. A lot of code that would normally be stored in React components can be removed or replaced.

Redux allows us to focus more on presentation in our React components, and use actions and reducers to handle the logic of organizing data. …


Photo by Mercey eric on Unsplash

So I’m very excited to announce that in my recent project I used Axios for the first time!

I decided to make a small write-up about it so others could share my experience.

Installation

Axios can be installed to be used in Node.js using npm:

npm install axios

In the browser, you can include it in your page using unpkg.com:

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

Remembering that API calls must enable CORS to be accessed inside the browser, otherwise the request will fail.

The Axios API

You can start an HTTP request from the axios object:

axios({
url: 'https://dolphins.ceo/api/breeds/list/all',
method: 'get'
})

This returns a promise. You…


Photo by Georg Bommeli on Unsplash

Prevent XSS?

XSS, or Cross-Site Scripting, is a technique that enables attackers to run externally injected JavaScript in the context of the attacked page. Once the attackers manage to do so, it can access the full range of web APIs.

Some XSS attack may look the following:

  • The attacker finds input fields on the webpage
  • The attacker starts inputting simple HTML and JavaScript to see if the page vulnerable, like <script>alert('ha ha ha!')</script>
  • Once the attacker finds such an input that is vulnerable, the attacker crafts a link that will inject a give snipper into the page, and sends it to the…

Photo by Todd Quackenbush on Unsplash

For this article I decided to focus more on the simple basics of JavaScript. One of the basics in JS is DOM manipulation.

Intro

DOM programming is using JavaScript to:

  1. Ask the DOM to find an HTML element or elements in the rendered page
  2. Remove the selected element(s) or add a new element next to the selected element
  3. Adjust a property of the selected element(s)

Define the Computer Science Version of “Tree”

What do we mean when we say that the DOM is a tree? Trees make a good metaphor for the DOM because almost everyone has seen a tree. Starting at the bottom, you can climb up…


Photo by Brian McGowan on Unsplash

Express validator is one of the many npm packages for validating a request an express application.

I recently used express validator in a project and stumbled upon a few challenges which I'm going to share in this article.

When you visit the express validator docs, you’d notice the way the validator was used in the examples as shown in the snippet below:

const { check, validationResult } = require('express-validator')app.post( '/user', [ // username must be an email check('username').isEmail(), // password must be at least 5 chars long check('password').isLength({ min: 5 }), ], (req, res) => { // Finds the…

Kirill Chaim Shcherbina

Passionate Programmer. Independent Thinker. Caring Father. Graduate of Flatiron Bootcamp for Software Development. Currently seeking new opportunities.

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