teleren/devto huggingface dataset:
Explain PySide2 & PyQT5 Licensing
Tags: explainlikeimfive, python, qt, license
Published: 2019-12-15 04:23:15

---
title: Explain PySide2 & PyQT5 Licensing
published: true
tags: explainlikeimfive, python , qt , license
---
PySide2 & PyQT5 are most popular QT binding for Python, but their licensing seems very confusing.

#### Assume two scenarios, 

### First :
I Develop a cool application with PySide2 but I don't open source it and want to sell it. *Can I do that*?

### Second : 
Same as  *First* but instead of PySide2 , I use PyQT5. Now *Can I Sell That*?

Any Help?
Cannot add class but elements are already added to the DOM
Tags: help
Published: 2019-12-15 04:22:50

Hey I am trying to add an active class to searchResult HTML using JavaScript.

I try to search for recipe in search bar and results are displayed as it is shown in image.
Search Result
https://i.stack.imgur.com/vWj4m.jpg

When I click on a recipe from the search list I want to add a background color to the currently selected recipe(click on the recipe) using function resultHighlight()

function resultHighlight() is being called in the controller and produces an error. Since the HTML is already added(after a search query is fired) by function renderRecipe() then why it is unable to find href id and producing error ?

//Function to add background color

`export const resultHighlight = id => {
document
.querySelector(``a[href="#${id}"]``)
.classList.add("results__link--active");
};`

Error Image
https://i.stack.imgur.com/m372A.jpg

NOTE: I tried console logging follwoing part and it returns null.

`document.querySelector(a[href="#${id}"])

//OUTPUT: null`

JavaScript has already added HTML by a function (Search result)

See the full question here

https://dev.to/dvgy/cannot-add-class-but-elements-are-already-added-to-the-dom-2km8
Lazy load images and videos in twig
Tags: twig, lazyload, php7, lazyloadimages
Published: 2019-12-15 04:22:32

---
title: Lazy load images and videos in twig
published: true
description: 
tags: twig, lazyload, php7, lazyload-images
---

Eager loading of images and videos not only makes webpage slow and clumsy but also consumes a lot of bandwidth.
If you use `twig` templating system for your view layer, here's a small extension that defers loading of resources so they are loaded when required in viewport.

