teleren/devto huggingface dataset:
Make Typescript less typesafe
Tags: help, typescript
Published: 2021-08-05 14:59:47

I am using Typescript to give VSCode some idea of what my Rhino JavaScript (Java JavaScript) is doing, I am not using Typescript sources, I am still using JavaScript files with checkJS turned on.

(I know it sounds terrible but I know the risk, all safety off)

I have several scripts executed in a sandbox with injected variables that includes the entire Java OpenJDK, I dont want to provide typedefs for this, but I do want to provide some hints, what can I do to make TS not care about 1000's of globally injected variables and objects.

Short of building Typedefs from Java (Done this it too 5 hours to build, its not going to work)

I want to do this:
``` js
java.io.readFile(); // < TS wont care about this

context.outcome; // hey TS there is this thing I have defined, its a boolean

(2).map(); // TS this isn't right!
```
Getting an error when the command pip install chatterbot is given.
Published: 2021-08-05 14:47:26

Hi ! I'm an IT student. I'm currently working on developing a chatbot using python. I'm having trouble installing the chatterbot library using the command 👉 pip install chatterbot

I encounter the following error whenever I try to install chatterbot.

Error: Could not find a version that satisfies the requirement chatterbot (from versions : none)
Error : No matching distribution found for chatterbot

I tried the command 👉 pip3 install Chatterbot , but still it generates the above error.

I'm using a windows 10, and I have python version 3.8(32-bit) installed. 

Can someone please help me with this

 #python #help
How can we test useState hooks inside a void function with jest and enzyme?

Tags: react, enzyme, jest, testing
Published: 2021-08-05 14:24:54

I'm new to unit-testing and writing test cases using jest and enzyme in React. Can someone please help me to write the test case for this example?
```
const [open, setOpen] = useState(false);
const handleClose = () => {
    setOpen(!open);
}

//this handleClose is an onClick event
```
WordWebNav : create usable MS-Word web-pages
Tags: opensource, webdev, news
Published: 2021-08-05 14:22:30

[WordWebNav (WWN)](https://jimyuill.com/software/www/WordWebNav/) is an open-source app that converts a Microsoft-Word document to a usable web-page.  

The web-page generated by WWN includes:
* A document-text pane, with adjustable width, and support for user-comments at the bottom
* A navigation pane, with hyperlinks to the headings in the document-text panel.
* A header-bar for site-navigation, e.g., breadcrumbs
* Fixes for common bugs in Word's HTML, such as:
    * Word-HTML's paragraphs span the browser's width, which makes them difficult to read.
    * Word-HTML's multi-level lists are mis-formatted
How SSL certificate works? Easy reference
Published: 2021-08-05 13:37:54

SSL certificate plays an important role in building trust between a browser and a web server.  Below is a simple sequence diagram that I created for easy reference and understanding.

A digital signature is create by a CA's private key.

![How SSL certificate works? sequence diagram](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4pg3nn8ylffyjc58f7ij.png)


Hope this help :) 



Reference LINK:
[How SSL certificate works? by Sunny Classroom](https://www.youtube.com/watch?v=33VYnE7Bzpk)
Feedback on Inspirational Design from Dribble
Tags: design
Published: 2021-08-05 14:18:27

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gouhcgdwdqulk4anesko.png)
Looking to get some feedback on this design I made, heavily based off of a design I liked on Dribbble. Here's the link. https://dribbble.com/shots/16180695-Monee-Financial-App

Just anything I can improve on, or learn from, please let me know!
How to create good patreon benefits
Tags: patreon
Published: 2021-08-05 14:14:34

###This case I will add my exclusive Discord Server for new Patreons!!

**Step 1:** Have a Discord Server created.

**Step 2:** Log in to Patreon and navigate to your [**Creator Page Editor**](https://www.patreon.com/edit/about). From here select the Tiers link of your editor. From here select the **Tiers link**. 
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1gkhd7yr6hy4e1jg63h9.png)
**Step 3:** Click the **Edit tier** button on a Tier you’d like to assign a Discord role(s) and click into the **Advanced** button. Scroll until you find the **Connect to Discord button**.
1:
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/aejfio9na41rjzyjl1xw.png)
2:
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/p8k4ey9jdzgjliyhdu8q.png)
3:
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/atspsjizlycm8i5px9uk.png)

**Step 4:** Click the **Connect to Discord** button and log in to your Discord account via the pop-up window that populates.  
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ah3zc1sw0am80envxz8i.png)

