teleren/devto huggingface dataset:
🐵 Monkey Patches
Tags: programming, javascript, python, codequality
Published: 2022-01-29 12:12:23

Do you know what Monkey Patches are? 🐒

You have probably seen them or even implemented a Monkey Patch before, so let’s delve into details to know more about this way of introducing hotfixes or patches in our code.

A Monkey Patch is an expression used for such changes that are made during runtime to functionalities that are already defined in our code or in external libraries/components.

This is usually done to modify the logic of your own functionality for some corner cases (example written in Javascript):

```js
// Create a class with a defined behaviour
class Monkey {
  constructor(name) {
    this.name = name;
  }

  sayMyName() {
    console.log(this.name);
  }
}

// Create a couple of Monkey instances
let monkeyAndrew = new Monkey("Andrew");
let monkeyRyan = new Monkey("Ryan");

// Monkey Patch the method "sayMyName" for the instance monkeyAndrew
monkeyAndrew.sayMyName = () => {
  console.log(monkeyAndrew.name + " I");
};

// Call to the method "sayMyName"
monkeyAndrew.sayMyName();
monkeyRyan.sayMyName();
```

This will return the following output:
```
Andrew I
Ryan
```

As you can see, we applied a Monkey Patch to the instance `monkeyAndrew` of our `Monkey` class. That way, this change of behaviour was only applied to that object and not to the rest of `Monkey` objects.

Monkey patches can also be applied to external libraries or components if the language allows such modifications (example written in Python):

```python
>>> import math

# Print PI
>>> math.pi
3.141592653589793

# Monkey patch PI and print it
>>> math.pi = 3.1
>>> math.pi
3.1
```

This practice can be useful if there is a specific case where you need to change the default behaviour. However, I think is not very recommendable. Introducing a Monkey Patch creates an unexpected logic and it can make error handling and identification much more difficult than it should be.

I see the point of applying Monkey Patches in unit testing. When we are creating stubs we are just basically faking the real call to the method with the result that we need. In any other case, if it’s possible is better to extend the class or the module by inheritance or to wrap them adding the functionality you need.

