teleren/devto huggingface dataset:
Day 91 : The Return
Tags: hiphop, code, coding, lifelongdev
Published: 2020-03-09 22:27:50

_liner notes_:
- Saturday : It was the return of the show to the radio waves. For the past few months the radio show has been preempted to broadcast the college's basketball team. During that time, we still do the show, but strictly online. I almost forgot how much other stuff I have to do when the show is broadcasting the radio. haha There's a bunch of forms that I need to fill out at different points during the show. Still felt really good to be back. The show's recording at https://kNOwBETTERHIPHOP.com

![Radio show episode image of a photo taken during the Selma to Montgomery marches known as Bloody Sunday with the words March 7th 2020, Let's get gross above and below the photo](https://dev-to-uploads.s3.amazonaws.com/i/192frma59xdlei2kau9w.jpg)

- Sunday : Hung out with my folks for a little, then got home and just rested. I finished ironing all my clothes and caught up on Dr. Who. Did some slight coding for a proof of concept for a project I'm working on. Other than that, I pretty much stayed in bed.

- Professional : Started off the week pretty productive. Cleaned up my code and tested my Ninjas vs Pirates demo to make sure that it was easy to spin up a copy of it. Pretty happy with how it came out. Also finished up a JIRA ticket that was assigned to me. It wasn't difficult, just needed to run my changes by someone first who was in a different timezone. Got some feedback on the initial draft, incorporated them, sent for feedback and was approved. Made the changes to a branch in the repo and did a pull request. Also meet with my manager. Had a really good talk. Submitted an idea for a project to work on for the internal hackathon that my company is putting together for the next couple of days. It's something I've wanted to build for a while for the local community. It just so happens that it will use some of our products. Basically a win-win situation. haha.

- Personal : Been working on an audio player for my slides page to replay the recordings of my talks that will pop up the text from the speech recognition and switch my slides. Got a pretty good proof of concept working. Not sure if I want to turn it into a component though because I'm not sure if I'll be using it anywhere else.

![Mountain range of Ghandruk, Nepal](https://dev-to-uploads.s3.amazonaws.com/i/0rbnob9hol9biypmyb1v.png)

Drove out to Winter Park a little earlier for the Orlando Developers Group meetup and do some work before it starts. Found a spot and started working out of my van. It's not that bad. That's a good thing since I'll be doing it a lot more in the near future. haha

Have a great night!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube E2GV7ErWNPo %}
RxJS & the combineLatest Operator "Gotcha"
Tags: rxjs, webdev, typescript, observables
Published: 2020-03-09 22:25:08

Today, I spent a good chunk of my workday debugging an issue I had with an observable stream spawned from the *combineLatest* function. I want to share this life lesson in hopes others do not suffer a similar fate.

I've boiled the problem down to the code snippet below:

```javascript
// Will output one value, an array of 3 numbers
const oneValue$ = of([10, 20, 30]);
// Will output two values
const twoValues$ = of(100, 200);

combineLatest(oneValue$, twoValues$).pipe(
  map(([val1, val2]) => {
    return {
      a: val1.splice(0, 1)[0],
      b: val2
    }
  })
).subscribe(output => console.log(output));
// Desired Output:
// { a: 10, b: 100 }
// { a: 10, b: 200 }

// Actual Output:
// { a: 10, b: 100 }
// { a: 20, b: 200 }
```
Notice the desired vs. actual outputs. Let's walk through this example:

We have two observable streams, one that will emit only 1 value in its lifetime, the other will emit two values.

Using *combineLatest* I want to construct a new return value based on the latest values from each stream.

I map the two emitted values `[val1, val2]` to a new object.

I want this new object to have two properties where
1. property `a` is the first value in the array from `oneValue$` (i.e. the value 10)
2. property `b` is the latest value in `twoValues$` (i.e. the value 100, then 200)

So I want my output to look like
```javascript
  // Desired
  { a: 10, b: 100 }
  { a: 10, b: 200 }

  // Actual
  { a: 10, b: 100 }
  { a: 20, b: 200 }
```
 My `a` value isn't always the first value from the array. Strange?

 *combineLatest* should re-emit the last value from `oneValue$` when `twoValues$` emits the second time. That should always be the array `[10, 20, 30]`. I'm using the function `splice(0, 1)[0]` to grab that first item in the array, yet the second emission seems to have grabbed the second item of the array.

Have you figured it out yet?

*The `splice()` function is permanently altering the array values*

*combineLatest* is emitting the same array value during the second emission, but
The `splice()` function actually alters the values of the array during each mapping. Remember, JavaScript is always passing by reference. In our `map()` function, `val1` is another variable that is pointing to the same array object being held in the *combineLatest* operator. We then modify the array contents. So when *combineLatest* passes the array reference to `map()` the second time, we receive the same (modified) array reference.

Obvious fixes are to use the `spread` operator if it's an array or object of primitive values, or possibly pulling in something like `cloneDeep` from the `lodash` library for more complex objects.

Many array functions return new arrays without altering the original, however, not all do. Make sure you make a conscious decision around this!
The 7 Most Popular DEV Posts from the Past Week
Tags: top7
Published: 2020-03-09 22:19:51

---
title: The 7 Most Popular DEV Posts from the Past Week
published: true
description: A round up of the most-read and most-loved contributions from the community this past week.
tags: icymi
cover_image: https://thepracticaldev.s3.amazonaws.com/i/sfwcvweirpf2qka2lg2b.png
---
Every Monday we round up the previous week's top posts based on traffic, engagement, and a hint of editorial curation. The typical week starts on Monday and ends on Sunday, but don't worry, we take into account posts that are published later in the week. ❤️

#1.  All About Rendering

Franck shares an overview of four web rendering solutions, along with a list of benefits and drawbacks for each solution. 

{% link https://dev.to/kefranabg/demystifying-ssr-csr-universal-and-static-rendering-with-animations-m7d %}

#2. Fav Coding Activity?

Refactoring! Bryce shares six refactoring patterns and provides examples of each.

{% link https://dev.to/brycedooley/refactoring-my-6-favorite-patterns-p13 %}

#3. Blowfish!

Sylvia helps us understand how BCrypt _works_. You'll learn about some history, hash algorithms, salts, and more. 

{% link https://dev.to/sylviapap/bcrypt-explained-4k5c %}

#4. Hypertext Markup Language

("what does HTML stand for is a fun trivia question", right?)

For anyone interested in learning HTML, this post shares an overview of important topics to cover.

{% link https://dev.to/theindiancodinggrl/20-days-of-html-learn-20-amazing-things-about-html-part-1-2p99 %}

#5. 200x, 300x, 400x...

Lucas takes us on a deep dive about HTTP status codes. In this post, we'll define status codes and learn when it's appropriate to use each code.

{% link https://dev.to/khaosdoctor/the-complete-guide-to-status-codes-for-meaningful-rest-apis-1-5c5 %}

#6. Open Source & Intuitive

Bushra shares an overview and tutorial of Cypress, a popular testing framework. 

{% link https://dev.to/bushraalam/cypress-end-to-end-testing-framework-3naa %}

#7. Big Rewards

Miranda highly recommends the book, "Cracking The Coding Interview". Here, they share seven steps to help you gain the confidence to ace your next interview.

{% link https://dev.to/mlimonczenko/7-effective-steps-to-cracking-the-code-interview-5fpl %}

_That's it for our weekly wrap up! Keep an eye on dev.to this week for daily content and discussions...and if you miss anything, we'll be sure to recap it next Monday!_
Selenide - UI tests in minutes 
Tags: testing, junit5, tutorial, selenide
Published: 2020-03-09 22:09:48


---
title: Selenide - UI tests in minutes 
published: true
description: Selenide provides the ability to create a project and start writing tests within minutes. It makes creating UI tests easy, simple and fast. It also works very well with Allure for reporting and Junit5 for tests.
tags: testing, junit5, tutorial, selenide
canonical_url: https://anilkulkarni.com/2020/03/selenide-ui-tests-in-minutes/
cover_image: https://i2.wp.com/anilkulkarni.com/wp-content/uploads/2020/03/selenide-logo-big.png?fit=352%2C186&ssl=1
---

[![Selenide - UI tests in minutes](https://i2.wp.com/anilkulkarni.com/wp-content/uploads/2020/03/selenide-logo-big.png?w=665)](https://selenide.org/)Selenide – UI tests in minutes

Selenide, is what I discovered as part of a new assignment at work. It involved testing of a product management application, majority of it a web based UI.

I took a week to get a deeper understanding of the assignment, both in terms of technical and business. Although it said automation is out of scope for now, I wanted to make my work easier. My hunt for suitable tools ended with Selenide.

It took be around 4 days to automate considerable amount of scenarios which could be presented as ROI or effort savings. Setting up the project with right tech stack took the most time. I spent around 1.5 days in writing tests.

- Selenide – For UI tests
- Maven – Build tool
- Junit5 – For writing tests
- Allure – For reporting
- Docker\* – For generating an emailable report.

The intent of this post is to share the project setup so that, if anyone else is looking for something similar, they can avoid the effort to set the project up. You can find this in on my [github ](https://github.com/anilkulkarni87/SelenideFramework).

Few thing that I learnt while working on this are listed here :

1. Ability to [log custom messages](https://github.com/anilkulkarni87/SelenideFramework/blob/2df2a73f9435ded2150e51b896bc785bff26cf63/src/main/java/com/lina/utils/LogUtil.java#L11) in an allure report.
2. Ability to use [excel sheet as test data input](https://github.com/anilkulkarni87/SelenideFramework/blob/master/src/main/java/com/lina/utils/ExcelUtils.java).
3. Java [Enum](https://github.com/anilkulkarni87/SelenideFramework/blob/master/src/main/java/com/lina/framework/EnumData.java)
4. Junit5 [parametrized ](https://github.com/anilkulkarni87/SelenideFramework/blob/2df2a73f9435ded2150e51b896bc785bff26cf63/src/test/java/GoogleSearchTest.java#L47)test.
5. Understanding of tags in Junit

 Selenide has definitely worked very well for my use cases and would definitely recommend for people to try. There are a lot more things that I would like to [learn](https://anilkulkarni.com/2019/12/learnings-from-my-last-assignment/)/understand.

- Better way of handling Test data.
- Leveraging picocli or other argument parsers for executing specific tests/modules.

The post [Selenide – UI tests in minutes](https://anilkulkarni.com/2020/03/selenide-ui-tests-in-minutes/) appeared first on [Anil Kulkarni | Blog](https://anilkulkarni.com).
Strategy Pattern
Published: 2020-03-09 21:44:55

# Strategy Pattern 
### *Algorithm Encapsulation*

GitHub Link: https://github.com/FrancescoXX/Design-Patterns-Strategy-Javascript
___

## Behavioral Design Pattern

## Intro

The Strategy pattern, also called policy pattern, enables selecting an algorithm at runtime.
Deferring the decision about which algorithm to use, allows more flexibility and reusability


## ⚡️Recognize

When we want to change the behavior of our application at runtime

For example, change the behavior to:

- aggressive
- defensive
- balanced

___

## 💡Intent

- Define different algorithms
- Make them interchangeable at runtime, with a setStrategy() method

___

## 🔧 Apply when

- Classes only change in behavior
- We want Different variants of an algorithm

___

## ✅Pro

- Algorithm families use inheritance  for common parts
Avoid conditional statements using this pattern
Clients can choose the required behavior

___

## ⚠️Cons

- Increased number of objects
- Strategies are shared between objects

___

## 🏆 Great for

- Encapsulate an algorithm
- Change algorithm at runtime

___



```javascript
/**
 * STRATEGY PATTERN JAVASCRIPT IMPLEMENTATION
 */

//Concrete Strategy A
class AggressiveStrategy {
	constructor() {
		this.next = move => "Next aggressive move";
	}
}

//Concrete Strategy B
class BalancedStrategy {
	constructor() {
		this.next = move => "Next balanced move";
	}
}

//Concrete Strategy C
class DefensiveStrategy {
	constructor() {
		this.next = move => "Next defensive move";
	}
}

//Strategy
class AIGameStrategy {
	constructor() {
		this.setStrategy = (game) => this.game = game;
		this.next = move => this.game.next(move);
	}
}

// --- MAIN ---

//Strategies initialization
const aggressive = new AggressiveStrategy();
const balanced = new BalancedStrategy();
const defensive = new DefensiveStrategy();

//Implement Strategy Pattern
const AI = new AIGameStrategy();

//Set Defensive Strategy
AI.setStrategy(defensive);

//Perform defensive action
console.log(AI.next()); //Next defensive move

//Set Balanced Strategy...
AI.setStrategy(balanced);

//Perform balanced actions
console.log(AI.next()); //Next balanced move
console.log(AI.next()); //Next balanced move
console.log(AI.next()); //Next balanced move

//Change Strategy to Aggressive
AI.setStrategy(aggressive);

//Perform aggressive actions
console.log(AI.next()); //Next aggressive move
console.log(AI.next()); //Next aggressive move
```



GitHub Link: https://github.com/FrancescoXX/Design-Patterns-Strategy-Javascript
Nevertheless, Karen Coded
Tags: wecoded, learning, curiosity, fortran
Published: 2020-03-09 21:22:24



<!-- Once your post is published, it will not appear on the /t/shecoded page until an admin approves it. This is an extra step to ensure there is no abuse on this important tag. -->

I am late to the coding scene. I didn't get started until my last year as an undergrad. I studied Astrophysics and Math for four long years. For my final thesis in both subjects, I wanted to learn more about galaxies in the universe colliding and merging.

##### Moreover, I wanted to simulate two galaxies colliding.
##### And, I wanted to make a video for the planetarium to display.

This was not an easy task, because I didn't know how to code. So - I taught myself to code in FORTRAN (the language I used for the simulation). I also needed to learn the specific languages to port the output of the simulation (the position of each part of the galaxy collision) to the computers in the planetarium. At the end of the project, I gained skills that I had never even considered before.

Fast forward a few years later and I was using PERL and a mix of other languages in my job. The department that I worked in had a few trainings on the tools and techniques that I used, but I mostly self-learned the technical aspects that the work required.

Even a few months ago, I started learning Python and SQL. Again, most this is self-taught.

### Advice for girls who want to learn 
If you have a curiosity for programming -- pay attention to that! Use your interest and passion to learn a new skill. Some places to learn are:
* [Codeacademy](https://www.codecademy.com/)
* [code.org](https://code.org/learn)
* [codewars](https://www.codewars.com/)
* [Coursera](https://www.coursera.org/courses?query=coding)

Your new skill might lead to a lifelong journey in a career you never considered!
Outlines are important
Tags: webev, html, css
Published: 2020-03-09 21:16:58

Many websites don't like having the blue outline on their actionable elements because it doesn't look good, but when someone tabs through it's difficult to know which item is currently focused. Combined with little to no labelling, someone who depends on accessibility features won't be able to use your website.

With CSS you can modify the look and feel of the outline shown when an actionable element is in focus.

{% codepen https://codepen.io/koralarts/pen/abOEymW %}

Seeing an element's outline is an important accessibility feature that we, as developers, shouldn't remove.

If you really don't want to use outlines, replace it with some other style that makes it obvious that an actionable element is currently in focus.
Using Async/Await: The right way
Tags: javascript, tutorial, webdev
Published: 2020-03-09 20:45:09

---
canonical_url: https://ogzhanolguncu.com/blog/using-async-await-the-right-way
title: 'Using Async/Await: The right way'
---


When async/await operations first introduced devs got hyped up about how things going to be clearer, shorter and faster. But, the problem was we were still writing synchronous code. Like, procedures work in order line by line but this is not how async works. In [MDN Docs](https://developer.mozilla.org/) Async defined as __Asynchronous functions operate in a separate order than the rest of the code via the event loop, returning an implicit Promise as its result.__ So, If you have a long-running task such as Db queries or bulky API calls this is the right way to handle. Yet, using __await__ keyword to resolve for every long-running task can be detrimental. I'm going to demonstrate how to use async effectively. I've used Axios for requests and Performance-now for calculating the execution time.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/ah0oj58lscbjea6mb6bd.PNG)

Suppose we have two APIs one for Pokemon and another for Digimon. From line 7 to 11 we just want to do operations related to pokemon. Now, you may ask: Why did you make Digimon call then, Right? To show the impact of await of course. So, it is okay to put two API calls side by side that is completely okay unless you use __await__. The question you should always be asking is, _"Do I really need data coming from API at the next line?"_ If, the answer is no then avoid __await__. Even if you are not going to use Digimon data __await__ will try to resolve it and resolving async operations takes a toll on your program. As you can see at __Terminal__ output this program takes 2539 ms. Now, check this out.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/ahm5pageni7h8h83w5f2.PNG)

This one takes 282 ms. So the thread is still not blocked but it takes 10 times shorter time to execute. Now, let's iterate over these APIs 50 times.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/rrsehj6e2yd9px5soc7b.PNG)

Approximately 40 seconds. Now without Digimon await.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/oqtnxf9p8xxzyxas73yh.PNG)

Without await, it takes 10 seconds. So the difference is 30 seconds that is not something we can unsee. If we increase the number of iterations difference will even greater.

<h3>Final Thoughts</h3>

As you can see how single __await__ can hinder the performance of your program. Don't think sync when you are programming async. Always ask, _"Do I really need that data right now?"_ 

Thanks for reading.
Distributing software with the JFrog Platform
Tags: devops, security
Published: 2020-03-09 20:27:05

Hey! In case you haven’t heard yet, JFrog just released the JFrog Platform. If your world is all about DevOps, this platform gives you an end-to-end solution that combines all JFrog products in one simple place. So, the platform includes:

[Universal package management](https://www.jfrog.com/confluence/display/JFROG/Package+Management) with all major packaging formats, build tools, and CI servers.
[Security and Compliance](https://www.jfrog.com/confluence/display/JFROG/Xray+Security+and+Compliance) that's fully integrated into the JFrog Platform, providing full trust of your pipeline from code to production.
[Radically simplified administration](https://www.jfrog.com/confluence/display/JFROG/Administration+Module)with all configurations in one place.
[Complete trust in your pipeline](https://www.jfrog.com/confluence/display/JFROG/Pipelines+Developer+Guide)
all the way from code to production.
[Seamless DevOps experience](https://www.jfrog.com/confluence/display/JFROG/Application+Module) for on-prem, cloud, hybrid or multi-cloud of your choice. 

Let’s take a closer look at how we can safely distribute our software using JFrog Distribution. 

JFrog Distribution is a service that lets you provision software releases using immutable [release bundles](https://www.jfrog.com/confluence/display/JFROG/Distributing+Release+Bundles)to many target destinations ([edge nodes](https://www.jfrog.com/confluence/display/JFROG/JFrog+Artifactory+Edge)).

**Distribution in 3 Steps**

1.Create a release bundle using [REST API](https://www.jfrog.com/confluence/display/JFROG/Distribution+REST+API#DistributionRESTAPI-RELEASEBUNDLES)or the [Query Builder](https://www.jfrog.com/confluence/display/JFROG/Distributing+Release+Bundles#DistributingReleaseBundles-AddingaQuery).

![Create a release bundle](https://s5.gifyu.com/images/EEvuGvVICk.gif)


2.Secure your release bundle by signing it using a GPG key, ensuring that its contents cannot be edited. This will also ensure consistency of distribution among target instances.
Note: The same GPG key is used by the Artifactory Edge to validate the Release Bundle before it is accepted.


![Secure your release bundle](https://s5.gifyu.com/images/iKrSpXdR7q.gif)


3.Distribute your release bundle. Distribution is responsible for triggering the replication process that happens from the source Artifactory to the edge nodes. First, it replicates the Release Bundle info to each edge node and then initiates the replication process in the source Artifactory.

![Distribute your release bundle](https://s5.gifyu.com/images/CY4MEH0OPk.gif)



Check out more information on our [website](https://jfrog.com/distribution/) and [documentation](https://www.jfrog.com/confluence/display/JFROG/JFrog+Distribution).
Servidores de cache
Tags: redis, varnish, memcache, cloudflare
Published: 2020-03-09 20:11:18

{% spotify spotify:episode:6BtB7tnHXTLW6jIsOiyFQ9 %}

Los servidores de cache nos permiten aumentar rápidamente el rendimiento de nuestros desarrollos, en primer lugar, lograremos tiempos de respuesta más rápidos, en segundo lugar menor impacto en nuestro sistema de base de datos.

Si hablamos de cache de datos simple, podemos hablar de redis o memcache. En este caso controlaremos qué queremos almacenar en la cache desde nuestro código PHP, NodeJS, Go, Java,...

Si consideramos atacar a un nivel superior, podremos hablar de servidiores de cache web como Varnish o CloudFlare que actúan delante de nuestro código, almacenan la respuesta web que damos para entregar la misma si un cliente hace una petición igual o similar.

Cuando nuestro código necesita de hacer una serie de consultas en una base de datos cada vez que un usuario solicite una página web, pensemos en usar un servidor de cache, pues mejoraremos tiempos de respuesta, y ahorraremos recursos, por lo que optimizaremos el coste de nuestro servidor y cantidad de páginas que podemos servir por minuto.
Career Advice...
Tags: help, career, devops, discuss
Published: 2020-03-09 20:01:53

Hi all,

So currently I'm working in an MNC as a mainframe developer but I don't like my technology and also my workplace is getting toxic so I can't work there anymore.
I want to go for DevOps but other companies are asking of experience in DevOps (including startups) which I don't have currently.
I have started with docker and some other tools, but I'm stuck and I'm not able to figure out what to do next.
So if someone can help or guide me, please do comment below.