teleren/devto huggingface dataset:
Quotes In Software Craftsmanship
Tags: softwareengineering, softwaredelivery, craftsmanship, productdevelopment
Published: 2022-04-29 19:30:00

These are some quotes in the heart of software craftsmanship:

> "We need teams of missionaries, not teams of mercenaries" 
~ by John Doerr mentioned in 'svpg' ~ Marty Cagan

---
> "I don't want productive teams, I don't want productive engineers, what I want is people who are really really good at understanding the heart of the problem and just solving for that" 
~ Dan North

---
> "The goal is to deliver the maximum customer value in the shortest sustainable lead-time while providing the highest possible quality to customers and society as a whole." 
~ Lean Agile Mindset

---
> “Clean code is not written by following a set of rules. You don’t become a software craftsman by learning a list of heuristics. Professionalism and craftsmanship come from values that drive disciplines.” 
~ Uncle Bob

---
> "Quality is the key to speed. You go fastest when you go well" 
~ Uncle Bob

---
> "It is a fuzzy embedded understanding that really matters, it is a social thing. The design decisions that you wish you could get right early as they are hard to change" 
~ Martin fowler talking about Software Architecture

---
> "First, solve the problem. Then, write the code"
~ John Johnson 

---
> "Optimizing for the completion of high-importance work, rather than optimizing for keeping people busy" 
~ Agility

---
> "An evolutionary architecture supports guided, incremental change across multiple dimensions"
~ Neal Ford

---
> "The three main challenges we should focus on are: fighting the Agile Industrial Complex and its habit of imposing process upon teams, raising the importance of technical excellence, and organizing our teams around products (rather than projects)" 
~ Martin Fowler

---
> "Science is what we understand well enough to explain to a computer; art is everything else" 
~ Donald Knuth


![Craftsmanship Manifesto](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/52dy1kc5p4n0tkybao9z.png)
https://manifesto.softwarecraftsmanship.org/
Scrum Team Size
Published: 2022-04-29 19:23:17

I work within a Scrum Team on and off. Once I started my career 3 years ago I worked within a team where they just went from waterfall to scrum and we had to figure it all out by our self. After I experienced a team I joined which was already full on steam and I couldn't fit well. Now I'm in a team where we do something in between both worlds and we are starting to do more waterfall again.

### Team size
Scrum or not, I think there are some good reasons to practice Scrum. It's like a framework (like Symfony or Laravel is), but for your workflow. Like playing a soccer match which describes the rules. You still have the freedom of how your setup will be and what strategy the team execute.

But as we all know, adding more and more people on the field won't do better. If you place 100 people on the field instead of 11 for soccer, it will get chaotic, messy and complex to score. This is the exact same with your Scrum Team.

Recently I got my Professional Scrum Master level I & II and I wondered what is the best team size according to Scrum.

### According to Scrum
The Scrum Team consists of a Scrum Master, Product Owner and Developers. Developers are the people in the Scrum Team that are committed to creating any aspect of a usable Increment each Sprint. This could be software developers, but also designers, testers, marketeers etc. As long as they are committed to creating anything of usable Increment!

The Scrum Team is small enough to remain nimble and large enough to complete significant work within a Sprint. Typically 10 or less. Smaller teams communicate better and are more productive. If Scrum Teams become too large, they should consider reorganizing into multiple cohesive Scrum Teams, each focused on the same product. They share the same Product Goal, Product Backlog and Product Owner.

### Communication overkill

The communications channels formula is N * (N-1) / 2. It is a way to numerically show the importance of proper communications management on a project.

The communications channel formula is a way to express this "challenge" numerically.

Let’s say you are in a team of 10 people. That would be 10 * (10-1) / 2 = 45.

If you add 2 more people, that would be 12 * (12-1) / 2 = 66.

That’s 150% of 10 people and you are only adding 2 people. Just to say how quick it adds up.

You can imagine how this effects the teams communication and productivity. This is why more then 10 people isn’t doing you much better for the team.

What’s your experience in Scrum Team Size? Let me know
Change color of SVGs Images with CSS Filter
Published: 2022-04-29 19:22:00

The CSS filter property provides graphical effects such as blurring or color change in the rendering before the element is displayed. Filters are commonly used to adjust the rendering of images, backgrounds or borders.

