teleren/devto huggingface dataset:
APPLICATION PROGRAMMING INTERFACE (APIS)
Published: 2020-11-13 08:59:46

Using a life scenario to explain the existence of APIs is the best way to communicate with someone that needs an extensive understanding of APIs.

    Taking a standard restaurant as an example.We have the waiter, kitchen, client, and menu.

    As the client(interface), you make an order(request) from the menu on your table, the waiter(API) comes around to pick your order and send it to the kitchen(database) to prepare and return your order(response). APIs are the intermediary between frontend and backend and the main purpose is for sending requests and receiving responses.


 ** THE ANATOMY OF URL(Unified resources locator)**
      Understanding the anatomy of URL is the key to know how HTTPS, domains, APIs, endpoints, and query parameters work.

api.themoviedb.org/3/movie/upcoming?api_key..

Using the above URL for explanation :

HTTPS is a secured protocol and the security of this protocol can be identified by a padlock icon that is locked while HTTP is an unsecured protocol.

api.themoviedb.org is the domain name

movie is the API that has an endpoint "/upcoming/" (an example of endpoint/path you wish to collect data from)

?api_key=229c849a6b383c4b10bad6a2aa48ab90 In some cases, we have query parameters. A query parameter is a key value pair of query name and query value .It comes after the endpoint and starts with ?, they're displayed like this (? query name = query value).We can have as many query parameters as possible. The way to add query parameter is by appending an and(&).

Documentation is the only way to have enough understanding on how to access other web server APIs endpoint.
My #100DOC - Day 92
Tags: 100daysofcode, challenge
Published: 2020-12-04 21:38:07

### Day 92: November 26, 2020