**Step 5:** Head to the Server Settings window and navigate to the Roles tab. You’ll notice a new “Patreon” role is in your server, go ahead and rename the role “Patreon Bot”. 
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/y24h92sdezvozu2jm48t.png)

Server management tips: 
- Rename your roles so that they match your Tier names
- Give your roles a distinguishing color 
- Enable the Display role members separately from online members setting, this will help you distinguish Patrons from other server members 

**Step 6:** Give the Patreon Bot the required permissions
Make sure that the Patreon Bot is above the roles you’ve just created for your Tiers. If you have existing roles you’d like to assign to patrons, be sure to drag the Patreon Bot above those roles. If the Patreon Bot is not above these roles, it will not assign that role to patrons. 

**Important:** Do not deselect or add any permissions to the Patreon Bot! It has all of the permissions it needs, and adding any additional permissions may break the integration.

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

**Step 7:** Click the **Edit tier** button on a Tier you’d like to assign a Discord role(s), and click into the **Advanced button**. Scroll down and select **Gives patrons access to selected Discord roles**. A drop-down menu will populate where you can select a role. 
 
You can select multiple roles. This useful if higher tiers are meant to receive benefit that lower tiers do. When you’ve selected your role(s) click **Save tier button**.
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3yzj09xpyjxud0qj5q7c.png)

##### And done, now you can create better benefits for your patreons 🎉

#### Enjoy and support me in [**Patreon**](https://www.patreon.com/beatrizoliveira), I create several things related to open source😄
👥 Can Your Identity Solution Grow With Your Company?
Tags: security, identity
Published: 2021-08-05 13:37:28

### 📈 Latin American markets are growing faster than ever. If you’re considering an expansion in the region, it’s important to make sure your identity solution can scale with you.

### <br>