You can change the color of SVG images with Filter property.

Examples:

 
`.red {
filter: invert(67%) sepia(89%) saturate(7492%) hue-rotate(346deg) brightness(84%) contrast(146%);
}`


`.green {
filter: invert(62%) sepia(65%) saturate(3453%) hue-rotate(81deg) brightness(111%) contrast(132%);
}`

`.blue {
filter: invert(9%) sepia(100%) saturate(5655%) hue-rotate(245deg) brightness(101%) contrast(149%);
}`




Result:

`<img class="red" src="https://freeforcommercialuse.net/unicorn-silhouette-birthday-fantasy-animal.svg">`
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0i835rvx2ptrkr4lj023.jpg)
 
`<img class="green" src="https://freeforcommercialuse.net/unicorn-silhouette-birthday-fantasy-animal.svg">`

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bsshokaugnjhgf94qv9r.jpg)
 
`<img class="blue" src="https://freeforcommercialuse.net/unicorn-silhouette-birthday-fantasy-animal.svg">`

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

For convert HEXA Color to Filter Property you can use this generator:https://codepen.io/sosuke/pen/Pjoqqp


SVG Source: [FFCU DesignBundles SVGs](https://freeforcommercialuse.net/designbundles)
Check if an Object Contains all Keys in Array in Javascript
Tags: javascript, typescript, webdev, tutorial
Published: 2022-04-29 19:21:53

Sometimes in Javascript we have an object which we need to conform to a specific set of keys. This is possible through type enforcement in [TypeScript](https://fjolt.com/category/typescript), but if we want to do certain things if the keys don't exist, then we have to take a different approach.

For example, suppose we are receiving the following object from an array, where `firstName`, `lastName`, and `age` are all needed for an operation we want to complete. For example

```javascript
let obj = {
    firstName: Jack,
    lastName: Doe,
    age: 123
}

console.log(`${obj.firstName} ${obj.lastName} is ${obj.age}`);
```

If we are receiving our data in `obj` from an array, we could trust that those properties will be provided, but if the API ever changes we may face issues. The developers of the API may decide to remove `age` or any other property, or maybe rename `firstName` to `first_name`. In the **best** scenario, this will lead to keys becoming undefined. In the worst, it may result in an error and crash our application.

To avoid this, we can check the object has the keys we **require**. 

## How to Check if Object Contains all Keys in Array
The solution to this problem uses `every()`. `every()` is an array method which checks every element in an array, and performs a logical check on them. If all return true, then the `every()` method returns true.

To check if an object contains all keys in an array, we just use `every()` on an array of all the keys we want to check. That way we can logically check each element exists, and then do something else if it's false, preventing us from encountering any errors:
```javascript
let requiredKeys = [ 'firstName', 'lastName', 'age' ]
let obj = {
    firstName: Jack,
    lastName: Doe,
    age: 123
}

let checkAllKeys = requiredKeys.every((i) => obj.hasOwnProperty(i));

if(checkAllKeys) {
    console.log(`${obj.firstName} ${obj.lastName} is ${obj.age}`);
}
else {
    console.log('The API does not have all the keys required. Please check API and configuration')
}
```

Here we create an array of our **required keys** - `firstName`, `lastName`, and `age`. We then use `every()` to go through each item in that array. In `every()`, we run a function - here, `i` is the the current item being looped through. If `obj` has the property `i`, then `every()` will return true for that specific item.

If every item returns true, then `every` returns true overall. Otherwise it will return false. As such, if `checkAllKeys` is true, we can be sure it has all the keys we need. Otherwise, we can do something else - like console log an error.
Css Flexbox Cheat Sheet
Published: 2022-04-29 18:49:03


flexbox - used to align items perfectly.
grid - can also be used to align items.

flex container - is the element that holds flex items.
                 display:flex.
flex items - direct children of flex container
eg:
`<div class="flex-container">
    <div>Flex item 1</div>
    <div>Flex item 2</div>
    <div>Flex item 3</div>
</div>`
**Flex Container Properties:**  
flex-direction - row,column
flex-wrap -value:wrap( to adjust flex items to the next line, if all the items doesnt fit in one line, works only when the width or basis is specified.)
flex-flow
justify-content(main axis) = start,end,center,space-around,space-between
align-items(cross axis) = end,start,center(align-self:to align a single flex item[flex item proprety])
align-content

**Flex item Properties:**
order - values:1,2,3..(to change the order of items in flex container)
flex-grow - value:1,2,3..(size of flex item, when it grows)(it also take the whole width of the container)
flex-shrink - value:1,2,3..(size of flex item, when it shrinks)
flex-basis - same as width.
align-self = end,start,center(to align a single flex item specifically.)
shortcut= flex: flex-grow flex-shrink flex-basis
Passwords in Solidity
Published: 2022-04-29 17:55:19

---
title: Passwords in Solidity
published: true
description: Miserable fails, ideas and stuff
tags: 
//cover_image: https://direct_url_to_image.jpg
---

### Why is it needed?
Suppose you have locked liquidity on-contract which can be liquidated via `withdraw()` that depends on a require function and access control. If someone has access to the responsible EOA, they can withdraw funds when needed. A better way to go about this is to also have a password, so that incase of a private key leak, the hacker still has to enter a password. 

### How is it implemented? 
0. User enters password, gets hashed via Keccak256 and appended with "0x" before the hash string.
1. User sets password via constructor when deploying (`_setNewPassword()`)
2. User then can decide to check password (`_testPassword()`) and enter expected password and new password (since current password will be declared by on-chain data).

### Solidity Code
```solidity
contract onChainPassword
{
    bytes32 private globalPassword;

    constructor(bytes32 _hashedPassword) 
    {
        globalPassword = _hashedPassword;
    }

    function _checkPassword(string memory _password, bytes32 _newPassword)
        public returns (bool)
    {
        bool decision = keccak256(abi.encodePacked(_password))==globalPassword;
        _setNewPassword(_newPassword);
        return decision;
    }

    function _setNewPassword(bytes32 _newPassword) internal
    {
        globalPassword = _newPassword;
    }
}
```

### Disclaimer
Never put Friday projects on main-net without testing extensively, I'm a scatterbrain.
Execute a powershell script from inside the git bash
Tags: bash, powershell, shell, cli
Published: 2022-04-29 17:40:54

I develop on Windows. And somehow got into the habit of using both the powershell and the git bash. It's not clear cut, but generally speaking i use git bash for small tasks and moving around the file system. When writing longer scripts i tend to use powershell. 
This week i stumbled about a nice way to execute a powershell script from the bash. This helps to reduce context switches. 

You have to use the following Statement
```bash
$ powershell -File scriptToRun.ps1
```

When you use an alias it gets even more convinient

```bash
$ alias ps1='powershell -File'
$ ps1 scriptToRun.ps1
```

### Addition

Another way to run powershell scripts was suggested by a reader in the comments. 

:exclamation: First you have to make sure that the powershell.exe is on the path. 

Then add the following shebang line at the start of your script: 

```powershell
#!/usr/bin/env pwsh
"Hello world!"
```

```bash
$ ./helloWorld.ps1
Hello world!
```

Thank you again @vitalytseshkovsky!
Why CSS animation (rotate) does not work in iOS 15.4
Tags: html, css, svg, ios
Published: 2022-04-29 17:58:34

I have an SVG icon and I have applied some CSS animation (rotation) to it, using inline CSS inside the SVG file (at the end of the post you can see my code in CodePen).

My problem is that, although the animation works as expected in desktop and in my Android mobile phone, it doesn't work in some iPhones.

For example, I saw it doesn't work in iPhone 11 if it's updated to iOS 15.4 but it works if it's in version 15.3. Also I tried with an iPad which was in 15.3 and it worked, and after the update to 15.4 it stopped working.

Am I missing anything here, or it's just a bug of iOS 15.4?

I appreciate your help!

Thanks!

EDIT: I've just realized that it works as expected when I visit directly the link to where I have uploaded the SVG image. I mean, If I have uploaded the SVG image to `example.com/path-to-icon.svg` I can see it rotating as expected.

However, when I am trying to use it like an image, it does not work. I mean, If I use `<img src="example.com/path-to-icon.svg">` it does not work... 

{% codepen https://codepen.io/Giordanidis/pen/RwQbERw %}
How to do a Woocommerce Product list shortcode with custom taxonomy
Tags: woocommerce, wordpress
Published: 2022-06-10 10:10:58

---
title: How to do a Woocommerce Product list shortcode with custom taxonomy
published: true
date: 2022-04-29 17:38:41 UTC
tags: woocommerce,Wordpress
canonical_url: https://daniele.tech/2022/04/how-to-do-a-woocommerce-product-list-shortcode-with-custom-taxonomy/
---

I hate blocks, I prefer shortcode and when an official block like in this case from WooCommerce doesn’t allow you to filter by taxonomy, well it is time to create a shortcode that uses the same HTML tags, CSS classes and structure so you can do it one that works without so much problems. function [...]

[Read More...](https://daniele.tech/2022/04/how-to-do-a-woocommerce-product-list-shortcode-with-custom-taxonomy/)

The post [How to do a Woocommerce Product list shortcode with custom taxonomy](https://daniele.tech/2022/04/how-to-do-a-woocommerce-product-list-shortcode-with-custom-taxonomy/) appeared first on [Daniele Mte90 Scasciafratte](https://daniele.tech/eng).
What was your win this week?
Tags: discuss, weeklyretro
Published: 2022-04-29 17:33:43

---
title: What was your win this 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
---

Hey there! 


Looking back on this past week, what was something you were proud of accomplishing?

All wins count — big or small 🎉

Examples of 'wins' include:

- Starting a new project
- Fixing a tricky bug
- Registering for [CodeLand 2022](https://dev.to/codenewbieteam/grab-your-spot-at-codeland-2022-view-speakers-31a0)... or whatever else might spark joy ❤️ 

---

Have a wonderful weekend

![Party Time](https://media.giphy.com/media/DE2VuTwN3TqxlcwIaH/giphy.gif)
$$ Every Wrong I Did As A 'FAANG' Software Engineer Before 30; What About You?
Tags: career, discuss
Published: 2022-04-29 17:07:15

[Youtube: $$ Every Wrong I Did As A 'FAANG' Software Engineer Before 30](https://youtu.be/raebJ8_U1wk)

If you listen to Gary Vee, '30 is the new 20', all blood-pumping vibes; look forward, never stop the hustles lol.

**However, I wish I could slap my 21-year-old self: calm down, go find the right internship, do leetcode. Nothing else matters!**

(slapping myself now ... a lot other stuff do matter: relationship, physical/mental health...)

We are all in this tech bubble, maybe my stories are relatable - guess what, we all mess up. [This video is a little retro](https://youtu.be/raebJ8_U1wk) of my personal failures, studying and working in the states. I wish I could have done better.

I'd love for you to watch the video, but here is the three points discussed:
- **I. Chasing After Others' Goals**
- **II. Never Landed The Right Tech Internship**
- **III. 'I Will Figure It Out Later'**

Through the past 8 years, I've observed so many people's success in the tech industry, which humbled me deeply. I often joke about my mistakes - some were very personal - it makes me appreciate more the uncommon successes. 

The internet is now full of breathtaking role models. To  they raise my anxieties. I just hope my humbled stories ([this video!]((https://youtu.be/raebJ8_U1wk)))can take you for a laugh.

## Questions
So here are the topics for discussion!
- What did you do well or otherwise in the tech industry? 
- What would you do differently before your first job? or before college graduation?
- Would you trade your time to grind leetcode?
- Is there any offer that you regretted (joined or rejected)?
- How can you be sure that Software Engineering is the right career path for you? Or is it just sunk cost so we've all been riding alone?
OpenAPI Editor - Free IN-Browser Developer Tool
Tags: openapi, devtool, apspeed
Published: 2022-04-29 17:08:03

---
title: OpenAPI Editor - Free IN-Browser Developer Tool
published: true
description: Free, In-Browser tool for editing OpenAPI definitions - provided by AppSeed (free developer tool).
tags: openapi, devtool, apspeed
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6dnzqxovaib4byxxnsmk.jpg
canonical_url: https://appseed.us/generator/openapi/
---
Hello Coders!

This article presents [OpenAPI Editor](https://appseed.us/generator/openapi/), a free, online tool that developers can use to edit their API interfaces. For newcomers, **OpenAPI** is an open-source format for `designing RESTful APIs` and web services that serves as a single source of truth for all parties involved in the software development process: developers, testers, etc.

> **Thanks for reading!**

- 👉 [OpenAPI Editor](https://appseed.us/generator/openapi/) - product page
- 👉 Free [support](https://appseed.us/support/) via Email and [Discord](https://discord.gg/fZC6hup)

---

![OpenAPI Editor - IN-Browser, LIVE Editing.](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sx8jyggpko89qod49ads.gif)

--- 

## ✨ Product Information

The service can be used to edit and generate unlimited documents, without an account on AppSeed. The editor supports editing the global API information (Title, API version, description), add/remove entities, and fields for each OpenAPI entity. Supported fields:

- ✔️ `string`
- ✔️ `timestamp`
- ✔️ `UUID`
- ✔️ `binary`
- ✔️ `boolean`
- ✔️ `number`
- ✔️ `object` (all entities previously defined)

Users are able to edit directly the generated JSON and the changes should be reflected automatically in the entities editor. Once the user finishes the document and hits the download button, the `OpenAPI` definition is saved locally.  

--- 

> Thanks for reading! For more `OpenAPI`-related resources, feel free to access:

- 👉 [What is OpenAPI](https://stoplight.io/openapi) - Definition & Standards
- 👉 [OpenAPI the same as Swagger](https://rapidapi.com/blog/api-glossary/openapi/) by RapidAPI
- 👉 [OpenAPI Guide](https://nonamesecurity.com/glossary/openapi) - a comprehensive introduction
Day-77 Training At Ryaz
Tags: javascript, webdev, beginners, programming
Published: 2022-04-29 17:07:40

- Date:29/04/2022
- Day:Friday

Today, I started at about 11:00 am as I was in progress to complete the java script course so, today I started with the left over task and firstly started with the fourteenth module as it included some reverent topic related to previous so, before thirteen I started the fourteenth module firstly the instructor started with asynchronous java script Ajax  is a set of web development techniques that uses various web technologies on the client-side to create asynchronous web applications. With Ajax, web applications can send and retrieve data from a server asynchronously (in the background) without interfering with the display and behaviour of the existing page. after this I started with  api url change The replace() method of the Location interface replaces the current resource with the one at the provided URL. The difference from the assign() method is that after using replace() the current page will not be saved in session History, meaning the user won't be able to use the back button to navigate to it. after this I started with requests and response and how it works with web page after this I shifted towards setting up and resolving errors of my project.
How to dynamically change collection in from client side ?
Published: 2022-04-29 16:44:48

   I want to change collection from client side, but I do not have sucess.
                                                                                                                                                                                                                                                                                          

```
import clientPromise from '../../lib/mongodb2'
 
export default async function handler (req, res) {
  
  const collection = req.query.collection
  const client = await clientPromise
 

  const db2 = client.db('javascript_questions')
  switch (req.method) {
    case 'GET':
      const question = await db2
        .collection(collection)
        .find({})
        .toArray()
      res.json(question )
      break
  }
}
```


component 


```
export async function getStaticProps (context) {
  let res1 = await fetch('http://localhost:3000/api/questionApi', {
    method: 'GET',
    headers: {
      'Content-Type': 'application/json'
    }
  })
  let question = await res1.json()

  return {
    props: { question }
  }
}

```
Cypress Workflows in Warp
Tags: javascript, tutorial, productivity, testing
Published: 2022-04-29 16:28:22

Recently I was introduced to a new terminal app called **Warp**. I was a bit skeptical at first as I thought a terminal was pretty strait forward and wasn't sure what type of improvements could be made to one. After trying Warp, I can tell you I was happy to be wrong. They very accurately describe it as _**"The terminal for the 21st century"**_

If you aren’t already using Warp you can download it at [warp.dev](https://warp.dev)

After you install Warp, go ahead and launch it and open the Workflows panel.

Workflows are an easier way to execute and share commands within Warp. They are searchable by name, description, or command and are easily parameterized

Workflows can be accessed directly within Warp, either through the Command Palette or by pressing `ctrl-shift-r`

Once the Workflows panel is open you can then scroll to Cypress under `Categories` or just begin typing `cypress`.

We now get shortcuts for how to `run` and `open` Cypress. We can even pass in an optional parameter for viewport width and and height.

Finally if click open and you can now watch Warp open Cypress and run your tests!

To see this in action, you can watch the example video below:


{% embed https://www.youtube.com/embed/EIb-CKvzyK8 %}