teleren/devto huggingface dataset:
Updates from 83rd meeting of TC39

Tags: tc39, javascript
Published: 2021-05-26 22:07:23

There were several items in the agenda, this post mainly focuses on feature proposals and their progress.

__Stage 4:__

* [RegExp Match Indices](https://github.com/tc39/proposal-regexp-match-indices) provide additional information about the start and end indices of captured substrings relative to the start of the input string.

* [Top level await](https://github.com/tc39/proposal-top-level-await) enables modules to act as big async functions: With TLA, ECMAScript Modules (ESM) can await resources, causing other modules who import them to wait before they start evaluating their body.

__Stage 3:__

* [Accessible Object.prototype.hasOwnProperty()](https://github.com/tc39/proposal-accessible-object-hasownproperty): Proposal for an `Object.hasOwn()` method to make `Object.prototype.hasOwnProperty()` more accessible.

* [Intl.DisplayNames V2](https://github.com/tc39/intl-displaynames-v2): In `Intl.DisplayNames` API, we already cover language, region, script, and currency. This proposal enhance the Intl.DisplayNames API and cover more.

* [Extend TimeZoneName Option](https://github.com/tc39/proposal-intl-extend-timezonename): Extend the timeZoneName option in Intl.DateTimeFormat object to support more formatted options.

* [Resizable and Growable ArrayBuffers](https://github.com/tc39/proposal-resizablearraybuffer) Growing a new buffer right now requires allocating a new buffer and copying. Not only is this inefficient, it needlessly fragments the address space on 32-bit systems, this proposal makes it easier to have a resizable and growable `ArrayBuffer`.

__Stage 2:__

* [Set notation in regular expressions](https://github.com/tc39/proposal-regexp-set-notation) UTS18 set notation in regular expressions

<hr/>

<center><a href="https://twitter.com/GNUmanth">@gnumanth</a></center>
Colorgradient.dev
Tags: css, showdev, webdev, vue
Published: 2021-05-26 22:06:53

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

I created this CSS Gradient Editor, you can check it out here [Color Gradient](https://colorgradient.dev/)

What do you think?
Factorialize a Number
Tags: javascript, beginners, tutorial, devops
Published: 2021-05-26 21:50:40

* Let's Return the factorial of the provided integer.
* If the integer is represented with the letter `n`, a factorial is the product of all positive integers less than or equal to `n`.
* Factorials are often represented with the shorthand notation `n!`
* For example: 5! = 1 * 2 * 3 * 4 * 5 = 120
* Only integers greater than or equal to zero will be supplied to the function.

### There's two ways that I know of to solve this problem:
```
function factorialize(num) {
let result = 1;
for (let i = 1; i <= num; i++) {
result *= i; // <--basically going to accumulate all of the numbers.
}
return result; //<-- returns 120;
}

console.log(factorialize(5)); // will display 120
```
* The for loop starts at 1 and increments each time until `i` is less than or equal to `num` which in this case is 5. When we `console.log(i)` we get 1, 2, 3, 4, 5. 
* I also created a variable `result` which is equal to 1 because if we put 0 there then every time we multiply it by 0 we get zero. the result variable is basically going to accumulate all of the numbers. We follow that by `result = result times i` or just `result times equal i` which then returns that which in this case is 120;

###OR
```
function factorialize(num) {
  if (num === 0) {
    return 1;
  } else {
    return num * factorialize(num - 1);
  }
 }

// factorialize(5); // will display 120
```
### Code Explanation:
* Notice at the first line we have the terminal condition, i.e a condition to check the end of the recursion. `If num == 0`, then we return 1, i.e. effectively ending the recursion and informing the stack to propagate this value to the upper levels. If we do not have this condition, the recursion would go on until the stack space gets consumed, thereby resulting in a Stack Overflow
How to change the default editor in git for beginners
Tags: git, tutorial, vim
Published: 2021-05-26 21:40:47

> When you decide to use a version control system (VCS) into your project using **git** And start creating the project
> folder and writing the first commands,

###### Creating the first Repository

```
$ git init
```

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


> Now we need to add our file into the Repository

```
$ git add test_code.js
```

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7qpasr9x6t4umuz5z3cg.png)

> Now the test_code.js file in the Staging area ( Index )

###### To get the status of our working tree  

```
$ git status
```

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

>The last step we need to run `$ git commit` to captures a snapshot of the project's currently staged changes.

```
$ git commit
```
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9roatmm26ywlsq0kjn31.png)

> Then the default text editor will run you need to write **i** letter to start typing the commit message and once you have done you need to click on **esc** button and input **:wq** to save and quite , 
>

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0qg8wukg6bme5eddfpkk.png)

> Here's the problem if you didn’t familiar with the default  Vim or nano text editor you need to add this command to use  your favourite text editor,
`$ git config --global core.editor "Atom"`
i'll use **Atom** as a text editor.
>

> finally Run this command `git commit --amend` to recover the commit message by input **R** then press Enter and run the `$ git commit` again
>
 
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tda7l6ebiotirbb677hj.png)


![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yrde1habssr51bvu6dik.jpeg)


Good Luck and Happy Learning
Welcome Thread - v126
Tags: welcome
Published: 2021-05-26 21:31:00

---
title: Welcome Thread - v126
published: true
description: Welcome to DEV! A thread of hellos and intros.
tags: welcome
canonical_url: 
---

![hot dog saying hi](https://media.giphy.com/media/kZzY6eKKPdIjK/giphy.gif)

### Welcome to DEV!

1. Leave a comment below to introduce yourself! You can talk about what brought you here, what you're learning, or just a fun fact about yourself.

2. Reply to someone's comment, either with a question or just a hello. 👋 

**Great to have you in the community!**
Join the Electron Developer Office Hour
Tags: codenewbie, opensource, devjournal, electronjs
Published: 2021-05-26 21:28:01

Learn and ask your questions about ⚡️ [Electron](https://www.electronjs.org/) - the hugely popular open-source framework that powers VS Code, Slack, Discord, and many other great desktop apps.

Get an intro on how to get started with Electron, our lessons learned, and bring your questions!

---

[Electron](https://www.electronjs.org/) is a hugely popular open source framework that enables the development of cross-platform desktop apps using web technologies. 

If you have ever used Visual Studio Code, Slack, Discord, or an endless list of other great apps on macOS or Windows, you’ve used Electron.

We believe in creating a meaningful space for developers of all levels to learn, collaborate and catch up on the latest technologies and frameworks. We’ve created a dedicated block of time to make sure someone from our team can help answer questions and facilitate the conversations for our growing community.

The up and coming Developer Office Hour will be hosted by Brad Carter, Software Engineer at [CoScreen](https://www.coscreen.co/) and an Electron enthusiast.

**Here’s the rough agenda:**
* Quick intro on Electron and how we use it at CoScreen to build our cross-platform collaboration app
* Helping you to decide when it is the right technology for you and when it isn’t
* And, of course, do our best to answer all of your questions.

The event will be hosted on **June 3rd 2021 at 11 am PST / 2 pm EST.**

Sign up and submit your questions [here] (https://docs.google.com/forms/d/e/1FAIpQLScrzguFPIWNWF34vXRpgfQsWeN5Qy3SWvcWIPBLVzgK3LI1jA/viewform?usp=sf_link)

Make sure to include your name and any useful information so we can help you best.

We are looking forward to chatting with all of you and learning together. 

*not all questions will be answered, but we will do our best to :)

The CoScreen Team
📚 The Complete Guide to Vue User Authentication with Auth0
Tags: vue
Published: 2021-05-26 21:26:58

####🛠 Learn how to add login, logout, and sign-up to Vue.js using a plugin, how to create vue-router guards, and how to make secure API calls from a Vue.js app.

### <br>
You'll enhance a starter Vue.js application to practice the following security concepts:

- Add user login and logout.
- Retrieve user information.
- Protect application routes.
- Call protected endpoints from an API.

This guide uses the Auth0 SPA SDK to secure Vue.js applications, which provides Vue.js developers with an easier way to add user authentication to Vue.js applications using a Vue.js plugin. The Auth0 SPA SDK provides a high-level API to handle a lot of authentication implementation details. You can now secure your Vue.js applications using security best practices while writing less code.

[Read more...](https://auth0.com/blog/complete-guide-to-vue-user-authentication/?utm_source=content_synd&utm_medium=sc&utm_campaign=vue)
Zorin OS for learning Linux? Yes.
Tags: linux, ubuntu, zorinos
Published: 2021-05-26 21:25:55

If you are using Windows and want to learn Linux, Zorin OS can be a good starting point.

Some interesting features:

- Familiar desktop environment & user experience
- Possible to run many Windows apps (by using WineHQ).
- It's free.

So if you are interested in Linux, I suggest trying [Zorin OS](https://zorinos.com) alongside your current OS or in a virtual machine.

P.S. [OnWorks](https://www.onworks.net) lets you test various OSes online. It's slow and time-limited but worth trying once.
Reversing a String
Tags: javascript, devops, tutorial, beginners
Published: 2021-05-26 21:14:09

* Let's Reverse the provided string.
* You may need to turn the string into an array before you can reverse it.
* Your result must be a string.
```
function reverseString(str) {
 return str;
}

reverseString("hello");
```
* Answer:
```
function reverseString(str) {
  let strArr = str.split("");
  let reverseStrArr = strArr.reverse();
  let reverseStr = reverseStrArr.join("");
  return reverseStr;
}

console.log(reverseString("hello")); // will display olleh
```
####Explanation:
* Our goal is to take the input, `str`, and return it in reverse. Our first step is to split the string by characters using `split("")`. Notice that we don’t leave anything in between the single quotes, this tells the function to split the string by each character.
* Using the `split()` function will turn our string into an array of characters, keep that in mind as we move forward.
* Next we chain the `reverse()` function, which takes our array of characters and reverses them.
* Finally, we chain `join("")` to put our characters back together into a string. Notice once again that we left no spaces in the argument for join, this makes sure that the array of characters is joined back together by each character.

#### OR
```
function reverseString(str) {
  return str.split("").reverse().join("");
};
```
* just simply return it.
Comunicación entre ventanas mediante el localStorage
Published: 2021-05-26 20:32:42

Hace poco tuve un desarrollo en la cual el alcance era realizar un callback entre dos ventanas de diferente origen. Quería encontrar una solución que no dependiera de alguna librería o dependencias externas.

En este artículo compartiré la solución de este desarrollo, en donde el principal protagonista es el localStorage.

NOTA: LOS PROYECTOS IMPLICADOS EN ESTA SOLUCIÓN SE REALIZARON CON ANGULAR

#1-**Realizar un window.open()**
Desde el proyecto A que vendría hacer la ventana principal, se invocara al proyecto B mediante un window.open('URL_PROYECTO_B').
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rvlq0arrup0812mhoplz.PNG)

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tmx73j2xnlwrlv2au61v.PNG)

#2-**Crear un iframe**
Desde el proyecto B se debe crear un iframe con la url de origen del proyecto A, el iframe va permitir incrustar todo el contenido html del proyecto A en el proyecto B.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b4jonmvwtcr63e6muvoa.PNG)

#3-**Realizar un postMessage**
Para enviar el mensaje del proyecto B al proyecto A, se dará mediante un postMessage('MENSAJE','URL_PROYECTO_B'), para esto primero se deberá obtener el elemento iframe que se creo anteriormente y desde la propiedad contentWindow del iframe enviaremos el mensaje.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4cmhqrr5ebbi3b1w1tav.PNG)

#4-**Obtener el mensaje y guardarlo en el localStorage**
Para obtener el mensaje en el proyecto A se utilizara un window.onmessage(), en donde se validara que el origen del mensaje venga del proyecto B.
Luego guardaremos el mensaje en el localStorage.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3g2ljm9wtaqgzyta1pqz.PNG)

En mi caso para obtener estos mensajes del localStorage uso el método window.onstorage() que se ejecuta cada vez que ocurre un cambio en el storage.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4f866t24kea3stj6f08v.PNG)

#**Ejecución**
Enviamos el mensaje del proyecto B al proyecto A
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4j62u059f1j3x1x7rjmk.PNG)

Verificamos que el mensaje este guardado en el localStorage del proyecto A
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/q5btal9vk8yqlhrxv64u.PNG)

Mostramos los mensajes en la ventana principal
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zkx144tviet455vfb7qg.PNG)


Existen diversas soluciones para lograr el callback entre ventanas/pestañas, en mi caso opte por el localStorage porque me pareció la solución mas sencilla y además que los mensajes persisten ante una recarga de página.

Espero que el post haya sido de su agrado y gracias por su tiempo :)
Converting Celsius to Fahrenheit
Tags: javascript, devops, tutorial, beginners
Published: 2021-05-26 20:32:39

* The algorithm to convert from Celsius to Fahrenheit is the temperature in Celsius times `9/5`, plus `32`.

* You are given a variable `celsius` representing a temperature in Celsius. Use the variable `fahrenheit` already defined and assign it the Fahrenheit temperature equivalent to the given Celsius temperature. Use the algorithm mentioned above to help convert the Celsius temperature to Fahrenheit.

```
function convertToF(celsius) {
  let fahrenheit;
  return fahrenheit;
}

convertToF(30);
```
* Answer:
```

function convertToF(celsius) {
  let fahrenheit = celsius * (9 / 5) + 32;
 return fahrenheit;
}

convertToF(30);
```
```
convertToF(30) should return a value of 86
```
Filtering, Sorting and Pagination With React Hooks & Redux 😍
Tags: javascript, react, 100daysofcode, redux
Published: 2021-05-26 20:31:07

# Demo
-   https://react-redux-filtering.netlify.app/

# Github 
-   https://github.com/saidMounaim/React-Redux-Filtering

-----------

## Getting Started

These instructions will get you a copy of the project up and running on your local machine for development and testing purposes.

```
node@v10.16.0 or higher
npm@6.9.0 or higher
git@2.17.1 or higher
```

## How To Use

From your command line, clone and run React Redux Filtering:

```bash
# Clone this repository
$ git clone https://github.com/saidMounaim/React-Redux-Filtering.git

# Go into the repository
$ cd React-Redux-Filtering

# Install dependencies
$ npm install

#Start's development server
$ npm start
```

## Technologies Used

-   [React](https://reactjs.org/)
-   [Redux](https://redux.js.org/)
How to Deactivate / Disable Button after Click
Tags: beginners, firstpost, html, javascript
Published: 2021-05-26 19:51:58

So I am working on my first Javascript/HTML project for coding school. I made it so that when the user clicks on a button it would render some API data onto the page. But if the user clicked that same button more than once it would add the same data to the page with every click.

First I tried to see if I could find a way to dynamically disable the button with JS code without having to write a whole function. I tried to use the btn.id = "" format with .onclick while dynamically creating the button and that did not work.  

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

The only solution I got to work was to add a disableButton() function, create the button in the HTML file and add an onclick classification inside of its tag activating that JS function.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/m83269kzoqxd2037atqv.png)
menu bar with css
Tags: html, css, vscode
Published: 2021-05-26 19:44:33

i have created menu bar with just in css.there no javascript code on that dummy website if you wanna check the website ill give the link
use the link and check out what i have done!

with just use of checkbox converted into menu bar style
![IMG_20210527_002303](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/u8kusowh098bblpw9l4y.jpg)
 



 https://imaasif01.github.io/menu-with-css/
Launch: The largest remote tech jobs aggregator 🔥
Tags: machinelearning, career, startup, discuss
Published: 2021-05-26 19:25:15

Hi, dev.to community!

We've launched the biggest remote tech job aggregator — Bergamot.io today on ProductHunt [(support us here)](https://bergamot.io/). 


### **Why we think that the world needs one more tech remote job aggregator?**

**None of the job boards aggregates ALL the job posts.** Only a few job aggregators scan companies' career pages for job posts. But so many great vacancies and hidden there. 

**None of the job aggregators has handy and smart filters.** For example, I live in Germany — why I still have to run into job posts for US citizens only? That's really a waste of time. 

**None of the job aggregators provides you with personalized** job selection and an opportunity to subscribe to its regular delivery to your email. 

What do you think?

Try it and share the feedback, please. That's so important!
Freebie: Cryptocurrency Icons (Figma)
Tags: figma, free, cryptocurrency, icons
Published: 2021-05-26 19:02:09

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

467 icons and growing

We offer this cryptocurrency icon pack in Figma format to everyone dealing with building interfaces for crypto exchange and wallet applications. Feel free to grab this file, and don't forget to share it!

[Download file in fig. format from our site.](https://hotsnow.fi/hotsnow-blog-workshtml/tpost/abi16jsfv1-freebie-cryptocurrency-icons-figma)

This resource is related to cryptocurrency assets, coins, tokens, logotypes, icons.
Read More/Read Less functionality with Vue
Tags: vue, javascript, html, css
Published: 2021-05-26 19:00:35

Hi!
In this post I am going to show you a simple way to do a Read More/Read Less functionality in vue.js.

One way to do that is to have two divs that will store both versions of the text (the long and the short one) but that is working only if we work with static texts.

This is a working version of that functionality using a variable in which will be stored our text:
https://codesandbox.io/s/eager-kowalevski-u406b?file=/src/App.vue

The idea is pretty simple. I just have a bool variable named "readMore" which will control displaying of Read More and Read Less buttons. Also, using readMore ,I give to div that stores the text a new class named "readLess" which have it own styles.
Hope it was useful for you. If you have any questions or suggestions, feel free to text me about that :)
Course Launch 🚀 - Sets and Frozen Sets in Python
Tags: programming, python, codenewbie, showdev
Published: 2021-05-26 18:58:57

Are you a newbie and is your next Python learning goal is Sets and Frozen Sets?
 
Preparing for an upcoming interview, want to brush up your knowledge on Sets and Frozen Sets while solving problem alongside?


I recently built and published a self-paced Python course on Linkedin Learning on Sets and Frozen Sets.

Course Features 👇:

📌 The full course is FREE for a month from the date of your sign-up.
📌 3 bite-sized lessons are available for preview (no sign-up needed).
📌 You can download the lesson on Linkedin Learning iOS and android applications and can learn offline.
📌 Hands-on examples, MCQs, challenges
📌 The course is a collection of bite-sized videos.
📌 Course duration - 1 hour 37 min, lesson duration varies between 40 sec to 6 minutes maximum.

NOTE - If your employer or your university has given you access to the Linkedin Learning library. You would be able to access the full course.

Take the course and spread the word among your peers.
If you take the course do let me know your feedback.

Course Link:

https://www.linkedin.com/learning/python-data-structures-sets-and-frozen-sets
Timex Men's Easy Reader Review- [Is Worth Buying?]
Published: 2021-05-26 18:43:01

Our Website: https://reviewthewatch.com/
Friends, after doing a lot of research and testing on Timex Easy Reader, We came to know a lot of things about this watch which we will reveal in this Review. We will also find out whether it is really worth buying or not? 

Timex Easy Reader 38mm( TW2P75900)- Is This a Quality Watch?

Friends, the Timex brand is best known for two reasons. First for Affordable Watches and second for  Quality and Durability.

With a lot of its watches, Timex has proved that this is a brand that gives you quality at affordable prices which makes Timex a Valuable Brand. 

Let's now talk about the quality of the Timex Easy Reader 38mm Leather Strap Watch. Friends, as we tested this watch, we found 4 factors that make this watch a quality watch. 

1. Its Cow Hide Leather Strap 
2. Readability & Looks
3. Durability 
4. 40th Anniversary Indiglo Feature

Friends, we will talk about these factors in more detail. Let us first see some of the looks of this watch.
Check full article here https://reviewthewatch.com/timex-mens-easy-reader-review/