teleren/devto huggingface dataset:
How to add and remove elements from the beginning of an array in JavaScript?
Tags: javascript
Published: 2020-06-14 00:00:00

---
  title: How to add and remove elements from the beginning of an array in JavaScript?
  published: true
  tags: JavaScript
  date: Sun Jun 14 2020 05:30:00 GMT+0530 (India Standard Time)
  canonical_url: https://melvingeorge.me/blog/add-remove-elements-from-beginning-array-javascript
  cover_image: https://melvingeorge.me/_next/static/images/main-a0d3bf865e7874267ea19509b8ba5888.jpg
  ---
  [Originally posted here!](https://melvingeorge.me/blog/add-remove-elements-from-beginning-array-javascript)
  
The `unshit` array method adds an element to the beginning of an array and the `shift` method removes the first element from an array.

---

## Adding elements to the beginning of the array

Consider this array of names.

```javascript
const names = ["John", "Lily", "Helen", "Roy"];
```

How can we add another name `Michael` to the beginning of this array?

We can use the `unshift` array method here to achieve this.

```javascript
const names = ["John", "Lily", "Helen", "Roy"];

// add elements to the beginning
const newLength = names.unshift("Michael"); // Result: ["Michael", "John", "Lily", "Helen", "Roy"]
```

- The `unshift` method adds an element to the beginning of an array.
- It accepts the item to be added as the argument
- It returns the new length of an array

## Removing elements from the beginning of an array

Let's consider our old array with `Michael` added.

```javascript
const names = ["Michael", "John", "Lily", "Helen", "Roy"];
```

Now we no longer need `Michael` and want to remove it.

We could use the `shift` array method to acheive this.

```javascript
const names = ["Michael", "John", "Lily", "Helen", "Roy"];
const newArray = names.shift();
```

- The `shift` method removes the first element on an array.
- It didn't accept any arguments
- It returns the removed item

### Feel free to share if you found this useful 😃.

---
Hello World
Tags: hello
Published: 2020-07-14 16:00:00

---
title: Hello World
published: true
date: 2020-06-14 00:00:00 UTC
tags: hello
---

This is the first post of my new personal blog. This blog will be a digital registry of some of my findings and experiences with software development and different technologies. Feel free to check out my other posts and to reach out on my social presence.
Using python virtualenv inside vscode
Published: 2020-06-14 07:50:22

---
title: Using python virtualenv inside vscode
published: true
date: 2020-06-14 00:00:00 UTC
tags: 
canonical_url: https://foursixnine.io/blog/2020/06/14/Using-python-virtualenv-inside-vscode.html
---

## Quick and dirty

- Install python3-virtualenvwrapper (via pip or via package manager)
- Export a workon directory: `export WORKON_HOME=/home/foursixnine/Projects/python-virtualenv`
- `source virtualenvwrapper`

```
foursixnine@deimos:~/Projects> source virtualenvwrapper    
virtualenvwrapper.user_scripts creating /home/foursixnine/Projects/python-virtualenv/premkproject
...
virtualenvwrapper.user_scripts creating /home/foursixnine/Projects/python-virtualenv/get_env_details

```

- mkvirtualenv newenv

```
foursixnine@deimos:~/Projects> mkvirtualenv newenv
created virtual environment CPython3.8.3.final.0-64 in 115ms
  creator CPython3Posix(dest=/home/foursixnine/Projects/python-virtualenv/newenv, clear=False, global=False)
  seeder FromAppData(download=False, pip=latest, setuptools=latest, wheel=latest, via=copy, app_data_dir=/home/foursixnine/.local/share/virtualenv/seed-app-data/v1.0.1)
  activators BashActivator,CShellActivator,FishActivator,PowerShellActivator,PythonActivator,XonshActivator
virtualenvwrapper.user_scripts creating /home/foursixnine/Projects/python-virtualenv/newenv/bin/predeactivate
...
virtualenvwrapper.user_scripts creating /home/foursixnine/Projects/python-virtualenv/newenv/bin/get_env_details

```

- By this point, you’re already inside `newenv`:

```
(newenv) foursixnine@deimos:~/Projects> 

```

- You can create multiple virtual environments and switch among them using `workon $env` so long as you have sourced `virtualenvwrapper` and your `$WORKON_HOME` is properly defined.

## Real business

- Now, if you want to use vscode, remember that you will need to define properly `python.PythonPath` for your workspace/project (I’m new to this, don’t hang me in a public square ok?), in this case, my env is called linkedinlearningaiml

```
{
    "python.pythonPath": "/home/foursixnine/Projects/python-virtualenv/linkedinlearningaiml/bin/python"
}

```

Now your python code will be executed within the context of your virtual environment, so you can get down to serious (or not at all) python development, without screweing up your host or polluting the dependencies and stuff.

PS: Since wanted to be able to run standalone python files, I also needed to change a bit my launch.json (Maybe this is not needed?)

```
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Python: Current File",
            "type": "python",
            "request": "launch",
            "program": "${file}",
            "console": "integratedTerminal",
            "cwd": "${fileDirname}"
        }
    ]
}

```

And off you go, how to use python virtualenv inside vscode

_Et voilà, ma chérie!_ ![It's alive!](https://media.giphy.com/media/xT5LMDi8H2A1FtLlpC/giphy.gif)
Yelpcamp - My first fullstack project
Tags: learning, courses, javascript, codenewbie
Published: 2020-06-13 23:54:20

I originally bought the Udemy course "Web Developer Bootcamp" back in 2017, but life got in the way. I have made it through the first half three times, but I was already quite comfortable with front-end and JavaScript basics, so it was just a comfortable place for me to be stuck in "tutorial hell". I had always wavered about pushing into the unknown of backend development with NodeJS. I'm so happy I finally made it through.

If you're not familiar with the course, the capstone project is a fullstack application called "YelpCamp" where you can add, view and review campsites. Besides the final project of CS50, this is my first foray into fullstack web apps.



#### Cons:
- Semi-outdated material: If you're looking for a course on ES6 and React this is not it. The course uses Bootstrap (both 3 + 4), callbacks, and jQuery. There are 1 or 2 additional/new modules on newer tech, but it is not at the forefront.
- Accelerates in pace after the backend section. I discuss this more below, but you're not going to get a lot of detail on the inner workings of passportJS, express, or MongoDB. I have been taking the time to read the docs on the side for better understanding.

#### Pros:
- Takes you from zero to a full-stack web app in a methodical and easy-to-follow manner. Actually, there are loads of positive reviews all over the web so I am not going to go crazy here. If the course is on sale, and you are a beginner/early-intermediate in web development, it's a good one.
- Friendly and helpful community: the course has its own Discord chat which is quite active and quick to respond, even though the course is several years old! A mix of experienced developers and TAs are there to help you with questions in and out of the course's scope.

#### ??:
- It teaches you how to use technology in a practical "bootcamp-style" manner. You don't spend much time on the docs for express, mongodb, mongoose, passport - but you are still able to implement them. I think it's a good taster, but you will not have a rich understanding by completing the course.


### What's next?
Well, in response to a previous post I have made a helluva [Trello](https://trello.com/b/Z4tBz981/learning-to-code) board. I took inspiration from many who came before me, trying to organize my learning and process. However, it is NOT perfect and I would really appreciate any feedback. I'm going to learn deeper into some of the topics introduced in the course, and finally fix up my portfolio.

Find the course here: https://www.udemy.com/course/the-web-developer-bootcamp
*I am not affiliated in any way with Udemy or this course*
Hiding API Keys in Your Code
Tags: react, github, environmentvariables, zeit
Published: 2020-06-13 23:02:59

Let's say you are using a fetch in React App to get info from an API, and are using your API key to connect to that API. The key is private, and should not be visible outside your code. How can you achieve that and keep your code functional?
These are my notes on what worked for me. It took me a while to figure it out, so I wanted to share it, as a personal note to self, and, hopefully, to help someone else with the same issue.

##These are the steps I followed:
**1-** Write **npm install dotenv** in the Terminal (I am using the Terminal in VSC).

**2-**Create an **.env** file in the root folder of the project (this means, outside the **src** folder).

**3-**This .env file will have the environment variables that are to be kept hidden. Since I am using React App, these variables have to be preceded by **REACT_APP_**. In my case, my variable is called **REACT_APP_API_KEY=numberOfYourAPIKey**.

**4-**Go to the .gitignore file in the root folder, and make sure **.env** is added to the list of files that will not make it into GitHub.

**5-**Go to your App.js file, and on the top list of "imports," (before declaring the App function), declare a variable to call the config function. I wrote **const dotenv = require('dotenv').config()** (you can use the variable name of your choice).

**6-**Go to any component using this API key, and, inside that component js file, declare a variable that will contain the API Key from your .env file. I wrote **const api_key = process.env.REACT_APP_API_KEY**. This is the variable you will use in your fetch. For example, fetch(`https://api.example.org/data/api_key=${api_key}`)
The first "api_key" in the example is given by the API URL, the one inside the curly brackets is the name of my variable "api_key".

**7-**You can upload your project to GitHub now, and your API Key will not be visible.

**8-**In my case, I deployed my project to zeit.co (now vercel.com), by importing my GitHub project into this platform. Once imported, you will see three tabs in vercel.com: Overview, Deployment, Settings. Inside **Settings**, you will find the option to declare a variable under **Environment Variables**. There you should use the name of the variable you used in your .env file (REACT_APP_API_KEY), and copy-paste the actual value of the variable (your API Key) in the field box next to the variable name, where it says "VALUE (WILL BE ENCRYPTED)". 

Your code should be working as if the actual API Key was still shown in your code, only now it will be hidden outside your local environment. Hope it helps!
Get a clients real IP in PHP
Tags: php, ip, functional, cloudflare
Published: 2020-06-13 22:54:56

Here's a simple php function to get the real IP of a client - Utilizing it inside a function so as to avoid duplicate code.

I use this function on most of my projects and have found it very reliable when dealing with getting the users real IP.

Enjoy :)
 
```php 
function GetClientIP()
{
    $ClientIPArr = array(
        "HTTP_CLIENT_IP",
        "HTTP_CF_CONNECTING_IP",
        "HTTP_X_FORWARDED",
        "HTTP_X_FORWARDED_FOR",
        "HTTP_FORWARDED_FOR",
        "REMOTE_ADDR"
    );
    $found = 0;
    foreach ($ClientIPArr as $value)
    {
        if (isset($_SERVER[$value]))
        {
			if (filter_var($_SERVER[$value], FILTER_VALIDATE_IP)) {
            $ClientIP = $_SERVER[$value];
            $found++;
            break;
			}
        }
    }
    if ($found > 0)
    {
        return $ClientIP;
    }
    else
    {
        return 'Not Found';
    }
}
echo GetClientIP();
```
Creating a small python script to skip spotify ads
Tags: python, github
Published: 2020-06-13 22:11:01

I am a student, and even with the student prices, I can't afford spotify premium. Since I don't like the ads, I decided to create a small script that effectivly skips them. To do this I used python and the spotify API. Take a look at my code and use it if you are in the same situation as me. If you really enjoy spotify and can afford premium, please just purchase it. Take a look at my code here: https://github.com/marvic2409/Spotify-Ad-Blocker
Introduction (Abhinavnigam2207)
Tags: abhinavnigam2207, javascript, webdev, react
Published: 2020-06-13 22:04:31

Hi, I’m Abhinav.

I'm an enthusiastic web developer with over 7+ years of experiences in wide range of applications in different ecosystems and domains. 


I'm a Javascript lover, like sarcasm, here to share my knowledge, views and help the developer community.

My main areas of expertise are:
- Javascript
- Typescript
- React
- Angular
- HTML5
- CSS3
- Webpack


Follow me @

LinkedIn - https://www.linkedin.com/in/abhinavnigam2207/
GitHub - https://github.com/abhinavnigam2207/
Instagram - https://www.instagram.com/abhinavnigam2207/
Facebook - https://www.facebook.com/abhinavnigam2207/


Feel free to Reach out for help @ abhinavnigam2207@gmail.com



I hope you have fun reading me !
What is a SCOPE in javascript ?
Tags: javascript
Published: 2020-06-13 21:49:14

Scope is the <b>execution context area</b> and the ability to access a variable based on how you declare them. One important difference between JavaScript and other languages mostly C-based languages is Variables are created at the spot(execution context area) where they are declared in latter case. <b>But in JS, the variables are created in a spot depending on how you declare them</b>. 

There are 2 types of scopes :


<b>1) Global Scope</b>
The area outside function is considered a global scope (window). So a variable can be accessed in other scopes (functions/blocks) as well.


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



<b>2) Local Scope</b>
It has 3 different types :