#### **Today's Progress**: 
1. **[JAXB](https://github.com/pablohs1986/dam_ad2021)** (1h 30min):<br>Studying JAXB theory.
    
#### **What I learned**: 
* JAXB theory.
* 
#### **Total time**:
1h 30min.
How to use express js with dotenv and ES6 modules
Tags: express, es6, dotev
Published: 2020-12-04 21:37:32

*If you are interested in developer trends you should check out my new newsletter at: [unzip.dev](https://unzip.dev)*

---

I'm assuming you are using nodejs with a version later than 13.
First, you will need to change your `package.json` to:
```
{
  "name": "api",
  "version": "1.0.0",
  "type": "module", 
  ...
}
```
(The `type` is the important part).

Now you can freely use imports, here is an express start with [dotenv](https://github.com/motdotla/dotenv)

```js
import dotenv  from "dotenv"
import express from "express"

dotenv.config()

const app = express()
const port = process.env.PORT || 5000

app.get('/', (req, res) => {
  res.send('Hello World!')
})

app.listen(port, () => {
  console.log(`Example app listening at http://localhost:${port}`)
})
```

Notes: 
*Having `dotenv` gives you the ability to add environment variables into `.env` files and use them easily in your express (in this case) app.*
Working Software
Tags: agile, programming, tdd
Published: 2020-12-04 22:33:08

---
title: Working Software
published: true
date: 2020-12-04 20:56:35 UTC
tags: AgileDevelopment,agile,programming,TDD
canonical_url: https://on-sw-integration.epischel.de/2020/12/04/working-software/
---

Ron Jeffries published a wonderful post titled “[working software](https://ronjeffries.com/articles/020-01ff/working-software/)“. He quotes the agile manifesto “working software is the primary measure of progress”.

Now, he explains that what exactly “working software” means depends (as always). But in general,

> Working software is real. It works. It can be tested. It can be verified. Questions about whether it does X are readily answered with “Yes” or “No”. The less ambiguity there is in our answers—our true answers—the closer to “working software” we are.

And he shares his opinion on “best development style”:

> The best development style we know today, whether working solo, in pairs, or in a mob, is to pick a very small thing that the system doesn’t as yet do, verify that it doesn’t do it, then make it do that thing, verifying again, and keeping the code at or above our standard of internal quality.
> 
> How small should that thing be? Tiny. Smaller than that. No, smaller still.

I repeat that:

1. pick a very small thing that the system doesn’t do yet
2. verify it doesn’t do it (the “red” step in the TDD cycle)
3. make it do that thing
4. verify it does it (the “green” step in TDD)
5. keeping the code at or above our quality standard (the “refactor” step in TDD).

I really like that. It’s not always that easy. But more often than not.

I know of TDD but I need to get better at remembering this (I’ll put that in my Anki deck) – including the _very small_ part – and then practice it.
MMT Tech Meetup November 2020 - Website Accessibility
Tags: websiteaccessibility, a11y, automatedtesting
Published: 2020-12-04 20:47:36

---
title: MMT Tech Meetup November 2020 - Website Accessibility
published: true
description: This meetup covers Website Accessibility
tags: websiteaccessibility, a11y, AutomatedTesting
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/n3mmy77aay7rsre2qwis.png
---

## MMT Tech Meetup - November 2020 featuring Website Accessibility

Website Accessibility plays a big role in development these days and it is essential to make sure what you build is available and useable by everyone. Leaving key aspects out of your development process, like accessibility, can affect people accessing your content, which is not recommended. It should be considered best practice to make sure your site has basic accessibility features. The meetup below goes through some of the things you should be considering.  

Meetup agenda:
- Why be accessible? - (Graham Rees-Evans - Technical Manager, Consultant, and Training - Shaw Trust)
- Common Accessibility mistakes - (Ilesh Mistry - CMS Specialist and Kontent MVP - MMT Digital)
- How to use pa11y-ci to prevent accessibility issues? (Tomas Jakelis - Front-End Engineer - MMT Digital)
- Using Persona Profiles for Accessible Websites (Nadia Rasul - Sr. Front-end Developer & Accessibility Lead - Reason One)

This is the recording from the tech meetup https://www.youtube.com/watch?v=idwE0ENNoRA
[![MMT Tech Meetup - November 2020 - Featuring Website Accessibility](https://dev-to-uploads.s3.amazonaws.com/i/n3mmy77aay7rsre2qwis.png)](https://www.youtube.com/watch?v=idwE0ENNoRA)

This is the recording from the MMT Tech Meetup where we have the following content in this video:
00:00:00 - Welcome to the MMT Tech Meetups by Ilesh Mistry
00:03:12 - Why be accessible? by Graham Rees-Evans
00:29:15 - Common Accessibility mistakes by Ilesh Mistry
00:59:35 - How to use pa11y-ci to prevent accessibility issues? by Tomas Jakelis
01:32:42 - Using Persona Profiles for Accessible Websites by Nadia Rasul
01:59:47 - End

Useful links
- Common Accessibility Mistakes slides (https://www2.slideshare.net/IleshMistry/common-accessibility-mistakes-239544831)
- Common Accessibility Mistakes carousel video 
Video - Marcy Sutton: ”Garbage Pail Components” — Clarity 2019 
https://youtu.be/MVzihFS1UQU?t=1208 - 00:20:20 to see the Carousel example from Ilesh's slides 
- How to use pa11y-ci to prevent accessibility issues slides (https://www2.slideshare.net/TomasJakelis/mmt-tech-meetup-november-2020)
- Using Persona Profiles for Accessible Websites slides (https://www2.slideshare.net/nrasul/using-persona-profiles-for-accessible-websites)
What Do You Do Friday for a better Monday?
Published: 2020-12-04 20:46:49

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

So here is a question, what do you do development or otherwise on a workday Friday afternoon to ensure a better Monday morning?

For me, I have a couple of things,

- Clean out the emails
- Check those files are all in the repositories
- Check that my tasks and tickets are up to date
- Look at my calendar so there are no surprises for Monday

<span>Photo by <a href="https://unsplash.com/@glenncarstenspeters?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Glenn Carstens-Peters</a> on <a href="https://unsplash.com/s/photos/planning?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Unsplash</a></span>
Reusable Code with "this" Keyword
Tags: programming, javascript, objects, coding
Published: 2020-12-04 20:30:28

If you are familiar with JavaScript objects, you know that you can access the value of an object property using dot notation like this:
```
let dog = {
    name: "Doug",
    breed: "pug",
    sayName: function() {return "The name of this dog is " + 
    dog.name + "."}
}
console.log(dog.sayName())
// "The name of this dog is Doug."
```
This is a fine way to access a property, but, if we want to future proof our code and account for the fact that variable names sometimes change, this is not the best way to access object properties. If we were to change the variable name from "dog" to "animal," any other code that references the original variable name of "dog" would need to be updated to the new variable name of "animal." You could see how this could quickly escalate if the original variable is referenced in a lot of other places. 

However, this problem can be easily avoided if we were to use the "this" keyword. The "this" keyword is a very deep topic that is beyond the scope of this short blog post. I am merely showing you one way to use it. However, "this" is something that I implore all of you to look deeper into. 

In its present context, "this" refers to the object that is associated with it, which, in this case, is "dog." We can access the same name property, only this time we use the "this" keyword instead of the "dog" variable:
```
let dog = {
    name: "Doug",
    breed: "pug",
    sayName: function() {return "The name of this dog is " + 
    this.name + "."}
}
console.log(dog.sayName())
// "The name of this dog is Doug."
```
We achieve the same result as before, only now if we were to change the variable name to "animal" we would not have to find and modify all of the references to "dog" in our code. Our code is now reusable and easier to read.
CLI Project
Published: 2020-12-04 20:24:54

This is was def a solid first project. It test all of your understanding from the things I learn from the first two weeks! Starting my project I was not confident because I could not find a good api I could work with. As days progressed I fell behind the 8ball. It had been 3 days and I was still at the starting line with no api. At this point I called a life line to help me out. With their help I was able to figure out why my first api I selected was not working. 

I was able to refocus my scope and I was off to the races! The resources that were available to me were vast and definitely helped. I am grateful but where I struggle is recalling the information that I used in my code. Like, the reasons why I wrote my code a certain way or what a specific line does. 

This project made that distinction clear. It also showed me the growth I have made as well! I have made leaps and bounds since week one but I still have a lot more  room for growth when it comes to Ruby.

I have a review coming up which will test my knowledge on my project. I feel like through this trial by fire I will gain a better understanding of my code and progress from there.
bind(), apply() and call() me maybe: Pt. 1 
Published: 2020-12-04 20:24:07

This is part one of a three part series on JavaScript's `bind()`, `apply()` and `call()`. These three methods are pretty closely related, but I think that each one deserves its own post! These concepts can be a little difficult to grasp, at least they were for me, so focusing on one at a time will be helpful!

The `this` keyword:
* This [tutorial](https://www.javascripttutorial.net/javascript-this/) covers just about everything you need to know about `this`.


First, let's take a look at the docs on `bind()` from [JavaScript MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_objects/Function/bind):
```
The bind() method creates a new function that, when called, has its this keyword set to the provided value, with a given sequence of arguments preceding any provided when the new function is called.
```

That explanation is a little rough, especially if you're new to JavaScript. Let's break it down!
* `bind()` returns a new function that has a specific value of `this` bound to it when invoked.
* The parameter passed into `bind()` will become `this`.
* You can add extra parameters to `bind()` after this initial `this`.
* Use `bind()` when you want to call a function later on and with a specific context.

Here's an example without `bind()`:
```
let meal = {
  snack: "apple"
}

let eat = function(){
  console.log(this.snack)
} 

eat();
// will return undefined
```

Here is where `bind()` comes in to save the day!
```
let boundEat = eat.bind(meal)

boundEat();
// returns "apple"
```

Now, let's see how we can add in those extra arguments!

```
let meal = {
  type: "dinner",
  consistsOf: "spaghetti and meatballs"
  chef: function(name) {
    return `Chef ${name} says: "We're having 
    ${this.consistsOf} for ${this.meal}."`
  }
}

let chefSays = meal.chef.bind(meal, "Remy")

// returns Chef Remy says: "We're having spaghetti and meatballs for dinner."
```

That's `bind()` simplified!
Algorithm Toolkit #1: Modulo
Tags: algorithms, javascript
Published: 2020-12-04 20:15:09

Welcome to the part of this blog where I write about things I either:

A) Wish I had known when I started programming
B) Am really grateful someone taught me when I started programming

Oh, who am I kidding? That's my entire blog.

Let's talk about number manipulation for algorithms. More specifically, let's talk about the modulo, or remainder operator. _(Quick note here: these are different things, but not for the purposes of the use case described in this post)_

<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Remainder">MDN says it best:</a>

>The remainder operator (%) returns the remainder left over when one operand is divided by a second operand. It always takes the sign of the dividend.

So, `4 % 2` is `0`, and `5 % 2` is `1`.

Okay, we'll come back to that in a moment.

Let's say you're given a common algorithm: reverse digits.

The problem states that, given any integer as an argument, write an algorithm that returns the _reverse_ of the digits of that integer. As an example, this algorithm, given 123, would return 321.

In JavaScript, you could achieve this using built-in methods:

1. Turn the number into a string
2. Turn the string into an array
3. Reverse the array with .reverse()
4. Turn the array back into a string
5. Turn that string back into a number

But this defeats the point of algorithms: the point here is to use a lightsaber, not a blaster: a civilized weapon for a more civilized age.

So! Let's avoid all of this data manipulation entirely and leave the number as a number.

To reverse the number, we need to be able to extract a single digit from the number at a time.

It turns out that, given x being any integer, `x % 10` always _returns_ the last digit of that number. To continue the exmaple, `123 % 10` _returns_ 3. There's our last digit!

If you wanted to simulate "popping" the digit off the number, you could, for example:

_Disclaimer: this code assumes a **positive** number_

```js
let x = 123;

while (x > 0) {
  // Here's our x % 10 operator, storing the last digit in r
  const r = x % 10;

  x = (x - r) / 10; // This is the important part

  // Use the remainder for something here
}
```

Pretty easy, right? Given that the remainder of `x % 10` is the last digit of that number, _you can then just subtract that remainder from the original number and divide by 10_.

Given 123, one iteration would leave 12, then 1, and finally `1 - 1 / 10` is 0, which ends the loop.

You can use this any time you need to manipulate a number without converting it into a string! Try it out the next time you need to manipulate a number directly.
Módulos npm más utilizados por Bananacode 2018–2020
Tags: npm, node, javascript, analytics
Published: 2020-12-04 20:04:10

Después de un largo camino de 2 años, en Bananacode hemos logrado crear proyectos innovadores, de alto desempeño y con problemas técnicos complejos, haciendo uso de nuevas y actualizadas tecnologías en el mercado, siendo NodeJs la ganadora en esos 2 años. Desde una aplicación móbil hasta servidores descentralizados, han sido parte de estos retos que hemos afrontado.

En la siguiente gráfica se pueden observar el top 15 módulos más utilizados.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/wucdmd854ufri9vqvae2.png)

En la siguiente gráfica, se pueden observar el top 15 módulos más utilizados removiendo linters, bundlers, preprocessors y formatters de código.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/0fwxqlx5kfe4fh9e2xyd.png)

En la siguiente gráfica se pueden observar los porcentajes de módulos de tipo Linters y Formatters “A” contra paquetes de utilidad directa “B”.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/w6gwl31n84xg3qzut8zs.png)

Muchos se pueden estar preguntando, ¿por qué esos módulos fueron elegidos? o ¿cómo saber cuáles utilizar? la respuesta a estas preguntas no es tan simple, y la forma correcta de dar una respuesta es dependiendo del problema. Una descripción correcta de cuáles son estos factores de selección podrían ser los siguientes:
Alcance del proyecto: Por alcance podemos hacer referencia a cantidad de funcionalidades, plataformas soportadas o tiempo en el que el proyecto se va a encontrar al aire, no es lo mismo hacer una campaña o landing page de un mes, a una plataforma que se espera que permanezca encendida por un periodo de 5 años como por ejemplo: React-Native que facilita la creación de aplicaciones móbiles con un único lenguaje de programación.
Tipo de proyecto: El proyecto puede ser de tipo back-end o de tipo front-end. Una librería para la interfaz de usuarios podría no ser muy sensato, como por ejemplo: la automatización de correos haciendo uso de Node-Mailer y Redis como módulo de conexión a base de datos.
Tiempo de desarrollo: Muchas veces el uso de un framework o módulo puede acelerar el tiempo de desarrollo de un proyecto, así mismo, podría ser un atraso a causa de la curva de aprendizaje que el equipo debe de afrontar. Usualmente utilizar “vainilla” pueder ser una opción más eficiente y de menor costo en tiempo de desarrollo como: Validation para realizar validaciones de ingreso de parámetros.
Soporte de proyecto: Una parte muy importante del desarrollo de software es el tema de mantenimiento o soporte, una vez terminado el proyecto, existen módulos que pueden facilitar esta tarea como lo son: Typescript , Eslint y Prettier que a largo plazo y gran escala, pueden beneficiar el mantener proyectos.
…
Estos fueron los módulos utilizados para este análisis.
“@octokit/rest”: “0.9”
“d3”: “2.0”
“dotenv”: “2.0”
“jsdom”: “4.0”
“node-fetch”: “6.1”

También en este archivo se puede ver más ampliamente el total de módulos utilizados en estos 2 años.

https://gist.github.com/allexxis/0d05336349566c9f5841573e943531d0
S3E6 Learn JMeter Series - Listeners in JMeter
Tags: performance, webperf, testing, tutorial
Published: 2020-12-04 19:58:21

Welcome to Learn JMeter Series!

In this Season 3, Episode 6, you will learn following:

🔹 Listeners in JMeter

{% youtube n8iGDgSDbg0 %}

☑ Buy me a tea 🍵 : https://www.buymeacoffee.com/qainsights
☑ [My Blog](https://qainsights.com)
☑ [My Udemy Course](https://www.udemy.com/course/performance-testing-using-truweb)

{% github QAInsights/Learn-JMeter-Series%}
Best TV shows/Documentaries for tech geeks & Entrepreneurs 🎞
Tags: techtalks, beginners, startup, motivation
Published: 2020-12-04 19:46:54

###As a tech lover, you’ll find dozens of documentaries that you can stream over your television, computer, tablet, or even phone. These films discuss some of the top names in the industry as well as major innovations over the years

#1. Silicon Valley
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/1z0i70aql5ecizklwxv9.jpg)
*The show chronicles the journey of a few engineers who are running a startup as they try to navigate Silicon Valley, investors, and the many clichés that are involved with startup culture.*
#2. Mr. Robot
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/mbqm9h9xk488pgg24ir5.jpg)
*The show follows the footsteps of Elliot Alderson, a cybersecurity engineer in a cybersecurity firm ‘Allsafe’ by day and vigilante hacker operating from his computer, apprehending no-gooders by night. Elliot struggles with social interactions because of his Chronic Depression and Social Anxiety but he persists with zeal to follow through with his plans.*

#3. The Social Network
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/drgvp6z8i3ryxlm83sw0.jpg)
*The thing I love about The Social Network is, the flow of the movie resonates with the characters it depicts. The movie proceeds with a breakneck pace, is raw, visceral, and restless, much like its characters. Another reason why the movie works is Impeccable casting. Jesse Eisenberg playing Mark Zuckerberg with an air of arrogance nails it. Andrew Garfield is the most likable character in the movie, as Eduardo Saverin. No one could have played Sean Parker like Justin Timberlake, and Armie Hammer playing the Winklevoss twins is fantastic too.*

#4. Steve Jobs: The Man in the Machine
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/44wu4jzipwcgok2ce216.jpg)
*The documentary “Steve Jobs: The Man in the Machine” captures, in its succinct subtitle, the contradictions inherent in its subject. Jobs, who founded Apple Computer with his friend Steve Wozniak in 1976, is presented as both brilliant and abrasive: a driven and at times deceitful tyrant whose firm made some of the most beautifully designed consumer electronics of the past couple of decades.*

#5. The Founder
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/tid7wb70kzsg9k2336ie.jpg)
*I Never heard the original McDonalds story before, so the movie kind of left me in shock by the end of it. All the actors and especially Michael Keaton portraying the lead character(Ray) did a fantastic job. I felt a deep connection with the characters that I forgot I was watching just a movie.*

##*These were some of my top picks, Have a great day ahead !! 🎇🎇*
System Design Interview - Design Youtube
Tags: tutorial, career, webdev, javascript
Published: 2020-12-04 19:41:32

In this video I'll show you some tips for how to handle a system design interview using Youtube as the example application to design.

Topics covered:
* **How to determine exact requirements interviewer is looking to cover**
* **Quick math for determining capacity requirements**
* **Database Design**
* **High level architecture design**
* **Detailed explanation of components**
{% youtube YEwKnGARDZI %}
my react app is published but my images assets in the images directory (/assets/images/) are not showing properly 
Tags: react, npm
Published: 2020-12-04 19:39:40

I think they were not deployed in the first place, cause when I built my project I didn't execute the last 2 commands that were suggested to me:

npm install -g serve
serve -s build

feel free to jump & share your input about this.