teleren/devto huggingface dataset:
Learning Algorithms with JS, Python and Java 9: Printing Steps
Tags: beginners, javascript, python, java
Published: 2018-10-10 00:38:08

---
title: Learning Algorithms with JS, Python and Java 9: Printing Steps
published: true
description: 
tags: beginners, javascript, python, java
---

This series of articles follows Stephen Grider's [Udemy course](https://www.udemy.com/coding-interview-bootcamp-algorithms-and-data-structure/) in three different languages. JavaScript solutions are [by Stephen](https://github.com/StephenGrider/AlgoCasts/blob/master/completed_exercises/). I try to "translate" them into Python and Java.


Today's question is meant to be an introduction to recursions.

> --- Directions
> Write a function that accepts a positive number N.
> The function should console log a step shape
> with N levels using the # character.  Make sure the
> step has spaces on the right hand side!
> --- Examples
>   steps(2)
>       '#&ensp;'
>       '##'
>   steps(3)
>       '#&ensp;&ensp;'
>       '##&ensp;'
>       '###'
>   steps(4)
>       '#&ensp;&ensp;&ensp;'
>       '##&ensp;&ensp;'
>       '###&ensp;'
>       '####'



#1: Iterative Solution

JavaScript:
```
function steps(n) {
    for (let row = 0; row < n; row++) {
        let stair = '';
        for (let column = 0; column < n; column++) {
            if (column <= row) {
                stair += '#';
            } else {
                stair += ' ';
            }
        }
        console.log(stair);
    }
}
```

Python:
```
def steps(n):
    for row in range(n):
        stair = ''
        for column in range(n):
            if column <= row:
                stair += '#'
            else:
                stair += ' '
        print(stair)
```

Java:
```
static void steps(int n) {
	for (int row = 0; row < n; row++) {
		StringBuilder stair = new StringBuilder();
		for (int column = 0; column < n; column++) {
			if (column <= row) {
				stair.append("#");
			} else {
				stair.append(" ");
			}
		}
		System.out.println(stair);
	}
}
```

#2: Recursive Solution

JavaScript:
```
function steps(n, row = 0, stair = '') {
    if (n === row) {
        return;
    }

    if (n === stair.length) {
        console.log(stair);
        return steps(n, row + 1);
    }

    stair += stair.length <= row ? '#' : ' ';
    steps(n, row, stair);
}
```

Python:
```
def steps(n, row=0, stair=''):
    if n == row:
        return

    if n == len(stair):
        print(stair)
        return steps(n, row+1)

    stair += '#' if len(stair) <= row else ' '
    steps(n, row, stair)
```

Java:
```
static void steps(int n) {
	steps(n, 0, new StringBuilder());
}

static void steps(int n, int row, StringBuilder stair) {
	if (n == row) {
		return;
	}
	
	if (n == stair.length()) {
		System.out.println(stair);
		steps(n, row + 1, new StringBuilder());
		return;
	}
	
	stair.append(stair.length() <= row ? "#" : " ");
	steps(n, row, stair);
}
```
Google Pixel 3 has a notch!
Tags: webdev, development, mobile, notch
Published: 2018-10-10 00:25:17

---
title: Google Pixel 3 has a notch!
published: true
description: Handling notch of Google Pixel 3 XL on your website.
tags: webdev, development, mobile, notch
---

If you weren't paying attention, Google announced the [Pixel 3 XL](https://store.google.com/us/product/pixel_3) today, and it has a notch! Yep, that dreaded notch that some developers loathe, but the consumers seem to be okay with.

Today's announcement from Google means that as an industry we're headed towards non-rectangular viewports where one cannot assume that a CSS width declared @100% *will* be equal to 100% available width on the viewport, especially around the notch in landscape mode.

Thankfully, there's an easy standard fix for this issue as described on the following [blog post](https://dev.to/marvindanig/take-your-web-development-skills-a-notch-higher-2cge). Quite interesting to note that Google announced [CSS support](https://developers.google.com/web/updates/2018/09/nic69#notch) for notched devices barely a month ago and followed it up with a notched phone themselves.
How to run OpenBSD 6.3 instance on Vultr
Tags: openbsd, vultr
Published: 2018-10-14 12:59:50

---
title: How to run OpenBSD 6.3 instance on Vultr
published: true
tags: OpenBSD, Vultr
canonical_url: https://wildauer.io/openbsd-on-vultr/
cover_image: https://thepracticaldev.s3.amazonaws.com/i/zuv9l8hfkb5kthuf5vml.png
---

