teleren/devto huggingface dataset:
Two Pointer Method to find two numbers
Tags: programming, cpp, dsa, algorithms
Published: 2022-03-25 12:01:46

Consider a situation, problem where you need to find a pair of numbers whose sum can give you a target number.
like, x+y = target
Here, you need to find x,y from array, list, vector or any other sequential data structure, where array is sorted.

### Brute-force Approach
1. Take one element and add it with another element.
2. Do this until sum of these elements is equal to target.
therefore, in worst case it will take

_Time Complexity_ - O(n^2)

### Two Pointer Method
1. Take two variables `start` and `end`.
2. Point `start` towards first element of array.
3. Point `end` towards last element of array.
4. Now let's put a while loop till we get desired result,
condition - `start + end == target`.
5. If `start + end > target` we will shift `end` leftwards.
6. If `start + end < target` we will shift `start` rightwards.

Thus by using this technique we can solve this problem in
_Time Complexity_ - O(n)

``` cpp
// Program to get two numbers from array whose sum is equal to target element.

#include <bits/stdc++.h>
using namespace std;
int main()
{
    int a[10] = {1, 4, 6, 8, 9, 12, 14, 16, 17};
    int target = 20, start = 0, end = 8;
    while ((a[start] + a[end] != target) && (start < end))
    {
        if (a[start] + a[end] > target)
        {
            end--;
        }
        else
        {
            start++;
        }
    }
    cout << "Two numbers are: " << a[start] << ", " << a[end] << endl;
    return 0;
}

// Code contributed by Kunal Agrawal
```
Thanks for reading this article.
Have a great day! 🙂
Why Data Cleaning?
Tags: programming, datascience, python, javascript
Published: 2022-03-25 11:53:50

~ "Garbage In, Garbage Out": Bad data will lead to bad results, plain and simple.
~ It's hard for computers to judge whether the data makes sense or not.
~ To get accurate results, you need to remove errors from you data which confuses the algorithms.
~ It's time-consuming process but important.

## **What are the causes?**
- Input Errors
- Duplicates
- Mangled Data
- Malfunctioning Sensors
- Lack of Standardization

## **Identifying Problems**
- Range Constraints
- Data-Type
- Compulsory Constraints
- Unique Constraints
- Cross Field Constraints

## **Data Cleaning Techniques**
- Removing missing data
- Direct correction
- Normalization
- Syntax errors
- Data Imputation
- Spell Check
- Filter Unwanted Outliers
- Remove Irrelevant Values
- Fix structural errors
React router private Routes
Tags: rr6, javacript, routes, react
Published: 2022-03-25 11:45:13

```js
import React from "react"
import {Outlet,Navigate} from "react-router-dom"
import {useJwt} from "react-jwt" // decode token
import jsCookie from "js-cookie" // store cookie if login

const ProtectedRoutes = () =>{
  const {state} = useAppState() // consum the context
  
// add persistent in route in application
const retrieveToken = jsCookie.get("token")
const {decodeToken} = useJwt(retrievesToken)

useEffect(()=>{
    if(token){
      // persist route and update app state like user informations
      dispatch({type : "Auth/Ok"}) //state.isAuth :true
      dispatch({type : "Users/Ok" , payload : {users : ...decodeToken}}) 
    }
},[])

 return (state.isAuth || token ) ? <Outlet/> : <Navigate to="/"/>
}
```
Create color console in vscode snippets
Tags: console, vscode, snippets
Published: 2022-03-25 11:35:11

---
title: Create color console in vscode snippets
published: true
description: Create color console in vscode snippets
tags: console, vscode, snippets
//cover_image: https://direct_url_to_image.jpg
---

Step 1: ctrl + p -> configure user snippets and select Javascript.json & Javascriptreact.json

```json
{
	"color console" : {
		"prefix": "colorconsole",
		"body": [
			"console.log('%c Oh my heavens! ', 'background: #222; color: #bada55', );"
		],
		"description": "color console"
	}
}
```
Step 2: Then in vscode setting

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gh3iqt8vto2mbkxp9rhd.png)
This Week in Python
Tags: python
Published: 2022-03-25 11:30:27


**Fri, March 25, 2022**

This Week in Python is a concise reading list about what happened in the past week in the Python universe. 

## Python Articles

