teleren/devto huggingface dataset:
Recursion For Beginners
Tags: recursion, javascript
Published: 2018-07-30 18:43:46

---
title: Recursion For Beginners
published: true
description: The hows and whys of recursion
tags: recursion, javascript
---

One topic that stumped me as a beginner programmer was the concept of recursion. It’s something that seems to never be used outside of programming, and it’s advantages aren’t quite obvious, making it something not-too-easy to understand. This is an attempt to effectively explain recursion to anyone who isn’t sure what it is, how it works, or why it’s useful.

What is Recursion?
According to Webster Dictionary, recursion is:

>“a computer programming technique involving the use of a procedure, subroutine, function, or algorithm that calls itself one or more times until a specified condition is met at which time the rest of each repetition is processed from the last one called to the first”

But what does that even mean? We already know it’s a computer programming technique, but under what conditions would you want a function to call itself?

Basically, recursion is the concept of having a function call itself until it has done whatever it needs to. This is kind of like a loop (and some languages actually use recursion AS their loops under the hood), but the key difference is that loops (iteration) work by explicitly specifying a repetition structure, whereas recursion achieves repetition by continuous method calls. Consider the following task:

Create a method that takes any two numbers as parameters and runs the fibonacci sequence algorithm on them 100 times, and displays the output for each step.

Iteratively, you may do so like this:

```
const fib = (a, b) => {   // Create the method
  counter = 0              // Instantiate a counter
  while(counter < 100) {     // Loop until the counter reaches 99 
    sum = a + b
    console.log(sum)
    a = b                  // Reassign the variables for the next iteration
    b = sum
    counter++
  }
}
  
fib(4,5);                   // Call the function
```

This gives you the desired results, and works fine. Recursively, though, it would look something like:

```
fib = (a, b, counter = 0) => { // Create the method
  if (counter > 100) return // Check exit condition
  counter++
  console.log(a + b)
  return fib(b, a + b, counter) // Call itself again if exit condition isnt met
}
  
fib(4,5)
```

As you can see, they both give the same results, but the recursion is slightly shorter and easier to read. Recursion allows for management of exponential growth. While recursion is useful in many cases, there are also cases when it is better to solve the problem iteratively. Recursion is usually more memory intensive, so it may not be the best option for solving problems that require minimal memory usage.
[discontinued] Run a green-badge local HTTPS server with zero configuration
Tags: ssl, https, serviceworker, node
Published: 2018-07-30 18:20:48

---
title: [discontinued] Run a green-badge local HTTPS server with zero configuration
published: true
description: No certificate creation, no tunnels and no hassle ⚡️
tags: Ssl, Https, Service Worker, Node
---

