teleren/devto huggingface dataset:
Instagram API With Node Js
Tags: javascript, node, express, api
Published: 2021-09-15 15:56:08

# instagram-api

REST API with all basic features real Instagram has.

## Features:

-   registering and logging to user account
-   posting photos
-   commenting and liking photos
-   following system
-   all CRUD operations on posts, comments, follows and likes with relevant permissions

## Technology Stack:

-   Node js
-   Express Js
-   MongoDB
-   JWT

Github : https://github.com/saidMounaim/instagram-api

Follow Me On Github : https://github.com/saidMounaim
Frontend JS, post 1
Tags: javascript, webdev, html, css
Published: 2021-09-15 15:56:34

The second week of JavaScript has ended. It’s has been fun to finally get to learn and practice code. We have gone through the basics of JavaScript, for example data types, conditions and loops. In the end of the second week got to manipulate the DOM with JavaScript.

I made a basic client-side validation with JS instead of using the browser built in validation. It was a fun assignment and a good introduction to the DOM.

{% codepen https://codepen.io/Matte667/pen/zYzPKRB default-tab=js,result %}

It has been two really fun weeks and I’m looking forward to more challenging assignments further on.
Variable Hoisting In JavaScript
Tags: javascript
Published: 2021-09-15 15:43:18

JavaScript handles function and variable declarations quite differently and you must have got stuck in one of the awkward scenarios due to it.

First of all, you should be familiar with Scoping in JavaScript. If you are, then you would know already that JavaScript only has function scopes and no block scopes.

[js]
var a = ‘hello’;
console.log(a);
if(a)
{ console.log(a);
a = ‘javascript’;
}
console.log(a);
[/js]

The result is:


hello

hello

javascript


As we can see in the above example, the if block doesn’t create a new scope.

Lets go into the concept of Hoisting now. Hoisting is a way in which JavaScript deals with variable and function declarations. What actually the JavaScript interpreter does is, it pushes all your Function and Variable declarations to the top of the containing scope.

Lets understand this with a simple example:

[js]
function sum() {
calculate();
var a = 10;
var b = 20;
}
[/js]

//Now this function will be interpreted as below

[js]
function sum() {
var a, b;
calculate();
a = 10;
b = 20;
}
[/js]

Lets try some code here:

[js]
function calculate() {
sum();
multiply();
var a = 10;
function sum(){
console.log(a + b);
}
var b = 20;
var multiply = function() {
console.log(a * b);
}
}
calculate();
[/js]

The above code will throw an error : undefined is not a function. Lets see how this function is interpreted.

[js]
function calculate() {
var a, b, multiply;
function sum(){
console.log(a + b);
}
sum();
multiply();
a = 10;
b = 20;
multiply = function() {
console.log(a * b)
}
}
[/js]

As we can see, only the left hand side of the declarations is hoisted, but that is not the case with function declarations written as sum method.

The other way of declaring functions is as method multiply, in this case though the interpreter only takes the left hand side name. This results in an error undefined is not a function as multiply is undefined at the time of function call.

This is all about JavaScript Hoisting in brief.
DEVCommunity, if you want to stay accountable, learn alongside, hit me up. Let's learn, grow and create projects together😊💪
Tags: webdev, codenewbie, wecoded, programming
Published: 2021-09-15 15:33:58

Hey #DEVCommunity, I've been learning and documenting my journey of learning webdev on (@thematsci_gal) twitter. If you want to stay accountable and learn alongside, hit me up. Let's learn, grow and create projects together😊💪
𝐑𝐞𝐚𝐜𝐭 🆚 𝐀𝐧𝐠𝐮𝐥𝐚𝐫
Tags: react, angular
Published: 2021-09-15 15:29:56

I'am not going to tell you which technology to choose. But I will give you enough "food" for thought for you to choose the technology that suits you and your project best.

❶ 𝗣𝗲𝗿𝗳𝗼𝗿𝗺𝗮𝗻𝗰𝗲
  ✔️𝑹𝒆𝒂𝒄𝒕
React’s performance is greatly improved with the introduction of the virtual DOM. Since all virtual DOM trees are lightweight and built on servers, the load on the browser is reduced. Furthermore, since the data-binding process is unidirectional, bindings are not assigned watchers as in the case of Angular. Respectively, no additional workload is created.
  ✔️𝑨𝒏𝒈𝒖𝒍𝒂𝒓
Angular performs worse, especially in the case of complex and dynamic web apps.
The performance of Angular apps is negatively affected by bidirectional data-binding. Each binding is assigned a watcher to track changes, and each loop continues until all the watchers and associated values are checked. Because of this, the more bindings you have, the more watchers are created, and the more cumbersome the process becomes.
However, the most recent update of Angular has greatly improved its performance, and it does not lose to React anymore. Moreover, the size of an Angular application is slightly smaller than the size of a React app.
 
❷ 𝐔𝐧𝐢𝐯𝐞𝐫𝐬𝐚𝐥𝐢𝐭𝐲:
  ✔️𝑹𝒆𝒂𝒄𝒕
React is a framework used in both web and mobile development. However, for mobile development, it needs to be incorporated with Cordova. Moreover, for mobile development, there is an additional framework – React Native.
React can be used to build both single-page and multiple-page web applications.
  ✔️𝑨𝒏𝒈𝒖𝒍𝒂𝒓
Angular is suitable for both web and mobile development. In mobile development, however, a great share of work is done by Ionic. Furthermore, similarly to React, Angular has an additional mobile development framework. The counterpart of React Native is NativeScript.
Angular can also be used for both single- and multiple-page web apps.
 
❸ 𝗦𝗲𝗹𝗳-𝗦𝘂𝗳𝗳𝗶𝗰𝗶𝗲𝗻𝗰𝘆
  ✔️𝑹𝒆𝒂𝒄𝒕
React is a framework for UI development, so apps written with React need additional libraries to be used. For instance, Redux, React Router, or Helmet optimize the processes of state management, routing, and interaction with the API. Such functions as data binding, component-based routing, project generation, form validation, or dependency injection require additional modules or libraries to be installed.
  ✔️𝑨𝒏𝒈𝒖𝒍𝒂𝒓
Angular is a full-fledged framework for software development, which usually does not require additional libraries. All the above-mentioned functions – data binding, component-based routing, project generation, form validation, and dependency injection – can be implemented with the means of the Angular package.

💎 You can find more about 𝐑𝐞𝐚𝐜𝐭 🆚 𝐀𝐧𝐠𝐮𝐥𝐚𝐫 in the picture below.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wy5ukutzs4p9kcdt9vp1.png)
Employee Resource Groups with Adrian Gillem
Tags: career, inclusion, podcast, management
Published: 2021-09-15 15:11:33

