teleren/devto huggingface dataset:
Understanding Array.concat() in Javascript
Tags: javascript, beginners, codenewbie, todayilearned
Published: 2020-06-07 16:14:13

In Javascript, we use **Array.concat()**  to concatenate/merge two or more arrays. Array.concat() returns a new array and does not modify the existing arrays. 

Example: 

```javascript
const fruits = ["apple", "orange", "kiwi"];
const vegetables = ["carrot", "tomato", "potato"];

const fruitsAndVegetables = fruits.concat(vegetables);
// ["apple", "orange", "kiwi", "carrot", "tomato", "potato"]
```

If no parameters are passed on to the **Array.concat() method**, it returns the shallow copy of the existing array on which it is called.

## Array.concat() on Object References

Before working on concatenating arrays, let's look into Object references. 

### Object Reference
In Javascript, Objects are a reference type. When you assign an object to a variable, variable store a reference to the object and not the object itself. For example,

```javascript
let watermelon = {
 name: "Watermelon",
 taste: "Sweet",
 shape: "round"
 };
```

Here, variable watermelon stores a reference to the assigned object. Now, let's store it into the fruit array and use Array.concat() over it. 

``` javascript
const fruits = ["apple", "orange", "kiwi", watermelon];
const vegetables = ["carrot", "tomato", "potato"];

const fruitsAndVegetables = fruits.concat(vegetables);
// ["apple", "orange", "kiwi", {…}, "carrot", "tomato", "potato"]

```
Here, Watermelon is **shallowly copied** and the reference to the original object is only copied and not the object itself. Now, the watermelon in both the fruits array and the fruitsAndVegetables array are **pointing to the same object**.  So, if any value of the **watermelon object** is changed, it will be changed in fruitsAndVegetables array as well. 


## Array.concat on primitive data types
Array.concat() copies values of primitive data types such as string, number, and boolean into the new array.

```javascript
let mixedArray1 = ["str", true, 1];
let mixedArray2 = ["str2" , false, 5];
let newMixedArray = mixedArray1.concat(mixedArray2);
// ["str", true, 1, "str2", false, 5]
```
## Concatenating multiple arrays

To concatenate multiple arrays, we call Array.concat() on one array and pass the rest arrays as arguments. 

``` javascript
const num1 = [ 1, 2, 3];
const num2 = [ 4, 5, 6];
const num3 = [ 7, 8, 9];

const num = num1.concat(num2, num3);
// [1, 2, 3, 4, 5, 6, 7, 8, 9]
```

We will love to see examples and scenarios where you have used Array.concat(). Feel free to add them in the comments below :). Have a nice day. 

---