<b>a) Function Scope</b>
When you declare a variable inside a function, it is accessible within function only.


![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/2r8wl9w5q4wyhn3x4rkg.png)

<b>Note:</b> This is same for let and const as well.

<b>b) Block Scope</b>
In ES6, <b>let</b> and <b>const</b> allow to declare variables in a block scope where in the variable is accessible only within the curly braces { } or a block like for and while loops, if and switch conditions etc. 


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



<b>c) Lexical Scope</b>
The child scope have access to the variables defined in its parent scope.



![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/gj5ipyk1bdvvq3t4q6ui.png)
Linux Mint Desklet for COVID-19 Tracking
Tags: linux, desklet, covid19, coronavirus
Published: 2020-06-13 21:41:04

Last month I was playing around with Desklets on Linux Mint and I thought to develop one of my own...
So, why not choose a topic that is relevant and people would love to get some regular updates on.

So, I made a Linux Mint Desklet that shows COVID-19 stats for India.

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

You can find the download page here - 
https://cinnamon-spices.linuxmint.com/desklets/view/51

The COVID-19 India Desklet allows you to see the latest stats about the Coronavirus statistics for India. The data on the Desklet is refreshed every 300 seconds and information is fetched from the website below. You can also see a 30 day graph of the data to see the trends of number of patients found, recovered, and died.
When Indexes & Performance Tuning don’t fix Slow queries in Postgres
Tags: postgres, dataengineering, queryoptimization, data
Published: 2020-06-15 13:37:35

