teleren/devto huggingface dataset:
First time writing Python with sub-directories?
Tags: python, beginners, programming, tutorial
Published: 2022-04-21 02:37:42

## Are you writing your first Python program, and you have folders within folders, within folders?

**Pretty Simple**

I'd like to learn how to run my own Image Recognition software using Python. I started with making a new file, and I named it main.py. Im thinking its going to be easy like what you see on YouTube. Ahhh ya.. not so much. 

Did you know, that when you have a file structure like this:

 - user/desktop/src/Lib/site-packages

and in your code you would like to import a package from `site-packages` but your main.py file you just made is in your src folder. Just importing like this isnt enough.

```
import PySimpleGUI
```

Because once you run and complie your main.py file, you will most likely get a error that says something like this:

```
ImportError: cannot import name 'PySimpleGUI' (unknown location)
```

Then it hits you. You are the worse programmer that ever exists. Don't worry, I was there today.. 

## GUESS WHAT!?

**It's just imposter syndrome kicking in, you are not a failure.**

Matter of fact, something I discovered that took me 3 hours to find was a tiny little file called:

`__init__.py`

Believe it or not, this file is in every folder that has some kind of python file. Supposely, for everwhere you want your code at, or where your packages are, you need an `__init__.py` file. **EVEN** if the file is blank. 

The __init__.py file lets the Python interpreter know that a directory contains code for a Python module. An __init__.py file can be blank. Without one, you cannot import modules from another folder into your project.

## YOUR WELCOME!!

I know right!? Could it have been that easier with everything else in life.. If only!

---

So next time you get stuck in Python and you cant run/compile your code, hopefully you remember did you add an __init__.py file to your directories yet?

Hopefully, you do from now on. 

Save this post! It will save your life from the aggervation you will find yourself in.. lol

Thanks everyone for reading.
How to Remove a Property from a JavaScript Object
Tags: javascript, beginners, tutorial, codenewbie
Published: 2022-04-21 02:09:13

