teleren/devto huggingface dataset:
Cool text hover effect
Tags: codepen, css, design, webdev
Published: 2023-02-13 16:26:51

<p>Cool Hover effect for text inspired by <a href="https://youtu.be/OUGksZGgko0" target="_blank">https://youtu.be/OUGksZGgko0</a></p>

{% codepen https://codepen.io/Smit29/pen/KKBLZaB %}
Building my Shopify App on Youtube
Tags: linodehackathon, buildinpublic, shopify
Published: 2023-02-13 16:20:32

Hey all,

I’m creating an Ultimate Shopify Cart Slider, packed with upsells, volume order discount and free gift, inspired by MrBeast’s Chocolate Store.

I visited MrBeast’s Feastables store the other and fell in love with how his cart encourages his audience to buy multiple by suggesting new products and giving free gift.

I want a smilar experience to my store but after going through all of the cart apps on the Shopify App Store, I couldn’t find any solution remotely close.

That’s why I determine to create a Shopify for this purpose and share the journey for the public to see -> https://www.youtube.com/@the_ecom_hacker

I’d love to hear you guys input and what you’d like to see in an ultimate cart experience. In return, you’re welcome to join the early (free) access if you have a Shopify store
TIL.I Made 2nd Website
Tags: beginners, devjournal, html, css
Published: 2023-02-13 16:04:59

during the weekend, i made a second site dedicated only to showcasing pictures outside of instagram. its pretty barebones. 

a block that i am having with that is the responsiveness on the desktop site compared to the mobile responsiveness. i followed responsive imaging structure but somehow it isn't working how i want it to so it's giving me a bit of a headache.  

also, tried to buy a domain name from porkbun but it wouldn't take my card for some reason so i guess the name i chose was not meant to be lol. that's another problem for another time i guess.
Day 1 as an Observer
Published: 2023-02-13 15:55:46

Sometimes I was surprised to figure out what CS interns or employees in a software company always code.
**I found my answers today!** Trust me; it was quite interesting.

We write Leetcode hard solutions. We write optimized code, We write automation scripts, and We write things that ChatGPT can't write or that an AI model can't predict!

Throughout my Engineering Life, I hated Leetcode problems the most. I always need clarification on why the whole Coder community is towards Cracking DSA, Solving Leetcode, Acing Hackerrank, etc. Also, in between, I never understood why "FAANG" picks candidates who can achieve _O(1)_ complexity.

It was today I figured out all these things. As an intern, I was assigned **a real-world optimization problem** of a cruise scheduler to deliver goods at various ports across the globe. Some constraints are provided, and we have to derive the schedule as output. It was when I remembered the concepts of **Linear Programming**, **Greedy Method**, and **Dynamic Programming** while writing an algorithm on a rough paper. Yes! I found this task interesting, engaging and challenging. It was my first experience putting all the algorithms into existence. Finally, after figuring it out, I could build a code with _O(n^2)_ complexity. Yayy! It sounds cool, right? But then my Team Leader was ready to blow me up for making the code more worse.

The entire day I drank more cups of coffee to write fewer lines of code. Hahaha! Jokes apart! Anyways thanks for reading for so long. To all the aspiring coders, engineers, and developers out there, a single piece of advice... <u>work on improving the logic you write in so-called "Hard Level problems"!</u> _Leetcode sucks!_ 
Don't worry if you can't fix Hard Code problems because you will be laid off soon :)
DSA- Linear Search
Tags: java, algorithms
Published: 2023-02-13 15:40:06

**linear Search** - is algorithm which starts searching from index 0 till the element finds.

This algorithm also worst-case algorithm. If element not available, it iterates through the elements till end.

Best Case - O(1)
Worst case - O(n) where n is the size of the array.