This extension based on awesome [malchata/yall.js](https://github.com/malchata/yall.js) aka `yet another lazy loader` is fully customisable.

## Install
```sh
composer require adhocore/twig-yall
```

## Usage

First setup twig to register this extension:

```php
// Use your loader of choice
$twig = new Twig\Environment(new Twig\Loader\ArrayLoader);

// Register Yall with defaults
$twig->addExtension(new Ahc\TwigYall\Yall([
    // customisation config:
    'placeholder' => 'default.png',
]));
```

Then wrap your twig template in `{% lazyload %}...{% endlazyload %}`  like so:

```twig
{# sometemplate.twig #}

<img src="apple.jpg" />                   {# not lazyloaded #}

{% lazyload %}
<img src="ball.jpg" />                    {# lazyloaded #}
<img src="cat.jpg" class="no-lazy" />     {# not lazyloaded #}
<img src="cat.jpg" data-src="..." />      {# not lazyloaded #}
<video poster="vid.jpg">                  {# lazyloaded #}
  <source src="vid1.mp4">                 {# lazyloaded #}
  <source src="vid2.mp4">                 {# lazyloaded #}
</video>
<video class='no-lazy' src="..."></video> {# not lazyloaded #}
<picture><source src="pic.jpg"></picture> {# lazyloaded #}
{% endlazyload %}

<img src="...">                           {# not lazyloaded #}

{{ yallify() }}                           {# place it in footer #}
```

Finally when twig compiles to html, above will be rendered as:

```html
<img src="apple.jpg" />
<img class="lazy yall" src="default.png" data-src="ball.jpg" />
<img src="cat.jpg" class="no-lazy" />
<img src="cat.jpg" data-src="..." />
<video class="lazy yall" poster="default.png" data-poster="vid.jpg">
  <source class="lazy yall" data-src="vid1.mp4">
  <source class="lazy yall" data-src="vid2.mp4">
</video>
<video class='no-lazy' src="..."></video>
<picture><source class="lazy yall" data-src="pic.jpg"></picture>
<img src="...">

<script src="https://polyfill.io/v2/polyfill.min.js?features=IntersectionObserver" async></script>
<script src="https://unpkg.com/yall-js@3.1.7/dist/yall.min.js" async></script>
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function() {
  window.setTimeout(function () { yall({"lazyClass":"lazy"}); }, 99);
});
</script>
```

{% github adhocore/twig-yall %}
NestJS Crash Course review and notes
Tags: nestjs, nest, rest, api
Published: 2019-12-15 02:57:57

I've been intermittently following a really **awesome** [crash course on NestJS](https://www.youtube.com/watch?v=wqhNoDE6pb4) by Brad Traversy on his YouTube Channel and finished it today.


Can't stress enough this video is really good paced and the contents are super well organized, with an organic development from the introduction to the technology to a finished CRUD solution.

[Here is my repo](https://github.com/ackzell/nest-rest-api) but what I really wanted to share is the notes I took from it:

[Check them out here](https://docs.google.com/document/d/e/2PACX-1vQqHzA6QRe3uELx3mNQVW_pZ0U2qsTWQ5mfbyV386LwZwSvXRwjWuBBg9gI3nR3tvOVtzl9-RqQjvfh/pub)

I have done this in the past where I create quick notes of what I am doing and trying to get the process documented. I figured it could probably help others, especially if they're not thrilled by the thought of a 1h long video.

Cheers!

PS. There is some bonus content from something else I learned while doing this FYI 😉
For Job seeker
Tags: career
Published: 2019-12-15 02:49:37

Hi. I am Tai Ming from China.
For now I am working on Upwork site. I need European or American account on upwork to get more money. If you are not working on Upwork for now, you can help me with this, I guess. I want to use your Upwork account by creating your new Upwork account. If you help me, I will pay you monthly salary.
      $100 if get less than $1000
      10% of my income if i get more than $2000
I think I can get more than $2000 after 3 months 
$k¥P€ : Roshan Webmaster Discord : SUPERMAN#4107  gmail:superman19931207@gmail.com
Awesome Terminal upgrades - Part Four: Make your your macOS terminal look slick
Tags: opensource, productivity, zsh, bash
Published: 2019-12-15 02:40:03

---
title: Awesome Terminal upgrades - Part Four: Make your your macOS terminal look slick
published: true
description: Awesome Terminal upgrades - Part Four: Make your your macOS terminal look slick
tags: opensource, productivity, zsh, bash
series: Awesome Terminal upgrades
---

![demo](https://i.imgur.com/DqH9IV9.gif)

## Install [Homebrew](https://brew.sh/)
> The missing package manager for macOS (or Linux)

We will be using Homebrew to manage everything for us, if you don't have it installed, go ahead and do it now!

```
echo “[ -f /usr/local/etc/bash_completion ] && . /usr/local/etc/bash_completion” >> ~/.bash_profile
```

## Install [Fira Code](https://github.com/tonsky/FiraCode)
> Monospaced font with programming ligatures

```
brew tap caskroom/fonts
brew cask install font-fira-code
``` 
![Fira Code](https://i.imgur.com/TlhJlZt.png)

## Install [Starship](https://starship.rs/)
> Starship is the minimal, blazing fast, and extremely customizable prompt for any shell!
> The prompt shows information you need while you’re working, while staying sleek and out of the way. 

```
brew install starship
```

In your `.bashrc` or `.zshrc` file (swap bash or zsh accordingly):

```
eval "$(starship init bash)"
```
![starship](https://raw.githubusercontent.com/starship/starship/master/media/demo.gif)

## Install [One Dark theme](https://atom.io/themes/one-dark-syntax) for iTerm2
> A dark syntax theme

```
wget https://raw.githubusercontent.com/nathanbuchar/atom-one-dark-terminal/master/scheme/iterm/One%20Dark.itermcolors
```

You can choose any colour scheme you like, my preferred is One Dark which was originally a theme for [Atom](https://atom.io/themes/one-dark-syntax).  
I chose to use the port made by [Nathan Buchar](https://github.com/nathanbuchar/atom-one-dark-terminal) because it's the most actively maintained for iTerm.

![one dark](https://i.imgur.com/BC2sJXT.png)

### Colours
Open preferences in iTerm and navigate to `Profiles > Colors` then in bottom right, from the dropdown `color presets` choose `import...` and import the file we downloaded.

![presets](https://i.imgur.com/r0azWLL.png)

And that's it, we now have a nicely styled and customised terminal.
Awesome Terminal upgrades - Part Five: Awesome and productive command line tools
Tags: opensource, productivity, zsh, bash
Published: 2019-12-15 02:38:40

---
title: Awesome Terminal upgrades - Part Five: Awesome and productive command line tools
published: true
description: Awesome Terminal upgrades - Part Five: Awesome and productive command line tools
tags: opensource, productivity, zsh, bash
series: Awesome Terminal upgrades
---

In part Five of my "Awesome Terminal upgrades" series, we will look at some programs that will really enhance your overall productivity in your terminal, there are plenty more out there, but these are my favourites.

They will work in both BASH and ZSH on both macOS and Linux.

## Install [Homebrew](https://brew.sh/)
> The missing package manager for macOS (or Linux)

We will be using Homebrew to manage everything for us, if you don't have it installed, go ahead and do it now!

```
echo “[ -f /usr/local/etc/bash_completion ] && . /usr/local/etc/bash_completion” >> ~/.bash_profile
```

## [bash-completion](https://github.com/scop/bash-completion)
> Programmable completion functions for bash

```
brew install bash-completion@2
```

the@2token indicates the major version 2 of bash-completion (the latest version, at the time of this writing, is 2.8) which must be used for Bash 4.1 and higher

Bash completions work really well by tabbing twice _&lt;tab&gt;&lt;tab&gt;_ and seeing a list of possible options for your current program.

## [fzf](https://github.com/junegunn/fzf) <a name="fzf"></a>
> A command-line fuzzy finder

fzf allows you to find files faster and filter them out better than relying upon find alone.

```
brew install fzf
```

## [hstr](https://github.com/dvorka/hstr) <a name="hstr"></a>
> bash and zsh shell history suggest box - easily view, navigate, search and manage your command history. 

hstr is brilliant, there are so many times I can't recall _exactly_ how to type out a command. This goes a step further than ZSH autocomplete or suggestions in that it allows you to search and filter previous commands super fast in a nice intuitive interface.

```
brew install hstr
```
![hstr demo](https://i.imgur.com/4sKXjTh.gif)


## [exa](https://github.com/ogham/exa) <a name="exa"></a>
> A modern version of ‘ls’. 

exa provides a lot more options than ls, and outputs information in a nice readable way.

```
brew install exa
```
![exa demo](https://i.imgur.com/DqH9IV9.gif)

## [thefuck](https://github.com/nvbn/thefuck) <a name="thefuck"></a>
> Magnificent app which corrects your previous console command.

Despite the name, this is a brilliant tool that allows you to correct your mistakes much faster than normal.

```
brew install thefuck
```


## [hub](https://github.com/github/hub) <a name="hub"></a>
> A command-line tool that makes git easier to use with GitHub.

hub is a great tool released by github themselves that allows you to interact with their website and manage things like pull requests, all from the commandline.

```
brew install hub
```

If you want a more comprehensive list of applications, you should check out [Terminals Are Sexy](https://terminalsare.sexy/)

Feel free to suggest any more!
Awesome Terminal upgrades - Part One: Upgrade and use a newer version of BASH on macOS
Tags: opensource, productivity, zsh, bash
Published: 2019-12-15 02:35:01

---
title: Awesome Terminal upgrades - Part One: Upgrade and use a newer version of BASH on macOS
published: true
description: Awesome Terminal upgrades - Part One: Upgrade and use a newer version of BASH on macOS
tags: opensource, productivity, zsh, bash
series: Awesome Terminal upgrades
---

This is part one in the "Awesome Terminal upgrades" series. In this short tutorial we will cover BASH on macOS and how you can upgrade and manage it using Homebrew. 

## Install [Homebrew](https://brew.sh/)
> The missing package manager for macOS (or Linux)

We will be using Homebrew to manage everything for us, if you don't have it installed, go ahead and do it now!

```
echo “[ -f /usr/local/etc/bash_completion ] && . /usr/local/etc/bash_completion” >> ~/.bash_profile
```

## Upgrade and use a newer version of BASH on macOS <a name="bash"></a>

As of macOS Catalina, the default shell is set to ZSH. 
The default version of BASH on macOS is **3.2** which is ancient! 
We'll be installing and using version **5** and making it our default shell instead.

```
brew install bash
sudo vim /etc/shells
```

You’ll see some output that looks like this:

```
/bin/bash
/bin/csh
/bin/dash
/bin/ksh
/bin/sh
/bin/tcsh
/bin/zsh
```

We need to update it:
1. Use your keypad to go down to the last line and press  `i` to edit this line
2. Type in `/usr/local/bin/bash`
3. Type `:wq` to writeout the file and quit. 

#### Change your default shell to BASH
```
sudo chsh -s /usr/local/bin/bash
```

After that, restart your Terminal to have it take effect.

#### Make sure BASH knows where to source everything from 

In order to make sure all of the above stick and work whenever you fire up a terminal, add this line to the top of your `~/.bash_profile` file.

```
[ -r ~/.bashrc ] && . ~/.bashrc
```

Awesome, your shell is now using BASH managed by Homebrew! 
You can update BASH whenever you like, as well as you other Homebrew installs by running:

```
brew update && brew upgrade
```
Why MSFT coworking space is better
Tags: discuss, work, dev
Published: 2019-12-15 01:26:38

Ok. I admit. Co-working spaces are absolutely useful: positive vibes, grow, elastic, productive, flexible time... etc, etc. 

But in terms of coworking (not cow-working, please...)
<b>@Microsoft</b> is better than all (we are sooo beauty 😍😜).

I say that, also because - unfortunately - (until now) I've only known #campus that feels like...God!

<img src="https://media.giphy.com/media/11fcS41pRsUyXe/giphy.gif" width="480" height="360" frameBorder="0" class="giphy-embed" allowFullScreen></img>
Fig.1 - Twisting Circle (gif) from: https://dribbble.com/shots/1679976-Twisting-circle/rebounds 

🤔🌐 Da...mn!
Why that? Why that happens?
Is really necessary playing card sorting with real life people? 🍻
I don't think so...


Horrible visu.
Computational Thinking / Pattern Recognition
Tags: firstyearincode, productivity
Published: 2019-12-15 01:23:08

Let's talk about the next part of Computational Thinking, which is Pattern Recognition.

A big part of the daily developer work is dealing with patterns. Sometimes it's more about patterns in data such as (75% of people who bought a croissant also bought a Latté), other times you focus more on patterns in your code. 

A common pattern could be that the user input always need to be validated before it can be saved. You first implement this code in the insert method, but turns out that the same code is also needed for update as well.

Detecting these patterns can help you to make more informed decisions about how to write code. This also sometimes involves higher abstractions, as in making sure that the code for validating user input is only written once and can be called from multiple places. 

![Computational Thinking / Pattern Recognition Sketchnote](https://thepracticaldev.s3.amazonaws.com/i/zp1jura6hqei0hb4c6s6.jpg)

Can you relate to this? Is there more from your side that goes into pattern recognition? Comment below!

---

_21 Lessons helps Junior Developers to level up their skills step by step via their weekly newsletter. Do you want to get out of Tutorial Hell or you're wondering how you develop the skills to write sophisticated programs yourself? [Sign up](https://learn.21-lessons.com/junior-dev-insights) and receive weekly articles and recommendations right in your mailbox._
How to convert image tags with SVG files into inline SVG tags 
Tags: javascript, webdev, codepen, showdev
Published: 2019-12-15 01:14:17

On many of the websites I have worked on that involve a CMS, the file manager does not handle SVGs very well. If I want to be able to store SVG icons or elements in the file manager, it is treated as an image and typically outputted using `img` tags, restricting any styling I'd like to add such as `fill` and `stroke` colors or animations. So, I created a function in JavaScript that would be able to run through the page for me and convert those `img` tags to inline svg:

{% gist https://gist.github.com/luisaugusto/ca14460632eb0f73ce1e3cefb1c18082 %} 

It's a pretty simple function that takes a query and a callback as arguments. All you need to do is call that function with a query for the images you want to convert, and it will loop through each of them, fetch the SVG and use `DOMParser` to pull the SVG data from the file. After that, it copies the `id` and `class` attributes from the image to the SVG variable and replaces the image with the SVG data. 

You can see it in action here, you'll notice that the html just has an image tag but if you inspect the page, it has been replaced with inline SVG. Now you can do whatever you want with the graphic!

{% codepen https://codepen.io/LegendOfLuis/pen/NWPqRKW %}

Feel free to edit this to your needs, it's possible to copy over more than just the `id` and `class` attributes, and it would probably be good to do a test and check elements to make sure they are `img` tags before fetching data.
npm: More Secure Canary Publishing
Tags: devops, opensource, git, github
Published: 2019-12-15 00:16:24


Publishing canary versions comes with some security risks. If your project is private you have nothing to worry about, but if your project is open source there are some security holes.

> A canary version is a test version put out for a change other user's can utilize for testing.

## Attack Vectors

Depending on the build platform you might be able to pass secrets to PR builds for forked repos. While this makes the developer experience of your project nice, in [`auto`](https://github.com/intuit/auto/)'s case publishing canary versions, it exposes your keys.

An attacker could:

1. print secrets
2. send secrets to some server
3. modify [`auto`](https://github.com/intuit/auto/) to publish to the latest tag instead of `canary`

No amount of code can fix these problems. If your release keys are in everyone's CI builds an attacker can do any number of things to modify what you intend for [`auto`](https://github.com/intuit/auto/) to do (or any other release method run in the CI).

## Solution

The solution for this is actually quite simple:

1. Create a test scope that you publish canaries under (ex: `@auto-canary` or `@auto-test`)
2. Create a user that only has access to that scope
3. Set the default `NPM_TOKEN` to a token that can publish to that scope (this is used for any pull request)
4. Set up a `secure` token that is only accessible on the main fork (still named `NPM_TOKEN`)

Step 3 might not be possible on your build platform.

The following are the ways the [`auto`](https://github.com/intuit/auto/) team knows how to do it. If you do not see the method for you build platform, please tell us about it!

- [CircleCI Context](https://circleci.com/docs/2.0/contexts/) - Contexts provide a mechanism for securing and sharing environment variables across projects. The environment variables are defined as name/value pairs and are injected at runtime.

## Usage

To use this work flow in [`auto`](https://github.com/intuit/auto/), supply the following configuration to the `npm` plugin.

```json
{
  "plugins": [
    [
      "npm",
      {
        "canaryScope": "@auto-canary"
      }
    ]
  ]
}
```

Now when people make pull requests to your repos: 

1. your CI can run `auto shipit`
2. the canary versions will get published under your `canaryScope`

---

This feature was added in `auto@v8.1.0`
How to test throw with Jest
Published: 2019-12-25 04:56:01

---
title: How to test throw with Jest
published: true
date: 2019-12-15 00:00:00 UTC
tags: 
canonical_url: https://gilbertodiaz.com//testing-throw-with-jest
---

**NOTE:**

I had this post in my personal blog but decided to try to link my RSS feed here and see how it goes.

## Table of contents

- [Assumptions](#assuptions)
- [Resources](#resources)
- [Scenario](#scenario)

## Assumptions

- You know how to install and use Jest
- You know how to develop programs in JavaScript

## Resources

- The [Jest](https://jestjs.io/docs/en/expect#tothrowerror) documentation.

## Scenario

Currently, at work, there is an effort to refactor a codebase to make it more maintainable and scalable. The JavaScript code is running in an unusual environment that is not a browser nither a node server. I’m extracting common functionality into a utility library and writing unit-test for all functions.  
I have used Jest before for frontend code but this is the first time using Jest for pure functions. Our use case is particular and we need to carefully choose which functions are going to throw/return an error.  
When I start writing unit-test for a function that returns an error I started having issues with it. Let consider a sample function and let’s say that I’m going to throw an error if any of the parameters are null.

```javascript
function addTwoNumbers(num1, num2) {
    const num1IsNull = num1 === null
    const num2IsNull = num2 === null

    if (num1IsNull || num2IsNull) {
        throw 'One of the parameters is not a number'
    }
    ... // continue your code
}

// testing

const addTwoNumbers = require('path/to/addTwoNumbers')

describe('addTwoNumbers', () => {
    it('should throw error if num1 is null', () => {
        // This expect wont error out but it wont pass either.
        expect(addTwoNumbers(null, 2)).toBe("One of the parameters is not a number")
    })
})
```

The correct way to test this is not by expecting the string that comes back but rather that the function did `throw`. Let’s consider the following test. It will be slightly different from the above.

```javascript
const addTwoNumbers = require('path/to/addTwoNumbers')

describe('addTwoNumbers', () => {
    it('should throw error if num1 is null', () => {
        // Notice that expect takes a function that return the function under test. 
        // If I pass (3,5) the test will faild.
        expect(() => addTwoNumbers(null, 2)).toThrow()
    })
})
```