There are two ways to remove a property from a JavaScript object: one is the mutable way of doing it by using the delete operator. And the second one is the immutable way of doing it by using [object restructuring](https://www.wisdomgeek.com/development/web-development/rest-and-spread-operator-three-dots-that-changed-javascript/). Let us go through each of these:

## 1. The delete operator

delete is a JavaScript instruction that allows us to remove a property from a JavaScript object. There are a couple of ways to use it:

* delete object.property;

* delete object[‘property’];

The operator deletes the corresponding property from the object.

    let blog = {name: 'Wisdom Geek', author: 'Saransh Kataria'};
    const propToBeDeleted = 'author';
    delete blog[propToBeDeleted];
    console.log(blog); // {name: 'Wisdom Geek'}

The delete operation modifies the original object. Therefore it is a mutable operation.

## 2. Object destructuring

Using the object restructuring and rest syntax, we can destructure the object with the property to be removed and create a new copy of it. After the destructuring, a new copy of the object would be created and assigned to a new variable without the property that we chose to remove.

    const { property, ...remainingObject } = object;

For example:

    let blog = {name: 'Wisdom Geek', author: 'Saransh Kataria'};
    const { author, ...blogRest } = blog;
    console.log(blogRest) // {name: 'Wisdom Geek'};
    console.log(blog); // {name: 'Wisdom Geek', author: 'Saransh Kataria'}

If we want to do this dynamically, we can do this:

    const name = 'propertToBeRemoved';
    const { [name]: removedProperty, ...remainingObject } = object;

It is also possible to remove multiple properties using the same syntax.

And those are the 2 ways to remove a property from a JavaScript object. If you have any questions, feel free to drop a comment below!

*Originally published at [https://www.wisdomgeek.com](https://www.wisdomgeek.com/development/web-development/javascript/how-to-remove-a-property-from-a-javascript-object/) on August 29, 2021.*
Ye Olde TicTacToe
Tags: beginners, python, programming
Published: 2022-04-21 01:53:12

It is time. Time for the one of the greatest rites of passage of all time... [Programming Tic Tac Toe.](https://github.com/xarop-pa-toss/py-tictactoe) 

I've been going through the great Edube Interactive Python beginner course and I was sort of expecting it to show up at some point.
They restricted my moves a bit by setting up some functions beforehand; I didn't see the use in a couple of them at the start but since they were there, I tried to incorporate them into my solution. It made the whole thing even more fun :)

I already programmed ConnectFour before so this, although still a challenge, wasn't completely new.
I coded the whole thing in about 3 hours but I have to say, it's probably some of the sloppiest code I've ever written. It really drives home the need to learn best practices from the start, which is harder than you'd give it credit to be honest. Lots of good tutorials on how to code, but learning best practices requires a non-basic knowledge of whatever you're learning.
But all in due time.

Do you remember when you first programmed Tic Tac Toe? What challenged you the most? =D
Using position absolute in a grid
Tags: css
Published: 2022-04-16 11:47:43

This is a [cool thing I saw on Kevin Powell's YouTube channel](https://www.youtube.com/watch?v=Hf_dDLLmPK8), and then actually used!

The cool thing is that if you have a grid child with position absolute, you can use the grid to position it. Let me show you what I mean.

## The HTML
```html
<div class="grid">
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div class="absolute"></div>
</div>
```
I have a div of class grid and inside it there are 10 grids. 9 of them have no class, but the last has a class of absolute - this will be our absolutely positioned element.

## The CSS setup
Without content the divs will have no width or height, so I've needed to make that explicit. I've also given everything background colours so it's easy to see what's going on.
```css
body {
  height: 100vh;
}

.grid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, 33vw);
  grid-template-row: repeat(3, 33vh);
  width: 100%;
  height: 100%;
}

.grid > div:nth-of-type(odd) {
  background-color: pink;
}

.grid > div:nth-of-type(even):not(.absolute) {
  background-color: aliceblue;
}
```
This gives us a lovely grid of 3 columns and 3 rows alternating in pink and light blue that fill the screen.

A quick note about how I'm adding the background colours. `:nth-of-type` is a selector that lets you select a subset of elements. It handily includes odd and even options, so in a 3x3 grid there are never two colours next to each other.

The `>` tells it to select the direct children - although in this case all the children are direct.

To the even divs I've added `:not(.absolute)` because I want the absolutely positioned div to be a different colour. Because this selector is more specific it will override anything I add to the .absolute div, so I've specifically excluded it.

I could have given classes to the divs of odd and even, but this felt easier while I was writing the HTML.

## Adding the absolutely positioned element
```css
.absolute {
  position: absolute;
  width: 33vw;
  height: 33vh;
  background-color: yellow;
}
```
This code will make this element the same size as all the other divs, just to make it look pretty, and yellow so it stands out. Because it's positioned relative to its relatively positioned parent, and that parent is the grid, it's positioned at the top left of the grid.

I want to move it into the centre. I could do that with top, left and transform: translate, or use the grid by adding:
```css
  grid-column: 2;
  grid-row: 2;
```
And it's now centred. How cool is that?

{% codepen https://codepen.io/nicm42/pen/jOYQGwv %}

## A note about blogging
I've been posting weekly since November 2020. Which sounds like a long time now I've seen it written down! Now the weather's warming up and it's easier to do things outdoors without having to worry about Covid, my diary is filling up. So I'm going to go fortnightly so I can enjoy having a social life before things inevitably get more Covidy in the winter.
Learning Finnish software engineering vocabulary
Tags: finnish, blog, software, language
Published: 2022-04-21 00:54:50

Before I wrote this article, I was wondering if it would be OK to post this to Dev.to. But since this is not a 100% off topic, I decided to post.


Do you study another language besides English? 
In my case, Yes. 

I have been learning Finnish since 4 years ago. In case you don't know what it is, it is an official language in Finland, and [also known as one of the hardest languages for English speakers](https://yle.fi/news/3-6690499). You might get a question like, "Hmm, did you live in Finland before?" or "Do you have friends there?" The answer is no. It is a long story why I started learning the language, so I don't write detail here. But in short, I was a big fan of Heavy metal from the country, and that's the beginning. 

Anyway, as I was gradually able to read real Finnish (i.e., not Easy-Finnish) articles, I began to want to learn software related vocabulary in Finnish. However, as I expected, I was not able to find a good list to start. I found some lists but there were for more general words. So, I googled or looked up in a dictionary, and jot down one by one. Here is part of my notes:

**VOCAB LIST**
argument : argumentti
array : taulukko
backend : back end
class : luokka
click (verb): klikata
cache : välimuisti
code : koodi
colon (:) : kaksoispiste
constructor : konstruktori
compile (verb): kääntää 
computer : tietokone
cookie : eväste
data : tieto
database : tietokanta
define (verb): määritellä
deploy (verb): sijoittaa
developer : kehittäjä
domain name : verkkotunnus
download (verb) : ladata
engineer : insinööri
file : tiedosto
folder : kansio
frontend : front end 
function : funktio
integer : kokonaisluku
keyboard : näppäimistö
operating system : käyttöjärjestelmä
namespace : nimiavaruus
object oriented programming : olio-ohjelmointi
parameter : parametri
performance : suorituskyky
polymorphism : polymorfismi
process : prosessi
programming : ohjelmointi
responsive : responsiivinen 
save (verb) : tallentaa
semicolon (;) : puolipiste
server : palvelin
session : istunto
software : ohjelmisto
software developer: ohjelmistokehittäjä
software engineer : ohjelmistoinsinööri
source code: lähdekoodi
terminal : terminaali
test : testi
user interface : käyttöliittymä
value : arvo
variable : muuttuja
webpage : verkkosivu 
website : verkkosivusto

I cannot confirm if those words are really used in actual workplaces because I have no Finnish friends. But I hope this list can save someone's time.

Before I close this post, I want to write little about my learning experience of this language so far. Its grammar is surely hard but hardest part for me is listening comprehension. Unlike major languages such as Spanish, there is a very limited number of intermediate level listening stuff with subtitles, so I lost where to start when I was leaving Easy-Finnish materials. This is still a tough issue. Fortunately, I found some Finnish youtuber videos with subtitles, so I continue this journey.
Array.some() - for testing that at least one item meets a condition
Tags: javascript
Published: 2022-04-21 00:45:59

This article is the sixth of the [Array Method Series](https://dev.to/dillionmegida/series/17614). In this article, I will explain what the `some` Array method is.

## What is the Some Method?
The `some` method of arrays is a higher-order function that tests if at least one item in the array meets a certain condition. If one item meets it, it returns `true`, and if no item meets it, it returns `false`.

This method does not modify the array. It only loops through and applies a condition on each item until it finds the one that matches. This means that if it finds an element that matches, it doesn't continue looping the remaining items in the array. It immediately returns `true`.

## Syntax of the Some Method

```js
array.some(function(item, index, array){
  // condition to test item with
  // return true or false
})
```

The `callbackFunction` passed to the `some` method is applied to each item in the array until it finds the item that matches the condition in the function.

The arguments passed to the callback function in each loop are the `item`, the `index` of the item, and the original `array`.

## Without the Some Method
The `some` method is an abstracted function that does a quick check and stops at the first item that passes a certain criterion. Here's an example imitating the `some` method:

```js
const array = [1, 2, 3, 4, 5, 6, 7, 8]

let hasEvenNumber = false

for (let i = 0; i < array.length; i++) {
  const item = array[i]
  console.log(item)
  if (item % 2 === 0) {
    hasEvenNumber = true
    break
  }
}

console.log(hasEvenNumber)
// 1
// 2
// true
```

This loop approach is similar to what the `some` method does in the background. It loops through each item, and when it finds the item that matches the specified condition, it stops the loop and returns `true`.

## With the Some Method

Here's how you achieve the previous result with `some`:

```js
const array = [1, 2, 3, 4, 5, 6, 7, 8]

const hasEvenNumber = array.some(item => {
  console.log(item)
  return item % 2 === 0
})

console.log(hasEvenNumber)
// 1
// 2
// true
```

From the result, you can see the first log `1`, which is the item in the first loop, `2`, the item in the second loop, and since `2` matches the condition, `some` stops the loop and immediately returns `true`.

The `some` method is useful when you have different values in an array, and you want to assert that at least one item meets a condition or that no items meet a condition.
E2E Testing an App with Clerk Authentication in Cypress
Tags: javascript, webdev, testing, nextjs
Published: 2022-04-21 00:39:25


Background: [Clerk](https://clerk.dev/) is a hosted authentication and user management product.

---

I recently started writing E2E tests in Cypress for an app that uses [Clerk](https://clerk.dev/) for authentication, and there wasn’t anything out there to guide me, so here’s what I ended up with after fiddling with it for a bit.

(Note: In my case, this is a Next.js app using Clerk’s Next.js SDK, but my understanding is that this code will work everywhere, because their client SDKs all ultimately use ClerkJS under the hood.)

I wrote a [custom Cypress command](https://docs.cypress.io/api/cypress-api/custom-commands) that waits for Clerk to load, signs the user out if they aren’t signed out already, and then signs in with test credentials (see [here](https://docs.cypress.io/guides/guides/environment-variables) for how you can set these so that they’re accessible via `Cypress.env()`).

```ts
Cypress.Commands.add(`initializeAuth`, () => {
  cy.log(`Initializing auth state.`)

  cy.visit(`/`)

  cy.window()
    .should(window => {
      expect(window).to.not.have.property(`Clerk`, undefined)
      expect(window.Clerk.isReady()).to.eq(true)
    })
    .then(async window => {
      await window.Clerk.signOut()
      await window.Clerk.client.signIn.create({
        identifier: Cypress.env(`TEST_USER_IDENTIFIER`),
        password: Cypress.env(`TEST_USER_PASSWORD`),
      })
    })
})
```

If you’re using TypeScript to write your tests (which I recommend!), you’ll also want to add this command to your [custom command types](https://docs.cypress.io/guides/tooling/typescript-support#Types-for-custom-commands).

```ts
declare global {
  namespace Cypress {
    interface Chainable {
      /**
       * Initialize auth to a state where you're logged in as the test user.
       * @example cy.initializeAuth()
       */
      initializeAuth(): Chainable<void>
    }
  }
}
```

Ultimately, you’ll probably want to use this command in a `before` or `beforeEach` hook to reset the auth state before every test, like so:

```ts
describe(`Test Page`, () => {
  beforeEach(() => {
    cy.resetDatabase() // another custom command
    cy.initializeAuth()
  })

  // ... tests go here
})
```

Happy testing! Please let me know if you run into problems with this approach.
Day 12: Up all night
Tags: productivity, career
Published: 2022-04-21 00:13:57

Hi!
yeah 2pm I had to rush to capture the screenshot just right on time but I was up all night anyway working on on a task that is due tomorrow and here I am now!
I'm like tired to the point I'm not even thinking straight just Writing random words before I can sleep
I expect tomorrow to be exactly the same as today even if I made a huge progress today 
let's hope that I will find some time to work on a new guide article soon 

stay strong!
signing off...
Google T5 Translation as a Service with Just 7 lines of Codes
Tags: datascience, machinelearning, deeplearning, python
Published: 2022-04-21 00:09:44


What is T5? Text-To-Text Transfer Transformer (T5) from Google gives the power of translation.

![translation](https://cdn-images-1.medium.com/max/3220/1*ha7jBw-tKjJIvFg1mUggpA.png)

In the article, we will deploy Google T5 model as a REST API service. Difficult? What about I’ll tell you: you just need to write 7 lines of codes?

![translation](https://cdn-images-1.medium.com/max/2564/1*CrZSaMXivXviTbf-_1C47w.png)

[**HuggingFace](https://huggingface.co/)** makes it easy to use the pretrained model with just several lines.

[**Pinferencia](https://github.com/underneathall/pinferencia)** makes it super easy to serve any model with just three extra lines.

![translation](https://cdn-images-1.medium.com/max/3280/1*Rh4v6AN0fnqg4WNIMVW4bw.png)

## Install Dependencies

### HuggingFace

pip install "transformers[pytorch]"

If it doesn’t work, please visit [Installation (huggingface.co)](https://huggingface.co/docs/transformers/installation) and check their official documentations.

### Pinferencia

pip install "pinferencia[uvicorn]"

If it doesn’t work, please visit [Install — Pinferencia (underneathall.app)](https://pinferencia.underneathall.app/install/) and check their official documentations.

## Define the Service

First let’s create the app.py to define the service:
{% gist https://gist.github.com/wjiuhe/a77248430dc7c79e85445fa3bb7be360.js %}
## Start the Service

    uvicorn app:service --reload

Wait for the model get downloaded. When it’s finished, you’ll see:

![finished](https://cdn-images-1.medium.com/max/2220/1*7O91O5ye4iVdYuSsadfFcQ.png)

## Call the Service

You can use curl or the interactive api page from Pinferencia.

### Curl

![curl](https://cdn-images-1.medium.com/max/3028/1*q-NwzMmdJWJZkz8JrSRIkw.png)

The result:

![result](https://cdn-images-1.medium.com/max/2836/1*pZxmjOk4bzDz1Wvf9pU0eA.png)

### Interactive API Page

![api page](https://cdn-images-1.medium.com/max/5776/1*2sxW4ldWfjLv7bpyYyinrw.png)

Result:

![result](https://cdn-images-1.medium.com/max/5808/1*NqAMPTBB1tXboQ7c7djLJg.png)

If you like [Pinferencia](https://github.com/underneathall/pinferencia) don’t forget to go to [GitHub](https://github.com/underneathall/pinferencia) and save to your favorites.
#42 - How many pages in a book? - Codewars Kata (6 kyu)
Tags: javascript, programming, 100daysofcode, computerscience
Published: 2022-04-21 00:02:06

##Instructions
**Task**
Every book has n pages with page numbers 1 to n. The summary is made by adding up the number of digits of all page numbers.

Task: Given the summary, find the number of pages n the book has.

**Example**

> If the input is summary=25, then the output must be n=17: The numbers 1 to 17 have 25 digits in total: 1234567891011121314151617.

Be aware that you'll get enormous books having up to 100.000 pages.

All inputs will be valid.

---

##My solution:


```javascript
function amountOfPages(summary){
  if(summary <= 9) return summary
  var count = 0;
  var res = 0;
  for(let i = 1; i<summary; i++){
    count+=i.toString().length
    if(count==summary) res = i
  }
  return res
}
```


---

##Explanation
First I used a conditional if the summary pages are less than 9 it means that the digits are the same as the original one
```javascript
if(summary <= 9) return summary
```

---

Then I created two variables: 
1. <u>count</u> where I'll store the count of the pages digits.
2. <u>res</u> where I'll store the last result.
```javascript
var count = 0;
var res = 0;
```

---

I used a for loop so I could go through every page and in every iteration I add to the variable count the total digits of the page number that is being iterated. Until the variable count is equal to summary, that means that I'm located in the exact page number "i", so I set "res" as the variable "i".

At the end I just return res

```javascript
for(let i = 1; i<summary; i++){
  count+=i.toString().length
  if(count==summary) res = i
}

return res
```

---

**What do you think about this solution? 👇🤔**

[My Github](https://github.com/Cesardlr)
[My twitter](https://twitter.com/cesar__dlr)
[Solve this Kata](https://www.codewars.com/kata/622de76d28bf330057cd6af8)
Hello, world!
Tags: java, beginners, programming
Published: 2022-04-20 23:24:28

Colé?

Como vc já deve ter visto na parte de cima aí da página meu nome é Felipe.
Mas deixa eu me apresentar direito.
Fiz Ciência da Computação na Universidade Federal de Ouro Preto mas estou fora da área de T.I. há dez anos. De tempos em tempos eu ainda brincava um pouquinho com programação mas só no começo desse ano resolvir voltar a estudar a sério mesmo. E daí vem o motivo de eu ter resolvido começar a escrever aqui.

Sempre me disseram que uma ótima forma de aprender algo é tentar explicar isso pra outra pessoa e eu, como bom nerd que sou, não tenho ninguém para explicar as coisas na vida real por isso vou falar sozinho por aqui mesmo.


![Claro que eu falo sozinho, de vez em quando eu preciso de um conselho de expert](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6gk7ejzk6bfwrbvidjql.jpg)


Outro fator interessante é que eu terei um registro da minha trajetória por aqui. Espero olhar pra trás daqui um tempo e gostar do que estou vendo.

E eu também sempre tive vontade de ter um blog mas nunca me achei interessante o suficiente pra isso. Agora eu tenho do que falar: Das minhas falhas e vergonhas nessa trajetória de novo (velho) programador.

Pensei em estruturar esse texto direitinho mas eu percebi que a melhor formar de eu manter algo semalhante a alguma constância aqui é usar esse espaço de forma bem informal. 

Portanto, acho que pra uma "apresentação" já tá bom demais né? Por hj é só pessoal.


![Isso é tudo pessoal!](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zgtmb3ui3r8uigymlv3g.png)