```
public class LinearSearch {
	public static void main(String[] args) {
		int[] arr = new int[5];
		for(int i=0;i<arr.length;i++) {
			arr[i]=i;
		}
		int target = 2;
		System.out.println("element found in the array at index " +linearSearch(arr, target));
		int targetNotInArray = 100; // to prove worst case
		System.out.println("This will iterate through the array and element "
				+ "is not found in array and return false" +
		linearSearch(arr, targetNotInArray));
	}

	static int linearSearch(int[] arr, int target) {
		if (arr.length == 0) { // if the array has no element
			return -1;
		}
		// looping through the array to find element
		for (int i = 0; i < arr.length; i++) {
			if (arr[i] == target) {
				return i;
			}
		}

		return -1;
	}
}

```


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/l6sog0k8i1hqwmiz0jva.png)
Vagrant and VirtualBox on Windows 11 and WSL
Tags: tutorial, devops
Published: 2023-02-13 15:01:06

Download VirtualBox's latest version for Windows and its extension pack from [here](https://www.virtualbox.org/wiki/Downloads). 

After installing VirtualBox, install the pack by going into tools > extensions then clicking install:

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

Install vagrant according to their [instructions for Linux](https://developer.hashicorp.com/vagrant/downloads). All you have to do is to runt he following command in WSL:
```
wget -O- https://apt.releases.hashicorp.com/gpg | gpg --dearmor | sudo tee /usr/share/keyrings/hashicorp-archive-keyring.gpg
echo "deb [signed-by=/usr/share/keyrings/hashicorp-archive-keyring.gpg] https://apt.releases.hashicorp.com $(lsb_release -cs) main" | sudo tee /etc/apt/sources.list.d/hashicorp.list
sudo apt update && sudo apt install vagrant
```

Export some global variables to be able to run vagrant (these need to be reset each time you open a new terminal):
```
export VAGRANT_WSL_ENABLE_WINDOWS_ACCESS="1"
export PATH="$PATH:/mnt/c/Program Files/Oracle/VirtualBox"
```

You also have to add the folder where your project is located:
```
export VAGRANT_WSL_WINDOWS_ACCESS_USER_HOME_PATH="/mnt/c/<path-to-folder-where-Vagrantfile-is>"
```

And you have to ssh from PowerShell 🫠
```
ssh vagrant@127.0.0.1 -p 2222
```

Add this line to your `Vagrantfile` to be able to have a project in your ubuntu file system:
```
config.vm.synced_folder '.', '/vagrant', disabled: true
```

For more info on WSL installs, click [here](https://developer.hashicorp.com/vagrant/docs/other/wsl).
What are your Goals for the week? 2/13
Published: 2023-02-13 15:05:00

What are your goals for this week?
 
- What are you building? 
- What will be a good result by week's end?
- Are you attending any events this week?
- Did you meet your goals last week?

I'll start.

**Last Week's Goals**

- [:white_check_mark:] Update resume/linkedIN/portfolio. * Minor updates to gitHub profile. Worked on my TIL log.
- [:white_check_mark:] Continue Job Search. * Spending my mornings hitting LinkedIn and sending DMs. Applying to open roles.
- [:x:]Continue new project. * Didn't touch one project. Did work on something for blog.
- [:white_check_mark:]Blog. * Reblogged an old blog. Worked on content for another.
- [:white_check_mark:] Encourage and help members in our Virtual Coffee's February Challenge, Getting job ready.
 * Made start of week and end of week announcements. Shared some content I found.


### Still working on: 
- Update resume/linkedIn/portfolio.
- Increasing follower count. I want more here than bird site. But my bird site followers grew. Most likely from attending online events. 



**This Week's Goals**

- Update Portfolio.
- Continue Job Search.
- Continue new project.
- Blog.
- Encourage and help members in our Virtual Coffee's February Challenge, Getting job ready.
- Attend AWSome Day on wed.

**This Month's Goals**
- Gain more followers here. I would like to have more followers on DEV than I had on the bird site. 


You've read my goals so I'll throw that question back to you.

What are your goals for the week?

```
-$JarvisScript git push
```
An Introduction to Classes in Ruby: A Guide to Object-Oriented Programming
Tags: ruby, beginners, programming
Published: 2023-02-13 15:04:10

**Ruby** is an _object-oriented programming language_, and **classes** play a crucial role in this paradigm. A **class** is a blueprint that defines objects and their behavior. In this article, we'll dive into the basics of classes in Ruby and how they can help you organize and manage your code.

To start, let's take a look at a simple **class in Ruby**:

```
class Dog
  def initialize(name, breed)
    @name = name
    @breed = breed
  end

  def bark
    puts "Woof!"
  end
end
```
Here, we've created a **class** called Dog with two attributes: name and breed. The initialize **method** is a special **method** that is called when a new _instance_ of the class is created. This is where you can set the initial state for the object. In our example, we are setting the name and breed attributes when a new Dog instance is created.

Creating an instance of the class is simple. Just use the following code:

```
dog = Dog.new("Fido", "Labrador")
```
And to call the bark method on the dog object, use the following code:

```
dog.bark
# Output: Woof!
```
In addition to the initialize method, Ruby has other special methods that make it easy to define getters and setters for class attributes. For example, you can use **attr_reader**, **attr_writer**, and **attr_accessor** to access and modify the state of an object.

Here's an example of using **attr_reader** and **attr_writer**:

```
class Dog
  attr_reader :name
  attr_writer :breed

  def initialize(name, breed)
    @name = name
    @breed = breed
  end

  def bark
    puts "Woof!"
  end
end
```
With **attr_reader** and **attr_writer**, you can access the name and breed attributes directly:



```
dog = Dog.new("Fido", "Labrador")
puts dog.name
# Output: Fido

puts dog.breed
# Output: Labrador

dog.breed = "Golden Retriever"
puts dog.breed
# Output: Golden Retriever
```
And if you want both getter and setter methods, you can use **attr_accessor**:

```
class Dog
  attr_accessor :name, :breed

  def initialize(name, breed)
    @name = name
    @breed = breed
  end

  def bark
    puts "Woof!"
  end
end
```

These are the **basics of classes in Ruby**, but they will give you a solid foundation to build upon. By using classes in your Ruby programs, you'll be able to create objects, manage their state, and define their behavior, making your code easier to organize and maintain.
Craft Systems - A collection of free Figma kits to kickstart your next project
Tags: webdev, beginners, productivity, firstpost
Published: 2023-02-13 15:03:36

FREE Figma templates to kick-start your next project. Easy to use and completely customizable. Start designing with a great foundation and stop wasting precious time.

Check them out at [craftsystems.xyz](craftsystems.xyz)
Small trick to understand the `this` keyword
Tags: webdev, javascript
Published: 2023-02-13 15:00:00

The `this` keyword is one of the biggest headaches for anyone learning JavaScript. In this article, I won't go too deep into how the keyword works, but I will give you a quick tip to make it easier to handle.

As a general rule, the `this` keyword represents what's left of the dot when you're calling the method. Let's see an example:

```javascript
class Capybara {
    constructor(name) {
        this.name = name;
    }
    sayName() {
        return `My name is ${this.name}`;
    }
}

const capyDavid = new Capybara("David");
const capyArianna = new Capybara("Arianna");

capyDavid.sayName();
// ☝️ "this" is `capyDavid`,
//    returns "My name is David"

capyArianna.sayName();
// ☝️ "this" is `capyArianna`,
//   returns "My name is Arianna"

```

In JavaScript, functions are values. That is, you can pass functions as arguments, or assign them to variables. But when you do it, things get tricky:

```javascript
const sayDavidName = capyDavid.sayName;
sayDavidName();
// ☝️ It fails! There's nothing "left of the dot"
//   because there's no dot.

function quoteCapybara(sayNameFuntion) {
    return `A capybara says: "${sayNameFuntion()}"`;
}
quoteCapybara(capyArianna.sayName);
// ☝️ It fails too
```

In the last example (the `quoteCapybara` function), why does it fail when you correctly passed the function as `capyArianna.sayName`? Because the function is executed inside the `quoteCapybara` function. There, it's run as `sayNameFunction`, so there's nothing "left of the dot".

In those cases, the most recommended solution is to change `quoteCapybara` so that it receives the capybara object as the parameter. 

---

Become a Better JavaScript Developer
Easy, actionable steps to level up your JavaScript skills, right to your inbox. [Click here to subscribe](https://nicozerpa.com/newsletter)
How to handle deeper routes?
Published: 2023-02-13 14:53:43

Hi Devs.
I am a beginner in Svelte.
I have a problem in routes.
When I try to route with deeper like `localhost:5000/auth/callback?`, browser is attempting to get global.css in localhost:5000/auth instead of localhost:5000.
So I tried to change `<link rel="stylesheet" href="global.css" />` to `<link rel="stylesheet" href="/global.css" />`, but in this case, there was problem in deployment.
In deployment server, this should be located in subfolder like `https://test123.com:8000/www/auth/callback?`, so it should be working in `.../www/` to get global.css, too.
How can I solve this?
Is there any configuration to set app's base url?
Näme Üçin Python Öwrenmeli?
Tags: python, programming, machinelearning, django
Published: 2023-02-13 14:46:50


## Näme Üçin Python Öwrenmeli?

![](https://cdn-images-1.medium.com/max/2000/1*Txy5tLFGhTYQv6llHWHZzg.jpeg)
>  Programirleme öwreniň, çünki bu size nähili pikirlenmegiňizi öwreder — STEVE JOBS

Python — öwrenilmegi has aňsat, ýokary derejeli programirleme dilidir. Python dilini öwrenip nämeler edip bolar? Ýagny näme üçin python öwrenmeli?
>  Web Programmalary Döretmek

![](https://cdn-images-1.medium.com/max/2560/1*L2GwnBuuNB57joM1Xxv6Gg.jpeg)

Pythonuň Django atly taýýar kod pakedi bize web programlary döretmegi aňsat hala getirýär.

Web saýt görnüşinde işleýän sosýal medýa programmasy pikirleniň -> Meselem: Youtube. Django bilen youtube algoritmini döretmek aňsat.

Log in, Sign up, cookie, bir web saýta gireniňizde sizi tanamagy, maglumatlar bazasyndan maglumat almagy, maglumat ýazmagy we muňa meňzeş işleriň hemmesini django bilen taýynlamak mümkin.

Django ulanýan tehnologiýa kompaniýalar: Youtube, Instagram, Spotify, Pinterest, Mozilla, NASA, Google…

### Eger django gowy derejede öwrenseňiz -> Amerikada ýyllyk 100$ müň dollar, Ýewropada 45 müň ýewro, Aziýada 20–30 müň dollar gazanyp bilersiňiz.
>  Emeli Akyl Programmalaryny Döretmek

![](https://cdn-images-1.medium.com/max/2000/1*z_aLudFMQI2LuKowGhnWig.jpeg)

Soňky döwürde iň ösen programirleme ugurlaryndan birisi — emeli akyl döretmek.

Emeli akyl döretmek üçin iň köp ulanylýan programirleme dili pythondur.
>  Opencv taýýar kod pakedi bilen kamerada görünýän obýektleri tanap bilýär. Ýagny öz-özi sürülýän awtoulaglary programirlemek üçin python ulanylýar.
>  Scikit-learn taýýar kod pakedini ulanyp kompýutere birnäçe maglumat berip, ony çözmegini isleýäňiz.

Pythony emeli akyl döretmek üçin ulanýan tehnologiýa kompaniýalar: Google, Netflix, IBM, NASA, Spotify.

### Eger python bilen emeli akyl döretmegi gowy derejede öwrenseňiz -> Amerikada ýyllyk 130$ müň dollar, Ýewropada 53 müň ýewro, Aziýada 35–45 müň dollar gazanyp bilersiňiz.
>  Python Bilen Bot Döretmek

![](https://cdn-images-1.medium.com/max/2400/1*RBQGSJ1rjSlVZs39GbUYVg.jpeg)

Pythonda bot döretmek has aňsat. Selenium ýada birnäçe taýýar kod pakedini ulanyp 10–20 setirde bot döredip we işledip bilersiňiz.
>  Python Bilen Blockchain Sistemasy Döretmek

![](https://cdn-images-1.medium.com/max/4096/1*b0kfTlUl2mqBOWvRgMSAZw.jpeg)

Python blockchain sistemalary döretmek üçin hem ulanylýar. IPython, eth_utils, web3.py ýaly taýýar kod paketlerini ulanyp, öz blockchain sistemanyzy gurup bilersiňiz.

## Eger bu ýazgyny halan bolsaňyz like basmagy we öz pikirleriňizi teswirlerde ýazmagy unutmaň!
Using A Helper Function
Tags: beginners, programming, coding, cleancode
Published: 2023-02-13 14:42:16


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uy2n4jsenngmr5ydlhkl.jpg)Using a helper function is pretty simple and it's a very useful tool that will help keep your code [D.R.Y](https://en.wikipedia.org/wiki/Don%27t_repeat_yourself) (Don't Repeat Yourself) and help you maintain the [S.R.P](https://en.wikipedia.org/wiki/Single-responsibility_principle) (Single Responsibility Principle). Because of that it also makes our code easier to debug.

A helper function is a function that is called within another function, and we are able to use the return value from that function being called.

## Example

In this example I'm going to show you how a helper function can be used:

```
function isPrime(number){
    if(number < 2) return false;

    for(let i = 2; i < number; i++) {
        if(number % i === 0) return false;
    }
    return true;
}


function collectPrimes(numbers){
    let primes = []
    for(let i = 0; i < numbers.length; i++) {
        let number = numbers[i]
        if(isPrime(number)) primes.push(number)
    }
    return primes;
}
```
The goal was to create a function that filtered out only the prime numbers and returned them in a new array. In order to do that and maintain the S.R.P, I had to break down the problem into two. 

## The Breakdown
```
function isPrime(number){
    if(number < 2) return false;

    for(let i = 2; i < number; i++) {
        if(number % i === 0) return false;
    }
    return true;
}
```
The isPrime (helper function) is taking in each number that is being sent up from collectPrimes (by calling it in the function and passing in the numbers) and checking if it is a prime number. If it is it will return true if not it will return false.


```
function collectPrimes(numbers){
    let primes = []
    for(let i = 0; i < numbers.length; i++) {
        let number = numbers[i]
        if(isPrime(number)) primes.push(number)
    }
    return primes;
}
```
Once it gets back down to the collectPrimes function the conditional checks if we got a truthy value back from the isPrime function, then it pushes that prime into the primes array and returns a new array of primes.

**side note:** _We could also refactor this code and make it cleaner by using the .filter method, which will iterate through. filter out the primes, and return a new array of only the prime numbers._

```
return numbers.filter(number => isPrime(number))
```
(_If you are not familiar with array iteration methods like .filter check out my previous blog post called [The Fantastic Four: .map, .filter, .forEach, & .reduce array (iteration) methods](https://dev.to/tatianabowman/the-fantastic-four-map-filter-foreach-reduce-array-iteration-methods-2722)_).

## Other Helpful Resources
[What are Helper Functions, How to Use a Helper Function in JavaScript, Programming with Codecademy](https://www.youtube.com/watch?v=Bt-fbCT7WFw)

[What are the Helper functions ?](https://www.geeksforgeeks.org/what-are-the-helper-functions/)
Supprimer automatiquement une Job dans Kubernetes
Tags: kubernetes, devops, sre
Published: 2023-02-13 14:34:00

Quand on travaille avec des jobs dans Kubernetes, on peut avoir le besoin de les faire rouler une fois quand on déploie et après on n'en a plus besoin. Donc conserver la ressource vous est inutile et vous voulez la supprimer. *(D'autant plus si lors de vos déploiements vous modifiez certaines informations de la job - ce qui peut causer des erreurs)*

Pour ce faire, il vous suffit d'ajouter le champ `.spec.ttlSecondsAfterFinished` dans la définition de votre Job avec comme valeur, le nombre de secondes après lequel vous voulez que la **Job soit terminée**.

*Exemple*
```yaml
apiVersion: batch/v1
kind: Job
metadata:
  name: pi-with-ttl
spec:
  ttlSecondsAfterFinished: 100
  template:
    spec:
      containers:
      - name: pi
        image: perl:5.34.0
        command: ["perl",  "-Mbignum=bpi", "-wle", "print bpi(2000)"]
      restartPolicy: Never
```

Mais **attention!!** J'ai bien mentionné **terminée**, du coup peut importe si votre Job s'est terminée avec succès ou non, elle sera supprimée après le délais défini! Par conséquent, faites attention à la valeur que vous définissez! 

En effet, si vous n'avez pas un système mis en place qui va rammasser les logs, vous n'aurez aucune vision sur ce qui a pu se passer, et donc débugger en cas de soucis.

Le mieux est de définir dans tous les cas une valeur suffisamment grande pour que vous puissez voir ce qu'il se passe sur votre cluster après un déploiement et être capable de récupérer les informations avant qu'elles ne disparaissent.

---
Si vous utilisez Helm, on va voir prochainement qu'il y a un système existant qui est bien plus utile.

---
### Liens 
- Documentation K8s - Automatic Cleanup for Finished Jobs : https://kubernetes.io/docs/concepts/workloads/controllers/ttlafterfinished/
- Documentation K8s - Jobs : https://kubernetes.io/docs/concepts/workloads/controllers/job/#clean-up-finished-jobs-automatically

J'espère que ça vous sera utile! 🍺

---

<center><h3>Vous voulez me supporter?</h3></center>
<a href="https://www.buymeacoffee.com/mxguilbert7" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/default-orange.png" alt="Buy Me A Coffee" height="41" width="174"></a>
Automatically delete a Job in Kubernetes
Tags: kubernetes, devops, sre
Published: 2023-02-13 14:34:00

When we work with Jobs in Kubernetes, we can need to make them run once we deploy and forget about them. So keep the resource is useless.

So, to do it, you just need to add the field `.spec.ttlSecondsAfterFinished`  with the number of seconds you want to wait between the **end of the Job** and when it's deleted.

*Example*
```yaml
apiVersion: batch/v1
kind: Job
metadata:
  name: pi-with-ttl
spec:
  ttlSecondsAfterFinished: 100
  template:
    spec:
      containers:
      - name: pi
        image: perl:5.34.0
        command: ["perl",  "-Mbignum=bpi", "-wle", "print bpi(2000)"]
      restartPolicy: Never
```

But **be careful!!** I've mentionned **the end of the Job**, so Kubernetes doesn't care if your Job ended successfully or not! It will be deleted either way! Consequently, be careful about the value of this field! If you haven't setup a log collector, you will see nothing about what happened if you have a too small value.

The best practice is to define a value big enough to let you connect manually to your cluster to check what happened.

---
If you are using Helm, we will see soon that there is a better system to manage this.

---
### Links
- K8s docs - Automatic Cleanup for Finished Jobs : https://kubernetes.io/docs/concepts/workloads/controllers/ttlafterfinished/
- K8s docs - Jobs : https://kubernetes.io/docs/concepts/workloads/controllers/job/#clean-up-finished-jobs-automatically

I hope it will help you! 🍺

---

<center><h3>You want to support me?</h3></center>
<a href="https://www.buymeacoffee.com/mxguilbert7" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/default-orange.png" alt="Buy Me A Coffee" height="41" width="174"></a>