Adrian Gillem introduces us to Employee Resource Groups (ERGs) and what they do, what their goals are, and how they operate. He gives an example of how his employer, Booz Allen Hamilton, has successfully implemented new policies surrounding transgender healthcare, and talks about how ERGs are only as strong as the management supporting them.

{% podcast https://dev.to/greaterthancode/250-employee-resource-groups-with-adrian-gillem &}

Check out more awesome episodes (with transcripts!) at [GreaterThanCode.com](https://greaterthancode.com)!
Svelte: derived stores based on an arbitrary array of stores
Tags: svelte
Published: 2021-09-15 15:07:55

Say you have an array of stores, the length of which is not necessarily known. You want to create a `derived` store that updates its value when any of these array values changes. The derived store syntax is a bit obtuse on how this can be done, but it is possible. Here's an example:

```js
import { writable } from "svelte/store"

const storeArray = [writable(1), writable(1), writable(1)]

const derivedStore = derived(storeArray, ([...arr]) => {
  // Do stuff with your array of stores
  // e.g., this code will set the derived store's value to true whenever all the stores are greater than 10:
  return arr.every(item => item > 10);
});
```

The `...` spread syntax here allows any number of stores to be passed into the `derived` constructor's callback function.

A caveat - the derived store won't be notified if new items are added to the store array, or the array itself is redeclared. For that, you could consider making the array itself a store, and use `set` and `update` whenever you want to change it.

```js
storeArray = writable(storeArray)
const derivedStore = derived(
  [storeArray, ...storeArray], 
  ([...arr]) => {
    // arr[0] is the array itself, and arr.slice(1) contains the contents
  }
);
```
TricetAtOps: the new DevOps frontier
Published: 2021-09-15 15:07:37

**DevOps** is always evolving and every day a new trend comes out... Waiting for having **TricerAtOps** as a skill, I tried to focus on the things that really matter and describe how to go ahead with a DevOps culture that goes beyond the labels.

Joking aside, we can start talking about DevOps. In this article, I want to explain the most important buzzword and try to find out what is the fundamental lesson to take home. The title and the fun story were just an excuse to start an analysis of the most spread DevOps buzzwords.
PS: you will discover where the terms TricerAtOps come out form.

[Link to the full article](https://betterprogramming.pub/triceratops-why-devops-is-not-only-an-acronym-2177f1cf6bc2)
How to share your website links with image in Linkedin
Tags: html, webdev
Published: 2021-09-15 14:37:40

 Few weeks ago, when I wanted to publish my App ["El Mejorado Buscador de Rick y Morty"](https://eliaar.github.io/Full-API-Rick-and-Morty-React-implementation/) in Linkedin post, I found a problem: my website preview appeared without any image 😖. I had seen posts in which there were images, so I believed that it happened automatically; however, on second thought, it didn't make sense. How is going to decide the image that had to be shown in the preview? 🤦‍♀️

 That's why I started to look for a solution. I discovered I had to write some meta tags in head to comply with necessary information for my website. These are:

```html
<meta 
  property="og:title" 
  content="Title of the article" 
/>
<meta 
  property="og:description"
  content="Description that will show in the preview"
/>
<meta 
  property="og:image"
  content="//media.example.com/ 1234567.jpg"
/>
<meta 
  property="og:url"
  content="//www.example.com/URL of the article" 
/>
```
Image have to meet some requirements: 5MB max file size, 1200(w)x627(h) px, 1.91:1 ratio

 After make this changes live, I tried again to preview my post on Linkedin; but it didn't work. The reason why is Linkedin is caching websites for seven days; fortunately there is a tool to clean this cache. You just have to go to ["Linkedin post inspector"](https://www.linkedin.com/post-inspector/), enter your website URL and click on "inspect" button. And that's all folks! 😜

Here is the result
![preview result in Linkedin](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ljz75j0swf6o1jek7mlt.png)
Funções (Parte 2)
Tags: javascript, algorithms
Published: 2021-09-15 14:13:45

## Afinal, o que é função?!

Uma função é uma rotina que devolve (retorna) um resultado, o que a torna diferente de um procedimento (ou função sem retorno). A estrutura é a seguinte:

```javascript
function nomeDaFuncao(parametro1, parametro2) {
    return // Alguma coisa aqui
}

nomeDaFuncao();
```

Vamos ver um exemplinho para entender melhor esse conceito:

```javascript
function numeroAoQuadrado (num) {
	return Math.pow(num, 2);
}

const valor = 5;
console.log(numeroAoQuadrado(valor));
```

Vejamos o passo a passo:

* Foi criada uma função chamada `numeroAoQuadrado()`, que receberá um único parâmetro chamado `num`. Essa função vai calcular o quadrado de um número inteiro.

### Espera um pouco. Que jabiraca é essa que você usou dentro da função?!

Eu usei uma função chamada `Math.pow()`, que retorna a base elevada ao expoente, ou seja, faz o cálculo da potenciação. Eu também poderia ter feito das seguintes formas:

```javascript
function numeroAoQuadrado (num) {
	return num * num;
}
```

```javascript
function numeroAoQuadrado (num) {
	return num ** 2;
}
```

Retornando o raciocínio:

* Dentro dessa função, coloquei o cálculo do quadrado do parâmetro `num` e um comando chamado `return`, que vai guardar o valor de `num`.
* Foi criada uma variável chamada `valor`, que receberá um número inteiro (nesse caso, 5).
* Ao chamar a função `numeroAoQuadrado()`, coloquei a variável `valor` como parâmetro.
* O resultado (25) aparece na tela.

### Vejamos outro exemplo:

```javascript
function diferenca(a, b, c, d) {
	return (a * b) - (c * d);
}

const val1 = 5;
const val2 = 6;
const val3 = -7;
const val4 = 8;
const calcularDiferenca = diferenca(val1, val2, val3, val4);
console.log(calcularDiferenca);
```

Agora o passo a passo:

* Foi criada uma função chamada `diferenca()` que receberá quatro parâmetros: `a`, `b`, `c` e `d` (Observação: eu sei que colocar mais de dois parâmetros em uma função vai contra os princípios de código limpo, mas é só para dar um exemplo. Não me matem, por favor!).
* Em seguida, foram declaradas as variáveis `val1`, `val2`, `val3` , `val4` e `calcularDiferenca`, que receberão números inteiros. A variável `calcularDiferenca` vai receber o valor de retorno da função `diferenca()`.
* Ao chamar a função `diferenca()`, o programa volta para a parte de cima, acionando os parâmetros `a`, `b`, `c` e `d`. O parâmetro `a` recebe o valor de `val1`, o parâmetro `b` recebe o valor de `val2`, o parâmetro `c` recebe o valor de `val3` e o parâmetro `d` recebe o valor de `val4`. Dentro dessa função ocorre a diferença das multiplicações entre `a`, `b`, `c` e `d`.
* Voltando ao código principal, a variável `calcularDiferenca` recebe o resultado dessa função, isto é, `(val1 * val2) - (val3 * val4)` (`(a * b) - (c * d)`).
* O resultado (no caso, 86) aparecerá na tela.

Esse segundo exemplo foi retirado do site URI Online Judge. A quem interessar possa, aqui está o endereço:

[Problema 1007 - Diferença](https://www.urionlinejudge.com.br/judge/pt/problems/view/1007)

E aí? Gostaram? Até a próxima anotação! 😊
CWE-611
Tags: applicationsecurity, cwe, cybersecurity, softwaresecurity
Published: 2021-10-19 22:52:56

---
title: CWE-611
published: true
date: 2021-09-15 13:03:38 UTC
tags: applicationsecurity,cwe,cybersecurity,softwaresecurity
canonical_url: https://blog.shiftleft.io/cwe-611-61fc6423f389
---

#### Improper Restriction of XML External Entity Reference

![](https://cdn-images-1.medium.com/max/640/1*60N8iD9h3Tn88OLcJFNLyQ.jpeg)

CWE-611 refers to vulnerabilities that arise when an application processes an XML document that contains entities referring to external URIs. These URIs resolve to assets outside the control of the application, resulting in the potentially unsafe execution of actions dictated by the outside assets.

### Why improper restriction of XML external entity references are problematic

The improper restriction of XML external entity reference can allow malicious parties to interfere with the application’s processing of XML data, impacting the application’s logic, performing unauthorized actions, and accessing sensitive data.

### How XML-related vulnerabilities occur

XML is used to store and transport data using a tree-like structure of tags and data. XML documents can contain a document type definition (DTD) whose declarations define the structure of the XML document, the data values permissions, and so on. The DTD can be placed within the document itself, or it can refer to an external version. Within DTDs, you can declare “XML entities”, which are used to refer to values in the document, just like variables in programming languages.

There is a special type of XML entities called “external entities”. They are used to access local or remote content with a URL. When the application accepts user input that is included in an XML document or parsed as an XML document, a malicious party can provide malicious XML external entity definitions that point to unintended destinations, such as the URI of sensitive files on the system. The XML parser would then parse and return the sensitive file to the malicious actor.

### Mitigating XML external entity references-related vulnerabilities

XML-related vulnerabilities typically result from improper software architecture. As such, the key practice for mitigating and remediating XML-related vulnerabilities is to validate and sanitize any user input that you might use in an XML document.

Additionally, it’s possible to block key XML metacharacters or escape key metacharacters (such as < or > with &lt; and &gt;).

### TL;DR

- CWE-611 issues typically result from software architecture decisions that allow users to provide input that’s then used by the application.
- The key protective measure is to sanitize or escape all user input used in XML, though escaping or blocking key XML metacharacters is also protective.

* * *
#help Should I use Golang or Node.js for E-commerce
Tags: webdev, beginners, node, go
Published: 2021-09-15 14:01:34

Hello Everyone
Hope you're all doing well. 


I need a little help, I want to create an e-commerce for a startup, They gave me two options for a backend Golang and Node.js. I have no expereience in both. Previously I used a Django/Flask as backend. I am interested in  Golang. So it is possible that can I use Golang for e-commerce as a backend?

I want to create a REST-API in golang and use it with react.js which we will be using for a frontend.

I am open for any kind suggestions.
Recruitment
Tags: career, developer, frontend, backend
Published: 2021-09-15 13:20:12

<p>Okami Intalentgent Solutions est un cabinet de recrutement spécialisé dans les profils techniques. Nous vous proposons des offres d'emplois dans des secteurs technologiques, techniques et IT.</p>

<p>Ce que nous vous proposons avec nos jobs ?<br>
Un environnement à haute valeur ajoutée ;<br>
Un emploi gratifiant ;<br>
Souvent innovant ;<br>
Et le tout avec un contrat en CDI.</p>

<p>https://www.okami-is.be/job/</p>
Using dd (dump and die) function in PHP
Tags: php, webdev, beginners, tutorial
Published: 2021-09-15 12:48:57

One of the most common ways to debug an error in PHP ecosystem is to dump the variable on the screen, and figure out what is going wrong with it.

The most common way we do it in PHP is via using `var_dump` function.

var_dump function dumps all the information about the variable or object on your page, but it does not stop the execution of the program further.

Let’s consider an example where if you have an associate array and you want to dump it on the screen.
```php
<?php

    $prices = [
        '🍔' => 5.99,
        '🍟' => 4,
        '🍻' => 10
    ];
    var_dump($prices);
```
This is what you get on the screen.
![screen](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/600tbzgesh40rj2ok2sp.png)
As you can see our code did not die and also the formatting very nice 🤔

### Using dd in PHP
If you are a laravel developer you must be aware of dd() function, dd dumps and die. There is no dd function in php if you try to do dd($prices) in the above example it will throw an error `Call to undefined function dd()`.
We can however create our own dd function, that will dump the variable/object and then die the script execution.
We have created a new `dd` function, and wrapped the `var_dump` around `pre` tags so that it gives out a nice formatting in the browser and a more readable dump.
```php
<?php

    function dd($data) {
        echo '<pre>';
        var_dump($data);
        echo '</pre>';
        die;
    }

    $prices = [
        '🍔' => 100,
        '🍟' => 10,
        '🍻' => 4
    ];
    dd($prices);
```
This is how you see the output, and the php scripts die after dumping. It does not execute the further code.
![result function](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qw34zpbpfo7gxcwldq1i.png)
You can isolate this function in a reusable functions file or a Class.

* * *
I hope you enjoyed the read!

Feel free to follow me on [GitHub](https://github.com/saymontavares), [LinkedIn](https://www.linkedin.com/in/saymon-tavares/) and [DEV](https://dev.to/saymontavares) for more!
What Is Multi Codec Streaming
Tags: streaming
Published: 2021-09-15 12:46:14

Encoding video using streaming with multiple codecs can double the video quality, reduce bandwidth consumption, and maximize device coverage.
##**Current State of Codecs**
H.264, also known as AVC, is currently the most widely used codec in online video. Almost every device and operating system supports hardware or software decoding. But while this compression technology is widely supported, it is far from the most efficient codec available in terms of compression ratio. Next-generation codecs such as VP9 and H.265, also known as HEVC, have been proven to deliver up to 50% bitrate savings over H.264. Once the AV1 hits the commercial market, it will likely offer an additional 30% savings.
##**Challenges of Using Next Generation Codecs**
The challenge for the next generation codecs (HEVC, VP9 and AV1) lies in their limited browser support. HEVC is supported on Apple devices equipped with iOS 11 and macOS High Sierra, as well as most 4K SmartTVs and Microsoft Edge for Windows 10 (when the device has a hardware decoder). VP9 is supported on Google Chrome, Firefox, Microsoft Edge, and Android devices. This split support situation has resulted in many content providers using H.264 by default to provide full platform coverage.
##**How Streaming Works with Multiple Codecs**
Multi-codec streaming allows you to switch between codecs based on the user’s platform capabilities, maximizing video streaming quality and bandwidth efficiency, improving QoE and reducing [CDN solutions](https://setplex.com/en/cdn.html) costs.
##**Multi-Codec Workflow**
At a high level, [OTT streaming](https://setplex.com/en/setrix.html) with multiple codecs is a simple concept. The player determines the capabilities of the viewer’s platform and streams the video according to the system in which it is played.
The first stage in the multi-codec workflow requires encoding each video into all of the codecs that you wish to support. In most cases this will be H.264, HEVC and VP9, however AV1 is already available and will soon be commercially viable.
The first step in the multi-codec workflow requires you to encode each video into all the codecs you want to support. In most cases these will be H.264, HEVC and VP9, ​​however AV1 is already available.
Once encoding is complete, adaptive bitrate packets are moved to your storage system, where they are immediately available for streaming. The manifest file of a multi-codec adaptive package contains information for the player that tells it what codecs are available. Every time a user clicks the play button, player analyzes their system and selects a stream encoded with the most efficient codec for their device and platform.