teleren/devto huggingface dataset:
Growth, Resilience & the Power of Creative Possibility
Tags: productivity, devops, career, news
Published: 2022-06-06 19:08:30

“Just like scaling the mountains to get to the top, in life we must push ourselves to keep going and turn the challenge,”  Cindy-Anne. Read on [here](https://community.lohika.com/home/blogs/growth-resilience-and-the-power-of-creative-possibility-2022-04-28)
Should There Be A Healthy Tension Between Product and Engineering Teams?
Tags: webdev, agile, performance, management
Published: 2022-06-06 19:03:47

Came across this read today.  Sharing for whoever needs to read this. https://community.lohika.com/home/blogs/should-there-be-a-healthy-tension-between-product-and-engineering-teams-2022-01-27
Keyboard Row
Tags: leetcode, dsa, theabbie
Published: 2022-06-06 19:00:46

Given an array of strings `words`, return _the words that can be typed using letters of the alphabet on only one row of American keyboard like the image below_.

In the **American keyboard**:

*   the first row consists of the characters `"qwertyuiop"`,
*   the second row consists of the characters `"asdfghjkl"`, and
*   the third row consists of the characters `"zxcvbnm"`.

![](https://assets.leetcode.com/uploads/2018/10/12/keyboard.png)

**Example 1:**

**Input:** words = \["Hello","Alaska","Dad","Peace"\]
**Output:** \["Alaska","Dad"\]

**Example 2:**

**Input:** words = \["omk"\]
**Output:** \[\]

**Example 3:**

**Input:** words = \["adsdf","sfd"\]
**Output:** \["adsdf","sfd"\]

**Constraints:**

*   `1 <= words.length <= 20`
*   `1 <= words[i].length <= 100`
*   `words[i]` consists of English letters (both lowercase and uppercase). 

**SOLUTION:**

    from collections import Counter
    
    class Solution:
        def findWords(self, words: List[str]) -> List[str]:
            rows = [Counter("qwertyuiop"), Counter("asdfghjkl"), Counter("zxcvbnm")]
            op = []
            for word in words:
                isValid = False
                for ctr in rows:
                    valid = len([c for c in word if ctr[c.lower()] == 0]) == 0
                    if valid:
                        isValid = True
                        break
                if isValid:
                    op.append(word)
            return op
Paracetamol.js💊| #134: Explica este código JavaScript
Tags: javascript, spanish, webdev, programming
Published: 2022-06-06 18:51:46

## **<center>Explica el siguiente código JavaScript</center>**
#### <center>**Dificultad:** <mark>Básico</mark></center>

```js
const numberXTwo = (arr) => {
  return arr.map(() => {})
}

console.log(numberXTwo([1,2,3]));
```

A. `[ undefined, undefined, undefined ]`
B. `[ null, null, null]`
C. `[ NaN, NaN, NaN]`
D. `[ false, false, false ]`

Respuesta en el primer comentario.

---
Ng-News: Episode 22/22
Tags: angular, javascript, webdev, frontend
Published: 2022-06-06 18:51:01

This is a weekly posting, covering the latest updates from the Angular community.

{% embed https://youtu.be/RxvPL68HolI %}

## Angular 14 - Standalone Components & APIs

Angular 14 is out. It is a big release, comparable even to version 9. But where Angular 9 was more like an enabler without new features, we have them now.

The most anticipated feature is the Standalone Components along necessary new functions for bootstrapping and routing, also known as Standalone APIs. It will remove the need for NgModules, but it is backward-compatible. So you can mix both approaches, which allows a smooth migration and not just a big bang.

Standalone Components are a developer preview. This means that by default, the Angular CLI still generates components in the old way. To enable them, you don't have to anything special. You can manually add the standalone property to your TypeScript class or add the standalone flag when you run ng generate.

## Angular 14 - Typed Forms

The other main feature is typed forms. This is not a developer preview, but you will see that the migration script will not apply them. What happens instead, is that all your FormGroup or FormControl elements are transformed to an untyped version, and you can make them type-safe by using the old types again. Type safety is achieved via type inference. So in most cases the types are recognized automatically.

All the FormControls are a union type of undefined, null, or the actual type. This is because when a FormControl is reset, it turns to null by default, and if you disable it, its value is undefined.

## Angular 14 - Miscellaneous

Other than that, we have a lot of other new features. Like the title property in the Router configuration, the inject function or new components for the CDK.

{% embed https://twitter.com/angular/status/1532787702785089536 %}

## Cypress 10

Last but not least, we have had another big release this week, and that Cypress version. It comes with a beta version for component testing. Unfortunately it is still missing support Angular.

[Cypress Release Notes](https://www.cypress.io/blog/2022/06/01/cypress-10-release/)
What was your win LAST week?
Tags: discuss, weeklyretro
Published: 2022-06-06 18:36:22

---
title: What was your win LAST week?
published: true
description: Got to all your meetings on time? Started a new project? Fixed a tricky bug?
tags: discuss, weeklyretro
cover_image: https://cl.ly/188e843c2985/download/Image%202019-02-15%20at%202.36.37%20PM.png
---

Heyo!

Sorry for leaving out the weekly wins thread last week! 😅

But hey, it's never too late to celebrate your wins. Let's talk about what you're proud of from LAST week.

All wins count — big or small 🎉

Examples of 'wins' include:

- Starting a new project
- Fixing a tricky bug
- Having a fun weekend with buds... or whatever else might spark joy ❤️ 

---

I'm looking forward to reading what you accomplished **last** week 🎉 

![Trent from Daria saying "I'm always late. That's why I don't wear a watch. They depress me."](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nlpjtcwd6wyouij0246v.gif)
laravel visitor details catch
Published: 2022-06-06 18:31:29

Suppose you want to save visitor details who visit your website...
You have to do something for this 
**Step No-1:**
go to code editor terminal and type
**_php artisan make:Migration (your table name)_**
Then go to migration file which you make just now
then code something in up function 
Here is some example

> Schema::create("your table name", function (Blueprint $table){
> 		        //$table->your data type here("column name");
> 			$table->bigIncrements("id");
> 			$table->string("ip_address");
> 			$table->string("visit_time");
> 			$table->string("visit_date");
> }
go to code editor terminal again and type 
**_php artisan migrate_**

**step 1 done**

**step No-2**
create model
**_php artisan make:Model (your model name)_**

**

> class VisitorModel extends Model
> {
>     public $table='Visitor';
>     public $primaryKey='id';
>     protected $fillable = ['ip_address', 'visit_time'];
>     public $incrementing=true;
>     public $keyType='int';
>     public  $timestamps=false;
> };
**

**step 2 done**

**step No-3**

create controller
**_php artisan make:Controller (your Controller name)_**
after make controller,
in this controller **import visitormodel** for inserting data in database . Like
**use App\Models\VisitorModel;**

and then
**

> class VisitorController extends Controller
> {
>     function getVisitorDetails(){
>        $ip_address = $_SERVER['REMOTE_ADDR'];
>        date_default_timezone_set("Asia/Dhaka");
>        $visit_time = date("h:i:sa");
>        $visit_date= date("d-m-Y");
>        
>       $result = VisitorMode::insert([
>             "ip_address"=> $ip_address,
>             "visit_time"=> $visit_time,
>              "visit_date"=> $visit_date,
>      ]);
>             
>             return $result;
>    }
> }
**

**step 3 done**

**step No-4**
this data use only for client site. that's why we go to the route>api.php and than
create new route
**_Route::get("/getvisitordetails", {VisitorController::class, 'getVisitorDetails'});_**
and also you should import the visitorcontroller class path in top of the api.php.

for this use **App\Http\Controllers\VisitorController;**

**step 4 done**

**step No-5**
test the route
go to postman and test this route.

step 5 is done......

**Step No_6:**
If you want to use this api in your website. Just go to the your interface code and create src>api>apiURL.js
and then, create a class like this...

> class url{
>       static baseURL = "your base url",
>       static visitorData = this.baseURL + "your visitor route"
> }
> export default url;

Now, go to your Homepage and write a function like

> GetVisitorDetails=()=>{
>       axios.get(url.visitorData).then().catch();
> }

and now call this function anywhere from the homepage.

that's it. 


thank you

if you find any error please comment below in this post, I will try my best to fix it
Construct Binary Search Tree from Preorder Traversal
Tags: leetcode, dsa, theabbie
Published: 2022-06-06 18:30:39

Given an array of integers preorder, which represents the **preorder traversal** of a BST (i.e., **binary search tree**), construct the tree and return _its root_.

It is **guaranteed** that there is always possible to find a binary search tree with the given requirements for the given test cases.

A **binary search tree** is a binary tree where for every node, any descendant of `Node.left` has a value **strictly less than** `Node.val`, and any descendant of `Node.right` has a value **strictly greater than** `Node.val`.

A **preorder traversal** of a binary tree displays the value of the node first, then traverses `Node.left`, then traverses `Node.right`.

**Example 1:**

![](https://assets.leetcode.com/uploads/2019/03/06/1266.png)

**Input:** preorder = \[8,5,1,7,10,12\]
**Output:** \[8,5,10,1,7,null,12\]

**Example 2:**

**Input:** preorder = \[1,3\]
**Output:** \[1,null,3\]

**Constraints:**

*   `1 <= preorder.length <= 100`
*   `1 <= preorder[i] <= 1000`
*   All the values of `preorder` are **unique**.

**SOLUTION:**

    # Definition for a binary tree node.
    # class TreeNode:
    #     def __init__(self, val=0, left=None, right=None):
    #         self.val = val
    #         self.left = left
    #         self.right = right
    class Solution:
        def getRoot(self, p, q):
            return min((i for i in range(p, q)), key = lambda x: self.valIndex[self.inorder[x]])
        
        def buildTreeRec(self, p, q):
            if p < q:
                root = TreeNode()
                currRoot = self.getRoot(p, q)
                root.val = self.inorder[currRoot]
                if currRoot > p:
                    root.left = TreeNode()
                    root.left = self.buildTreeRec(p, currRoot)
                if currRoot < q - 1:
                    root.right = TreeNode()
                    root.right = self.buildTreeRec(currRoot + 1, q)
                return root
        
        def bstFromPreorder(self, preorder: List[int]) -> Optional[TreeNode]:
            n = len(preorder)
            self.inorder = sorted(preorder)
            self.valIndex = {}
            for i, item in enumerate(preorder):
                self.valIndex[item] = i
            return self.buildTreeRec(0, n)
Truncate... with this JS function...
Published: 2022-06-06 18:22:17

```javascript
const str= 'I am a very long string thats needs discipline!' 
function truncate(str, n) {
     return str?.length > n ? str.substr(0, n - 1) + '...' : str;
  } 

truncate(str,24);
```
//'I am a very long string...'

## The Gist 

- Pass the string onto the truncate function with the number indicating the the index of the string you want the ellipse(...) truncation to occur. 


- This versatile function does not only have to be 3 dots you can create 5 dots or any string character for that matter 


:heart::heart::heart:

## Social 
[Twitter](https://twitter.com/GregoriosPetro1)
[Linkedin](https://www.linkedin.com/in/greg-petropoulos/)
[Portfolio](https://gregpetropoulos.dev/)
[Github](https://github.com/GregPetropoulos)

:metal:
## Happy Coding
Top 10 most used libraries and a surprising find
Published: 2022-06-06 18:12:48

This is another analysis from scrapping the tech stacks of companies listed at https://himalayas.app/companies
For the libraries I scraped around 1000 companies. 

These are the top 10:

1. React,646
2. jQuery,179
3. Underscore,154
4. Lodash,153
5. Moment.js,142
6. Modernizr,124
7. Redux,115
8. Vue.js,111
9. AngularJS,96
10. Emotion,60

What surprised me is that jQuery is number 2 in the list. I knew React is way more popular than Vue.js, but I would have expected Vue.js to be higher up on the list. Underscore and Lodash are utility libraries that are not anymore really needed as most functionality is now available in JavaScript. I'm a bit disappointed that Svelte only made it on place 39, as it looks quite promising, but that's probably because it's quite new. 

You can find the full list here: https://github.com/artisanphil/techstacks/blob/main/libraries.csv
Day 1 : Objects in javascript
Tags: javascript, webdev, tutorial, 100daysofproductivity
Published: 2022-06-06 18:05:18

## What is object ?
>An object is a collection of properties, and a property is an association between a name (or key) and a value.
```
const myCar = {
  make: 'Ford',
  model: 'Mustang',
  year: 1969
};
```
## Different ways to create object in javascript
```
// 1
const obj = new Object();

// 2
const obj = Object.create(null);

// 3 => Most common way
const series = {
     name: "Game of thrones",
     season: 8,
     case: getCast() // can use function as well
};

// 4 => function constructor 
function cast(name) {
  this.name = name;
  this.id = 2;
  this.item = [1,2,3,4
}
var object = new Person("Jon snow");

And Many more..
```
## Tricks and tips
- To check in object if particular key is exist or not

> `obj.hasOwnProperty(key)` // returns true if key exists otherwise false.

- To get all properties from an object

```
const cast = {
  name: 'jon snow',
  age: 22,
  active: false
};

console.log(Object.keys(cast));
// expected output: Array ["name", "age", "active"]
```

## Best practices 

```
Object creation 
// bad
const item = new Object();

// good
const item = {};

function getKey(k) {
  return `a key named ${k}`;
}

Use computed property names when creating objects with dynamic property names.
// bad
const obj = {
  id: 5,
  name: 'San Francisco',
};
obj[getKey('enabled')] = true;

// good
const obj = {
  id: 5,
  name: 'San Francisco',
  [getKey('enabled')]: true,
};


Use object method & property shorthand.
// bad
const atom = {
  value: 1,

  addValue: function (value) {
    return atom.value + value;
  },
  name: name
};

// good
const atom = {
  value: 1,

  addValue(value) {
    return atom.value + value;
  },
  name
};

Only quote properties that are invalid identifiers. 
// bad
const bad = {
  'foo': 3,
  'bar': 4,
  'data-blah': 5,
};

// good
const good = {
  foo: 3,
  bar: 4,
  'data-blah': 5,
};

Do not call Object.prototype methods directly, such as hasOwnProperty, propertyIsEnumerable, and isPrototypeOf. 

Why? These methods may be shadowed by properties on the object in question - consider { hasOwnProperty: false } - or, the object may be a null object (Object.create(null)).

// bad
console.log(object.hasOwnProperty(key));

// good
console.log(Object.prototype.hasOwnProperty.call(object, key));

// best
const has = Object.prototype.hasOwnProperty; // cache the lookup once, in module scope.
console.log(has.call(object, key));

/* or */
import has from 'has'; // https://www.npmjs.com/package/has
console.log(has(object, key));


```

Thanks for reading..

Resource & credits
- https://github.com/airbnb/javascript#objects
- https://github.com/sudheerj/javascript-interview-questions#what-are-the-possible-ways-to-create-objects-in-javascript
- https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects
Push Dominoes
Tags: leetcode, dsa, theabbie
Published: 2022-06-06 18:00:48

There are `n` dominoes in a line, and we place each domino vertically upright. In the beginning, we simultaneously push some of the dominoes either to the left or to the right.

After each second, each domino that is falling to the left pushes the adjacent domino on the left. Similarly, the dominoes falling to the right push their adjacent dominoes standing on the right.

When a vertical domino has dominoes falling on it from both sides, it stays still due to the balance of the forces.

For the purposes of this question, we will consider that a falling domino expends no additional force to a falling or already fallen domino.

You are given a string `dominoes` representing the initial state where:

*   `dominoes[i] = 'L'`, if the `ith` domino has been pushed to the left,
*   `dominoes[i] = 'R'`, if the `ith` domino has been pushed to the right, and
*   `dominoes[i] = '.'`, if the `ith` domino has not been pushed.

Return _a string representing the final state_.

**Example 1:**

**Input:** dominoes = "RR.L"
**Output:** "RR.L"
**Explanation:** The first domino expends no additional force on the second domino.

**Example 2:**

![](https://s3-lc-upload.s3.amazonaws.com/uploads/2018/05/18/domino.png)

**Input:** dominoes = ".L.R...LR..L.."
**Output:** "LL.RR.LLRRLL.."

**Constraints:**

*   `n == dominoes.length`
*   `1 <= n <= 105`
*   `dominoes[i]` is either `'L'`, `'R'`, or `'.'`.

**SOLUTION:**

    class Solution:
        def pushDominoes(self, dominoes: str) -> str:
            n = len(dominoes)
            encoded = []
            i = 0
            while i < n:
                ctr = 1
                while i < n - 1 and dominoes[i] == dominoes[i + 1]:
                    i += 1
                    ctr += 1
                i += 1
                encoded.append([dominoes[i - 1], ctr])
            k = len(encoded)
            for i in range(k):
                c, ctr = encoded[i]
                left = encoded[i - 1][0] if i > 0 else "L"
                right = encoded[i + 1][0] if i < k - 1 else "R"
                if c == ".":
                    if left == right:
                        encoded[i][0] = left
                    if left == "R" and right == "L":
                        l = r = ctr >> 1
                        mid = ctr & 1
                        encoded[i][0] = "R" * l + "." * mid + "L" * r
                        encoded[i][1] = 1
            return "".join(c * ctr for c, ctr in encoded)
Day-102 Training At Ryaz
Tags: webdev, javascript, beginners, programming
Published: 2022-06-06 17:50:29

Date:6/06/2022
Day:Monday

Today, I started at about 10:30 am as I was in progress to complete the bidding project so, I started with about left over task so, firstly I started with enhancing the project and did some changes in the css and after this I perform various testing on it to check as if it works fine in each and every situation so, after this I started with adding some new feature and stated that it would become more efficient soothes way my day ended up and I got to learn many new things.
Find Center of Star Graph
Tags: leetcode, dsa, theabbie
Published: 2022-06-06 17:30:42

There is an undirected **star** graph consisting of `n` nodes labeled from `1` to `n`. A star graph is a graph where there is one **center** node and **exactly** `n - 1` edges that connect the center node with every other node.

You are given a 2D integer array `edges` where each `edges[i] = [ui, vi]` indicates that there is an edge between the nodes `ui` and `vi`. Return the center of the given star graph.

**Example 1:**

![](https://assets.leetcode.com/uploads/2021/02/24/star_graph.png)

**Input:** edges = \[\[1,2\],\[2,3\],\[4,2\]\]
**Output:** 2
**Explanation:** As shown in the figure above, node 2 is connected to every other node, so 2 is the center.

**Example 2:**

**Input:** edges = \[\[1,2\],\[5,1\],\[1,3\],\[1,4\]\]
**Output:** 1

**Constraints:**

*   `3 <= n <= 105`
*   `edges.length == n - 1`
*   `edges[i].length == 2`
*   `1 <= ui, vi <= n`
*   `ui != vi`
*   The given `edges` represent a valid star graph.

**SOLUTION:**

    class Solution:
        def findCenter(self, edges: List[List[int]]) -> int:
            graph = {}
            for a, b in edges:
                if a in graph:
                    graph[a][0] += 1
                    graph[a][1] += 1
                else:
                    graph[a] = [1, 1]
                if b in graph:
                    graph[b][1] += 1
                    graph[a][0] += 1
                else:
                    graph[b] = [1, 1]
            k = len(graph) - 1
            for node in graph:
                if graph[node][1] == k:
                    return node
YouTube subscribe button animation
Tags: css, javascript, webdev, programming
Published: 2022-06-06 17:28:30

📃Source Code:- [Codepen](https://codepen.io/deepakydv9315/pen/oNEMKLe) || [GitHub](https://github.com/deepakydv9315/youtube-subs-btn)
📽️YouTube link:- [Click Here](https://www.youtube.com/channel/UCoBv49GWlBRjDSRa3Aa_X4w?sub_confirmation=1)
🤝Instagram [profile](https://www.instagram.com/syco_coders/)


Here is a simple project using JavaScript, CSS, and HTML. In this project we are using CSS animation, CSS flexbox, and **JavaScript DOM concepts**.

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

## Button after click
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fd548u1dsxpb3i1s0dnf.png)
 
 
 ## Codepen Source Code
{% codepen https://codepen.io/deepakydv9315/pen/oNEMKLe %}

Hope you will enjoy learning this 😊😇.
Follow for more :)
Happy Coding ;)
How can I Make Web Developer's Life Easier?
Published: 2022-06-06 17:15:09

Hello devs, 
I hope you guys doing well. I want to work on a project where developer life will be easy by speed up the work. Let me give you few examples 

1. Themes/Templates- I hired a team and creating some MERN Stack solutions. So, This might be helpful for the developers to develop their similar/same type of project faster. 

2. Design and Static Code- I also started project creating Tailwind CSS, React, Vue, Angular UI library. Plan is to do lot of creative, clean design by professional designer and Developer will convert them to production ready code. 
So, Other dveloper can access to resoucres to speed up their work/projects.

3. Skill development resources- The more skill development you do, the easier your life will be. So, sharing some good resouces might be helpful for other developes 

4. Tools- may be we can create some nice tools that will do some automated work like automated backend generation, automated headless site generation etc.

Let me know your thought and ideas. You might have wonderful, efficient, better idea to make developer life easier.

Best wishes 
Zelal
Unique Binary Search Trees
Tags: leetcode, dsa, theabbie
Published: 2022-06-06 17:00:47

Given an integer `n`, return _the number of structurally unique **BST'**s (binary search trees) which has exactly_ `n` _nodes of unique values from_ `1` _to_ `n`.

**Example 1:**

![](https://assets.leetcode.com/uploads/2021/01/18/uniquebstn3.jpg)

**Input:** n = 3
**Output:** 5

**Example 2:**

**Input:** n = 1
**Output:** 1

**Constraints:**

*   `1 <= n <= 19`

**SOLUTION:**

    class Solution:
        def getTrees(self, beg, end):
            if beg > end:
                return 1
            if (beg, end) in self.cache:
                return self.cache[(beg, end)]
            ways = 0
            for i in range(beg, end + 1):
                ways += self.getTrees(beg, i - 1) * self.getTrees(i + 1, end)
            self.cache[(beg, end)] = ways
            return ways
        
        def numTrees(self, n: int) -> int:
            self.cache = {}
            return self.getTrees(1, n)