Create a new instance and select OpenBSD 6.3 as operating system. After a minute you can login on your new instance over ssh.

First we set the installurl and then we should patch the machine with `syspatch`.

> The `/etc/installurl` file contains a single line specifying an OpenBSD mirror server URL. `syspatch` is a utility to fetch, verify, install and revert OpenBSD binary patches.

```
echo 'https://fastly.cdn.openbsd.org/pub/OpenBSD' > /etc/installurl && syspatch
```

Now we create a new user to the system with `adduser` and then we add them to `/etc/doas.conf`.

> With `doas`, we can execute commands as another user, for example as root.

```
echo "permit YOUR_NEW_USER" > /etc/doas.conf
```

Add a ssh key to you new user. Open a Terminal on your local machine and execute

```
ssh-copy-id -i path/to/your/public.key YOUR_NEW_USER@server
```

Switch back to your OpenBSD instance and edit the ssh daemon configuration in `/etc/ssh/sshd_config`.

We don’t allow login over ssh as root

`PermitRootLogin no`

We disable login with passsword over ssh

`PasswordAuthentication no`

Now check the configuration with

```
sshd -t
```

and restart the ssh daemon with

```
rcctl restart sshd
```

Now you should be able to login with YOUR\_NEW\_USER over ssh without a password. If it works, close your root connection and switch to YOUR\_NEW\_USER.

