teleren/devto huggingface dataset:
How to generate animated cover image for your dev.to post's from any video using python and moviepy 😎
Tags: python, programming, coding, tutorial
Published: 2023-08-11 10:02:36

Hello everyone 🙂🖐
In this post, I will share with you how to generate cover image for you dev.to post from video using python and moviepy in an easy and simple way

**step 1**
you need to install moviepy lib from here `pip install moviepy `

**step 2**
you need any video to test this code 

**step 3**
as we kenow the dev.to post cover image size is : 1000 x 420
For this we need to resize video to 1000 x 420

```python

import moviepy.editor as mp

video = mp.VideoFileClip('test.mp4')
video = video.subclip(8, 10)
video = video.resize((1000, 420))
video.write_gif('out.gif')

```
i used **subclip** to cut video from 8s to 10s only
**resize** function to resize video frames to 1000 x 420

**result**

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6wfv6y9mrb4j3xpkcbhy.gif)


**Now you can use it to your post 🤗**

**Now we're done**
Don't forget to like and follow 🙂
Who's looking for open source contributors? (week 54)
Tags: discuss, opensource, contributorswanted, codenewbie
Published: 2023-08-11 10:00:00

---
title: Who's looking for open source contributors? (week 54)
series: Looking for Contributors
published: true
description: Discover which open source projects are actively seeking contributors. Learn how you can make a meaningful contribution to the open source community and gain valuable experience. Find out who's looking for open source contributors now.
tags: discuss, opensource, contributorswanted, codenewbie
# cover_image: https://direct_url_to_image.jpg
# Use a ratio of 100:42 for best results.
published_at: 2023-08-11 10:00 +0000
---
Open Source thrives through shared efforts. Whether you're a newcomer or a veteran, we're here to encourage your contributions, motivate your endeavors, and provide valuable assistance to maintainers. Together, we are building amazing things!

## Tell us about your project
_Promote your project by providing a link to the repo. Everyone who posted in previous weeks is welcome back this week, as always 😄_