The number of Venture Capital deals signed in Latin America hit a record high of 488 in 2020. That’s nearly double the 2017 number according to [Bloomberg](https://www.bloomberg.com/news/articles/2021-03-16/latin-american-startups-had-record-venture-capital-deals-in-2020). The growth in the tech market in LatAm isn’t only apparent in new startup deals; companies who already have a presence in the region are expanding both through mergers and acquisitions and by looking into new countries to grow their footprint in the region. 

Each scenario brings its own challenges for your IT infrastructure, particularly your[ identity solution](https://auth0.com/blog/how-to-scale-quickly-with-identity/). If you’re expanding into a new country, there’s likely to be a different data privacy regulation you’ll have to comply with. And that startup you’re eyeing probably has a vastly different infrastructure than yours, whether private or public cloud or even legacy on-prem. An Identity management solution has to be able to expand and flex in order to grow with your company, regardless of the specific scenario.

![Business Expansion](https://images.ctfassets.net/23aumh6u8s0i/1HnNeEEQ4hCBb2M4y2ZerT/5b5a1de004ea8021fdc38d042a85a672/Latam05.jpg)

## With Business Expansion Come Business Questions

Let’s take a look at those two potential growth scenarios and what they mean for your business’s identity solution. First up is the acquisition of a competitor or related smaller entity. [Mergers and acquisitions](https://auth0.com/blog/why-your-ma-strategy-has-to-include-an-iam-solution/) (M&A) always bring an array of unique challenges, but for this article, we’re going to focus on the identity challenges associated with the merging of IT infrastructure.

Your web app may be hosted on a public cloud, but the company you just bought has been in business for a while and is still using on-prem hosting for theirs. In order for you to bring both properties together under one identity solution, you need one that can bridge the gap between the two, allowing your new audience access to both apps without managing multiple sets of credentials.

In our second scenario, your organization is considering an expansion into a neighboring country to take advantage of the easing of business restrictions and the growing market for your product that your marketing team has identified. You already comply with the privacy regulations in your country, but are you ready to comply with those abroad? 

[Read more...](https://auth0.com/blog/can-your-identity-solution-grow-with-your-company/?utm_source=content_synd&utm_medium=sc&utm_campaign=identity)
Svelte Todo CRUD App 
Published: 2021-08-05 14:00:23

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

## [Introduction](https://youtu.be/yLwwJtCFDNo)

## [Create Simple Todo App using Svelte](https://youtu.be/AV04qN6frmE)

## [Deleting Todos](https://youtu.be/50s6IKO8028)

There will be more videos coming. Subscribe to get udpates.
tmux targeted session
Tags: cli, linux, tmux
Published: 2021-08-05 13:57:05

---
tags: ['cli', 'linux', 'tmux',]
series: tmux
title: tmux targeted session
canonical_url: https://waylonwalker.com/tmux-targeted-session/
published: true
---

This is something that I made up but use every single day, this is what keeps much of what is on my blog or my teams private work wiki going.  I have a few very important directories that I have assigned directly to a hotkey for fast
session switching.

``` bash
bind -n M-i new-session -A -s waylonwalker_com "cd ~/git/waylonwalker.com/ && nvim"
bind i popup -E -h 95% -w 95% -x 100% "tmux new-session -A -s waylonwalker_com 'cd ~/git/waylonwalker.com/ && nvim'"
bind -n M-I popup -E "tmux new-session -A -s waylonwalker_com 'cd ~/git/waylonwalker.com/ && nvim'"
```

https://waylonwalker.com/tmux-new-session/

> This one is building off of yeserday's new-session post, make sure you check that one out as well.


Be sure to check out the full YouTube playlist and subscribe if you like it.

[![tmux playlist on youtub](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/v4cgo76y53s1hwykajo1.png)](https://www.youtube.com/playlist?list=PLTRNG6WIHETB4reAxbWza3CZeP9KL6Bkr)

{% post https://dev.to/waylonwalker/how-i-navigate-tmux-in-2021-2ina %}

> Also check out this long form post for more about how I use tmux.
Print in Italics using quo
Tags: python, devops, quo
Published: 2021-08-05 13:54:43


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

Printing in Italics made easy!!
Quo is a Python based toolkit for creating Command-Line Interface (CLI) applications.
You can install through PypI:
[quo](https://www.pypi.org/project/quo)
How to cut a cake with various tech
Tags: watercooler, jokes
Published: 2021-08-05 13:47:10

- **JavaScript**
  - You build a robust, accurate user experience to cut cake. But then you realize that knifes are not supported in most browsers.
  - You cut yourself.
- **CSS**
  - You try to cut the cake, but by the time you position the knife, the cake has moved into your face. You realize that you need Adobe Flash to cut cake.
- **HTML**
  - You cut a triangle in your cake with nothing more than a small penknife, but you realize that to make it look convincing, you need to be using Dreamweaver.
- **Git**
  - It is easy to cut cake with Git, but also easy to revert to a previous cake and merge it with your current frosting.
- **Shell**
  - `~$ ls`

  - `cake.c cake.h cake.o frosting.c frosting.o`

  - `~$ rm * .o`

  - `rm: .o: No such file or directory`

  - `~$ ls`

  - `~$`

  - You don't remember any syntax and spend 5 hours reading man pages. Then you give up and cut the computer
- **XML**
  - You can't actually cut the cake; all you can do is describe the knife in painful detail.
- **Node.js**
  - The cake and knife are available, but they use callbacks. You install packages for them, but the knife is too heavy. Frustrated, you rewrite Node.js.
  - You write the knife, using 13 other libraries. But this bloats the knife, and you can't lift it. You get frustrated and kick the cake and cut it yourself. Considering this a success, you blog about your experience of being able to cut cake without even using a knife!
- **Angular**
  - You spend hours learning Angular, and when you are done you are so happy you forget about cutting cake.
  - You absolutely mutilate the cake
- **jQuery**
  - You cut cake. You are now an expert on JavaScript.
- **Svelte**
  - Since the only instruction is to cut cake, the Svelte compiler hyperoptimizes your code so that it only shaves off a small part of the cake
- **React**
  - You manage to get rid of `this`, which was stopping you from cutting cake, but then you face a closure.
- **Vim**
  - You cut cake, but you can't quit.
  - `"cake"` is falsy, so you can't cut it
- **VSCode**
  - You type cake, but VSCode autocompletes to `hasUncaughtExceptionCaptureCallback`. The next time you try, it autocompletes to `REGEX_SPECIAL_CHAR_BACKREF`
- **Assembly**
  - You try to cut cake, but then you realize you need to invent the cake, the knife, the oven needed to cook cake, and your hand
- **BASIC**
  - POINT KNIFE at CAKE, then MOVE DOWN 45px, then MOVE UP 45px, then ROTATE KNIFE.HANDLE, then MOVE DOWN 45px, then MOVE UP 45px.
How to config Gitlab CI just checks commit changed files
Tags: gitlab, python, devops
Published: 2021-08-05 13:32:21

**[Background]**
I have a Python project with config CI on Gitlab. It has a lint stage which will check code quality of all source code when push event or merge request event is triggered. It will take time to check all source code with merge request. And it will not focus on code quality of merge request. It should check code quality on commit change files.
```yaml
pylint:
  stage: lint
  before_script:
    - mkdir -p public/badges public/lint
    - echo undefined > public/badges/$CI_JOB_NAME.score
    - pip install pylint-gitlab
  script:
    - pip install -r requirements.txt
    - pylint --rcfile=.pylintrc --exit-zero --output-format=text $(find -type f -name "*.py" ! -path "**/.venv/**") | tee /tmp/pylint.txt
    - sed -n 's/^Your code has been rated at \([-0-9.]*\)\/.*/\1/p' /tmp/pylint.txt > public/badges/$CI_JOB_NAME.score
    - pylint --exit-zero --output-format=pylint_gitlab.GitlabCodeClimateReporter $(find -type f -name "*.py" ! -path "**/.venv/**") > codeclimate.json
    - pylint --exit-zero --output-format=pylint_gitlab.GitlabPagesHtmlReporter $(find -type f -name "*.py" ! -path "**/.venv/**") > public/lint/index.html
  after_script:
    - anybadge --overwrite --label $CI_JOB_NAME --value=$(cat public/badges/$CI_JOB_NAME.score) --file=public/badges/$CI_JOB_NAME.svg 4=red 6=orange 8=yellow 10=green
    - |
      echo "Your score is: $(cat public/badges/$CI_JOB_NAME.score)"
  artifacts:
    paths:
      - public
    reports:
      codequality: codeclimate.json
    when: always
  only:
    - develop
    - merge_requests
  tags:
    - docker
```

**[Solution]**
Here is a solution to resolve my problems.
I will create another config pylint for merge request event. It just check code quality on commit changed files compare with merge request target branch.
```yaml
pylint_merge_request:
  stage: lint
  before_script:
    - pip install pylint-gitlab
  script:
    - echo CI_COMMIT_SHA=${CI_COMMIT_SHA}
    - echo CI_MERGE_REQUEST_TARGET_BRANCH_NAME=${CI_MERGE_REQUEST_TARGET_BRANCH_NAME}
    - git fetch origin ${CI_MERGE_REQUEST_TARGET_BRANCH_NAME}
    - FILES=$(git diff --name-only ${CI_COMMIT_SHA} origin/${CI_MERGE_REQUEST_TARGET_BRANCH_NAME} | grep '\.py'$)
    - echo "Changed files are $FILES"
    - pip install -r requirements.txt
    - pylint --rcfile=.pylintrc --output-format=text $FILES | tee /tmp/pylint.txt
  only:
    - merge_requests
  tags:
    - docker
```

I hope it is helpful for everyone. You can use it for other programing languages on Gitlab.
Always and everywhere make Triple equals
Published: 2021-08-05 13:30:18

Hi there 👋🏼

Today I realized that a triple equal does an additional check to compare types of operands.

I got excited at the moment and I go to write a benchmark to check it!

I wrote two funny and stupid functions for it

With double equal

```javascript
const f1 = () => {
  const v = Math.random();
  if (v === '2') {
    return true;
  }
  return false;
};
```

And with triple equal

```javascript
const f2 = () => {
  const v = Math.random();
  if (v == '2') {
    return true;
  }
  return false;
};
```


And after that, I run a benchmark and saw what I did not expect.

Average `f1` is faster than `f2` for **80%**. WHAT?!

I rewrote functions and in equal replaced string `'2'` to number `2` and did run a benchmark again.

So that I saw that functions execution times do not have a lot of difference.

So. What conclusion can I do?

**Javascript engine spends a lot of time on type conversion, but using triple equal does not do your code very slowly.**

Thank you!
„Hacking” in JS: Enums

Tags: javascript, programming, webdev
Published: 2021-08-05 13:16:47

#Hello, it’s 2021 why I should use „fake” enums in JS while can use Typescript to provide serious enum logic?

Yeah, we don’t live in the perfect life and sometimes we have to stick to the JS for some reason. Even with JS, we should try to write as clean code as we can. Enums are very helpful when we have to define a variable with a definite number of fixed values. Then, we will obtain a boost to readability. For example:
```js
let color = "red"

switch (color) {
 case "blue":
  console.log("It's blue")
  break
 case "red":
  console.log("It's red")
  break
 case "purple":
  console.log("It's purple")
  break
}
```
With some useful knowledge we can transform it into much cleaner piece of code :
```js
const colors = {
 BLUE: "blue",
 RED: "red",
 PURPLE: "purple"
}
Object.freeze(colors)

let color = colors.PURPLE
switch (color) {
 case colors.BLUE:
  console.log("It's blue")
  break
 case colors.RED:
  console.log("It's red")
  break
 case colors.PURPLE:
  console.log("It's purple")
  break
}
```
##Object.freeze + const = powerful duo to make a JS enum!

Object.freeze - this method freezes our object. This is the most helpful method to obtain enum in JS. Freezing prevents changing properties and in the enum that is our goal. More on this topic here:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze

Const - It provides that our variable won’t be overridden. 

I think enums are quite useful and using them provides much more readability in our code. 
JS code is provided here:
https://jsfiddle.net/x79g6zuq/8/
User Chat plugin for WordPress
Tags: wordpress, chat, woocommerce, buddypress
Published: 2021-08-05 13:01:40

ImbaChat is a free WordPress community chat plugin. Online support chat, group chat, and private chat between users in the cloud service. Allows you to add a chat widget to your site for free. Integration with BuddyPress, SweetDate, and WooCommerce. Read on to learn more about [this plugin](https://wordpress.org/plugins/imbachat-widget/).

Add a widget for your site for free. This plugin can be integrated with BuddyPress, SweetDate, and WCFM MarketPlace. ImbaChat has many features. This live chat plugin for WordPress has full integration with the user base on your web resource. It is possible to create a chat room with an unlimited number of participants. Automation on the site and in the chat has a single mechanism.

In the chat widget WordРress created using the ImbaChat plugin, you can send pictures, geolocations, and files. There is support for Emoji and chat database backup. If you use shared hosting, then this plugin supports work on it. If the Internet is disconnected, you can continue to work with the chat, since all your messages will be sent immediately after connecting your device to the global network.

Many people are interested in the question of whether the ImbaChat plugin will load the server. The answer is no, because all data processing takes place on the plugin's servers, and, accordingly, it takes all the load on itself. Thus, we can conclude that the ImbaChat [private chat plugin for WordPress](https://imbachat.com/en/wordpress-chat) will be an excellent solution for creating a chat on your site since it is practical, multifunctional, and does not load your server.


### ImbaChat plugin installation

Install the chat plugin for WordPress directly from the WordPress plugins screen and activate it. If you don't have a widget, click "Create Widget" in ImbaChat settings. The connection between your website and the ImbaChat server will be configured automatically. If you already have a widget, just enter its ID in the ImbaChat settings on your website and click on "Connect Widget".
The full tutorial you can find [here](https://imbachat.com/en/blog/post/step-step-imbachat-setup). 

In addition, if you have BuddyPress, WooCommerce, or SweetDate themes, ImbaChat integration will be configured automatically as well. You must use shortcodes to create chat buttons. Buttons are only available in BuddyPress.

### ImbaChat plugin functions:
* Full integration with your site's user base;
* Online chat for online support service;
* Private chat between users;
* Group chat with an unlimited number of participants;
* A unique authorization mechanism in the chat and on the site (users do not need to register twice);
* Chat moderation;
* Interface appearance and language setting;
* Sending images, geolocation, and files;
* You can also make a backup copy of the chat data, as well as use * It on shared hosting. It continues to work fine even without the internet (your messages will be sent as soon as the internet comes up). 

This best WordPress group and private chat plugins will improve users experience on your website.
Using Metafields in Your Shopify Theme
Tags: shopify, metafield
Published: 2021-08-05 12:56:14

If you've ever had to create multiple custom Liquid product templates to accommodate unique product data, you know how difficult it is to manage. I'll tell you how to do it easily :)

Metafields have four components: namespace, key, value, and description (optional). Namespaces will be used to group different metafields, keys will be used to reference our information, and values will contain our unique content. We can also specify if the value is a string or integer. 

<script src="https://gist.github.com/imuhammadshoaib/c9f8629a581dad8853a2e2313e37932f.js"></script>
{% gist https://gist.github.com/imuhammadshoaib/c9f8629a581dad8853a2e2313e37932f.js %}
You can learn more about customizing metafields in our <a href="https://shopify.dev/api/liquid/objects/metafield">documentation page</a>.