teleren/devto huggingface dataset:
A palavra chave: this
Published: 2021-03-24 23:01:01

Chegamos a mais um post da minha [saga de estudos](https://dev.to/inando85/bem-vindo-de-novo-javascript-1b48) em JavaScript.

No post de hoje irei falar sobre a palavra chave `this`.

### This

`this` é um objeto de contexto, ele representa o contexto no qual o código atual está sendo executado.

E dependendo de onde o `this` é usado, podemos ter resultados diferentes.

Se usarmos o `this` na raíz do documento, por exemplo, ele irá referenciar o contexto global, no caso caso o window object.

```js
console.log(this) // Window {window: Window, self: Window, document: document, name: "", location: Location, …}
```

Observe o objeto abaixo:

```js
let user = {
 name: 'João',
 age: 31,
 blogPosts: ['Empadão de Frango', '4 receitas de purê de batata'],
 logBlogPosts () {
  console.log(`${this.name} escreveu os seguintes posts:`)

  this.blogPosts.forEach(post => {
   console.log(`- ${post}`)
  })
 }
}

user.logBlogPosts()

// Output
João escreveu os seguintes posts:
- Empadão de Frango
- 4 receitas de purê de batata 
```

Quando invocamos o método `logBlogPosts` criado dentro do objeto `user`, o JavaScript faz com que o valor de `this` seja o objeto no qual o método está sendo usado.

Neste caso acima, o `this` está referenciando o próprio objeto `user` e por este motivo é possível acessar suas propriedades.

#### This e Arrow Functions

Observe que não utilizei arrow function para a criação do método `logBlogPosts`, e isso foi intencional, pois as arrow functions funcionam de forma diversa quando utilizamos o `this`.

Quando criamos um método utilizando function declaration, conforme o exemplo do método `logBlogPosts` criado no objeto `user` acima, o JavaScript atribui o `this` ao contexto daquele objeto.

Se usarmos arrow function, o JavaScript irá atribuir ao `this`, o contexto do objeto global, no caso o window object.

Então, quando for necessário usar um método dentro de um objeto, que tenha que referenciar o próprio objeto em que o método foi criado, precisamos que esse método seja declarado com function declaration e jamais com arrow function.

```js
let user = {
 name: 'João',
 age: 31,
 blogPosts: ['Empadão de Frango', '4 receitas de purê de batata'],
 logBlogPosts: () => {
    console.log(`${this.name} escreveu os seguintes posts:`)
  }
}

user.logBlogPosts() // escreveu os seguintes posts:
```

Conforme visto no exemplo acima, o método `logBlogPosts` não teve o objeto `user` referenciado com o uso do `this` e com isso, não teve acesso a propriedade `name`.

Ficamos por aqui com mais um post.

Segue documentação da MDN sobre a palavra chave [this](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this)

________________________________________________________________

Esse foi mais um post da minha saga de estudos em JavaScript Vanilla. Espero que estejam gostando!

Qualquer dúvida ou sugestão, vocês me encontram nas minhas redes sociais:

[LinkedIn](https://linkedin.com/in/inando85)
[GIthub](https://github.com/inando85)
[Twitter](https://twitter.com/inando85)
My experience with HTML and Bootstrap 5
Published: 2021-03-24 22:42:03

One of my weaker areas in developing web application is by far using html and css to style the web page. In my second milestone project for Flatiron school, I developed a Sinatra web application in which I needed to incorporate html and css to style my web pages and make it look pretty. While building the backend of the application was fairly easy, I definitely felt like I spent most of my time working with the HTML and CSS aspect. 

In my application I incorporated Bootstrap 5 to help with styling of some aspects of my app like the buttons and log-in page. At first I was super confused at some of the classes that Bootstrap uses. For example...
```HTML
<td><form class="edit" action="/stocks/<%= stock.id %>" method="get">
          <input type="submit" class="btn btn-primary" name="" value="Stock Info">
        </form></td>
```
At first glance I was confused with the class names like "btn btn-primary". But with further investigation the reason for that is to help tell Bootstrap how I want to style a specific element. For example in the snippet above, I am telling Bootstrap to style the input element to look like a blue button called Stock Info. Bootstrap has many classes like this to help provide styling to your project with ease. 

You can apply this concept to other elements like creating a flash alert. For example...
```HTML
  <div class="container-c alert alert-danger" role="alert">
    <%= flash[:notice] %>
  </div>
```
This code snippet will provide a red looking alert at the top of the page when I get an error message. The reason for the look comes from the class name "alert alert-danger".

The more I used this concept the more natural it felt using Bootstrap to help style with ease.
#Day4 - Sets and Frozensets in Python
Tags: 100daysofcode, codenewbie, programming, python
Published: 2021-03-24 22:21:13

Sets and Frozen Sets are built-in data types in Python. Both of them are unordered datatypes used to store distinct elements. If you have worked with a different programming language, you might be familiar with Set. However, Frozen Sets are not so common and unique to Python. The biggest advantage of a set and frozen set are the fact that they have a lookup time of O(1).

Frozen Sets are built on top of Sets and as a result, they have many similarities.

A quick summary of their similarities and differences, all of them are discussed.
**Similarities**
- Both contain distinct elements only
- Traversing
- Lookup
- Both can contain Hashable elements only
- Intersection, Union, and Difference

**Differences**
- Creation
- A Frozen set is hashable and mutable while a Set is not hashable and immutable
- A Frozen set can be used as a key in a dictionary

### Creation
To create a set or a frozen set, all we need is iterable. It will only store the distinct elements.

![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1616619444748/hJNFrsrHQ.png)

### Treversing a Set/Frozen Set
Both support ** for......in** and can be traversed.

![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1616620152249/yd9-J3E2u.png)

### Lookup
Both sets and frozen sets can only store hashable elements. You can not create a set of lists since a list is not hashable. Since sets and frozen sets only contain hashable elements, each element has a hash value associated with it. As a result, using the **in** operator takes O(1) time. Since they are unordered, both of them do not support indexing


![1_U5-VIijFMTd-n1JeWSXI6A.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1616622066200/bCndCuZkE.png)

The picture was taken from [this article](https://towardsdatascience.com/python-sets-are-underrated-55fc27db2ada) on Medium

### Intersection, Union and Difference in Sets/Frozen Sets
- **Intersection**  :  & (and)
- **Union** :  | (pipe)
- **Difference**: - (subtraction)

![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1616622505936/FmOkXfP8S.png)

### Mutability
A set is mutable while a frozen set is not. This basically means that a set can be updated after it's created but a frozen set can not. Once a frozen set is created, the elements inside it are frozen.

![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1616623810766/ctzHJhNQ0.png)

### Hashability
A frozen set is hashable, i.e it can have a hash value. On the other hand, a set is not hashable. As a result of this, a frozen set can be used as a key for a dictionary but a set can not be used.

![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1616623829292/i1FvVJfYy.png)

### Summary
- Both Frozen Sets and Sets have O(1) lookup time
- Neither of them supports indexing
- Both can be traversed using **for.....in**
- A set can be updated after creation but a frozen set can not be updated
- Only Frozen Sets are hashable and can be used as dictionary keys
How to Learn Modern JavaScript (Not Dying in the Process)
Tags: javascript
Published: 2021-03-24 22:17:45

JavaScript is one of the most popular languages nowadays. However, it's challenging to learn. Many people find it confusing, overwhelming. If you're a beginner and want some help on how to tackle JavaScript, here are some useful tips for you:

## Don't Strive for Perfection: Programming is Making Mistakes
In 1999, the Mars Climate Orbiter was a spacecraft that NASA launched to explore Mars. However, the orbiter went off course and the mission failed. NASA lost $327 million in this mission.

The problem? A component, built by a third party, sent measurements in the imperial system (i.e. miles, yards, pounds, etc.), but the component that received them, built by NASA itself, expected values in the metric system (i.e. metres, kilograms, etc.)

**Every single developer in history has made bugs and mistakes. Every single one of them.** And they will continue making them, no matter how talented or experienced they are. So, don't discourage if you make mistakes while learning, even if it happens many times!

Mistakes are not only a part of learning, they're a part of programming.

## Yes, There Are Problems With The JS Ecosystem
In other languages, there are a small set of libraries and frameworks that become the _de facto_ standard, the safe choice. For example, if a Ruby developer wants to build a website, they'll probably use the Ruby on Rails framework. If a PHP developer wants to do the same, they'll do it with Laravel.

Other options and alternatives do exist, but these libraries are the default choice in these other languages.

On the other hand, **in the JS world, there are simply too many options for doing anything**. How do you want to use for the UI: React, Vue.js, Angular, Svelte? And how to manage the state: Redux, Vuex, Mobx? 

So, if you find yourself struggling with having to choose which library or framework to use, remember that you're not necessarily the problem.

By the way, I've made a guide to help you decide [which framework to use](https://nicozerpa.com//which-ui-framework-should-you-use-in-your-next-project/).

## You'll Never Stop Learning JavaScript
I've started learning JavaScript when I was 13 years old, and I'm 31 at the time of writing this. But I still have things to learn about the language, even after 18 years of using it (and 12 years of professional experience.)

But thankfully, **you don't need to know 100% of JavaScript (or any language) to start doing great things**. In fact, I think it's a great idea to start practising doing projects with what you already know.

---

p.s. Did you like what you've read? Every week I send an email with free tips and insights to become a better JavaScript dev. If you're interested, [click here to subscribe](https://nicozerpa.com/newsletter/).
Kedro pipeline_registry.py
Tags: python, kedro, datascience
Published: 2021-03-24 21:53:40

---
content_hash: 49482f4c160ff25f23bd0e0c2601f795
path: pages/blog/kedro-pipeline-registry.md
slug: kedro-pipeline-registry
published: true
tags:
- python
- kedro
- DataScience
title: Kedro pipeline_registry.py
canonical_url: https://waylonwalker.com/kedro-pipeline-registry/
series: kedro
---

With the realease of `kedro==0.17.2` came a new module in the project template `pipeline_registry.py`.  Here are some notes that I learned while playing with
this new module.

## migrating to `pipeline_registry.py`


* create a `src/<package-name>/pipeline_registry.py` file create a
* `register_pipelines` function in `pipeline_registry.py` that mirrors the
* register_pipelines method from your `hooks.py` module do not bring the
* `hook_impl` decorator remove register_pipelines method on your `ProjectHooks`
* class

You should now have something that looks like this in your
`src/<package-name>/pipeline_registry.py`.

``` python 
"""Project pipelines."""
from typing import Dict

from kedro.pipeline import Pipeline


def register_pipelines() -> Dict[str, Pipeline]:
    """Register the project's pipelines.

    Returns: A mapping from a pipeline name to a ``Pipeline`` object.
    """
    return {"__default__": Pipeline([])}
```


> pipeline_registry only works in `kedro>=0.17.2`

## Conflict Resolution

_What happens If I register pipelines in both places_

I was not able to find any official documentation on how conflict resolution worked so I stepped into a project and added to both my `hooks.py` and `pipeline_registry.py` file.  I noticed that it would pick up pipelines from both modules, but pipelines from `hooks.py` always take precedence.  The entire duplicate pipeline will be over written by the one from `hooks.py`.

>  kedro automatically merges pipelines from both hooks.py takes precedence

## Ready to update

In my experience there were no issues upgrading from `0.17.1` to `0.17.2`.  I would reccomend only having one `register_pipelines` so decide to migrate to the new `pipeline_registry.py` or keep it in your `hooks.py`, but both is only going to lead to confusion.
Day 336 : The Word
Tags: hiphop, code, coding, lifelongdev
Published: 2021-03-24 21:29:03

_liner notes_:
- Professional : Meetings. That was the word for today. haha Right after the meetings, I worked the booth for CityJS conference. Good thing I did my coding work earlier in the week. haha.

- Personal : Last night, I got the video recorder working on the dashboard of my side project. It doesn't look good, and there is an error when I send the recorded video to the review video player, but it records. haha I think my issue is that I'm hiding the review video until the video is recorded so when I try to set source with the recorded video, it's not there yet. It's a small thing and I'll figure it out. Also went through a bunch of tracks for the radio show..

![A lake surrounded with mountains in the distance, pine trees and a small island in the middle with some pine trees in Spirit Island, AB, Canada.](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hrj8hhwbhwa2873mpvap.jpg)

It's Wednesday, which means $5 sushi at the supermarket! Going to head over there once this conference is officially over which I think is soon. Get one more lap around the park. I've also been filling up water bottles at a fountain. Forgot that I'm backing up old tracks to the cloud. I'll probably leave after that completes, then head to the supermarket. After that, going to fix the recorded video issue, get that uploaded to the storage and continue on the next data to be uploaded. Maybe go through some tracks for the radio show and watch some anime. 

Have a great night!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube A83UtSv87Z8 %}
Hi there, I’m Looking To Collaborate with Data Scientists, Machine Learning Engineers, and Content creators, and developers
Tags: datascience, machinelearning, deeplearning, ai
Published: 2021-03-24 20:54:35

Hi there, I'm Ahsan👋 Creater, Data Scientist and Researcher👨‍💻!
🏛️ 3rd year CS Student, at University Of Okara
✔️ Data Scientist | Machine Learning Engineer
👨🏽‍🌱 I’m currently Exploring Data Science and Machine Learning
👯 I’m looking to collaborate with other content creators and developers
🥅 2021 Goals: Contribute more to Open Source projects,
Here is My GitHub Profile Link
https://github.com/ahsanshareef21
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jy8yr83bthe18fghf8to.png)
My Résumé Workflow
Tags: productivity, process
Published: 2021-03-24 20:05:46

Resumes! That almighty document, it's what recruiters crave!! You need one (unless you're extra special) and there are many ways of making your resume. There are [web apps](https://resume.io), [design templates](https://www.canva.com/create/resumes/) and even [dinosaur-era® software](https://store.steampowered.com/app/707280/ResumeMaker_Professional_Deluxe_20/) available for use. This is how I do mine.

So...over the years, I've produced my resume using various tools: ms-word, latex and yes even (at the time) macromedia flash. I found latex to produce the best results but I ran into two problems. Latex is ugly to write even though it produces gorgeous results AND most recruiters insist on word documents because *reasons*. It's possible to convert latex to word docs but I didn't succeed in doing so. I ended up maintaining two different formats of the same resume which was inefficient.
```latex
% seriously dis ugly
\begin{document}
\renewcommand{\labelitemi}{$\circ$}
\newcommand{\mywebheader}{
\begin{tabular*}{7in}{l@{\extracolsep{\fill}}r}
	\textbf{\href{http://www.goldenxp.com/}{\LARGE SUNDER IYER}} & \href{http://www.goldenxp.com}{http://www.goldenxp.com}
\vspace{0.1in}}
```
Now I just use [JSONResume](https://jsonresume.org). It's easy to write, has many beautiful templates and supports [hosting](https://registry.jsonresume.org/goldenxp) with easy previews. 
![Hosting preview of two templates](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9cspbq6v6afwijfzpazy.png)
The links can be shared or saved and distributed as a PDF. But what about those pesky word docs? [ResumeFodder](https://www.resumefodder.com/) to the rescue! 
I have a batch script that uses ResumeFodder and it converts the JSONResume file into a word XML file which opens nicely in Microsoft Word. No complaints yet!
![Word document version of JSONResume](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/p8xkg2s8bbt66ks2r69m.png)
Currently I have modified the XML template that's used to generate the final doc but in the future I hope to take this further with selective data export.
How HTML attributes become DOM object properties during page parse ?
Published: 2021-03-24 20:04:52

when a browser loads or parses a page most of the HTML attributes automatically become properties of DOM object. for example if there is a tag <body id="page">,then the dom will have Dom.id="page" properties.
but the attribute-property mapping is not one-to-one. below we will see some of the things to consider.

1. there are build-in Dom properties but we can add new properties too.
Challenges for Junior Devs w/ Monarch Wadia | Podcast
Tags: webdev, bootcamps, hackathon, podcast
Published: 2021-03-24 19:46:35

{% spotify spotify:episode:7vr7dlGOERtU9kmA5uTM8O %}

## What is HTML All The Things

HTML All The Things is a [web development podcast](https://podcast.htmlallthethings.com/) and [discord community](https://discord.com/invite/jweMCx9) which was started by Matt and Mike, developers based in Ontario, Canada. 

The podcast speaks to web development topics as well as running a small business, self employment and time management. You can join them for both their successes and their struggles as they try to manage expanding their Web Development business without stretching themselves too thin. 

## Guest Introduction

Today, we're speaking with Monarch Wadia, an industry veteran and founder of [Mintbean](https://www.mintbean.io/), an organization that has hosted over 150 events including hackathons, webinars, and workshops. These events have spanned over 100 campuses across 150+ cities internationally.

And while that's already a lot, Monarch is also the founder of [Zero Projects](https://www.zeroprojects.ca/) a software development firm from Toronto, Canada.

## Show Notes

5:00 - Should you attend programming events or buckle down and code on your own?

11:14 - Coding is a trade

16:20 - Jr. Developer Training (or lack there of)

23:50 - Budgeting time for company structural changes

27:39 - Senior vs Junior dev pay gap

33:20 - Legacy web agencies vs startups that use new tech

40:00 - The need for Cobalt and Fortran developers

43:10 - Interview techniques

50:00 - Does traditional education matter

55:50 - Mintbean Hackathons

61:04 - Jack of all trades, master of none

##Key Takeaways

* 80% coding vs 20% networking
* Use hackathons to do both at the same time
* Mintbean.io provides weekly online hackathons to promote this 
* Regardless of the level of coding knowledge you're at, just code code code
* Coding is more of a trade then a traditional job
* Systems need to be put in place to allow masters to pass their knowledge on to students
* Apprenticeships are needed to facilitate the passing of knowledge
* Coding is a 'craft' and if you don't enjoy doing it for long periods of time, coding might not be for you
* Plenty of other careers in this space that are associated to coding, i.e project manager
* Sink and swim mentality in a lot of startups can bury junior developers
* Training is never standardized across companies and sometimes is non-existent

##Social Links

You can find us on all the podcast platforms out there as well as

[Instagram (@htmlallthethings)](https://www.instagram.com/htmlallthethings/)
[Twitter (@htmleverything)](https://twitter.com/htmleverything)
[Facebook (Html All The Things)](https://www.facebook.com/htmlallthethings)
Lei de Demeter
Tags: oop, ptbr
Published: 2021-03-24 19:44:39

> A Lei de Demeter ou principio do conhecimento minimo é uma diretriz de desenvolvimento de software, particularmente de sistemas que utilizam a programação orientada a objetos.
— Wikipedia

Esta lei foi proposta por Ian Holland em 1987. Holland e seus colegas estavam programando um sistema chamado Demeter usando programação orientada a objetos. Durante o desenvolvimento do sistema, eles perceberam que o código que atendia a uma série de regras era menos acoplado.

A Lei de Demeter exige que um método m de um objeto O só pode invocar os métodos dos seguintes tipos de objetos:
* O próprio.
* parâmetros de m.
* Quaisquer objetos criados / instanciados em m.
* Objetos componentes diretos de O.
* Uma variável global, acessível por O, no escopo de m.

Em resumo, todas as regras acima podem ser resumidas dizendo que você deve evitar invocar métodos de um objeto retornado por outro método. Em linguagens orientadas a objetos modernas, o identificador usado é ponto ou ->. Portanto, a lei de Demeter é violada quando o código tem mais de uma etapa entre as classes. 

Um exemplo de código em que a lei de Demeter é violada é apresentado a seguir:

` const data = cliente.ultimoPedido.dadosPedido.dataEmissao `

Nesse caso é conhecido a estrutura interna do objeto ultimoPedido. O problema nisso é que em uma modificação da classe ultimoPedido, as propriedades podem não existir mais e assim ocorrerá uma quebra no sistema, um chamado a uma propriedade nula.

Nesse caso o ideal é que seja feito na classe ultimoPedido um getDataEmissao para ser usado em outras classes.

` const data = ultimoPedido.getDataEmissao() `

Assim, mesmo que se modifique a classe ultimoPedido o método ainda existe e vai retornar a informação necessária.

**Principais Vantagens**

* Dependências entre classes e acoplamento são reduzidas.
* Classes podem ser reutilizadas com facilidade.
* Código é mais fácil de testar.
* Código é mais fácil de manter e flexível para mudanças.
What crossbrowser tips do you seggest me?
Tags: discuss, codequality, webdev, help
Published: 2021-03-24 19:35:07

---
title: What crossbrowser tips do you seggest me?
published: true
description: What strategies do you implement for an excellent crossbrowser development?
tags: discussion, codequality, webdev, help
cover_image: https://images.unsplash.com/photo-1590595906931-81f04f0ccebb?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=1050&q=80
---

This morning I read about how much Google is working on crossbrowsing. 

> Google is partnering with other browser vendors and industry partners to fix the top five browser compatibility pain points for web developers

https://web.dev/compat2021/

I was pleasantly surprised by this, because for me the verification of multiple devices always turns out to be boring.

What strategies do you implement for an excellent crossbrowser development?