Open Source should be a welcoming space for contributors. The README is the front door of your project. If you'd like to check out an example of a README, here's our [OpenSauced/insights README](https://github.com/open-sauced/insights).

If you submit please have the following in your repo to make it welcoming and helpful for contributors:

1. README.md
2. CONTRIBUTING.md

Feel free to drop your issues and repos in the [OpenSauced Discord](https://discord.gg/opensauced) #:eyes:-looking-for-contributors channel at any time! 

If you're new to open source, and you're not sure where to start, check out our [Intro to Open Source course](https://github.com/open-sauced/intro). 

Finally, consider reading the [Best Practices for Maintainers](https://opensource.guide/best-practices/).

Just a note to say, we've restarted this post from something Ben was doing for a while :star-struck: 

Happy contributing!
How to Improve Application Performance
Published: 2023-08-11 09:59:05

There are many ways to improve software application performance.Here are some of the most impactful techniques:

Use a reverse proxy server
Adding a reverse proxy server like NGINX in front of your application servers can significantly improve performance. A reverse proxy:

Offloads network traffic from the application servers, allowing them to focus on processing requests
Enables load balancing across multiple application servers for scaling
Can cache static and dynamic content to reduce load
Adds flexibility to scale and replace application servers easily
Implement caching
Caching static and dynamic content is one of the most effective performance optimizations:

Cache static files (CSS, JS, images) on the reverse proxy to serve them faster and reduce load on application servers
Implement dynamic content caching by caching generated HTML pages for a short period of time (e.g. 1–10 seconds) This can dramatically reduce the number of pages that need to be generated.
Compress data
Compressing text data like HTML, JS and CSS can reduce bandwidth usage by 30% or more and decrease page load times. SSL/TLS encryption also offsets some of the CPU overhead of compression.

Optimize SSL/TLS
SSL/TLS handshakes and encryption/decryption can impact performance, so:

Enable SSL session caching, session tickets/IDs and OCSP stapling to reduce handshake times
Terminate SSL on the reverse proxy to offload encryption/decryption from the application servers
Implement HTTP/2 or SPDY
These protocols use a single connection rather than multiple connections, which reduces overhead and improves performance, especially when used with SSL/TLS.

Tune your software stack
Updating to the latest stable versions of software, tuning Linux settings, and optimizing configuration of your web server (like NGINX) can all boost performance.

Monitor live activity
Monitoring tools like NGINX Plus can alert you to issues in real-time, catch performance problems early, and help you identify optimization opportunities.
Spring Application Startup Analysis
Tags: spring, optimization
Published: 2023-08-11 09:49:47

[spring-startup-analyzer](https://github.com/linyimin0812/spring-startup-analyzer) generates an interactive Spring application startup report that lets you understand what contributes to the application startup time and helps to optimize it.

[analyzer report demo](https://linyimin-blog.oss-cn-beijing.aliyuncs.com/spring-satrtup-analyzer/hokage-20230618000928-192.168.0.101-analyzer.html)

- **Spring Bean Initialization Details**
  ![Spring Bean Initialization](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vvrscrm0q8wrv96z2c8b.png)

- **Spring Bean Initialization Timeline**
  ![Spring Bean Timeline](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/i9cyhi2fan9ortfga08e.png)

- **Method Invocation Count and Time Statistics**
  ![Details of Method Invoke](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nyuhl1ki7hcmrylf93ai.png)

- **Unused Jars**
  ![Unused Jars](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/o3xya1e7ddu2xrzgvoeg.png)

- **Application Startup Thread Wall Clock Profile**
  ![Flame Gragh](https://raw.githubusercontent.com/linyimin0812/spring-startup-analyzer/main/docs/full-flame-graph.png)
Using performance.now() instead of Date.now() to prevent timestamp collisions
Tags: timestamps, performance, javascript
Published: 2023-08-11 09:45:54

Say you have an array of data entries and you need to attach a unique identifier to each entry. The popular approach would be use Date.now() as a unique identifier. The problem with this approach is that there is a chance of two or more entries having the same identifier. This is because the timestamps returned by Date.now() have a resolution of one-millisecond. Thus it is highly probably that you could have collisions between the unique identifiers of the data entries. Let us consider the following example that loops 5 times, printing out a Date.now() timestamp every loop. Let's open up our command prompt and let's run the following code in node (to enter node just type the word node in your command prompt assuming that you already have it in your environment).

CODE: 

```
for (let index = 0; index < 5; index++) {
    console.log(Date.now())
}
```

OUTPUT:
``` 
1691741535783
1691741535784
1691741535785 < Identical
1691741535785 < Identical
1691741535785 < Identical
```
As you can see in the output that the last three outputs were the same, so if you where using these as unique identifiers you would have collisions. 

Enter performance.now()

Unlike Date.now() the timestamps returned by performance.now() represent floating point numbers with a resolution of up to 5 microsecond rather than the one-millisecond resolution of Date.now() timestamps. Also performance.now() timestamps always increase at a constant rate being independent of the system clock which can be manually adjusted or susceptible to change by software such as the Network Time Protocol. Lets see the same example that we did above but this time with performance.now().

CODE: 

```
for (let index = 0; index < 5; index++) {
    console.log(performance.now())
}
```

OUTPUT: 
	

```
7908.96749997139
7910.144699931145
7910.284399986267
7910.412899971008
7910.533899903297
```

Let's test performance.now() further by logging two timestamps at the same time.

CODE: 
	

```
console.log(`${ performance.now() } ${ performance.now() }`)
```

OUTPUT: 
	

```
773756.6698999405 773756.6811999083
```

As you can see that even when you log it at the same time the timestamps are different thus there is no chance of collisions occurring. I highly recommend that you take a look at the MDN docs for performance.now() if you want to read more about it (https://developer.mozilla.org/en-US/docs/Web/API/Performance/now).
How to assign TailwindCSS class names to arbitrary variable names while letting auto-completion work.
Tags: tailwindcss, vscode
Published: 2023-08-11 09:45:40

When defining class names in TailwindCSS, if you're using VSCode, installing the [extension](https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss) enables automatic autocompletion.

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/552712/9e170e40-7a07-7403-7cd2-3d4bb80e47e4.png)

Autocompletion also works for variable names like `const className = ""`.

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/552712/03322785-37bd-8c0d-1957-ef5820d7f8fd.png)

By default, the variable names where autocompletion is active are:

- "class",
- "className",
- "ngClass".

So, what about using variable names like `const mySpecialStyles = ""`? Of course, autocompletion doesn't work by default.

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/552712/8409e437-1777-4b7f-87cc-df30444b4945.png)

Is there a way to enable autocompletion for arbitrary variable names like `mySpecialStyles` or `greatStyles`? I looked into it, and I found a configuration method that I want to share, which was originally introduced in a [GitHub Discussions](https://github.com/tailwindlabs/tailwindcss/discussions/7554#discussioncomment-3030988) post. For detailed information, please refer to the original discussion.

## VSCode Configuration

Configuring VSCode is simple. Refer to the following image: go to the Class Attributes section in settings and add `.*Styles*` using the Add item button.

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/552712/09f78d83-493a-a0b0-cf8f-126a1265c8c0.png)

If you want to add this to your `settings.json`, here's what you need to do:

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/552712/891eddfa-bdb8-a6f2-a744-f2ce9ab49288.png)

With this, autocompletion will now be enabled for variable names like `mySpecialStyles` or `greatStyles` 🎉

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/552712/d1313139-0e94-c5d0-a29b-087583da8716.png)

---

While it's generally recommended to define classes inline with TailwindCSS, for those who prefer separation to maintain cleaner code and avoid duplication, give this a try! It can help make your code more readable and organized.
What was your win this week?
Tags: discuss, weeklyretro
Published: 2023-08-11 09:30:00

---
title: What was your win this week?
published: true
description: Looking back on this past week, what was something you were proud of accomplishing?
tags: discuss, weeklyretro
published_at: 2023-08-11 09:30
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wyck78r593005hlbngyn.jpg
---

Hey my peeps 👋

Hope everybody is enjoying their weekend!

Looking back on this past week, what was something you were proud of accomplishing?

All wins count — big or small 🎉

Examples of 'wins' include:

- Starting a new project
- Fixing a tricky bug
- Netflix and chillin' 📺

---

![A clip from He-Man: Masters of the Universe... He-Man and Teela chilling and watching what looks like a magical television](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kgehuczh8ooh2no6l3u1.gif)
how to generate audio and image CAPTCHAs using python
Tags: python, security, development, webdev
Published: 2023-08-11 09:16:46

## Hello everyone 🙂🖐

In this post, I will share with you how to generate captcha in an easy and simple way

## step 1
you need to install captcha lib from here `pip install captcha`

## step 2
After installation, you can now start generating captchas

I will start generating an audio captcha

```python

from captcha import audio
from string import digits
from random import choice

audio_captcha = audio.AudioCaptcha()

text = ''.join(choice(digits) for _ in range(5))
audio_captcha.write(text, 'out.mp3')

```

i used **digits** from string and **choice** from random to generate
random numbner that i can use to generate audio captcha

generate image captcha

```python

from captcha import image
from string import digits
from random import choice

image_captcha = image.ImageCaptcha()

text = ''.join(choice(digits) for _ in range(5))
image_captcha.write(text, 'out.jpg')

```


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


## Now we're done

Don't forget to like and follow 🙂
Help me
Tags: laravel
Published: 2023-08-11 09:16:38

I have a problem with a php script and the login form does not work I think it is a lavrev problem in the module. If anyone can help me I attach my zip archive with all the files and if anyone can examine them. Thank you!
https://drive.google.com/file/d/1ynBcwu4TgMaI17UWK915l27I5pts7k1U/view?usp=sharing
Understanding the Type coercion and Type conversion
Tags: javascript, beginners, webdev, productivity
Published: 2023-08-11 09:15:31

Talking about one of the uniqueness of Javascript, the type coercion and conversion is an attribute of that qualification. Let's go on and see why that is>>>. 

NB: _This is not to show that it doesn't apply in other programming languages._

**Type Conversion**
Type conversion in JS refers to the programmer manually transforming a value from one data type to another. One of the popular ways by which conversion is done is by using  `Number()` and `String()` explicit conversion:

```
let numStr = "78";
let toNumber = Number(numStr) // Converts the string "78" to a number
```

but beyond that, Do you know it also applies to the use of operators? Let's move further.

**Type Coercion** 
Type Coercion is a process automatically executed by JavaScript when operations involve different data types. JavaScript undertakes the responsibility of transforming one or more operands to a common type to enable the operation.

```
let numStr = "78";
let toNumber = numStr + 20; // Converts to a number?
// result: 7820
```
This is where JavaScript is given control over the result of the expression, you would see that the result of `toNumber` is `7820`, this happens because of the **"+"** operator. Whenever the **"+" **operator is used to add a string to a number it automatically turns the result to a string. But what happens when we use another operator?

```
let numStr = "78";
let toNumber = numStr - 20; // Converts to a number? YES
// result: 58
```
It gave us the result we expected when we used the **" - "** operator. This tells us now that Javascript uses these operators to automatically converts one data type to another.

**Why are they both important?**
They are important in many scenarios, For instance: Type conversion is important when handling user inputs, if a user enters their age as a string, it needs to be explicitly converted to a number before any calculations. 

```
let ageStr = document.querySelector('.message').value; // 28
let age = Number(ageStr) + 10 // Using type conversion
```

In Type coercion, this can occur when performing arithmetic operations involving mixed data types. For instance, when displaying a message that combines strings and numbers.

```
let items = 83;
let message = "Sold, " + items " in total today."; // becomes a string
```
In Conclusion, Both are important no one is better than the other. Thank you for reading, I'd love to write to you again.💙
The Death of Comments
Tags: discuss, documentation, ai, testing
Published: 2023-08-11 09:13:44

No this isn’t what you expect, comments are useful but we are as developers at all levels bad at them. Could it be that the future of documentation code comments and tests amalgamated through AI?

I’ve seen GPT4s code interpreter understand, describe and test my code and it’s only a matter of time before we move to a workflow and pipeline that takes a wholistic perspective.

Such a tool would be a guidebook of the code with unit tests right in the code, it would make source maps and plug into dev tools, it would be the unified guide to your codebase.

I think this is the death of comments but what do you think?
Dev Links
Tags: webdev, beginners, programming, tutorial
Published: 2023-08-11 09:04:33

Following are some interesting links:

-  [Learn Grid](https://www.sitepoint.com/introduction-css-grid-layout-module/)

- [ASP.net Core Tag Helpers](https://www.telerik.com/blogs/aspnet-core-basics-tag-helpers) *we can have CUSTOM taghelper too

- [Web Performance](https://community.perfplanet.com/latest)

- [C4 Model for documenting software architecture](https://c4model.com)

Database

- [MySQL Replication](https://www.red-gate.com/simple-talk/blogs/beginners-guide-to-mysql-replication-part-1/)

Blogs, Podcasts, etc for Developers

- [Same stuff different day](https://samestuffdifferentday.net/)

- [Morning Dew](https://www.alvinashcraft.com)

- [The home of engineering leadership](https://leaddev.com)


Some open source .Net software to look out for

- [Envoy - API Gateway](https://www.envoyproxy.io/) *proxy, load balancing, for microservices

- [Open Telemetry for Observation](https://dateo-software.de/blog/improve-your-applications-observability-with-custom-health-checks)
Django Bootcamp: The only resource you need
Tags: django, webdev, javascript, career
Published: 2023-08-11 08:38:47

[Zero to Mastery](https://academy.zerotomastery.io/a/aff_90nxs4pt/external?affcode=441520_nmkbcy8m) offers a variety of programming courses to help you in breaking into the world of technology.

The ZTM platform is really helpful in my experience. It offers a better user experience and is more reasonably priced than other platforms.

Although it is a relatively new platform, they are constantly updating it with new courses.

They recently launched their brand new **[Django Bootcamp](https://academy.zerotomastery.io/a/aff_wvls2r8t/external?affcode=441520_nmkbcy8m)**, which has been in development since last year.

Have you ever used **Django** before? It is an open-source Python web framework that makes it easy to develop scalable and reliable web applications.

Thus, Django's slogan is "the web framework for perfectionists with deadlines ”.

With this Bootcamp, you'll have the opportunity to work on some amazing projects, and if you know ZTM, you know that they believe in learning by doing, as well as a storyline featuring Bruno. 

In case you don't know, Bruno is a fictional character in several ZMT courses to give students the feeling that they are really working at an organization.

You can learn Django from the ground up by creating some great projects. Become a Django Developer and land a job by learning everything from the basics to the most advanced techniques!

Here's the link to join the course 👉 [Django Bootcamp: Zero to Mastery](https://academy.zerotomastery.io/a/aff_wvls2r8t/external?affcode=441520_nmkbcy8m)

Know that the link provided above is an affiliate link :))

Thank you for taking the time to read! Follow @ishratumar for more content.
How to install NodeJS
Tags: node, tutorial, ubuntu, webdev
Published: 2023-08-11 08:38:18

Today we will show you how to install Node.js in Ubuntu.

If you like our article, we would be very happy about a Like and a comment!

---

You think it's easy to do

`sudo apt install nodejs`
That's true, but with the command

`node -v`
is the output

`v10.19.0`
But we need a newer version.

This works as follows:

First we download the script: (version number is desired version number)

`curl -sL https://deb.nodesource.com/setup_versionnumber.x -o /tmp/nodesource_setup.sh`
Then we run it with the following command:

`sudo bash /tmp/nodesource_setup.sh`
Now we can just use nodejs

`sudo apt-get install -y nodejs`
to install.

If you now again

`node -v`
executes, the output should be:

`version number....`
You need Node.js e.g. for the next article:

[Face recognition in NextCloud](https://technik.schächner.de/index.php/blog/2023/08/08/face-recognition-faces-recognition-in-nextcloud/)
MySQL CheatSheet
Tags: sql, mysql, database, webdev
Published: 2023-08-11 08:30:00

Here's a MySQL cheat sheet with some commonly used commands and concepts:

**Connecting to MySQL:**

```bash
mysql -u username -p
```

**Basic Commands:**

- Show Databases:

    ```bash
    SHOW DATABASES;
    ```

- Create Database:

    ```bash
    CREATE DATABASE database_name;
    ```

- Use Database:

    ```bash
    USE database_name;
    ```

- Show Tables:

    ```bash
    Show Tables
    ```

- Describe Table:

    ```bash
    DESCRIBE table_name;
    ```

**Data Manipulation:**

- Insert Data:

    ```bash
    INSERT INTO table_name (column1, column2, ...) VALUES (value1, value2, ...);
    ```

- Update Data:

    ```bash
    UPDATE table_name SET column1 = value1, column2 = value2 WHERE condition;
    ```

- Delete Data:

    ```bash
    DELETE FROM table_name WHERE condition;
    ```

- Select Data:

    ```bash
    SELECT column1, column2, ... FROM table_name WHERE condition;
    ```

**Filtering and Sorting:**

- Filtering with WHERE:

    ```bash
    SELECT * FROM table_name WHERE condition;
    ```

- Sorting with ORDER BY:

    ```bash
    SELECT * FROM table_name ORDER BY column_name ASC/DESC;
    ```

Aggregation Functions:

- Count:

    ```bash
    SELECT COUNT(column_name) FROM table_name;
    ```

- Sum:

    ```bash
    SELECT SUM(column_name) FROM table_name;
    ```

- Average:

    ```bash
    SELECT AVG(column_name) FROM table_name;
    ```

**Joining Tables:**

- Inner Join:

    ```bash
    SELECT * FROM table1 INNER JOIN table2 ON table1.column = table2.column;
    ```

- Left Join:

    ```bash
    SELECT * FROM table1 LEFT JOIN table2 ON table1.column = table2.column;
    ```

- Grouping Data:

    ```bash
    SELECT column1, COUNT(*) FROM table_name GROUP BY column1;
    ```

**Indexes:**

- Creating Index:

    ```bash
    CREATE INDEX index_name ON table_name(column_name);
    ```

- Dropping Index:

    ```bash
    DROP INDEX index_name ON table_name;
    ```

Backup and Restore:

- Backup:

    ```bash
    mysqldump -u username -p database_name > backup.sql
    ```

- Restore:

    ```bash
    SHOW DATABASES;
    ```

Remember to replace username, database_name, table_name, etc., with your actual values. This cheat sheet covers the basics, but MySQL is a rich and powerful database system, so there's a lot more you can explore and learn.