- [Processing large JSON files in Python without running out of memory](https://pythonspeed.com/articles/json-memory-streaming/) – Parse JSON files with streaming parsing
- [Currying In Python](https://sixeleven.in/currying) – Currying is a technique in functional programming to transform a function with multiple arguments into a sequence of nested functions with fewer arguments.
- [Running Python in WebAssembly](https://www.fermyon.com/blog/python-wagi) – It is now possible to run Python inside of a WebAssembly runtime.
- [How to Make the Most of Pydantic](https://towardsdatascience.com/how-to-make-the-most-of-pydantic-aa374d5c12d) – techniques for data contract validation, higher interoperability with JSON Schemas, and simplified data model processing.
- [Implementing @property, @staticmethod and @classmethod from scratch](https://sadh.life/post/descriptors/) – A follow up article to my [guide to decorators](https://bas.codes/posts/python-decorators)


## Projects

- [authentik](https://github.com/goauthentik/authentik) – authentik is an open-source Identity Provider focused on flexibility and versatility.
- [changedetection.io](https://github.com/dgtlmoon/changedetection.io) – self-hosted website change detection monitoring and notification service
- [ibis](https://github.com/ibis-project/ibis/) – Python data analysis framework for Hadoop and SQL engines
- [xonsh](https://github.com/xonsh/xonsh) – Python-powered, cross-platform, Unix-gazing shell
- [thefuck](https://github.com/nvbn/thefuck) – Magnificent app which corrects your previous console command.
Sniffing the Reverse Shell
Tags: cybersecurity, malware, reverseshell, wireshark
Published: 2022-03-25 11:29:48

This is a follow up of my previous post [Glimpse of Reverse Shell](https://dev.to/indominus_rem/glimpse-of-reverse-shell-3n4n)

Now we are going to see how the reverse shell's network traffic looks like using the Wireshark.

First start Wireshark (assuming that you have already installed it in your machine) and click the capture button after selecting your targeted network interface (in my case I have only one "Ethernet").

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nvl6qpq4i37kvy2k5xaw.png)

Then follow the steps from [Glimpse of Reverse Shell](https://dev.to/indominus_rem/glimpse-of-reverse-shell-3n4n) and type any command in the reverse shell. It will generate some network and it will show up on the WireShark at midst of other network activities. 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qsbmcoeddfdbfyb77ahn.png)


In our case we know the destination port is 8989, so we can apply it as filter like this,

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nsybl6gkqjc077f29ks7.png)


Then we can follow the TCP stream of the filtered traffic

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ph8s8m44sr48f1qsw6bp.png)


Finally we get see the result of the command that have executed remotely

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/f28mccosp8fdoads92fa.png)

Again it is very beginner level demonstration of how to look for network traffic of a naive reverse shell. In real world scenario it would be complicated to varying degrees. For example the network traffic might be encrypted or the data might be obfuscated. I hope this helps you to get some basic understanding of the reverse shell's traffic..
Amazing tools for better understanding Scope and Block in javaScript!
Tags: javascript, scope, block, visualize
Published: 2022-03-25 11:10:28

If you are reading this article, we assume that you are familiar with the concept of scope and block in JavaScript, and we only intend to introduce you to some practical tools in order to better understand this concept.

## JS Scope Visualizer

![JS Scope Visualizer preview](https://media-exp1.licdn.com/dms/image/C4E22AQEPPlchlD7pUA/feedshare-shrink_800/0/1643025108678?e=1651104000&v=beta&t=ioY3wjqIj9HUOI_DnpqCkuAvOF88FAIwgo9T6QTY9xA)

In JavaScript, the "Scope" concept has always been tricky for programmers, no matter how experienced they are. here is a simple tool for visualizing the scope of every part of your code. this online tool illustrates your scopes with colors. code sections with the same color are in the same scope! enjoy.
🌎 https://js-scope-visualizer.firebaseapp.com/#visualizer

## VS Code Trick

![VS Code preview](https://media-exp1.licdn.com/dms/image/C4E22AQE2neJZ6TsmCA/feedshare-shrink_2048_1536/0/1644059006262?e=1651104000&v=beta&t=9xIdDbIXv8WxTJWVoxK2sMuzqZih2uZ9zn6OhUZwi5Y)

If you are a programmer seeking perfect control over your code, I strongly recommend copying these two lines from here (at the bottom) into your VScode "setting.json" file. Why?!
As you can see (in GIF), by doing this, you activate a built-in function that automatically colorizes the matching brackets and at the same time indicates the scope/block you are in! So what are you waiting for?
Copy these two lines into your VScode "setting.json" file :

```
"editor.bracketPairColorization.enabled": true,
"editor.guides.bracketPairs": "active",
```

There are, of course, other tools and methods that can be used to better understand Scope and Block. Please feel free to refer to it in the comments section so it can be included in the article if it is useful.

My name is "Hooman Talakian" and you can [follow me on LinkedIn](https://www.linkedin.com/in/hoomantalakian/) if you liked this article.
I am officially a Codemotion Ambassador
Tags: ambassador, award
Published: 2022-03-25 10:53:25

![...](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/om6ga2y7qht7ksbem4bq.png)

It's a great honor to be selected as one of the first six people in the Codemotion Ambassadors program.

I am happy and proud to announce that I have been awarded as one of the   of the Codemotion Ambassadors program.

![...](https://images.gr-assets.com/hostedimages/1446494393ra/16817275.gif)
 
> The program will be dedicated to creating a structured Codemotion supporters network. It will help you share your software development knowledge, grow your professional skills, and provide value to the global tech community.

**My heart belongs to the community** and since a while I want to give back to the community what it has given to me.

When the organizers asked me if I would like to join the program (which is still in beta) **I didn't hesitate to accept**.

I am happy to be in a good company with the other six friends and colleagues.
I shared a lot of awesome experiences with them.

![...](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/q77z4tjbdu8vuj7d1ruk.png)

## What is Codemotion
[Codemotion](https://www.codemotion.com/) is the biggest tech community in Europe to help developers grow.
They organize a lot of events and webinar about a lot of topics: accessibility, AI, programming languages and much more.

## The Program

The program will still be in beta for a few more months but you can start applying by doing some online activities, including:

- Writing tech articles, creating tech videos
- Stream a Live Code Session on Twitch
- Create new content and formats with us
- and much more

You can find more information about the program on the official website: https://extra.codemotion.com/ambassadors-program/

For any feedback on the code of conduct and inappropriate behavior, please write to us at ambassador.program@codemotion.it

## Conclusion

The most important thing? We have a beautiful badge that you can have on your social profiles!

![...](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9xykjdvl3y71t0nrif1t.png)
What is JWT and why do we need it in a microservices based application?
Tags: oauth, jwt, microservices
Published: 2022-03-25 10:46:55

JWT (JSON Web Token) is a very popular way to do user authorization in microservices. It is a standard which is used to create access tokens for an application and enables secure communication between between two parties.

But why do we need it for microservices? More details on this [link](https://belowthemalt.com/2022/02/21/what-is-jwt-and-why-do-we-need-it-in-a-microservices-based-application/)
Raw query in sequilize model
Tags: sequelize, javascript, node, express
Published: 2022-03-25 10:22:47

Good Morning,

I have this in my sportcenter's model using sequelize:

```
import Sequelize from 'sequelize';

export default (sequelize, DataTypes) => {
    const Sportcenter = sequelize.define('Sportcenter', {
        id: {
            autoIncrement: true,
            type: DataTypes.INTEGER.UNSIGNED,
            allowNull: false,
            primaryKey: true,
        },
        name: {
            type: DataTypes.STRING(500),
            allowNull: true,
        },
        counter: {
            type: DataTypes.VIRTUAL,
        },
      ...
    });
}
```

The fields id and name are in database table, but counter is not. I want to relate "counter" with the raw query (e.a. "select count(id) from sportcenter") and then see it in the json output in the api:

```
{
    "id": 1,
    "name": "Gorka",
    "counter": 26,
},
{
    "id": 2,
    "name": "Pedro",
    "counter": 26,
},
...
```

how can i get that?
SQL UPDATE and DELETE Commands
Tags: sql, database, beginners, tutorial
Published: 2022-03-25 10:12:39

---
canonical_url: https://baransel.dev/post/sql-update-and-delete-commands/
---

> [Sign up to my newsletter!](https://baransel.dev/newsletter/).

## UPDATE Statment

`UPDATE` statement is a SQL DML statement used to **change** and **update** the data in tables. We will explain the UPDATE statement with sample applications. Let's take a look at how this expression is used.

> ```sql
> UPDATE table_name SET = column1 = new_value, column2 = new_value WHERE condition
> ```

Now let's write our codes, for this, let's see our table first.

<img alt="Students Table Structure" src="https://baransel.dev/post/sql-update-and-delete-commands/students-table.png" style="height:75%;width:75%;"/>

For example, let's add 10 points to the second exam grade of the student whose name is Baransel;

```sql
UPDATE students SET second_exam_grade = second_exam_grade + 10 WHERE student_name = 'Baransel'
```

Now let's look at our table;

<img alt="Mark updated for student" src="https://baransel.dev/post/sql-update-and-delete-commands/mark-updated.png" style="height:75%;width:75%;"/>

Let's do another example, this time, let's add 10 points to both the first exam grade and the final grade of all students whose first exam grade is less than 50.

```sql
UPDATE students SET first_exam_grade = first_exam_grade + 10, final_grade = final_grade + 10 WHERE first_exam_grade < 50
```

<img alt="Update grade of students lower than 50" src="https://baransel.dev/post/sql-update-and-delete-commands/update-grade-lower-than-50.png" style="height:75%;width:75%;"/>

Mark's and Ekrem's first exam grades is less than 50, 10 points were added to first exam grade and final grade.

## DELETE Statment

The `DELETE` statement is the SQL Data Manipulation Language statement used to **delete** data in a table. With the `DELETE` statement, the entire data in the table or the data that meets a certain condition is deleted.

> ```sql
> DELETE FROM table_name WHERE condition
> ```

For example, let's delete students whose surnnames does not start with the letter "E" from the table;

```sql
DELETE FROM students WHERE student_surname NOT LIKE 'E%'
```

Thus, we deleted 3 students from the table. Let's take a look at the final version of our table.

<img alt="After delete from table students" src="https://baransel.dev/post/sql-update-and-delete-commands/after-delete.png" style="height:75%;width:75%;"/>

Now let's delete all the data in our table.

<img alt="Empty students table" src="https://baransel.dev/post/sql-update-and-delete-commands/empty-table.png" style="height:75%;width:75%;"/>

```sql
DELETE FROM students
```

As you can see we have deleted all the data inside our table. The point to note here is that we can delete the data in the table with the `DELETE` statement, but not the tables. If you want to delete the table, not the data in the table, you can refer to the `DROP` statement in the [SQL DDL Commands](https://baransel.dev/post/sql-ddl-commands/).

> [Sign up to my newsletter!](https://baransel.dev/newsletter/).
DevTips Daily Update - 25/03/22
Tags: javascript, beginners, tutorial
Published: 2022-03-25 10:00:59

So in this week’s tutorials we finished off the stats feature of our application and did some cool stuff like sharing stylesheets across apps in our Monorepo and saw some different ways to dynamically create HTML content with JavaScript/Typescript.

Here’s a link to each video this week:


[DevTips Daily - Rick and Roll Project - Creating a GET endpoint to provide stats information](https://youtu.be/9S-RenxtXlU)
{% youtube 9S-RenxtXlU %}

[DevTips Daily - Rick and Roll Project - Changing the default port of an app in an NX MonoRepo](https://youtu.be/Tzt20m3Gr6M)
{% youtube Tzt20m3Gr6M %}

[DevTips Daily - Rick and Roll Project - Parsing path or query params from a URL](https://youtu.be/d-QkcGmm_EU)
{% youtube d-QkcGmm_EU %}

[DevTips Daily - Rick and Roll Project - Using Fetch to GET API data for our stats](https://youtu.be/0aIBqaeptb4)
{% youtube 0aIBqaeptb4 %}

[DevTips Daily - Rick and Roll Project - Sharing Stylesheets across Apps (within an NX MonoRepo)](https://youtu.be/nAKtSjbR-tg)
{% youtube nAKtSjbR-tg %}

[DevTips Daily - Rick and Roll Project - Creating a dynamic heading for the stats App](https://youtu.be/zTcr8GDkDyE)
{% youtube zTcr8GDkDyE %}

[DevTips Daily - Rick and Roll Project - Creating a dynamic table](https://youtu.be/o7ngDsQ7n9U)
{% youtube o7ngDsQ7n9U %}

[DevTips Daily - Rick and Roll Project - Adding table styles](https://youtu.be/AVKR3L3jeQA)
{% youtube AVKR3L3jeQA %}

[DevTips Daily - Rick and Roll Project - Formatting dates with DayJS](https://youtu.be/kAQRLXIOPR4)
{% youtube kAQRLXIOPR4 %}

[DevTips Daily - Rick and Roll Project - Enabling Dynamic paths in Nginx Configuration](https://youtu.be/j8Kz6iILQUE)
{% youtube j8Kz6iILQUE %}


Next week, we’ll be getting a new domain setup for doing redirects (an actual short domain URL!) and doing and starting to tidy up our app ready for completion!

Thanks for watching

[@codebubb](https://twitter.com/codebubb)
Angular
Published: 2022-03-25 09:42:50

**Angular (commonly referred to as "Angular 2+" or "Angular CLI")[4][5] is a TypeScript-based free and open-source web application framework led by the Angular Team at Google and by a community of individuals and corporations. Angular is a complete rewrite from the same team that built AngularJS.

Angular is used as the frontend of the MEAN stack, consisting of MongoDB database, Express.js web application server framework, Angular itself (or AngularJS), and Node.js server runtime environment.**
Cloning dev.to in 30 seconds straight
Tags: programming, beginners, tutorial, webdev
Published: 2022-03-25 09:33:22

So we will be doing this in, well maybe 10 seconds:

![Dev.to clone](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/k4pc5orb33glj7emsvf3.jpg)

And no worries, no hacking involved, and no money. So step one, right click the current page(on windows), on Mac, do the equivalent action(two fingers tap left side of mouse). Now press view page source.

So now you got a page with a big bunch of code, click on the code and press command A(or control on windows), then copy everything.(command c or control c on windows). Now you got the page source code copied, create a file called index.html(with any means necessary). Now copy the source code into the index.html file.

Good, the index.html file is the new dev.to! Just open it! Oh, and if it doesn't work, make a copy of the index.html, then open it! If it doesn't work, just comment below and I'll help you, you can also talk to me on **[reddit](https://www.reddit.com/r/freetechstuff/)**!
bfrtn
Published: 2022-03-25 09:29:10

**Angular** (commonly referred to as "Angular 2+" or "Angular CLI")[4][5] is a TypeScript-based free and open-source web application framework led by the Angular Team at Google and by a community of individuals and corporations. Angular is a complete rewrite from the same team that built AngularJS.

Angular is used as the frontend of the MEAN stack, consisting of MongoDB database, Express.js web application server framework, Angular itself (or AngularJS), and Node.js server runtime environment
New Survey
Tags: survey, javascript, tutorial
Published: 2022-03-25 09:25:41

Hello everyone, 

I and my friend are running a small survey, and would be great to get some feedback. 

Can you please have a look at this when you have 2 minutes? I promise it won't take more than that.

https://docs.google.com/forms/d/e/1FAIpQLSe9ZOnLGNfN1byEMwwt-5m-8o_VBEpGD-sf2IkkxwC8ZhDSrg/viewform
Have a nice Friday you all :)
TypeScript library for Localazy API
Tags: howto, api, devtips
Published: 2022-03-25 09:17:58

## ▶️ Production-ready today

As an example, our [Figma plugin](https://localazy.com/features/figma-localization-plugin) for Localazy revolves around API and shows that you can use it to build powerful plugins and tools. However, it may be daunting to start as [REST-based API](https://localazy.com/dictionary/api) generally provides only basic functionality and complex logic needs to be built on top of it. Therefore, starting from scratch will generally include studying the [documentation](https://localazy.com/docs/api/introduction), trying out various endpoints, inspecting responses, and then creating some kind of personal library to abstract some of the complexity.

## 📚 TypeScript library to get you started

Well, if you're going to use either [JavaScript](https://localazy.com/dictionary/javascript) or [TypeScript](https://localazy.com/dictionary/typescript), you're in luck! We've built a zero-dependency [library](https://github.com/localazy/ts-api) that takes care of the basic concepts such as authentication or type definition. The library provides several methods that should cover most of your needs.

You just need to install it as a dependency in your project to get started.

```bash
npm install @localazy/ts-api
```

Afterward, import the library and initialize it.

```javascript
import LocalazyApi from '@localazy/ts-api';

const api = LocalazyApi({
    projectToken: "your-project-token"
    // ...additional options
})
```

That's it. You can immediately begin to fetch data from Localazy, such as a list of projects with `listProjects` the method, all the keys for a given project, file, and language with `listKeysInFileForLanguage` and then upload modified content with `import`.

See the project's GitHub page for an overview of all the supported methods. Or head over to this [article](https://localazy.com/blog/how-to-translate-ad-banners-localazy-api-marketing-localization) about the dynamic localization of ad banners to see this library in action.

### Project token

To access anything from Localazy, you need to [sign up](https://localazy.com/register) and create a project. Then, you'll be able to generate a project token [here](https://localazy.com/developer/tokens). See [documentation](https://localazy.com/docs/api/authentication) for more information.

## ✔️ Closing words

We hope this small library will help you get the best of [Localazy API](https://localazy.com/features/translation-api).

To see the complete list of supported methods or to report a bug/feature request, please head to [GitHub](https://github.com/localazy/ts-api). Don't hesitate to contact us via <team@localazy.com> or join our [Discord](https://discord.gg/Sm8z5Bhq) channel if you have any questions. Happy coding!

##