teleren/devto huggingface dataset:
Yet another programming language Unv
Tags: javascript, unv, webdev, programming
Published: 2021-12-24 05:28:38

---
cover_image: https://images.unsplash.com/photo-1444703686981-a3abbc4d4fe3?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=870&q=80
---

```py
if 'Unv is awesome!'
    print('Hello World!')
# keep editing for live results
```

Above code looks like Python. But python requires `:` after `if` statement.

I am the creator of Unv. Here are some features of Unv

- **🍬 Syntax sugar**
The syntax of Unv language is inspired by Python. So It's nearly similar to English. instead of too many brackets ot depends on whitespace.

- **🌐 Universal**
Compilers convert Unv language to existing languages.(currently JavaScript, more coming soon). Use Unv for your web, mobile, desktop or IOT application.

- **🤝 Friendly**
As Unv language is universal, It can import your favorite library.

To make it work first I had create a Unv to JavaScript compiler.

[![Card of Unv to JavaScript compiler](https://opengraph.githubassets.com/34eb9dbde80ab51ed1c811e7502552eede53ac53bb01631683d4e9d389d4abd1/UnvLabs/JavaScript)](https://github.com/UnvLabs/JavaScript)

It was written with 30 lines of JavaScript.

Then created a [site for Unv](https://unv.vercel.app/) with docusaurus.


There is a [playground for Unv](https://unv.vercel.app/playground).
Its powered by Codemirror mobile friendly code editor.

I need contributors for this project. If you can help me please contact me via ksengine.github@gmail.com or comment to this [thread](https://github.com/UnvLabs/UnvLabs/issues/1) on Github.

Please give us a star If you like this project 
[Star me](https://github.com/UnvLabs/Unv)
Thanks.
Top HR Trends in 2022 You Should Be Paying Attention to
Tags: hr, business, employee
Published: 2021-12-24 05:08:32

The human resource function faced many challenges when the pandemic hit in 2020. And with the recent improvements in the COVID-19 conditions, companies are again making adjustments and decisions about their working setup. In adapting to these rapid changes, here are five HR trends companies must pay attention to in 2022.

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

**Internal Mobility & Shift in the Hiring Process**

With the pandemic creating missed opportunities for millions of displaced workers in 2020 and 2021, companies are changing their mindsets about the hiring process. Mainly, they want to give their recognition to qualified employees who continue to be with the company – with better positions that will match their skills set. Therefore, higher-ranking roles are given to workers who have already shown their abilities.

**Diversity and Inclusion Initiatives**

The world today is very passionate about diversity and inclusion. Businesses should also adopt this mindset and put more emphasis on skills and differences that each staff member brings into the workspace. Benefits of workplace diversity include increased productivity, creativity, cultural awareness, and marketing opportunities.

**Managing Multi-generational Workforces**

Alongside the elevation of diversity in workforces is the inclusion of all age groups. From the traditionalists to Gen Z, multi-generational workforces have been seen to increase innovation and problem-solving. Although it may pose some challenges with regards to differences in mindsets, workspaces benefit from having a mix of age groups within teams.

**Aligning With Business Goals to Drive Impact**

Modern HR methods now entail the alignment of HR strategies with business goals. This means that aside from processing payslips and tax payments for payroll, the HR manager has to plan employment policies that will support the overall company objectives.

**The Revamping of Employee Perks and Benefits**

Aside from the usual paid day-offs and healthcare benefits, companies should add more relevant benefits in 2022. For example, their benefits packages can include flexible work location or hours, mental health benefits, loan relief, family planning benefits, or personalized ones.

**Manage HR Activities with Entrust Payroll Solutions**

Enterprises face new challenges and opportunities every day. Your time is valuable, which is why Entrust Payroll Solutions Fort Myers, FL offers you simple, affordable online payroll services that save your time.

Manage your payroll in minutes from anywhere, even while on the go with your mobile device. Get the service and support you deserve. It’s that simple!
.NET 6 Service Bus Trigger Azure Function - Part 2
Published: 2021-12-24 05:03:46

I develop simple Azure Function with Service Bus Topic Trigger in [previous article](https://dev.to/kenakamu/net-6-service-bus-trigger-azure-function-part-1-50h4), and I will deploy it to Azure Function App.

# Create Function App

1\. From add resource, add "Function App".

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

2\. Select .NET 6 as runtime.

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

3\. Once the resource is created, go to "Identity" menu and turn on system assigned managed identity.

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

4\. Next, we need to add one variable. Go to Configurations and add "New Application Settings". Set appropriate value for your environment.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/m18gg4w383fc8j5zpnzo.png)
 
   
# Set IAM for Service Bus

I only assign myself as Data Receiver role of Service Bus in the previous article, so let's add Function's managed identity as well.

1\. Go to Service Bus topic resource from Azure Portal and add Role.

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

2\. Select "Azure Service Bus Data Receiver" and add the function app managed account as member. You can easily find it by selecting "Managed identity".

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

# Deploy to Function App

I use Visual Studio feature for deploy.

1\. From Visual Studio, right click the project and click "Publish". Then select Azure as target.

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

2\. Select the created Function App by using wizard.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/aekwmi6gaxr0hnols38n.png)
 
3\. Click "Publish" and go to Azure Portal to see the result.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0fihpj47zctb0vfrvw60.png)
 
4\. Select the function and go to "Code" section, then open "Logs".

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zo31k0hpflgj4haq2thz.png)
 
5\. Send any data from Service Bus Topic and confirm the function is triggered as expected.

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

# Summary

Though there are small differences, developing .NET 6 version of Function app won't vary from previous version. So please try the latest version whenever possible!
Self-Taught Developer Journal, Day 24: TOP JavaScript Fundamentals Part 1 - Numbers cont. and Operators
Tags: webdev, beginners, codenewbie, devjournal
Published: 2021-12-24 04:51:52

Today I learned...

## Infinity
Infinity (or -Infinity) is the value JavaScript will return if you calculate a number exceeding the largest possible number.

A division by 0 will also return Infinity.

Infinity is a number type.

## Hexadecimals
JavaScript interprets numbers beginning with "0x" as a hexadecimal.

**Never write a number with a leading zero (07) because some JavaScript versions interpret numbers as octal.**

By default, JavaScript displays numbers as base 10 decimals. The toString() method can be used to output numbers from base 2 to base 36.

* Hexadecimal - base 16
* Decimal - base 10
* Octal - base 8 
* Binary - base 2

## Numbers as Objects
Numbers can also be defined as objects using the keyword **new**.

    let o = new Number(100);

However, its best not to create Number objects since it may produce unexpected results, complicates the code, and slows down the execution speed.

## Operators
An operator is **unary** if it has a single operand. 

    let x = -1;


When the unary plus operator, "+", is used on an operand that is not a number, it converts it into a number. An empty string and null become 0, true is 1, and false is 0. Space characters (\t, \n, etc.) are trimmed off when a string is converted to a number.

An operator is **binary** if it has two operands. 

    let x = 8 - 1;

## Resources
[The Odin Project](https://www.theodinproject.com/paths/foundations/courses/foundations/)
https://www.w3schools.com/js/js_numbers.asp
https://javascript.info/operators
fugitive verbose commit
Tags: git, vim
Published: 2021-12-24 04:39:08

---
published: true
tags:
- git
- vim
title: fugitive verbose commit
series: til
canonical_url: https://waylonwalker.com/til/fugitive-commit-verbose/
---

fugitive comes with a pretty sick way to commit files and see the diff at the same time with verbose commit.  Opening the fugitive menu with `:G` brings up your git status, you can stage files with `s`, unstage them with `u`, toggle them with `-`, and toggle their diff with `>`.  Once you have staged your files for commit, you can commit with `cc`, but today I found that you can commit verbose with `cvc`.  This brings up not only a commit widow with your git status shown, but the diff that you are about to commit.

![fugitive verbose commit example](https://images.waylonwalker.com/fugitive-verbose-commit.png)

> example of a verbose commit in fugitive

---

This is the first of my effort to post more, create more, and increase my content pipeine with shorter content.  I am posting all my tils can be found on my website.

https://waylonwalker.com/til
How to make a little npm package and publish it
Tags: javascript, node, webdev, tutorial
Published: 2021-12-24 04:16:21

Really! It is very easy...

{% youtube https://www.youtube.com/embed/N5Lh21LEQqU %}

**npm** stands for **node package manager**

### **In Breif**
Every npm require **one** `package.json` with **name** and **version** properties
```json
{
   "name": "string-seperator",
   "version": "1.0.2"
}
```

### Step 1 - npm account
the most important thing, just go and  [sign up](https://www.npmjs.com/signup) 

### Step 2 - login to npm via CLI
I guess you have made an account there

So, go to your terminal and type
```bash
$ npm login
```

### Step 3 - Initialize npm
You need to initialize your project in order to publish the package to the npm registry

To initialize your project, run the following command
```bash
$ npm init
```
It will look like this
```json
{
  "name": "PROJECT_NAME",
  "version": "1.0.0",
  "description": "PROJECT_DESCRIPTION",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "AUTHOR_NAME",
  "license": "ISC"
}
```

### Let's code
- Go to your root repository and create `index.js`
- Now write the following code in your `index.js`

```js
function greet(string){
    return "Hello, " + string;
}

module.exports = greet;
```
- tada, now you have completed the core part of the project 🎉

### Publishing the package to the npm registry
- Make sure to check all your code before publishing
- Now head up to `terminal` again 👨🏻‍💻
```bash
$ npm publish --access public
```
Here `--access public` is a scope that tells npm to publish your package to the npm registry publicly.

### 🎉
You made it, you can check out your published package from ↓
![Check out your package at npm registry](https://cdn.hashnode.com/res/hashnode/image/upload/v1640318850293/xlDDZPsSO.png)

* * *
Make sure to check out: https://snowbit.bio.link/

Make sure to check out my YouTube Channel: https://www.youtube.com/channel/UCNTKqF1vhFYX_v0ERnUa1RQ
Digital Revolution Awards - 2021 Finalists
Tags: aws, cloud, award, community
Published: 2021-12-24 04:05:19

Wow!! It's pretty amazing to be the finalists under two prestigious award categories by #DigitalRevolutionAwards while celebrating the excellence in #cloud

Proud to come this for standing strong along Nicole Aebi-Moyo, Anurag Kale for the **Tech Star of the Year** award where individuals' outstanding contributions to the cloud industry are recognized.

AWS Community is always close to my heart and honored to stand tall as finalists along with fellow #AWShero, Robert Koch, and Carlos Cortez for the **Outstanding Contribution to the AWS Ecosystem** award in recognition of the exceptional contributions to the #AWS cloud space.

As always proud to be AWS Users Group Bengaluru and AWS User Group India represent!

Here you go with the [Digital Revolution Awards - 2022 Finalists] (https://digitalrevolutionawards.com/2022-shortlist/)

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

Let's continue to learn and share to grow along with the community!

**Announcements:**

Outstanding Contribution to the AWS Ecosystem award - [LinkedIn](https://www.linkedin.com/feed/update/urn:li:activity:68798173 47385839616/)

Tech Star of the Year award - [LinkedIn](https://www.linkedin.com/feed/update/urn:li:activity:6879019678652481536)
Por onde começar, para ser um dev?
Published: 2021-12-24 03:20:54

Esses dias comecei a fazer uma **mentoria** para ajudar devs.

Em alguns casos tive _iniciantes_, ai veio automático a recomendação de começar por lógica de programação...

Ai eu pensei talvez seja chato começar por lógica porque a pessoa não ia ter esse **feeling** de estar **"programando"** e então o que recomendar ? `A PODEROSA TRIADE HTML, CSS E JAVASCRIPT ??`

Mas ai estaria introduzindo lógica no JS ... Então recomendei a duplinha `HTML` e `CSS`. Eles estariam vendo algo acontecer e que é algo usado no _mundo real_.

Hoje estamos em um momento onde todos estão **ansiosos**, **apressados** e **sem tempo**, todos querendo ter um retorno **rápido** e  olhando para o nosso cenário, onde temos pessoas que viram dev sem faculdade, inúmeras vagas, startups surgindo a rodo, vendas e compras de empresas.

Começamos a ter pessoas migrando de área para se tornar desenvolvedoras, é um fato que é um excelente investimento estudar tecnologia devido a N fatores, dentre eles o mais **visado** na minha opinião os **salários**.

Acredito que quanto mais estudantes mais coisas boas teremos, mais inovação, `frameworks javascript` (piadaa), novos materiais para estudo serão criados. Tudo de bom vem com isso, eu estou aqui ajudando DEVS a entrar nesse mundo maravilhoso, cheio de gambiarras que é a tecnologia <3 .

Ahh precisando desssa mentoria ? Cola aqui bb [Nosso Discord](https://discord.gg/Mm6hpKXeMx)
Laravel 8 CRUD Operation Example
Tags: laravel, php, crud, laravel8
Published: 2021-12-24 02:57:02

In this example we will see how to create crud operation step by step and this laravel 8 crud application tutorial for beginners.

Laravel 8 already offically released and laravel 9 is upcoming but today I will show you how to create CRUD operation in laravel 7 and laravel 8. 

I have already perform many crud operation in my previous aticle like crud operation in AJAX crud operation in laravel 6, crud opeation in laravel 7 etc.

In laravel 8 CRUD operation in we will perform laravel install, database configuration, creating model, migration and basic insert, update delete functionalities.

So, let's see how to create CRUD operation in laravel 8.

```
Step 1 : Install laravel 8

Step 2 : Database Configuration in laravel

Step 3 : Create Migration and model in laravel

Step 4 : Add Resource Route in laravel

Step 5 : Add Controller and Model in laravel

Step 6 : Add Blade Files in laravel
```

---

> **_[Read More : Laravel 8 CRUD Operation Example](https://techsolutionstuff.com/post/laravel-8-crud-operation-example)_**
How can you create a Scroll To Top button with just HTML?.
Tags: webdev, html, css, tutorial
Published: 2021-12-24 02:49:05

---
title: How can you create a Scroll To Top button with just HTML?.
description: Create fully accessible scroll-to-top button with just HTML. Plus smooth scrolling and floating action button with CSS. no JavaScript.
published: true
cover_image: https://cdn.dribbble.com/users/989157/screenshots/4970953/media/e5606e2c4e295de4905a3377e171d4f6.gif
tags: webdev,html,css,tutorial
---

Oh, today I'm going to introduce a silly trick. This is one of the first things I learned about HTML.

So without cheating😉, Here is the solution (as a tweet 🐦).

{% tweet 1466321149533503491 %}
> Please like and retweet if you love it.

This is a basic of HTML. Instead of fighting with JavaScript. We can use HTML to do it.
```html
<a href="#">Scroll To Top</a>
```

When you clicked this link the page jumps to the top immediately. So we can add smooth scrolling to page with one line of CSS.

```css
:root { scroll-behavior: smooth; }
```

This CSS line will enable smooth scroll for all the links in whole page. It's OK, because it's useful for most situations.

You can use CSS to create a floating scroll to top button.
```css
.stt {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background: rgb(128, 128, 255) url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath fill='currentColor' d='M352 352c-8.188 0-16.38-3.125-22.62-9.375L192 205.3l-137.4 137.4c-12.5 12.5-32.75 12.5-45.25 0s-12.5-32.75 0-45.25l160-160c12.5-12.5 32.75-12.5 45.25 0l160 160c12.5 12.5 12.5 32.75 0 45.25C368.4 348.9 360.2 352 352 352z'%3E%3C/path%3E%3C/svg%3E") center no-repeat;
  box-shadow: 0 0.25rem 0.5rem 0 gray;
  opacity: 0.7;
}

.stt:hover {
  opacity: 0.8;
}

.stt:focus {
  opacity: 0.9;
}

.stt:active {
  opacity: 1;
}
```
`position` makes it floating. `right` and `bottom` places it. `border-radius` makes it round. used a background color with up arrow head SVG as background image. `opacity` is used to show state. And it's useful because user can read the content behind the button.

Update your link
```html
<a href='#' class="stt" title="scroll to top"></a>
```

`title` is used to improve accessibility. And it shows a tooltip when hovered. 

See the codepen.
{% codepen https://codepen.io/ksenginew/pen/jOGPqoz %}

Thanks for reading this article.
Follow me for more articles.
Set Variable As A Key Name In JavaScript Object
Tags: javascript, webdev, react, angular
Published: 2021-12-24 02:40:09

Hello Devs,

In this blog you are going to learn a very important and useful concept of JavaScript which you will definitely going to use or might have used in Production application, i.e: `How to make any variable name as key of an object in JS`.

I know you might be thinking when and in which scenario you will have to use the `variable name as a key name in JS`.
Let me take your next 2 mins to explain the scenario.
Let say you have a function and that function is used to add some keys to an object.
The key name which you are going to add in that object is dynamic depending on the button click or something like this, and in the Handler function you are passing the argument which will be used as the new key name.
So how you will make that argument name as a key of an object ?

---

### **Solution:**

#### STEP 1:

Make an object

```javascript
let obj = {};
```

#### STEP 2:

```js
let key = "someKey";
```

#### STEP 3:

then use `[]` to set it.

```js
obj[key] = someValue; // this is same as obj.someKey=someValue
```

**but the best way and the recommended way is using spread operator `(...)`**

```js
obj = { ...obj, [key]: somaValue };
```

NOTE: if you having any doubt regarding why we are using [] for setting the keys, please have a look at [DOT & BRACKET Notation in Javascript](https://www.capscode.in/blog/dot-and-bracket-notation-in-javascript)

### **Examples:**

lets assume that we have 3 buttons, and there is a `OnClickHandler function`.
On click of buttons we are calling this handler function and passing some `key` and `value` as a argument to this handler function and then we have to set this `key` and `value` in an object.

```html
<button onclick=OnClickHandler("button1", 10)>Click 1</button>
<button onclick=OnClickHandler("button2", 20)>Click 2</button>
<button onclick=OnClickHandler("button3", 30)>Click 3</button>
```

```js
let obj = {};
function OnClickHandler(key, value) {
  obj = { ...obj, [key]: value };
}

console.log(obj); // {button1:10, button2:20, button3:30}
```

#### Other scenarios where this concept is required:

1. while updating `session storage` value.
2. while updating `state` value in reactjs
3. while switching between light and dark mode in any website

Thank you for reading this far. This is a brief introduction on **How to use variable as a key name in JavaScript**.

Hope its a nice and informative read for you.
If you find this article useful, like and share this article. Someone could find it useful too.

If you find anything technically inaccurate please feel free to reach out to us.

VISIT https://www.capscode.in/blog TO LEARN MORE.

See you in my next Blog article, Take care!!

### IF MY ARTICLE HELPED YOU

<a href="https://www.buymeacoffee.com/capscode" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/default-orange.png" alt="Buy Me A Coffee" height="41" width="174"></a>

Thanks,

CapsCode
1936. Add Minimum Number of Rungs [Leetcode][C++]
Tags: cpp, algorithms, leetcode, programming
Published: 2021-12-24 02:01:00

**_All suggestions are welcome. Please upvote if you like it. Thank you._**

---

[Leetcode Problem Link: 1936. Add Minimum Number of Rungs](https://leetcode.com/problems/add-minimum-number-of-rungs/)

---
**_Input_** 
rungs = [6,12,13,14,15], dist = 2
**_Output_** = 4

**_Ladder_**
**_---15_**
**_---14_**
**_---13_**
**_---12_**
---11
---10
---9
---8
---7
**_---6_**
---5
---4
---3
---2
---1
**_---0_**

**_Efficient Solution:
Concept of count1=(rungs[i]-rungs[i-1]-1)/dist vs count2=(rungs[i]-rungs[i-1])/dist_**
For example : If i=2, count1=(12-6)/2=3 & count2=(12-6-1)/2=2. From ladder diagram, if we add rungs at 8 & 10, it will enable us to climb from 6 to 12 in steps of 8-6=2=dist, 10-8=2=dist, 12-10=2=dist by adding minimum number of rungs. Hence, count2 is the correct equation.

```javascript
class Solution {
public:
    int addRungs(vector<int>& rungs, int dist) {
	    // Efficient Solution Time O(N) & Auxiliary Space O(1)
        int len=rungs.size();
        int count=(rungs[0]-1)/dist; 
        if(len==1)
            return count;
        for(int i=1;i<len;i++){
            count+=(rungs[i]-rungs[i-1]-1)/dist;
        }
      return count;
    }
};
```
**_All suggestions are welcome. Please upvote if you like it. Thank you._**
1480. Running Sum of 1d Array [Leetcode][C++]
Tags: cpp, algorithms, leetcode, programming
Published: 2021-12-24 01:56:38

**_All suggestions are welcome. Please upvote if you like it. Thank you._**

---

[Leetcode Problem Link: 1480. Running Sum of 1d Array](https://leetcode.com/problems/running-sum-of-1d-array/)

---

**_Brute Force Solution:_**

```javascript
class Solution {
public:
    vector<int> runningSum(vector<int>& nums) {
    // Brute Force Solution Time O(N^2) & Auxiliary Space O(1)
    vector<int> result;
    int len=nums.size(),sum=0;
    for(int i=0;i<len;i++){
          sum=0;
        for(int j=0;j<=i;j++){
              sum+=nums[j];
        }
        result.push_back(sum);
    }
        return result;
    }
};
```

**_Efficient Solution:_**

```javascript
class Solution {
public:
    vector<int> runningSum(vector<int>& nums) {
    // Optimal Solution Time O(N) & Auxiliary Space O(1)
    int len=nums.size();
    for(int i=1;i<len;i++){
        nums[i]+=nums[i-1];
    }
        return nums;  
    }
};

```
**_All suggestions are welcome. Please upvote if you like it. Thank you._**