---
title: When Indexes & Performance Tuning don’t fix Slow queries in Postgres
published: true
date: 2020-06-13 21:31:11 UTC
tags: postgres,dataengineering,queryoptimization,data
canonical_url: https://medium.com/@aitzaz/when-indexes-performance-tuning-dont-fix-slow-queries-in-postgres-fb0a63d99276
---

[![](https://cdn-images-1.medium.com/max/2600/0*cw7jdiW6sOr72xLy)](https://medium.com/@aitzaz/when-indexes-performance-tuning-dont-fix-slow-queries-in-postgres-fb0a63d99276?source=rss-a46382da92fa------2)

A tale of resolving a blocked query by fixing Postgres disk usage via Vacuum, Analyse and 2 minutes break. And it might save you a few days!

An index or server params tuning may not always fix a slow or even blocked query. Postgres table bloat may cause such issues and Vacuum Analyse can fix it.

...

### Indexes are not a silver bullet!
A team member suggested a new index but I knew that an index won’t help due to low cardinality of the column used in the query and nature of the data. However, he tried that but the full table scan was still there.
> BTW this happens when the query optimizer decides that reading table data pages sequentially (full table scan) is faster than reading pages in random order (which is done when an index is used). Normally index is skipped by query optimizer if query covers more than 20–30% table data search.

...

[Continue reading on Medium »](https://medium.com/@aitzaz/when-indexes-performance-tuning-dont-fix-slow-queries-in-postgres-fb0a63d99276?source=rss-a46382da92fa------2)
React is not that easy (For me)
Tags: react, javascript
Published: 2020-06-13 21:07:28

Hello everybody, couple days ago I started to learn React after I feel comfortable with Vanilla Js. I'm following an Udemy course to Learn React. I was expecting React to bit eaiser to understand and implement but now it really confuse me all that sending components and creating lots of things. I just wanted to share this. Do you guys have any suggestion for me?
os module in python with examples
Tags: python
Published: 2020-06-13 21:07:16

This article is about the <a href="https://python.org">Python</a> programming language, the **os module** (operating system) lets you grab some useful information. 

The **os module** contains functions for interacting with the operating system. The **os module** can not be installed since it is an integrated Python module. 

By using it, you can perform additional tasks such as identifying the operating system, navigating the file system and performing many other operations. 

If you are new to Python, I recommend <a href="https://gumroad.com/l/dcsp">this course/book</a>.

You can list all data in the os module with the **dir() function**. 

```python    
    # load os module
    import os 
    
    # show directives
    print(dir(os))
```    

You can try it in the Python <a href="https://bsdnerds.org/learn-python/">shell</a>:

    >>> import os
    >>> print(dir(os))

## key functions of the os module 

### os.name

This function gives the name of the OS you run in your own system. The output of this function will be unique from system
to system, as not the same operating system is used. 

```python
    import os 
    print( 'Name of OS: ',os.name)
```

This can output 'posix', 'nt' for windows nt etc.

### os.getcwd()

This function is short for 'get current working directory' (cwd), it returns the programs current working directory.

```python
    import os 
    print(os.getcwd())
```

It output the current working directory like `/home/you/` or `C:\Users\you`

### os.chdir()

This function is used to modify the path of the file used for code execution. It takes the new path as a parameter in the form of a string. Before you change the directory, use the **mkdir() function** to create a new directory. 

```python
>>> import os
>>> os.mkdir('/home/you/test')
>>> os.getcwd()
'/home/you'
>>> os.chdir('/home/you/test')
>>> os.getcwd()
'/home/you/test'
>>> 
```

This creates a new directory, shows the current directory, changes the directory and then shows the current directory again. (used this <a href="https://gitpress.io/u/1282/os">script </a> as reference)

Links:
* <a href="https://pythonprogramminglanguage.com/">Python programming tutorial</a>
* <a href="https://docs.python.org/3.8/library/os.html">The os module</a>
Top Websites for every Developers!
Tags: websites, technology, developers
Published: 2020-06-13 20:57:19

I have created a list of resources that must help developers.
#### [My Youtube Channel Link!](https://www.youtube.com/channel/UC0hmXRqXYVO0mocVt5D3GkQ)
----
# Developer Resources

> Top websites that every developer should know!

## Recommended

* [Free for developers](https://free-for.dev/#/)
* [Github](https://github.com)

## Online IDE

* [Codesandbox](https://codesandbox.io)
* [Stackblitz](https://stackblitz.com/)
* [Scrimba](https://scrimba.com)
* [Repl](https://repl.it)
* [Glitch](https://glitch.com)

## Online editor for web development

* [Codepen](https://codepen.io)
* [Jsbin](https://jsbin.com)
* [Jsfiddle](https://jsfiddle.net)
* [Jdoodle](https://jdoodle.com)
* [Codeinterview](https://codeinterview.io)

## Deployment sites

* [Heroku](https://heroku.com)
* [Netlify](https://netlify.com)
* [Firebase](https://firebase.com)
* [Vercel](https://vercel.com)

---
To Edit the list, If I missed some awesome developers
Sculpt this repository!
{% github Vuelancer/development-websites no-readme %}


### Support Me
* Youtube Channel - [Vuelancer - youtube channel](https://www.youtube.com/channel/UC0hmXRqXYVO0mocVt5D3GkQ)

* Github - https://github.com/vuelancer

* Scrimba - https://scrimba.com/@selvakumardhivakar

* Patreon - https://patreon.com/vuelancer
Python: What is a Lambda Function?
Tags: python, beginners, learning, lambda
Published: 2020-06-13 20:41:59

---
title: Python: What is a Lambda Function?
published: true
description: Understanding lamdba functions in Python
tags: python, beginners, learning, lambda
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/9x4qzg7vh9wf3zmh8wir.jpg
---

In Python, the `lambda` keyword is used to define an anonymous (i.e., nameless) function, using the following syntax:

```
lambda parameters: expression
```

Assume we have the following list of fruits:
```python
fruits = ['apple', 'orange', 'grape', 'lemon', 'mango', 'banana']
```

Now imagine we need to filter our list to print only fruit names which are 5 characters long. We _could_ do so by defining a named function to test word lengths, and then passing it (and our list of fruits) to `filter()`:

```python
def five_letter_words(word):
  if len(word) == 5:
    return True

five_letter_fruits = filter(five_letter_words, fruits)

for fruit in five_letter_fruits:
  print(fruit)
```
```
apple
grape
lemon
mango
>>>
```

Or, the same task can be accomplished directly in `filter()` using a `lambda` expression, without needing to define a separate named function:
```python
five_letter_fruits = filter(lambda word: len(word) == 5, fruits)

for fruit in five_letter_fruits:
  print(fruit)
```
```
apple
grape
lemon
mango
>>>
```

Because lambda functions are Python expressions, they can be assigned to variables.

So, this:
```python
add_two = lambda x, y: x+y
add_two(3, 5)
```

Is equivalent to this:
```python
def add_two(x, y):
  return x + y

add_two(3, 5)
```

---

Was this helpful? Did I save you some time?

## {% cta https://www.adamlombard.com/support-me %} 🫖 Buy Me A Tea! ☕️ {% endcta %}

---
Boost MySQL Write Performance
Tags: database, python, tutorial
Published: 2020-06-13 20:24:51

I **increased** my write performance to a mysql database from **48s down to 3s** writing 100,000 records at once.

I am no DBA, but I got curious when I noticed sluggish write performance on a mysql database, and I remembered somewhere that **you should always use batch writes over sequential writes** (when you have a lot of writes to be dine at once) 

So I decided to test it out, using a python script and a mysql server.

For the sequential writes, I generated random data and in the for loop, I made a write to the mysql database every time I generated data for the record.

For the batch write, I defined a list/array and for every record that I generated, I appended the record to the list and once I exited the loop, I write to the database using `executemany` and including the list.

The scripts I used, the results and more info can be viewed on my blog:

* https://blog.ruanbekker.com/blog/2020/06/13/improve-mysql-write-performance-using-batch-writes/