We need to set some network informations. You can find all information on [my vultr](https://my.vultr.com)

Populate the `/etc/mygate` file with your gateway

```
echo YOUR_GATEWAY > /etc/mygate
```

Populate `/etc/hostname.vio0` with following text

```
inet YOUR_INSTANCE_IP 255.255.254.0 NONE
inet6 autoconf -autoconfprivacy -soii

```

Populate `/etc/resolv.conf` with following text

```
nameserver 108.61.10.10
lookup file bind

```

That’s it. No we have a running OpenBSD 6.3 instance on vultr.
Question about connecting React Router to a database
Tags: react, database, mysql
Published: 2018-10-09 21:44:58

---
title: Question about connecting React Router to a database
published: true
description: 
tags: react, database, mysql
---

I am trying to connect to a database from my React app (which has routes). This get request using Express and MySQL was successful:

db/index.js
```javascript
import mysql from 'mysql'

let pool = mysql.createPool({
    connectionLimit: 10,
    password: 'app',
    user: 'app',
    database: 'chirprapp',
    host: 'localhost',
    port: '3306'
});

let chirprdb = {};

chirprdb.all = () => {
    return new Promise((resolve, reject) => {
        pool.query('SELECT * FROM chirps', (err, results) => {
            if (err) {
                connection.end()
                return reject(err);
            }
            return resolve(results);
        })
    })
}

chirprdb.one = (id) => {
    return new Promise((resolve, reject) => {
        pool.query('SELECT * FROM chirps WHERE id = ?', [id], (err, results) => {
            if (err) {
                return reject(err);
            }
            return resolve(results[0]);
        })
    })
}
```
route
```javascript
import { Router } from 'express';
import db from '../db'

router.get('/:id?', async (req, res) => {
    let id = req.params.id;
    if (id) {
        try {
            let results = await db.one(id);
            res.json(results);
        } catch (e) {
            console.log(e);
            res.sendStatus(500);
        }
    } else {
        try {
            let results = await db.all();
            res.json(results);
        } catch (e) {
            console.log(e);
            res.sendStatus(500);
        }
    }
});
```

But when I try to make a simpler get request like

db/index.js
```javascript
let mysql = require('mysql')

let connection = mysql.createConnection(
    {
        host: 'localhost',
        database: 'chirpapp',
        user: 'app',
        pasword: 'app'
    }
);
module.exports = connection;
```
route
```javascript
import { Router } from 'express';
import connection from '../db'

let router = Router();

router.get('/', (req, res) => {
    connection.connect()
    connection.query('SELECT * FROM chirps', (err, results) => {
        if(err) {
            connection.end();
            res.sendStatus(500);
            return console.log(err);
        }
        res.json(results);
        return connection.end();
    })
})
```

I get a status 500 internal service error and SyntaxError: Unexpected token I in JSON at position 0. From what I've read online, the syntax error means the server is sending back HTML instead of JSON. 

Why would I get two different responses for basically the same request?

This is the first time I've done this, so any insight from you is guaranteed to shed some light.
How to add bullet points on LinkedIn Experience sections
Tags: jobsearch, linkedin, connect
Published: 2018-10-09 21:27:48

---
title: How to add bullet points on LinkedIn Experience sections
published: true
description: 
tags: jobsearch, linkedin, connect
---

I have been trying to update my LinkedIn profile ( I am under a job search ) and didn't have a clue how to add bullet points in the experience section of the profile. Appears it takes ALT codes, so in the experience section you should be able to use any of the ALT codes ( I have tested with only a few ).

So press NumLock key to use the numeric keypad, then press and hold the ALT key while entering the numeric key code for the symbol you would like for bullet point using the keys on numpad.

A list of ALT codes can be found at https://www.alt-codes.net/
What are your favorite VueJS libraries?
Tags: javascript, webdev, vue, discuss
Published: 2018-10-09 21:25:15

As my career has progressed I have filling a number of roles; backend(LEMP), then team lead, then Dev(Sec)Ops. The few times I needed frontend effort someone more skilled was always available. So frontend was never my thing. Recently though, I have been listening to some VueJS videos and it seems ...interesting. Not like the JS of the old days (writing logic twice, once for each browser).

![](https://thepracticaldev.s3.amazonaws.com/i/nuzn79noiv67gwpsbk0y.png)

So; what are some of your favorite libraries to use with VueJS (or plain JS)?
Where are the old developers?
Tags: discuss
Published: 2018-10-09 21:01:48

---
title: Where are the old developers?
published: true
description: I was just thinking about that today, maybe you have a good idea
tags: discuss
---

Hi Everyone,

So today I started to think about the following:
Most of the people are working about until age of 65. I was working at several companies, together with really a lot of people, but 80% of the developer colleagues was under 40 years and I was working only once with a developer over 50.
Ok, it is pretty clear that nowadays much more people are starting a carrier in this field, than 30 years ago.

But still I don't understand: where do the "older" developers work?

And I think it is an important question for all of us, because one day we will be old as well and we still would like to work somewhere.

Do you have similar experiences? Do you have any idea, why?
Tetríssimus – Tetris game in JavaScript (March 2006)
Tags: game, puzzle, gamedev, javascript
Published: 2018-10-09 21:04:36

---
title: Tetríssimus – Tetris game in JavaScript (March 2006)
published: true
tags: game,puzzle,gamedev,JavaScript
canonical_url: 
---

“Tetríssimus” is an open source Tetris clone totally written in DHTML (HTML, CSS and JavaScript).

![Screenshot](http://dhtmlgames.com/tetrissimus/tetrissimus.gif)

It is my third DHTML game and was made in early 2006.

Editing the game code in order to add new pieces with different shapes or change the current ones or even delete them is very easy. You can also change the game behaviour easily by editing many of the configuration variables which are at the beginning of the script. To change the background image you just need to replace it with another one.

This game only uses one image for the background which is not necessary to make it work, so all the rest you can see has been made using just pure HTML and CSS.

Official languages are Spanish and English.

You can find other modified and adapted versions of this game on the Internet, including one Opera widget and even a Drupal module.

This game has been tested under BeOS, Linux, NetBSD, OpenBSD, FreeBSD, Windows, Mac OS X and others.

Play online in English: [http://tetrissimus.tuxfamily.org/tetrissimus\_english/](http://tetrissimus.tuxfamily.org/tetrissimus_english/)

Play online in English (mirror): [http://www.dhtmlgames.com/tetrissimus/tetrissimus\_english/](http://www.dhtmlgames.com/tetrissimus/tetrissimus_english/)

Play online in Spanish: [http://tetrissimus.tuxfamily.org/tetrissimus\_spanish/](http://tetrissimus.tuxfamily.org/tetrissimus_spanish/)

Play online in Spanish (mirror): [http://www.dhtmlgames.com/tetrissimus/tetrissimus\_spanish/](http://www.dhtmlgames.com/tetrissimus/tetrissimus_spanish/)

Official web site: [http://tetrissimus.tuxfamily.org/](http://tetrissimus.tuxfamily.org/) (mirror at [http://www.dhtmlgames.com/tetrissimus/](http://www.dhtmlgames.com/tetrissimus/)).

The repository can be found on GitHub: [https://github.com/jalbam/tetrissimus](https://github.com/jalbam/tetrissimus)
When is a MySQL error not a MySQL error
Tags: devops, dbops, troubleshooting
Published: 2018-10-09 19:37:16

---
title: When is a MySQL error not a MySQL error
published: true
tags: devops,dbops,troubleshooting
cover_image: https://thepracticaldev.s3.amazonaws.com/i/k6pw558gfxg23nepdfj1.png
canonical_url: https://booyaa.wtf/2018/when_is_a_mysql_error_not_a_mysql_error
---
_Photo by [Cassidy Mills](https://unsplash.com/photos/QJBsOY6e7QI) on Unsplash_

I came across this error recently: `Mysql2::Error: Can't connect to MySQL server on 'some-db-server.example.com' (113)`

A quick [search](https://duckduckgo.com/?q=mysql+error+113&t=ffab&ia=qa) on the Internet, resulted in various Q & A sites hinting at a connectivity/routing issue to/from the MySQL server. 

Whilst this was probably enough information for me to fix, if the problem exists on a 3rd party's infrastructure you want to provide a bit more information.

The first port of call was to see if the error code `113` appears in the [MySQL reference](https://dev.mysql.com/doc/refman/8.0/en/error-handling.html). You can imagine my surprise when I couldn't find `113` anywhere in this chapter.

Luckily there is help available from MySQL in the form of a utility called [`perror`](https://dev.mysql.com/doc/refman/8.0/en/perror.html) that allows you to look up MySQL error codes.

By typing `perror` along with error code, you'll get the following:

```shell
$ perror 113
OS error code 113:  No route to host
```

So the reason we can't find this error in either the Client or Server sections of the MySQL reference manual is that it's an operating system error.

The operating system in question is Linux, so we know we're looking for C error number codes ([errno.h](https://en.wikipedia.org/wiki/Errno.h)). If you've got access to the kernel source you can find it in `/usr/src/linux-source-<VERSION>/include/uapi/asm-generic/errno.h` if you don't have the source installed you can see it see a definition of `113` [GitHub](https://github.com/torvalds/linux/blob/master/include/uapi/asm-generic/errno.h#L96):

```c
#define    EHOSTUNREACH    113    /* No route to host */
```

So armed with this information, I could contact the 3rd party and ask them to check routing and firewall rules between us and the database server.
Exploring Drag and Drop with the new Angular Material CDK
Tags: angular, webdev, javascript, typescript
Published: 2018-10-09 18:16:13

---
title: Exploring Drag and Drop with the new Angular Material CDK
published: true
description: Drag and Drop is a new feature in the new Angular Material CDK. Let's explore it together!
tags: angular, webdev, javascript, typescript
canonical: https://timdeschryver.dev/blog/exploring-drag-and-drop-with-the-new-angular-material-cdk
cover_image: https://cdn-images-1.medium.com/max/2000/0*8R_ltDYyRaZVXXt_
---

With the upcoming release of Angular Material it also brings us a new CDK, Drag and Drop. Let's get a small preview together by creating a simple task board.


[Read more...](https://timdeschryver.dev/blog/exploring-drag-and-drop-with-the-new-angular-material-cdk)
Changelog: We have a new beta editor you can try
Tags: changelog, meta
Published: 2018-10-09 17:28:13

Hey folks! We have a new editor you can start using! We have no plans on removing the old editor as an option, but you can start playing with a new one now!

The new editor is a bit easier to use. It maintains our wonderful markdown + liquid tag style of writing posts, but removes the "frontmatter" part, which was confusing (and inherently buggy in frustrating ways!)

![](https://cl.ly/9305d8256596/Image%202018-10-09%20at%201.07.52%20PM.png)

V2 is still in unfinished beta mode, but it's good to go and should work wonderfully for most use cases! To switch to the new editor, go to https://dev.to/settings/misc and switch to "v2".

Thank you to [Derek Hopper](derekjhopper) for pitching in big-time to help launch this feature. The work can be reflected in [this PR](https://github.com/thepracticaldev/dev.to/pull/522).

If you are interested in making any code quality improvements, feel free to take a look at the code [here](https://github.com/thepracticaldev/dev.to/blob/master/app/javascript/article-form/articleForm.jsx).

If you are interested in pitching in on the ongoing development effort of this feature in any way, let me know in the comments and I'll be in touch. It's principally built in Preact.

If you would like to start playing around with one stretch feature that I think would be really cool, take a look at this issue:

{% github https://github.com/thepracticaldev/dev.to/issues/872 %}

Happy coding!
Securing Electron Applications with OpenID Connect and OAuth 2.0
Tags: electron, javascript, oauth, openidconnect
Published: 2018-10-09 17:17:27

---
title: Securing Electron Applications with OpenID Connect and OAuth 2.0
published: true
description: Learn how to secure your Electron applications using standards like OpenID Connect and OAuth 2.0.
tags: #electron #javascript #oauth #openidconnect
canonical_url: https://auth0.com/blog/securing-electron-applications-with-openid-connect-and-oauth-2/
---

In this article, you will learn how to secure Electron applications with OpenID Connect and OAuth 2.0. You don't need to be an expert in any of these technologies to follow this article along because the instructions will guide you through the whole thing. 

[Read on ⚡️](https://auth0.com/blog/securing-electron-applications-with-openid-connect-and-oauth-2/?utm_source=dev&utm_medium=sc&utm_campaign=securing_electron)

![Securing Electron Applications with OpenID Connect and OAuth 2.0](https://thepracticaldev.s3.amazonaws.com/i/p6rhumley99jvpi68vud.png)
Anchore Security Bundle Policies
Tags: containers, security, malware, vulnerabilities
Published: 2018-10-09 16:55:33

---
title: Anchore Security Bundle Policies
published: true
description: An article about Anchore Security Bundle Policies
tags: containers, security, malware, vulnerabilities
cover_image: https://thepracticaldev.s3.amazonaws.com/i/v42fln9da53zekwv2hwg.jpg
---

Just finished up a new article about [Anchore](https://anchore.com) Security Bundle Policies and the kinds of things you can do with them.

https://blog.osninja.io/anchore-security-bundle-policies/
Dev-Connections open source project
Tags: hacktoberfest, opensource, beginners
Published: 2018-10-09 16:46:53

---
title: Dev-Connections open source project
published: true
description: Dev-Connections open source project
tags: #hacktoberfest #opensource #beginners
---

Because I became addicted to Dev Community, I created this simple project for all developers especially beginners in open source community who want to contribute to #hacktoberfest . Dev-Connections will help us to make connections, follow each other on github, linkedin and twitter to be communicate.
I hope all of you to contribute :)
 

{% github mohamedkhaledyousef/Dev-Connections %}
The Outrageous Cost of Skipping TDD 
Tags: discuss, tdd, programming, testing
Published: 2018-10-09 14:25:14

---
title: The Outrageous Cost of Skipping TDD 
published: true
description: 
tags: discuss, tdd, programming, testing, 
---

You’ve already heard of Test-Driven Development. Finally, you get down to trying it out for real. You even manage to convince your whole team to adopt it with you. Now you ask yourself how to find out, whether TDD actually benefits your team. 

Here's the comprehensive blog [What is TDD?](https://simform.com/what-is-tdd/) to know more about Test-driven development.   
 
One of the primary reasons managers cite for waiting so long to implement TDD is the cost. It’s common for the initial project [build-outs to take up to 30% longer with TDD](https://www.computer.org/csdl/mags/so/2007/03/s3024.pdf).
 
What those managers need to know is that [TDD reduces production bug density 40% — 80%](https://www.computer.org/csdl/mags/so/2007/03/s3024.pdf), and that makes all the difference. More bugs in production leads to a dramatic rise in maintenance costs.
 
Before adopting TDD, we ran a small survey project with and without TDD. There were 4 developers working on each project with an average salary of $150. Here are the results of each project.   
 
**Without TDD:**
 
No. of man-hours to complete a project: 200 hours
No. of production bugs without TDD: 70
Average time to fix bug at production: 4 hours
Total hours: 200 + (70x4=280) = 480 hours
 
**With TDD:**
 
No. of man-hours to complete a project: 240 hours
No. of production bugs without TDD: 70
Average time to fix bug at the implementation: 1 hour
Total hours: 240+70 = 310 hours
 
**We saved 480-310= 170 hours X $150/hour = $ 25500.**
 
**Why cost of fixing production bugs is less in TDD?**
 
In TDD, your team can maintain a stable code base throughout the development lifecycle. By properly creating tests first, and then writing code that passes those tests, the chances of regressive bugs popping up drops dramatically.
 
On the other hand, in traditional approach cost of fixing production bugs is high because developers are pulled out of the context in which they’re currently working and dumped into the context of the bug. It takes time to absorb the related code and flow, diagnose a root cause, fix the bug, and then reabsorb the context of what they were working on before.
 
In other words, the cost of fixing bugs that get released in production isn’t just about the cost of fixing the production bug. Interruptions increase the cost of current development work and introduce more bugs that will eventually need fixing, too.

What is your experience with TDD in terms of cost and development time?