**This article was first published on [hackinbits.com](https://hackinbits.com/articles)**
Configuring Kitty
Tags: kitty, terminal, config, iterm
Published: 2020-06-07 16:07:58

---
title: "Configuring Kitty"
published: true
description: Configuring Kitty with some iTerm2 shortcuts
tags: Kitty, terminal, config, iTerm
---

I love the [Kitty](https://sw.kovidgoyal.net/kitty/) terminal emulator for its speed! Ever since I started doing more work in the terminal, it became painfully clear to me that the standard terminal.app on Mac and even [iTerm2](https://www.iterm2.com/) (although an amazing product!) were not cutting it anymore for me in terms of speed. 

However, since I started using Kitty, I noticed how used I was to some of the shortcuts that "just work" when using terminal.app and iTerm2. In this short post we'll go over some configuration settings to make Kitty behave more like iTerm2 and have the best of both worlds!

## What we'll be configuring

* `cmd` + arrow keys for jumping to beginning or end of the line.
* `alt` + arrow keys for jumping between words.
* Only vertical splits by default
* Switching between Tabs (Kitty calls them Windows)
by using `cmd` + 1-9 numeric keys
* Some visual tweaks

## Relevant config

```text
# don't draw extra borders, but fade the inactive text a bit
active_border_color none
inactive_text_alpha 0.6

# tabbar should be at the top
tab_bar_edge top
tab_bar_style separator
tab_separator " ┇"

# open new split (window) with cmd+d retaining the cwd
map cmd+d new_window_with_cwd

# open new tab with cmd+t
map cmd+t new_tab_with_cwd

# new split with default cwd
map cmd+shift+d new_window

# switch between next and previous splits
map cmd+]        next_window
map cmd+[        previous_window

# clear the terminal screen
map cmd+k combine : clear_terminal scrollback active : send_text normal,application \x0c

# jump to beginning and end of word
map alt+left send_text all \x1b\x62
map alt+right send_text all \x1b\x66

# jump to beginning and end of line
map cmd+left send_text all \x01
map cmd+right send_text all \x05

# Map cmd + <num> to corresponding tabs
map cmd+1 goto_tab 1
map cmd+2 goto_tab 2
map cmd+3 goto_tab 3
map cmd+4 goto_tab 4
map cmd+5 goto_tab 5
map cmd+6 goto_tab 6
map cmd+7 goto_tab 7
map cmd+8 goto_tab 8
map cmd+9 goto_tab 9
```

See the [full config](https://github.com/Tmw/dotfiles/blob/master/.config/kitty/kitty.conf) in my Dotfiles and see all available configuration options [here](https://sw.kovidgoyal.net/kitty/conf.html).

Cheers! 🐈

_crosspost from https://tiemenwaterreus.com/posts/configuring-kitty/_
Destination host unreachable..
Tags: unreachable, ping, host, destination
Published: 2020-06-07 15:49:35

Today i encountered a somewhat unusual scenario, a client was failing to access their loyalty program, the query kept timing out.
I noticed the contributor to this, the application(POS) on Client computer was connecting using the IP Address instead of the Server Name.



When pinging the server, it was giving the "Destination host unreachable" error, however when i ping using the IP Address this gave success replies.

I tried flashing the DNS cache, ARP cache, all did not resolve the issue. I looked back at my pings results, noticed that the IP Address that it was assuming the server to be was not the one that is currently on the server. This is when i had to look at the DNS management template, i used the below route to fix the issue.

1. Press the Windows key.
2. Type Notepad in the search field.
3. In the search results, right-click Notepad and select Run as 
   administrator.
4. From Notepad, open the following file:

   c:\Windows\System32\Drivers\etc\hosts

5. Locate the host name that was causing the issue.
6. Change it to the current name and ip address.
7. Select File > Save to save your changes.

After this my pings using the host name were successful and re ran the setup using the host name, all worked well.
Why DEV ? 
Tags: webdev, trending, dev, codenewbie
Published: 2020-06-07 15:47:33


<h1>>> About DEV </h1>

DEV is a community of software developers getting together to help one another out. The software industry relies on collaboration and networked learning. They provide a place for this to happen. It is like a Social Media Platform for developers.</p>

<h2>>> Why I chose DEV ? </h2>

I started writing my blogs recently <a href="https://dev.to/varaprasad_gudi">here</a>. I personally liked this way of writing blogs and recommend any beginner who is interested to start his career in Web Development. This gave me a chance of improving my knowledge and practice my front-end basics. Writing a HTML page and modifying it using CSS and publishing it through GITHUB pages <a href="https://gudivaraprasad.github.io/Projects/Technozone/">like this </a> is a prolonged process. Apart from doing all this stuff, here you can publish your practiced entities on different topics which will also be helpful for beginners. DEV gives you answers to many questions. There is a dual way benefit with this. So, I am eager to introduce myself to the world by contributing some informative blogs about core concepts in CSE, ECE and my learning experiences which may be at least helpful for beginners. 
As a beginner, I came here after an instagram post and a friend advice to start contributing to <a href="https://dev.to/">dev.to</a>. I hope this would be a good start and best practice to develop as a front-end Developer.

First Of all it's an easy platform to grow yourself and to build your brand on! A Chat ? Twitter or other social media has a chat feature but your favorite celebs don't reply there unlike DEV your celebs might actually reply since DEV has less users You have a higher chance to meet your stars! Yes DEV is not like other social medias like Twitter Facebook Instagram. But it's a social media for Developers! 

<img src="https://dev.to/social_previews/tag/8.png" alt="dev.to" width=600px height=320px >


A week ago, I joined the DEV community as a beginner. It was kind of random. I wanted to write more often and was testing other platforms too (CodePen and Medium). DEV's editor seemed easier to use, and the community larger and welcoming... although I must admit that I was a bit wary, as my first impression was of DEV as a techy version of BuzzFeed. But still it seemed to me a good start as a developer at <a href="https://dev.to/varaprasad_gudi">DEV</a> So, thanks DEV for providing the platform and this amazing community...

- Written by <a href="https://github.com/GudiVaraprasad">@GVP</a>.
TypeScript Types Deep Dive - The Talk
Tags: typescript, javascript, webdev
Published: 2020-06-07 15:38:32

---
title: TypeScript Types Deep Dive - The Talk
published: true
description: An epic journey of discovery into the mysterious world of TypeScript's type system. Now condensed into a talk.
tags: [typescript,javascript,webdev]
cover_image: https://www.barbarianmeetscoding.com/images/typescript-types-deep-dive.jpg
series: TypeScript Types Deep Dive
---

Learn more about the wondrous and mysterious world of the TypeScript type system, this time condensed into an exciting, fun and insightful talk by yours truly. Enjoy!

{% youtube ThLVga4oKRw %}
How to do a quick network recon during a pentest or CTF
Tags: security, nmap, pentest, ctf
Published: 2020-06-07 15:32:34

This article was also published on [razcodes.dev](https://razcodes.dev "razcodes.dev")

Since I have been learning more lately about pentesting, and playing on sites like [tryhackme.com](https://tryhackme.com/ "tryhackme"), I find myself starting with the same tools usually so I decided to write this short post about the process.

## Init

Sometimes you know the IP of the machine that you will be working on and sometimes you don't. Sometimes there is more than one machine on the network you want to look into, so in those cases, you start with the basic IP scan.

```bash
nmap -sn -n 192.168.0.0/24 -oN discovery.nmap
```

Options:

```bash
-sn: ping scan
-n: no DNS resolution
-oN: output scan in normal to file
```

Besides using _nmap_ for this, you can also use _netdiscover_ to see all the machine on the current network by specifying the interface.

```bash
netdiscover -i tap0
```

Here I use _tap0_ as the interface if I am connected to a VPN or if I just look at machines on my internal network I would use _eth0_.

```bash
netdiscover -i eth0
```

Once _nmap_ is done running, I take that file and remove everything from it leaving just the IPs.

```bash
cat discovery.nmap | grep for | cut -d " " -f 5 > ips.txt
```

I also make sure my IP is not in there so I don't scan myself.

## More

Now that we have a list of IPs, I can run a longer scan.

```bash
nmap -sV -p- -n -v -Pn -T4 -iL ips.txt -A --open
```

Options:

```bash
-sV: version info
-p-: scan all ports
-n: no DNS resolution
-v: verbose
-Pn: treat host as online
-T4: timing template
-iL: use the file and only scan IPs in it
-A: OS detection, version, script scan, traceroute
--open: only show open
```

Of course these might not work for every engagement and you should read more about _nmap_ strategies before using them, but for my needs so far these have worked well.

## Website involved

If the scans above yield some http ports open (80,8080, etc), I then run _dirbuster_ to look for any folders that might be hidden.

```bash
dirb http://10.10.47.53
```

## Fork in the road

After the usual scan above is where I take a different road based on whatever scenario I encounter, now that I have the data I need from the scan.

Happy scanning!
Code Trends 0.0.3
Tags: codetrends, javascript, trends, go
Published: 2020-06-07 15:15:23

---
title: Code Trends 0.0.3
published: true
description: When code gets political
tags: codetrends,javascript,trends,golang
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/s8zbadsautwzfe22q6rn.gif
---


## Code Trends 0.0.3 — When code gets political

![Code Trends](https://cdn-images-1.medium.com/max/2000/1*BLMPFuVOjcm8mO8cBvun2A.gif)

*Given the events of this week, and without being tone deaf to the #blm movement, I want to acknowledge that code is not neutral, and we as a technology industry have a long way to go.*

What happens when [code get’s politicized](https://github.com/defund12/defund12.org) 🤷‍♀️? Code is not neutral. Much like bias in machine learning, [voting with what code does](https://github.com/Say-Their-Name/say-their-names-ios) is not a neutral act. Github is used by many people around the world. However, most of the repos you encounter have READMEs in English. This is changing. Have you been coming across more and more [foreign language repos](https://github.com/CyC2018/CS-Notes)? I have, and though I can’t read them yet, this is a good thing.

Native english speakers forget that from c to javascript, you’re mostly writing english. What does it say to a young eastern student that to learn to code, you must learn some english. English is a western language. Is code a western thing? What would make it more eastern? Yes, of course part of the answer is the problem you choose to solve with code, but acknowledge that this is not neutral territory. This is not a blank piece of canvas waiting to be painted on, there are rules written by mostly white people.

What kind of world do we want to build? Those of us who can write code have a unique skill to directly change the path of humanity. So what does it say when [the top golang repo this week is titled **police-brutality](https://github.com/2020PB/police-brutality)?**

These are reasonable questions to ask at an inflammatory time. What can you work on to make real change? What will your dent in the universe be? Perhaps putting a dent in the universe is no longer the lofty kind of idealism we need in Silicon Valley, and beyond. The universe implies unity, the dent implies damage. We do not see unity, and we do not need any more damage. We see division, racism, and the very people sworn to protect us wearing riot gear and pepper spraying children among many other egregious acts.

So let’s not pretend everything is okay, let’s write code that does not aim to put a dent in the universe, but instead, aims to patch the holes in people’s hearts.

*P.S. If do not agree that Black Lives Matter, please, for the love of whatever god you pray to, unsubscribe.*
Criando pacotes para o NPM
Published: 2020-06-07 14:22:03

## Criando módulos Node.js
Os módulos Node.js são um tipo de pacote que pode ser publicado no npm.
https://docs.npmjs.com/creating-node-js-modules

## npm-package.json
Este documento é tudo o que você precisa saber sobre o que é necessário no seu arquivo package.json. Ele deve ser JSON real, não apenas um literal de objeto JavaScript.
https://docs.npmjs.com/files/package.json.html
How to GET data from an API in React JS
Tags: react, javascript, restapi
Published: 2020-06-07 14:20:45

Hello everyone today I’m going to show you how to implement HTTP GET action of any API inside a React JS application. For this, we use fetch() function.
 
Here the input parameter passed for the fetch function is an API URL. And the response from API is a JSON type response.We can set the response data to a state variable using this.setState({ }) .Here I have used sensors array list to store the data comming from fetch() method.
 
The structure of the fetch function is as follows,


import React , {Component} from 'react';
class App extends Component {
 
state = {
  loading: true,
  sensors: null,
};
 componentDidMount() {
      fetch('api.example.com')
            .then((response) => {
                   return response.json();
            })
            .then((data) => {
                  this.setState({
                        sensors: data,
                        loading: false
            })
             console.log(data);
       });
   }

Let us come to the rendering part of the component in index.html,

 

Here we can add a loading screen using another Boolean state variable (this.state.loading) which is displayed until data is been fetched from the API as follows,

 

*Note: Here I have used bootstrap 4 for the project.If you don’t use bootstrap css, remove << className={“”} >> attributes in <div> tags or Instead use only pure <div> tags and test.

 

render() {
 if (this.state.loading) {  //this content is displayed when (loading == true) 
 return (
            <div className={"container"}>


                <div className={"row mt-4 justify-content-center"}>
                    <div className="spinner-border" role="status"></div>
                </div>


                <div className={"row mt-4 justify-content-center"}>
                    <h1>Fetching data...please wait</h1>
                </div>


            </div>
        )
    }

 

return (

 

<div className={"row justify-content-center"} >
    {this.state.sensors.map((value) => {


        return (
              <div className={"box m-2"}>
                   <h5 >Sid: {value.sid} </h5>
                   <h4>Co2 Level: {value.co2Level}</h4>

                   <h4>Smoke Level: {value.smokeLevel}</h4>
                   <h5>Floor No: {value.floorNo}</h5>
                   <h5>Room No: {value.roomNo}</h5>
               </div>      
  )


	 }

</div>
)

}


I hope now you are clear about the fetch function and its implementation. If you have any questions please comment below. Stay connected with our blog for more posts like this.

 
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/0uwy7t7p55vcz0obfbeg.png)
Get Your Github Repo Verified
Tags: webdev, github, security
Published: 2020-06-07 13:58:21

![](https://user-images.githubusercontent.com/7384288/56078187-aa8ae980-5e17-11e9-89cf-5b1a3d57d25c.png)


This is a quick guide to get your repo verified on  [Github](http://gihub.com).


First step is to enter Github and create your repo, name it anything you want!



![](https://user-images.githubusercontent.com/34520390/34878557-8b981b30-f778-11e7-964f-d472699fdec1.jpeg)


Second step is to choose a license, without a license, our repo will not get verified. 
The one I always pick is the "MIT License". With this option anyone can use or code, but they have no guarantee.
The Swift Programming Language Companion: Enumerations
Tags: ios, swift, beginners
Published: 2020-06-07 13:57:09

This article is part of a series on learning Swift by writing code to The Swift Programming Language book from Apple. This is the second article in Section 2 (here is [Section 1](https://app-o-mat.com/post/swift-programming-language-companion-section-1))

Read each article after you have read the corresponding chapter in the book. This article is a companion to [Enumerations](https://docs.swift.org/swift-book/LanguageGuide/Enumerations.html).

### Set up a reading environment

If you are jumping around these articles, make sure you read the [Introduction](https://dev.to/loufranco/the-swift-programming-language-companion-introduction-4k0a) to see my recommendation for setting up a reading environment.

To add a new page, in Xcode:

1. Choose File > New > Playground Page
1. Rename the page to "08-Enumerations"

### Exercises for Enumerations

At this point, you should have read [Enumerations](https://docs.swift.org/swift-book/LanguageGuide/Enumerations.html) in The Swift Programming Language. You should have a Playground page for this chapter with code in it that you generated while reading the book.

#### Exercises

The chapter covers how to declare Enumeration types and use Associated Values.

For these exercises, we are going to imagine a simple media playing app.

In your Playground write code to do the following:

1. Declare an enumeration called `Genre` and add cases for `jazz`, `rock`, `rap`, `country`, and `folk`.
1. Write a function called `genreName` that takes a `Genre` value and uses a `switch` to return a string with the name of the genre. So, "Jazz" for `.jazz` and "Rap" for `.rap`.
1. Call `genreName` with some `Genre` values.
1. Extend `Genre` to implement `CaseIterable ` and write a `for in` loop to print out all of the genres using `Genre.allCases`
1. Change `Genre` to extend `String` and change `genreName` to use `genre.rawValue` instead of a `switch`
1. Make another enumeration called `MediaType` and add cases for `music`, `podcast`, `audioBook`
1. Add an associated value for `music` of type `Genre`
1. Write a function called `mediaTitle` that takes a `MediaType` value and uses a `switch` to return a string with the name of the name of the media type. If it's `music`, make sure to use the associated `genre`.
1. Call `mediaTitle` with some `MediaType` values.

#### Next

The next article will provide exercises for the [Structures and Classes](https://docs.swift.org/swift-book/LanguageGuide/ClassesAndStructures.html) chapter.
What is Data Science? 
Tags: datascience, codenewbie, devops, beginners
Published: 2020-06-07 13:45:33

What is data science? 

Hmmm.. 

Sometimes writing paragraphs don't say much but pictures says alot. 

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

Pics says alot. 😊

https://twitter.com/erRaghavKhanna/status/1269625540530499584?s=19
What is Deno? Getting started with Deno
Tags: javascript, deno, node, beginners
Published: 2020-06-07 13:37:11

Deno v1 was released recently, created by Ryan Dahl who is known for the creator of Node. Will it replace the node?

Deno a new javascript runtime for the backend but now it’s written in Rust, not C++, in addition to that supports Typescript. The coolest thing about Deno is it doesn’t have heaviest node modules replaced by linking third-party snippets in code directly using its source like the web.

###How secure is this?
Deno created by thinking the security most in mind. Like by default, no file, network, or environment access, unless explicitly enabled.


```bash
$ deno run — allow-read=/etc https://deno.land/std/examples/cat.ts /etc/passwd
$ deno run — allow-read=/etc myFile.ts
```

###no more npm!

Most people prefer npm because it’s just like that, we can install and use third-party modules.

In Deno, the source of the repository should be imported to use it.

```sh
import { copy } from “https://deno.land/std@0.50.0/fs/copy.ts";
```
Rather you can import all third-party dependencies in a single file because package.json is no more here.

For the first time, Deno will download the modules and cache it.

```sh
$ deno run — allow-read — allow-write main.ts
Compile file:///dev/deno/main.ts
Download https://deno.land/std@0.50.0/fs/copy.ts
Download https://deno.land/std@0.50.0/fs/ensure_dir.ts
Download https://deno.land/std@0.50.0/fs/_util.ts
.
.
```
If you want to clear and download it again, you can run it with -- reload flag:

```sh
--reload
```
or update a specific package like this,

```sh
-- reload=https://deno.land/std/fs/copy.ts
```
###Conclusion

As mentioned in the title, will it replace Node?
No. Deno is an idea in mind made by clearing all the flaws in Node. A huge community and large scale applications were built using Node.

May be from now, people will use it in their hobby projects and make it as an alternative to Node.

<a href="https://twitter.com/sasiKdharan?ref_src=twsrc%5Etfw" class="twitter-follow-button" data-show-count="false">Follow @sasiKdharan</a><script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>