teleren/devto huggingface dataset:
How to find the best web development stack to learn
Tags: programming, coding, tutorial, webdev
Published: 2021-07-03 13:14:26

Hello, I am the founder of www.developerupdates.com and Instagram Influencers with 1,70,000+ followers on([@richwebdeveloper] (https://www.instagram.com/richwebdeveloper/) and [@newjavascript] (https://www.instagram.com/new_javascript/)) and helping thousands of people to improve their web development skills by bringing them useful content.

Finding and choosing the right web development stack is very difficult for everyone. I get too many messages for which is the best development stack to learn, which is the best technologies to learn, react or angular and etc.

So I have decided to develop a tool that guides us to choose the right development stack based on current skills(If any).

##[Check out this tool] (https://www.developerupdates.com/best-skills-to-learn?utm_source=blog&utm_medium=dev_to)

If you want to become a Front-end developer, backend developer, or Full-stack developer this tool will guide you with the best technologies to learn with details of each technology.

###You will get details of
* Best programming language to learn
* Information about programming languages and technology
* Why this technology/programming language is used 
* Best YouTube Tutorials
* Best Udemy courses
* Best Website Tutorials

After using this tool if you still have questions please feel free to message me on Instagram Page, I will try to give my best.

Thank You!
Checklist of 5 things you should have before you start networking for a developer job
Published: 2021-07-03 13:04:20

1. LinkedIn profile, with:
   - [ ] A profile picture
   - [ ] About summary stating top 3 to 5 of your programming tools & languages
   - [ ] Link to your GitHub page

2. Github page, with:
	- [ ] Pinned repo of your projects or projects you collaborated in
	- [ ] Write Good README
	- [ ] Link to the working demo of your project

3. Portfolio website with:
	- [ ] Your projects
	- [ ] Your cv
	- [ ] Include profile picture

4. Online Presence
	- [ ] Blogging
	- [ ] Write articles
	- [ ] Social media writing : Tweet & linked in article with keywords relevant hashtag 

5. Make Projects:
	- [ ] Refine your existing projects
	- [ ] Create new projects
	- [ ] Add complexity to your projects 

Try to have these boxes all checked up!
Wishing you all the best.
Handwritten implementation of call, apply, bind
Published: 2021-07-03 12:45:14

### preparation
<font color=#959595 size=3>First, define the show function to print the name attribute and parameters in the specified object;</font>
```javascript
function show(...args) {
    console.log(this.name);
    console.log(args);
}
```
<font color=#959595 size=3>Define the object, which contains the name attribute</font>

```javascript
let obj = {
    name:'philip'
}
```
<font color=#959595 size=3>Define function, convenient to call</font>
```javascript
    function mycall(fn, object, ...args) {
        return fn._call(object, ...args)
    }

    function myapply(fn, object, array) {
        return fn._apply(object, array)
    }

    function mybind(fn , object , ...args){
        return fn._bind(object,...args)
    }
```
### call
<font color=#959595 size=3>As a prototype property of a function, it needs to be mounted on the function prototype</font>
<font color=#959595 size=3>The first parameter is the object, and the second parameter is any number of parameters</font>
```javascript
Function.prototype._call = function (obj,...args) {
    
}
```
<font color=#959595 face="仿宋" size=3>Add attributes to the object. The type is the function that currently uses the call method</font>
<font color=#959595 size=3>Call the function, delete the function attribute after calling to make space</font>
```javascript
Function.prototype._call = function (obj,...args) {
    obj.fn = this // Add attributes to the object. The type is the function that currently uses the call method
    obj.fn(...args) // Call the function
    delete obj.fn // delete the function attribute after calling to make space
}
```

### apply
<font color=#959595 size=3>It has the same function as the call method, but the second parameter needs to be an array</font>

```javascript
Function.prototype._apply = function (obj,args=[]) {
    if(args && !(args instanceof Array)){
        throw new Error("TypeError:apply only receive array")
    }
    obj.fn = this
    obj.fn(...args)
    delete obj.fn
}
```
### bind
<font color=#959595 size=3>The bind method returns a function that can receive any parameter</font>
```javascript
Function.prototype._bind = function (obj, ...args1) {
        return (...args2) => {
            obj.fn = this
            obj.fn(...args1.concat(...args2))
            delete obj.fn
        }
    }
```
### test

```javascript
mycall(show, obj, 'a', 'b', 'c') // philip ['a','b','c']
myapply(show, obj, ['a', 'b', 'c']) // philip ['a','b','c']
let result = mybind(show,obj,'a', 'b');result('c')// philip ['a','b','c']
```
WordPress Performance - WordPress schneller machen
Tags: wordpress, performance
Published: 2021-07-05 11:56:30

---
title: WordPress Performance - WordPress schneller machen
published: true
date: 2021-07-03 12:36:13 UTC
tags: WordPress,Performance
canonical_url: https://bloggerpilot.com/performance/
---

![WordPress Performance](https://bloggerpilot.com/wp-content/uploads/2021/07/wordpress-performance.png)

Wordpress ist in einigen Aspekten sehr schnell, aber in anderen nicht. Das ist ein Grund, warum es eine gute Optimierung braucht. Hier sind einige Tipps und Tricks, wie du WordPress optimieren kannst und es schneller laufen lässt.

[WordPress schneller machen](https://bloggerpilot.com/performance/)!
Ist deine Website langsam?  
In diesem Beitrag zeige ich dir, wie du die Performance deiner WordPress Seite optimieren kannst, indem du einige kleine Tipps und Tricks lernst. Ich werde dir auch zeigen, wie du deine WordPress Seite optimiert und reibungslos laufen lässt.
Simplicity as a prerequisite for reliability
Tags: programming, productivity, webdev, devops
Published: 2021-07-03 12:15:00

Simple is not easy, easy is not simple. Let's first get that out of the way. People are often equating easiness with simplicity, but they are very different words.

- Simple (vs complex) - from "sim plex", literally: one-fold (i.e. not braided)

- Easy (vs hard) - from "lying at, lie near"; familiar, near to our understanding 

Rich Hickey goes more into detail about this in his [presentation](https://www.infoq.com/presentations/Simple-Made-Easy/). If you haven't already, check it out (I don't agree with everything he said, but it's a good presentation, definitely worth watching).

Most often, achieving simplicity is the hardest thing to do in software development and usually, it requires an enormous experience.

---

Simplicity is an extremely important, probably the most important, aspect of software development. As Edsger Dijkstra put it, "Simplicity is prerequisite for reliability". 

If your design is not simple, the whole thing will eventually become fragile, unreliable, and start to fall apart.

Unfortunately, complexity sells much better, and together with <a href="https://onethingwell.dev/cargo-cult-programming">cargo-cult programming</a> and <a href="https://onethingwell.dev/resume-driven-development">resume driven development</a>, this is one of the roots of the modern software development mess.
        
<hr><small>
Note: This is a snapshot of the wiki page from <a href="https://onethingwell.dev">OneThingWell.dev Wiki</a>, you can find the latest, fully formatted version here: <a href="https://onethingwell.dev/simplicity-as-a-prerequisite-for-reliability">onethingwell.dev/simplicity-as-a-prerequisite-for-reliability</a>.
</small>
What is AWS Cloud Security?
Published: 2021-07-03 11:57:05

AWS Cloud Security enable customer to protect there data, account and workload. The thread detection, data encryption and monitoring are the key concept. 

Various aws service have been used for various perpose. The data protection like AWS KMS provide encryption and key management.

Where the services like AWS Security Hub and Guard Duty provie continues monitoring your data, accounts and workload.
How to download multiple youtube videos in python.
Tags: python, youtube, videos, download
Published: 2021-07-03 11:47:18

In this tutorial i am going to show you how to download multiple youtube videos using pafy in python.

Firstly, go to the GitHub page: https://github.com/Kittex0/Download-Multiple-Youtube-Videos-in-Python

Then simply download the file by clicking on the green code button and then click on download zip and then unzip the file. 

To use, simple go on the file "Download Multiple Youtube Videos.py" and then read the instructions in Green. After that, your video's should be downloaded

Requirements:

1.You need to how python installed
2.You need to have the right python modules installed To install modules, simply open command prompt and locate your file. ex. Go to folders and then locate the folder the file "Requirements.txt" is in, and then simply just copy the path (for example: C:\Users\forda\Desktop\Programmers\GITHUB DESKTOP IMP\GITHUB DESKTOP\python\github\Github Desktop\Download-Multiple-Youtube-Videos-in-Python) Dont copy my path as it wont work. Then go Command Prompt and type. "cd {Your Path}" then simply type "pip install -r Requirements.txt".
VCS  v/s  SCM
Tags: github, git
Published: 2021-07-03 11:31:17

What is VCS?
VCS is Version Control System. It is a component of software configuration management. 
In simple terms, practice of tracking and managing changes to software code and it saves all the versions of the file. It is also known as Source Control.

 
What is SCM?
SCM is Source Control Management. It has the additional features of Version Control System. 
It tracks all the modifications to a source code files. Running a history of changes to a code base and helps to resolve conflicts when merging updates from multiple contributors.
In simple terms, it tracks all the changes what we done and perform operation on files.
How to add webpack loader to Next.js application
Tags: webpack, nextjs
Published: 2021-07-03 11:06:24

In this article, I will show how to add custom loader to your Next.js application. To simplify the example, I'll start with brand new application & just add some extension to be loaded as plain string.

# Application set up

We start by creating a brand new next.js application. As stated in the [documentation](https://nextjs.org/docs/getting-started) we run `npx create-next-app` and just add the name to it

```
$ npx create-next-app webpack-next

cd webpack-next
npm run dev
```

{% asciinema 423665 %}

The resulting application looks like:
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yscdzzg7u1z70pswddbw.png)

# Changing the wepback configuration
Next.js abstracts away from us the webpack configuration. They leave a way to tweak it in our project, but it's less straightforward than editing `webpack.config.js` direct. As you see in [the documentation](https://nextjs.org/docs/api-reference/next.config.js/custom-webpack-config):
```js
module.exports = {
  webpack: (config, { buildId, dev, isServer, defaultLoaders, webpack }) => {
    // Important: return the modified config
    return config
  },
}
```

you have many ways of mess it up - for example by not returning the config as the framework require us to do.

Note! Every time you change `next.config.js` you are supposed to restart the dev sever manually. I'm suspicious of auto restarts, so even if it were restarting on it's own, as NuxtJS does, I would restart manually from time to time anyway.

The configuration where we specify the `.my-files` to be loaded as text:
```js
module.exports = {
  reactStrictMode: true, // was there by default
  webpack: (config, { buildId, dev, isServer, defaultLoaders, webpack }) => {
    config.module.rules.push({
      test: /\.my-file$/i,
      loader: "raw-loader",
    });

    // Important: return the modified config
    return config;
  },
};
```

We need to make sure to **push** to `config.module.rules`. Otherwise, if we were overriding the whole array, would drop all loaders specified by Next.js.

When we add an example files, `/pages/test.my-file`:
```
Test content
```

and import it in our js like this:
```js
import test from "./test.my-file";

export default function Home() {
  return <div>{test}</div>;
}
```

the attempt to build will fail. That's because we have to install `raw-loader` first:

{% asciinema 423670 %}

The resulting application:
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5qmkr13j0itqm8d4jz05.png)

# Links
* [webpack video course](https://bit.ly/WebpackCourse)

# Summary
Here we have seen how to add custom loader to the Next.js application. If you want to see the repository, you can find it here:
{% github marcin-wosinek/webpack-next no-readme %}

If you want too see my other webpack related content:
{% post https://dev.to/marcinwosinek/webpack-links-4alp %}
Basic profile for asciiname recording
Tags: asciinema
Published: 2021-07-03 10:18:21

If you spend a lot of time in terminal, your prompt is probably heavily customized. [asciinema](asciinema.org) a great terminal recording tool, by default is picking up your normal configuration - which is not perfect, because probably while recording a session, you don't want to distract people with unrelated details.

I use `zsh`, and if I want to avoid clutter I would have to do a bit of clean up at the beginning of each recording:
{% asciinema 423659 %}

You can easily address it by setting up configuration in `~/.config/asciinema/config`, that contains:
```
[record]
; Command to record, default: $SHELL
command = /bin/sh
```

this makes asciinema session start with `sh` shell, a most likely have no customization on your system, and gives distraction-free prompt by default:
{% asciinema 423660 %}
How I switched careers to Software Engineering
Published: 2021-07-03 10:08:44

Hey everyone! Today I talk about how I switched careers from law to Software Engineering. In Germany you have different education paths and I tell you more about dual studies and an education at a company.

{% youtube pA7f2gwiYHk %}

➤ Timestamps:
Introduction 0:00
Education for programmers: 0:55
Dual studies: 1:50
Application process: 2:10

Study/life updates playlist:
➤ https://youtube.com/playlist?list=PLWzVVoNwuhYlpGBw12JP-h8-hwjkBrco6
Webpack links
Tags: webpack
Published: 2021-07-03 09:15:34

I'm create a bit of webpack content recently, here I put all the links so you can find other pieces easily if you are interested in.

# Series about webpack 5

{% link https://dev.to/marcinwosinek/tutorial-for-building-multipage-website-with-webpack-4gdk %}

An bunch of articles about various aspects of webpack.

# Series about webpack & Next.js

{% link https://dev.to/marcinwosinek/adding-webpack-loader-to-next-js-application-1c7e %}

Articles about webpack as it's used in Next.js

# Build tools in 2021 series

{% link https://dev.to/marcinwosinek/webpack-5-in-a-simple-html-js-usecase-3ee8 %}

I this series I take a look on various build tools we have available now in 2021. This article show a simple application build with webpack

# Udemy course about webpack 5
My video course about webpack:
[![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ly459jw7a80faad7dyx1.png)](https://www.udemy.com/course/beginners-course-for-webpack-5/?referralCode=CF61F1A7C095ED2A63B8)
Github copilot - thoughts after actually trying it
Tags: githubcopilot, ai, pairprogramming, keybindings
Published: 2021-07-03 09:08:07

After waiting some time, today I was invited to try out Github copilots' visual studio code extension.

After using it some time, I personally feel that it is a next step in the coding .

---

Simple commands are suggested right away
![elems](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/57yv5frxumojwzuin7f0.gif)


There are some very practical suggestions as well (they are trivial , but I google them all the time still)
![dates](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/l1m4a6hc792kec7rknfx.gif)
 
---

Sometimes it suggests ridiculous solutions ![ridc](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/m60473kp528ln2jbwcgs.gif)

But by clicking `control+enter` we can check several other possible solutions and choose most efficient one

![sol](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b6p341swpnwfzs3ryaqv.gif)

---

It can actually generate function body from comments (usually it was other way around)

![date](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/g943s4nn1zz1di89tek1.gif)
 
 

One other thing I noticed is that, sometimes, when it comes to libraries, it suggests code from old versions.

For example, in the image bellow it tries to draw scatterplot using d3 v3 (v4 was released in Jun 2016 ) and latest version is d3 v7

![Screenshot 2021-07-03 at 12.26.48](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2vsg29zmbxgt7xrlbvjz.png)
 

Aside from the issues mentioned above, I personally think that this is a next step in the AI assisted programming and can't wait to see how it will progress.

If you are eager to try it out, but you are still in waitlist , just comment your uncompleted code piece bellow and I will try respond with copilot suggested snippets.

Thanks for reading :)
Negotiating Languages with Ruby: A Journey through Linguistic Diversity
Tags: ruby, acceptlanguage, http, request
Published: 2021-07-03 08:51:23

Our world, with its vast array of languages, is a melting pot of diverse cultures and histories. Linguistic diversity is a remarkable aspect of human society that underscores our uniqueness. Just as the web is an intricate network of hyperlinks that binds web pages together, languages interconnect humanity. This myriad of human languages is innumerable, yet the [BCP 47 specification](https://tools.ietf.org/html/bcp47) helps us identify and code them by their name, regional variation, and script.

In the realm of web services, the [`Accept-Language` HTTP header](https://tools.ietf.org/html/rfc2616#section-14.4) field articulates client preferences concerning languages.

Consider a Japanese user, a native speaker who has adjusted their browser settings to receive content primarily in Japanese. This preference is reflected in the following request:

```http
Accept-Language: ja
```

Suppose this user is from Osaka and has a preference for the Kansai dialect. The parameter can be fine-tuned as follows:

```http
Accept-Language: ja-KS, ja;q=0.9
```

Further, let's assume the user has a basic understanding of Thai, but only in the Latin script. The request now becomes:

```http
Accept-Language: ja-KS, ja;q=0.9, th-Latn;q=0.8
```

Lastly, let's presume the user is open to other languages, except French and English:

```http
Accept-Language: ja-KS, ja;q=0.9, th-Latn;q=0.8, *;q=0.1 fr;q=0, en;q=0
```

[Ruby](https://www.ruby-lang.org/) offers a compact and handy library, [`accept_language`](https://rubygems.org/gems/accept_language), that simplifies language negotiations between the client and server.

If a server, for instance, has translations in Japanese and Korean for a certain resource, the `accept_language` library can find a common ground between the user's preferred languages and those supported by the application:

```ruby
AcceptLanguage.parse("ja-KS, ja;q=0.9, th-Latn;q=0.8, *;q=0.1 fr;q=0, en;q=0").match(:ko, :ja) # => :ja
```

In the context of a [Rails](https://rubyonrails.org/) application, the usage might look like this:

```ruby
# app/controllers/application_controller.rb
class ApplicationController < ActionController::Base
  before_action :best_locale_from_request!

  def best_locale_from_request!
    I18n.locale = best_locale_from_request
  end

  def best_locale_from_request
    return I18n.default_locale unless request.headers.key?("HTTP_ACCEPT_LANGUAGE")

    string = request.headers.fetch("HTTP_ACCEPT_LANGUAGE")
    locale = AcceptLanguage.parse(string).match(*I18n.available_locales)

    # If the server cannot serve any matching language,
    # it can theoretically send back a 406 (Not Acceptable) error code.
    # But, for a better user experience, this is rarely done and more
    # common way is to ignore the Accept-Language header in this case.
    return I18n.default_locale if locale.nil?

    locale
  end
end
```

Here's to the joy of linguistic diversity! Let's embrace the challenge of matching as many languages as possible. Happy coding!
My javascript / tech / web development newsletter for 2021-07-03 is out!
Tags: javascript, tech, webdev, discuss
Published: 2021-07-03 08:47:42

---
title: My javascript / tech / web development newsletter for 2021-07-03 is out!
published: true
description: A roundup of all the best javascript, tech and web development links posted to my linkblog in the past week
tags: javascript, tech, webdev, discuss
---
In this week’s edition:

Instagram more than just photos, AI tools for developers

https://markjgsmith.substack.com/p/mark-smiths-newsletter-03-07-2021

Would love to hear any comments and feedback you have.

[@markjgsmith](https://twitter.com/markjgsmith)
Start  mongodb/mysql services automatically in wsl2
Tags: linux, database, systems, mongodb
Published: 2021-07-03 08:16:03

* First open a script using nano in your WSL terminal by running this command:
```
sudo nano ~/.local/bin/start_script
```
* Copy the following command in that scipt:

```
service mysql start
service mongodb start
```
![commands inside script](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bilqazla27r949ri5kjs.JPG)

* Press `ctrl+o` and then `ctrl+x` to save and exit the script.
* Go to Windows start menu and type `Task Scheduler` to open Task Scheduler.
* Under the Actions tab on the right hand side, click `Create Task...` to open create task window
* On this window give your task a specific name and make sure `Run only when user is logged on` is selected as shown below.
![Task Name](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/s05540wofqwjghgskgyn.JPG)
* Then click on Triggers tab and create a New Trigger by selecting Begin the Task `At log on` from the dropdown menu and under settings `any user` and select `Enabled` under Advanced Settings.
![Trigger](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bp4zu7dkpljf8rkey5yi.JPG)
* Then go to Actions Tab and create a New Action as `Start a Program` and under Settings set Program/Script as `C:\Windows\System32\bash.exe` and in the Add arguments `-c "sudo ~/.local/bin/start_services.sh"` as shown below.
![Actions](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/z7ltne3sx0cq67ckwz1f.JPG)

That's all. The next time Windows starts, task will be triggered and it will run your custom script as root and start mongodb and mysql. You can also add any other services to this script.