If you liked this article, please follow me on twitter [https://twitter.com/javihache_dev](@javihache_dev) and check out my personal blog [https://javihache.dev/](javihache.dev)
Best Tech Related Book You Have Ever Read!
Tags: webdev, machinelearning, programming, javascript
Published: 2022-01-29 12:12:12

What are some of the best tech related books you have ever read that made you a better developer or expanded your knowlegde about tech? Book can be anything like related to a specific topics like blockchain, ML and AI, Web development and so on, or related to some programming language, or some tech figure's Biography or anything else
Responsive Personal Portfolio Website Using React, Styled Components and Framer Motion
Tags: react, html, css, webdev
Published: 2022-01-29 12:04:10

## You can get the template from the link proivided in the description of the video.

### Technologies Used :
+ React
+ CSS

### Libraries and Assets Used :
+ React Icons
+ Framer Motion
+ Styled Components
+ React Intersection Observer

## Portfolio Sections
+ Responsive Navbar
+ Home
+ Services
+ Portfolio
+ Milestones
+ Blog
+ Promo Video
+ Pricing
+ Testimonials
+ Skills
+ Contact
+ Footer

## What will you learn ?

+ Creating Awesome React Styled Components
+ Usage of Framer Motion Animation Library
+ Creating Components without using any kind of CSS Libraries
+ Responsive Layouts
+ Advanced Grid Layout in the Portfolio Section
+ Creating Responsive Navbar without using any kind of extra elements
+ Smooth Scrolling and Scroll to top
+ Creating Custom Testimonial Slider
+ Advanced CSS Properties like Transform

## To learn how to create this template watch the complete video. You can get the template for free from the link provided in the description of the video.

{% youtube c8lnJzGVVpQ %}

## Please do like the video and subscribe to the channel. It helps and motivates me to create more content like this.

## If there are any room for improvements please let me know. You can also fork the repository and give me a merge request if you can implement something more.
Swapping Of Two Numbers In Python in One Line
Tags: python, beginners, tutorial, programming
Published: 2022-01-29 12:01:28

## Do you know that using only just 1 line of code in Python you can Swap 2 numbers without using any third variable?

Let's see how can we do that...

**Pre-requisites:-**
1. Download [Python](https://www.python.org/downloads/) and Install it.
2. Code Editor like [Visual Studio Code](https://code.visualstudio.com/download) or others of your choice where you can compile and run your python code.
3. If you're using Visual Studio Code, then install this [extension](https://marketplace.visualstudio.com/items?itemName=ms-python.python) below.
![Python Extension](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mqixkfv9vo4cdj853jan.png) 

---
**Code to Run:-**
```python
# taking input from the user
a = int(input("Enter a number: "))
b = int(input("Enter another number: "))
a, b = b, a  # Swapping two numbers
# printing values in one line after swapping
print("Output:-", a, b)
```
---
**Output:-**
```
PS D:\Coding> & C:/Python310/python.exe "d:/Coding Projects/Swap.py"
Enter a number: 5
Enter another number: 6
6 5
```
---

Another method is shown in this video:-
{% youtube https://youtu.be/9u349PPwfGg %}

---

## Hope this helps you. Thank you for reading, and let's connect!
Thank you for reading my blog. Feel free to subscribe to my [YouTube Channel](https://www.youtube.com/channel/UCsuzc8lqAbgUYo4yzpjtfSw) and connect on [LinkedIn](https://www.linkedin.com/in/susmita-dey-15a15a210/) or [Twitter](https://twitter.com/its_SusmitaDey).
Also, feel free to [support](https://www.buymeacoffee.com/susmitadey) my work.😊
How to install Hugo on Windows 10
Tags: hugo, beginners, codenewbie
Published: 2022-01-29 11:41:43

So Hugo is one of those things that I've dabbled with, struggled with, cursed at, and celebrated.  I am once again diving into the realm of trying to make Hugo create a nice looking website for me once again.  So I've had to install it on my system.

I wanted to share this quick tutorial of installing Hugo on my Windows 10 machine to start the journey with ya'll. 😊

## Download the Hugo latest version
First thing to do is go and download the latest release of Hugo from their official download area - Hugo GitHub Releases.  You are looking for the Source Code Zip file format.

With that file now on your machine you need to get Hugo installed...

## Install Hugo
Take the zip file that you've just downloaded and extract it, I always extract to C:\Hugo\bin

## Environmental Variables
We now need to set an environment variable. If you hit the Windows key on your keyboard and then search for environmental variables, the first results should be how to edit your environmental variables.

Click on Environmental Variables at the bottom of the dialog box that is open.  Click on Path in the top half of the next dialog box and edit that.

Now enter the path you extracted Hugo to.  In my case this will be C:\Hugo\bin.


![Hugo Environment variables](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ynaqog2p5lct2wwddz9s.png)

## Test Install
To test the install open up a PowerShell command shell or a Command Prompt and type in hugo version

You should get back information on the version that has been installed!

You can now go off and use Hugo to build some funky websites! 😉
Center a Div | Jim
Tags: webdev, beginners, css, html
Published: 2022-01-29 11:23:24

Centering a div can be tricky at the beginning.

But no worries, It's simple and you can do it in a lot of ways,

**Side note:** HTML code:
```
<div class='parent'>
  <div class='child'></div>
</div>
```

1. Using flex:
```
.parent {
  display: flex;
  align-items: center;
  justify-content: center;
}
```
and whatever the case is your child element is always centered.

2. Using grid:
```
.parent {
  display: grid;
  align-items: center;
  justify-content: center;
}
```
3. Using grid: (you kidding! again!)
```
.parent {
  display: grid;
  place-items: center;
}
```
It's just a shortcut of using grid.

4. Involving both elements:
```
.parent {
  display: flex;
}
.parent .child {
  margin: auto;
}
```
or,
```
.parent {
  display: grid;
}
.parent .child {
  margin: auto;
} 
```
And there you go. You can now center your element however you want.

See, this [Pen](https://codepen.io/akhlak-hossain-jim/pen/ZEabOZL?editors=1100) as an example reference.
URL Shortener Bot 🔗🤖
Tags: chatbot, landbot, urlshortener, api
Published: 2022-01-29 11:18:14

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

We're on Product Hunt, and your support means a lot. Give your favorite bot some love.

[https://www.producthunt.com/posts/url-shortener-bot](url)
"==" VS "===" in JavaScript
Published: 2022-01-29 10:39:48

So, let's get started:

"==" operator compares variables but not their datatypes.

However "===" operator compares the variables as well the datatypes of these variables and returns "true" only when both are equal. 

Let's understand it with an example:

```javascript
if("5" == 5){
      return true
}
else{
      return false
}
// It will return true.



if("5" === 5){
     return true
}
else{
     return false
}
// It will return false.

``` 

In the above example, both left hand side and right hand side variable is equal but have different data types that is, one is string and the other one is number and since the "==" compares only variables, it returned true.
However, "===" returned false since it compares variable as well as their data types.


Let's see another example:

```javascript
console.log(null == undefined ? true : false)                 //true

console.log(null === undefined ? true : false)              //false
``` 

In the above example, "null" has object data type and "undefined" has undefined data type. 
Since the structure of both the "null" and "undefined" is same, "==" returned true but as we can see both "null" and "undefined" belong to different data types, "===" returned false.

Although it varies from case to case, it is generally safe to use "===".



Hope, you liked the article.
If it added any value, consider giving a ❤️.
Blockchain Technology 
Tags: writing, nextjs, blockchain, react
Published: 2022-01-29 10:12:55

**Blockchain developers are earning twice as much as normal developers.**

But what is blockchain?

Here is a very basic explanation of Blockchain technology.

Blockchain is a chian of blocks that are chained together. It is a decentralised system which means it is not controlled by a single organization. It is a shared and permanent database shared among nodes on a network. It stores data in a way that makes it almost impossible to hack.

## Nodes
Since we know that blockchain consists of numerous amount of data and this data is stored on these nodes. Every node keeps a copy of the previous node in the form of unique ID`s known as Hashes.

## Hashes
A hash itself is basically a numeric value that is used to validate the authenticity of different types of inputs. These hash values can be in different length sizes, from 160-512 bits.

Before we dive into the concept of Decentralization. let`s look at a centralized system.

## Centralized system
In a centralized system, the database consists of a single server into which all the data is stored. So it`s safe to say that all the data resides at a single location and all the applications must retrieve data from that location.

## Decentralized system
If we were to compare the centralized way of storing data to decentralization in the blockchain. We could say that since the data is stored on a peer to peer network of nodes. The blockchain is a decentralized syestem.

## What is a peer to peer network?
A peer to peer network(P2P) connects nodes directly without the need of a centralized server or a third party. Nodes on a P2P network are typically located near each other and run similar protocols.
Try Aquila Network 1.0.0 (Beta)
Published: 2022-01-29 10:10:54

Here's the first batteries included version of Aquila Network — a semantic text search engine. Available as Open Source as well as managed service.
![Aquila Network 1.0.0 features](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pn2ph1rrfwnmqf6fcjbd.png)
Read more about this release: https://medium.com/aquila-network/aquila-network-1-0-0-beta-released-7ef9afb451b0
HTML Anatomy | Jim
Tags: webdev, design, beginners, html
Published: 2022-01-29 09:34:07

As HTML is the soul of the web, we must know how it works (we will focus on writing HTML).
Even though the HTML has different versions in his family, we only speak in the updated version, which is HTML5. So let's start wondering about HTML5.
So this is the basic HTML page structure:
```
<!DOCTYPE html>
<html>
  <head>

  <title>Title of the Page</title>

  </head>

 
  <body>
    
    <h1>A Heading</h1>
    <p>A paragraph.</p>
    
  </body>
</html>
```
There you go with your first HTML code.
But wait a minute 😗, what is that? I got the 'Title of the Page', 'A Heading', and 'A Paragraph', but what are those in <..>..</..>?
Right these are HTML tags. Let me break it down.
First,
```
<!DOCTYPE html>
```
is telling the browser, "Hey, look, I am an HTML5 document. So don't try to read me like other versions of my family, Just read me like me (HTML5)".
So, the browser hears the soul and reads the rest.
Then,
```
<html></html>
```
This tag is the root element of the HTML page. So whatever you are seeing right now is in between this tag.
Next, we have,
```
<head></head>
```
Which tells the browser some useful information about your website/page that you and I don't see so often. In between, we declare the title, description, keywords that appear in the search result. It also holds the CSS and JavaScript contents, character set declarations, and more. Which we will be discussing later on. let's move on to the
```
<title></title>
```
tag. Oh, man! Shouldn't you give your page a name? And if you are saving the page to the bookmark, what is the name your browser should remember(save)/reference it? So this is how the web knows the name of your web or HTML page. Like

![Title in web](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hd08nx0l2qtyuvtqhn5m.png)

Oh, that's a lot we don't see, do we?
Now, time to discover what viewers are seeing on the website.
```
<body></body>
```
This tag tells the browser, "Browser, listen, I've given you a lot of information that viewers can't see. Now whatever declared in between me, show that to the viewers."
Let's declare some,
```
<h1>A Heading</h1>

<p>A paragraph.</p>
```
Which gives us,

![HTML preview](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/e0cfwbnt6z4r7l49ig3p.png)

With `<h1></h1>` you the browser give me a big size of heading.
And with `<p></p>` you just declared a simple text.
**Note**, Html doesn't care about extra spaces. Extra spaces will be removed automatically by the browser.
With everything we just discussed, the web page looks like,

![Web preview](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zzcgjt9wo9pqzy8qpfls.png)

To know even more, visit: [MDN Doc](https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML/Getting_started)
Subscribe to LinkedIn [News Letter](https://www.linkedin.com/newsletters/html-time-6888745679510999041/) 
To see everything in one place, Check and install this web app: [Web App](https://html-time.vercel.app/)
How to get start understanding source code of open source projects?
Tags: opensource, contributorswanted, productivity, programming
Published: 2022-01-29 09:33:57

Hello,

Open source software is awesome and important for the industry. However, whenever I try to read some code for an open source project with the intent to contribute, I get scared. I get this weird anxiety and for some reason my brain freezes. I can't understand anything what the code is doing and how it's working, it looks too complicated even if I kinda understand what things are supposed to do.

I can't describe the feeling. Even if I know the language and I've learned a lot.

How do I start?
New Things Added - Laravel 8.81 Released
Tags: php, laravel, programming, webdev
Published: 2022-01-29 09:23:03

Let's get started quickly I found new things in Laravel 8.81 Released I wanted to share with you.

- Stringable Scan Method

Here we find it in php https://www.php.net/manual/en/function.sscanf.php https://www.w3schools.com/php/func_string_sscanf.asp and this feature is available now in laravel

```php
$this->assertSame(
    [123456],
    $this->stringable('SN/123456')
         ->scan('SN/%d')
         ->toArray()
);
 
$this->assertSame(
    ['Otwell', 'Taylor'],
    $this->stringable('Otwell, Taylor')
         ->scan('%[^,],%s')
         ->toArray()
);
 
$this->assertSame(
    ['filename', 'jpg'],
    $this->stringable('filename.jpg')
         ->scan('%[^.].%s')
         ->toArray()
);
```
- Disable Caching in Attribute Accessors

disable caching for attributes being accessed via the new Attribute class. You can use the new API in a few ways
```php
public function finish(): Attribute
{
    return Attribute::getWithoutCaching(
        fn () => $this->start->addSeconds($this->duration)
    );
}
 
// or
 
public function finish(): Attribute
{
    return Attribute::get(
        fn () => $this->start->addSeconds($this->duration)
    )->disableObjectCaching();
}
```
- Get or Put Collection Method

getOrPut method to collections which simplifies the use-case where you either want to get an existing key or put the value if it doesn't exist and return the value
```php
// Still valid,
if ($this->collection->has($key) === false) {
    $this->collection->put($key, $this->create($data));
}
 
return $this->collection->get($key);
 
// Using the `getOrPut()` method with closure
return $this->collection->getOrPut($key, fn () => $this->create($data));
 
// Or pass a fixed value
return $this->collection->getOrPut($key, $value);
```

I hope you enjoyed with me and to learn more about this release visit the sources and search more. I adore you who search for everything new.
Source :- https://laravel-news.com/laravel-8-81-0
Source :- https://www.youtube.com/watch?v=vuSZPsMePHc
Open Source LEGO CAD
Tags: opensource, cpp, design, github
Published: 2022-01-29 09:16:20

# [LeoCAD](https://github.com/leozide/leocad)
<span><strong><i class="fa fa-star">Star 1.9k</i> <i class="fa fa-eye">Watch 69</i> <i class="fa fa-code-fork">Fork 161</i></strong></span>

# About LeoCAD
LeoCAD is a CAD program for creating virtual LEGO(R) models. It's available
for free under the GNU Public License v2 and works on the Windows, Linux
and macOS Operating Systems.
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ors01efjpos0dv1wqf4c.png)
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/dxfei7pfebzsvrn4sa07.png)


# Installation
You can download the latest version of LeoCAD and its Parts Library from the main website at https://www.leocad.org

It's recommended that you install the latest drivers for your video card since LeoCAD uses OpenGL to take advantage of hardware acceleration for rendering.

## LeoCAD for Windows
Download the latest LeoCAD-Windows.exe to your computer, double click on the icon to launch the installer and follow the instructions.

## LeoCAD for Linux
There are multiple ways to install LeoCAD on Linux.

* Snap Store
You can find LeoCAD in your distribution's Snap Store. Alternatively, you can enter `sudo snap install leocad` to install it using the command line.

* AppImage
Download the latest LeoCAD-Linux.AppImage, make the file executable (`chmod +x`) and run it.

* Flatpak
You can also install LeoCAD releases as a Flatpak from Flathub: https://flathub.org/apps/details/org.leocad.LeoCAD
Note: there might be a delay for new releases to appear there. If you have it already installed, it will be updated.

* From source
If you prefer to compile LeoCAD yourself, go to the GitHub releases page at https://github.com/leozide/leocad/releases/latest and download the source archive from there. If you do not already have a Parts Library installed, you will need to download one and follow the installation instructions. More information on how to compile your own executable is available in the Documentation section of https://www.leocad.org

## LeoCAD for macOS
Download the latest LeoCAD-macOS.dmg to your computer, double click on the icon to open the archive, copy LeoCAD.app to your Applications folder and then launch it from there.

New users should read the online tutorial located at https://www.leocad.org/docs/tutorial1.html to learn how to use LeoCAD.


# Online Resources
- Website:
  https://www.leocad.org

- GitHub page:
  https://github.com/leozide/leocad

- Unstable builds:
  https://github.com/leozide/leocad/releases/tag/continuous


# Legal Disclaimer
LEGO(R) is a trademark of the LEGO Group of companies which does not sponsor,
authorize or endorse this software.
test 2
Published: 2022-01-29 09:03:07

```javascript
 if(token){
        jwt.verify(token, config.secret, (err, payload) => {
            if(err){console.log(err.message)
            res.redirect('/user/login')}
            else{
                console.log(payload)
                next()
            }
        })
    }else{
       
        res.redirect('/user/login')}
    }
```