![image](https://thepracticaldev.s3.amazonaws.com/i/199fub9gos4wks74r312.jpg)


⚠️ Apparently, this goes against letsencrypt's ToS and I can't use their certificates in such manner. And I have to drop this tool. I would have issued a non-free certificate to keep this tool up, but it doesn't sound like a great idea to publish a private key that is officially registered to my name.


_No certificate creation, no tunnels and no hassle ⚡️_


### The importance of using HTTPS locally

One might assume that HTTPS isn’t needed for local development. But that’s not always the case. You need to test for mixed-content, secure cookies, service workers, etc. This thread by @getify makes the point perfectly.

{% twitter 1023202051902373888 %}

Running a local HTTPS server can be pain in the neck. You have to create your own certificates, add them as trusted etc. You know the deal.

Using tunnels, at least the freely-available choices, isn’t the best experience either, they create a different URL everytime, they can get really slow, and 3rd parties will have access to your app in plain text.

But what if you could use a static, short and memorable URL to access your app without 3rd parties involvement? ez-s does exactly that. You run `ez-s` and access `https://ez-s.io` and you’ll see your app with a green badge.

### What is EZ-S?
It’s a fork of [zeit/serve](https://github.com/zeit/serve) that gives you the ability to locally run a green-badge HTTPS server. You can see it on GitHub [here](https://github.com/alshakero/ez-s).

### Quick steps

```bash
$ npm i -g @alshakero/ez-s
$ ez-s
# => go to https://ez-s.io to see your app
```

### How does it works?

1. The domain ez-s.io has a single A DNS record pointing to the IP address 127.0.0.1.
2.  ez-s package includes SSL certificates generated by letsencrypt.
3. There is also a small HTTPS server that uses the aforementioned certificates including the private key. So when you access ez-s.io the certificate provided will actually match letsecrypt's, and you get a green badge. The IP address of the host does not matter. As long as letsencrypt records match the certificates provided by the server, Chrome will not object.

Wait what? Public private keys?! Yes. Because the domain will forever point to 127.0.0.1, impersonating it will not take the impersonator anywhere. Unless the impersonator has power over the victim’s DNS server, which makes ez-s the least of the victim’s worries 😁

### Caveat

Since ez-s.io points to `127.0.0.1`, your app will be only accessible locally. You can't test it on your phone or using another machine.

Due to this caveat, serve's `--listen` argument is useless in this case. The only configurble network-related parameter is the port (`-p` or `--port`).

### Questions

If you have any questions please go ahead and comment below.
Explain Blockchain like I'm 5
Tags: blockchain, bitcoin
Published: 2018-07-30 17:02:47

---
title: Explain Blockchain like I'm 5
published: true
description: Simple brief description on Blockchain
tags: blockchain, bitcoin

---
<p>
 <ul>
    <li>The concept of blockchain came with Stuart Haber and W. Scott Stornetta when in 1991 they published a paper about how to timestamp a digital document. It was until Satoshi Nakamoto published a paper on Bitcoin: A Peer-to-Peer Electronic Cash System which was completely based on the Blockchain concept.</li>
    <li>Blockchain lets us for the first time have a shared version of truth that is open, distributed and tamper proof in its nature. Blockchain is an emergent technology concept that enables the decentralized and immutable storage of verified data.
    </li>
    <li> Blockchain has a wide ranging set of applications and almost any field can benefit from having such a technology at its disposal. Blockchain is also heralded as a way by which trust can be ensured in the online world and lets us have greater confidence in the range of products and services that we use online.
    </li>
    <li>While previously we would have the backend code residing in a server or a set of servers, Dapps let us run web enabled applications where the back end is instead hosted on a blockchain network which executes the code that is needed for it.
    </li>
    <li> Distributed Ledger( a collection of accounting entries consisting of debits and credits)
Computing power and breakthroughs in cryptography, along with the discovery and use of some new and interesting algorithms, have allowed the creation of distributed ledgers.
    </li>
    <li>Blockchain is a new technology that uses cryptography with distributed computing. It was Satoshi Nakamoto the genius behind building up the blockchain where a network of computers collaborate to maintain a shared and a secured database. So we can call blockchain as a secure distributed database.
Mining computers or nodes on the network validate the transaction, have them the block they are building and once the block is verified it is broadcasted to other nodes that all have the copy of. 	
    </li>
    <li>Now since there is no centralized authority to verify the transaction the blockchain depends upon a distributed consensus algorithm. In order to make an entry on to the blockchain network(database) all the nodes have to agree on the state of the block so that no one computer in particular can make an alteration without the consensus of the others. Once the block is accepted it is finally added to the chain which may contain countless number of other blocks. 
    </li>
    <li>Blockchain was designed so that the transactions are immutable. The first generation blockchain was much more like a database, but the second generation of the blockchain provides the facility to execute any computer code on the blockchain.
</li>
</ul>
</p>
Why are you programming?
Tags: discuss, programming
Published: 2018-07-30 15:33:36

---
title: Why are you programming?
published: true
description: 
tags: discuss, programming
---

People started to learn web development thinking about future, right now web development is no longer a thing for future, it's present. However, this arises another concern, what's now? AI? Machine Learning? Self driving? Mars? Aliens? Prevent global warming? More programming?

Predictions can go wrong any time, and they are dangerous. However you, those who don't live in the past or present, have some ideas/plans that you are following, right?

So,
- What is it? What do you think will be here 5-10-50 years later? 
- Are you planning for that? What's your plan? 
- **Why are you programming/developing/hacking...or doing whatever you are doing?**
Killer Elixir Tips Github
Tags: elixir, tips, tricks
Published: 2018-07-30 15:07:48

---
title: Killer Elixir Tips Github
published: true
description: The Elixir Tips from Experience of Development
tags: [Elixir, Tips, Tricks]
---


Killer Elixir-Tips

Elixir Tips and Tricks from the Experience of Development. Each part consists of 10 Unique Tips and Tricks with clear explanation with live examples and outputs. These tips will speed up your development and save your time in typing code as well.

You can read specific parts with following links...

[GITHUB KILLER ELIXIR TIPS & TRICKS](https://github.com/blackode/elixir-tips)

Share if they are worth. 

Happy Long Coding life :)
Wannabe a certified Rockstar developer?
Tags: programming, language, fun, rockstar
Published: 2018-07-30 15:01:15

---
title: Wannabe a certified Rockstar developer?
published: true
description: Rockstar, a new programming language
tags: programming, language, fun, rockstar
cover_image: https://thepracticaldev.s3.amazonaws.com/i/4qsxay03id3md2nroxqs.png
---

I was on my commute, listening to the latest podcasts, and 86. Lightning Talks starts by CodingBlocks. Suddenly I can hear them singing lines of code. 

What? Yes, there is actually a new programming language called Rockstar created by @dylanbeattie. The programs you write are song lyrics, too. How cool is that? :)

I am simply amazed. And here comes the question: why would anyone do something like this? The aswer:

> Mainly because if we make Rockstar a real (and completely pointless) programming language, then recruiters and hiring managers won't be able to talk about 'rockstar developers' any more.

OMG! Hilarious. I want to be a Rockstar developer!

The specification of the language was uploaded to GitHub, check it out [here](https://github.com/dylanbeattie/rockstar#the-rockstar-language-specification).

It is changing very often, however there is a sample FizzBuzz written in Rockstar:

```
Midnight takes your heart and your soul
While your heart is as high as your soul
Put your heart without your soul into your heart

Give back your heart


Desire is a lovestruck ladykiller
My world is nothing 
Fire is ice
Hate is water
Until my world is Desire,
Build my world up
If Midnight taking my world, Fire is nothing and Midnight taking my world, Hate is nothing
Shout "FizzBuzz!"
Take it to the top

If Midnight taking my world, Fire is nothing
Shout "Fizz!"
Take it to the top

If Midnight taking my world, Hate is nothing
Say "Buzz!"
Take it to the top

Whisper my world
```
 
This is pure genious! My favourite part is how you can compose poetic number literals: Here is the first few digits of π:

```
My dreams were ice. A life unfulfilled; wakin' everybody up, taking booze and pills
```

Here is my very first program:

```
Leah is in it 
Young is too optimistic

If Leah is greater than Young
Whisper "you're a bit old"
Else 
Shout "you are still very young"
```

What will be the very first line of Rockstar code you write?


But here is the topping. In the ideas section, it is mentioned, that we should create 'Certified Rockstar Developer' stickers and give them out to anybody who can write even one line of Rockstar. What do you think?
Music Player Using Reactjs 
Tags: react, javascript, webdev, beginners
Published: 2018-07-30 14:55:20

---
title: Music Player Using Reactjs 
published: true
description: how to build a music player in javascript 
tags: react,javascript,webdev,beginners 
cover_image: https://thepracticaldev.s3.amazonaws.com/i/e69b1rarzyln8a54ixak.png
---

I just Build a [Music Player](https://5y2r5k2m1p.codesandbox.io/) using Reactjs initially i was learning how sliders
work in javascript.

## First i build a normal slider using pure javascript.

{% codepen https://codepen.io/saigowthamr/pen/zLZQRr %}


## Second i build a **Color** changer using slider.

{% codepen https://codepen.io/saigowthamr/pen/BPJwXz?editors=0010 %}

At final Music Player using Reactjs.

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


# [Music Player Demo](https://5y2r5k2m1p.codesandbox.io/)


In my next post i will explain how to build your own music player using javascript.
Not sure what to build? Here's a desktop app idea that solves a real problem for people who create videos
Tags: discuss, opensource, desktop
Published: 2018-07-30 14:49:29

---
title: Not sure what to build? Here's a desktop app idea that solves a real problem for people who create videos
published: true
tags: discuss, opensource, desktop
---

I often hear people saying they don't know what to build, so here's a desktop application idea that solves a real problem for people who create screencast style videos.

Rather than explain the problem, I've demonstrated it on video (~3min):

{% youtube pUmGFiAZA0s %}


The TL;DR is when your desktop resolution > recording resolution you lose a lot of common Windows functionality and have to manually pixel align windows inside of recording tool constraints. I'm sure there's Windows APIs and methods to restrict windows operations to a customized rectangle, and that's the app you could potentially build.

Anyone up for the challenge of creating that type of app, or perhaps something like this already exists? Let me know!
Understanding AWS lambda qualifiers
Tags: cloudwatch, logs, slack, lambda
Published: 2018-07-30 13:59:59

---
title: Understanding AWS lambda qualifiers
published: true
description: This post describes how you can automatically parse cloudwatch logs for terms and send them to a slack channel with direct links to the log event.
tags: cloudwatch, logs, slack, lambda
---

# Heres the scenario

You have an application which is making use of AWS cloudwatch logs.  You want a beautifully simple way to parse those logs for errors and send a message to monitoring slack channel.  We have several log streams (service1, service2, etc) for 2 different environments.  One for staging and one for production.  These environments should send messages to their respective slack channels.

# Using qualifiers

Qualifiers are a way to name the different versions of your code; such as production, staging, etc..  AWS lambda qualifiers are good for dividing environments as well as promoting versions of code in staging before promoting production.  Qualifiers allow for unique triggers.  From this we attach our staging qualifier to watch a set of streams.  For example:

![lambda example](https://thepracticaldev.s3.amazonaws.com/i/toon039i7z0p4w4kbbg9.png)

From the image above you can see I've set the qualifier for version 1 of my code to have 2 cloudwatch log triggers based on different text patterns.  Each stream can be turned on and off at a click of a button with out redeploying.  I find this super cool.

Unfortunately you can't set environment variables based on a qualifier.  Only versioned code will be given static environment variables.  However, there is a work around.

```js
function isNotAnAliasName(context) {
  return isNumber(context.alias) || context.functionName === context.alias;
}

// Add this to your exports.handler
context.alias = context.invokedFunctionArn.split(":").slice(-1)[0];
console.log("Alias: " + context.alias);
// Set a default value
if (isNotAnAliasName(context)) {
  context.alias = "UAT";
}
```

From there you can namespace your environment variables similar to this:

```js
const slackPostPath = process.env["SLACK_POST_PATH_" + context.alias];
const slackBotUsername = process.env.SLACK_BOT_USERNAME + " " + context.alias;
```

### [The code](https://github.com/kyleparisi/cloudwatch-logs-slack)

The code might seem dense but this is because there are no dependencies.  Set up a lambda with a copy of the linked code and save it.  Set up the qualifiers you want along with the appropriate triggers and slack details and bam!  Log monitoring on the cheap.
Why do you like jsx?
Tags: discuss, jsx, virtualdom, hyperscript
Published: 2018-07-30 13:35:55

---
title: Why do you like jsx?
published: true
description: 
tags: discuss, jsx, virtual dom, hyperscript
---

I've been using frameworks and libraries with a virtual DOM for a while now (specifically, [React](https://github.com/facebook/react), [Cyclejs](https://github.com/cyclejs/cyclejs) and [Hyperapp](https://github.com/hyperapp/hyperapp)), and many people using them seem to prefer jsx over hyperscript-like helpers.

Back when I first started using React, I really liked jsx because it is close to HTML and more powerful than any templating language I know of. For anything you can't do with regular HTML syntax, you can just drop a couple of brackets and write Javascript code.

But then I discovered hyperscript-like helpers, which allowed me to create vdom elements using plain Javascript functions with names like `div(...)`, and I immediately fell in love with that approach.

To compare some code:

```jsx
// JSX
<div class="container">
    <h1>Ponies</h1>
    <PonyList>
        { ponies.map(({ name, type }) => <PonyItem name="name" type="type"/>) }
    </PonyList>
</div>
```

```javascript
// Hyperscript
div({ class: 'container' }, [
    h1('Ponies'),
    PonyList(
        ponies.map(({ name, type }) => PonyItem({ name, type }))
    )
])
```

Both are easy to read. The first word in the line tells you which HTML element or component you are creating. Jsx looks more like HTML, which we are used to. However, the more dynamic behaviour we want, the more Javascript code we have to inline. On the other hand, we don't need any special syntax for hyperscript-helpers and everything is just regular Javascript.

For the record, jsx still trumps having to create elements with `React.createElement`, but there are [hyperscript alternatives](https://github.com/ohanhi/hyperscript-helpers) for React too.

From my perspective, both approaches are more than good enough, but I don't see why I would prefer jsx over plain Javascript, since it doesn't seem to provide any extra benefit.

My question then is, why would you prefer jsx over hyperscript? Does it provide any advantages I'm unaware of?
Selenium WebDriver and WebElement Commands
Tags: selenium, automation, java, webdriver
Published: 2018-07-30 13:15:20

---
title: Selenium WebDriver and WebElement Commands
published: true
description: Selenium WebDriver and WebElement Commands
tags: #selenium #automation #java #webdriver
---

Post Link :  https://www.skptricks.com/2018/03/selenium-webdriver-and-webelement-commads-action.html



<img src="https://2.bp.blogspot.com/-Fr7W08oKcI0/WpqbEg3t3cI/AAAAAAAABXQ/81XMj_ugOxsu4SJEO-Q4hAvJ-kavf4CXACLcBGAs/s400/seleniumpost.jpg" />

WebDriver is a web automation framework that allows you to execute your tests against different browsers using their corresponding driver functions. Also it allows us to use a programming language in creating test scripts.
programming languages are supported by WebDriver as follows :
Java
.Net
PHP
Python
Perl
Ruby
selenium webdriver webelement, selenium webdriver webelement list, selenium webdriver webelement getattribute, selenium webdriver webelement exist, selenium webdriver webelement parent, selenium webdriver webelement sendkeys, selenium webdriver webelement commands,selenium webdriver webelement click

<a href="https://www.skptricks.com/2018/03/selenium-webdriver-and-webelement-commads-action.html" >Selenium WebDriver and WebElement Commands </a>

WebDriver is implementing classes one should use are listed as below:
ChromeDriver
EventFiringWebDriver
FirefoxDriver
HtmlUnitDriver
InternetExplorerDriver
PhantomJSDriver
RemoteWebDriver
SafariDriver
NOTE : Depending upon the browser, we are selecting the above WebDriver method.

While automating the test cases we are selecting the desired WebElement from the web pages and performing the desire operation as per the need. It is a essential part because it helps us to uniquely identify the HTML element or web objects from the web browser page. 

What is WebElement ?
WebElement is an HTML element that helps the users to drive automation tests. Selenium WebDriver provides well-organized web page interactions through WebElements, such as locating elements, getting attribute properties, asserting text present in WebElement, and more. However, to interact with hidden elements in a web page, it is necessary to unhide the hidden elements first and then find the element in web page. Also you can refer below link to build more understanding on WebElement :
https://seleniumhq.github.io/selenium/docs/api/java/org/openqa/selenium/WebElement.html

NOTE : WebElement is an interface

OR succinctly,
WebElement represents an HTML element and HTML elements are written with a start tag, with an end tag, with the content in between: <tagname> content </tagname>.

<a href="https://www.skptricks.com/2018/03/selenium-webdriver-and-webelement-commads-action.html">Read More...  </a>