teleren/devto huggingface dataset:
The 18th day of the 100 Days of Code challenge
Published: 2023-06-27 21:26:18

Today was a day full of coding, 10 hours of sessions.

Following yesterday, I tried to implement the buffering approach I wanted to take.

Some context about the app: This real-time transcription app serves to improve an existing project that incrementally sends audio chunks (5 seconds worth of audio chunks) via a regular HTTP protocol for the real-time transcription.

The only thing that the web socket approach changes is that it allows for constant streaming of audio, but then, what does it change? We still need to accumulate a certain amount of audio chunks that will be equal to some amount of time. We still need to buffer it, just that this time, it will be done in the server.

So I chose to ask some great programmers I know, and once I've clarified the goal, I'll finish with the implementation. For now, it just seemed goal-less and therefore, why work hard?

After all the frustration leading up to that point, I chose to move on to a more exciting project. Adding Speaker Diarization to that existing project that does transcripions in real-time with Whisper. 

Speaker Diarization is recognizing who is speaking. For example, if you had an audio file where two people talk and you chose to run Speaker Diarization on it, the output would look like this:

Speaker 1: Hey, how are you?
Speaker 2: Great! What about you?
Speaker 2: The weather is quite good today.
Speaker 1: I'm great! And yes, you're right, the San Francisco fog is amazing.

One way to implement this would be using the open-source library pyannote, which is what I chose to use.

The goal was to build a "Diarizator" which does what I described above. However, since there's a new recording coming in every 5 seconds, I need to remember the speakers in the application are so that I won't keep creating new speakers.

For that, I implemented embeddings. Embeddings are what makes voices unique, like your ID, but for your voice.

In each recording, I extract the embedding of each speaker, check if I've already identified an identical or very similar embedding before, and create a dictionary that labels each speech segment with its corresponding speaker. I then return this dictionary, which should suffice for implementing Speaker Diarization in a real-time transcription app.

This is not going into detail at all, but I plan to make a different post going into detail about how it works and it will soon be available on GitHub. I believe that it can prove useful in an infinite amount of cases.

There's a lot of things to improve upon, and I will improve it as the cases where it fails present themselves. It should be good enough to work in the app, so that'll be the starting point. I haven't had the time to actually modify the app to implement it, that I'll do tomorrow.

That's about it for today!
Happy coding everyone!
Adjust an Image File on a Specific Div or Size Using CSS (auto resize image)
Tags: html, css, image, imageresize
Published: 2023-06-27 21:19:03

First of all you need a `<div>` over the `<img>` tag. Then add given CSS with the div. If you want any specific size or shape of the image then add those shape to this div. example: Circle, Hexagonal etc.

![Adjust an image file on a specific div or size using CSS](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rkzw42t8zqfzss5rpa2x.png)

Outer `<div>`:

```
height: 500px;
width: 500px;
```

`<img>` Tag:

```
object-fit: cover;
object-position: center center;
height: 100%;
width: 100%;
```

object-fit:
Here object-fit property has following values: fill, contain, cover, scale-down, none. We will use object-fit: cover because cover value keeps the image in its aspect ratio and fills the given dimension. The image will be clipped to fit.

object-position:
center center : For scale the image from the center of the picture.

right bottom:
`<img>` element will align to bottom-right edge of its parent container with  object.

100% 80%: 
You also can add this percentage as a value to positioning the image.

height: 
100% & width: 100%:
This property will cover the image into the shape or div.
Add Hearverse Chain in your Metamask
Tags: hearverse, music, musicalnft, metamask
Published: 2023-06-27 21:10:52

These are the details of Hearverse Testnet Connection with Wallet :
```
- Network Name :- Hearverse
- New RPC Url  :- http://65.109.4.218:9933
- ChainID      :- 1372
- Currency Symbol :- HV

```
Flex your muscles 🧠💪
Tags: github, softwareengineering, javascript, security
Published: 2023-06-27 21:06:17

## Setting up the hackathon repo

While setting up my GitHub, where I go by `@100stacks` -- https://github.com/100stacks -- repo -- https://github.com/100stacks/1password-passage-hashnode-hackathon -- for the [hackathon](https://dev.to/builditdeploy/why-am-i-posting-to-dev-now-hackathon-1p8h)  I came across this error when I pushed an update to the [`README`](https://github.com/100stacks/1password-passage-hashnode-hackathon/blob/main/README.md).


![readme error](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2u533n7t7cg5uxsc22uy.png)


## Troubleshooting GitHub Repo Images

This is odd, so I begin by troubleshooting the cover image by uploading it again, and seeing where the issue is.


![error](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ibasg8yuhqrsyhjm655b.png)

The second image link renders.

![readme error](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5aew5o41f6g0srzxjv4d.png)


## Drop the image link in a browser

As I continue to troubleshoot the image error, I dropped the image link in a separate browser window.


![troubleshoot image url](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5zci8pjfoobmxiwcd9m8.png)

TIP: Typically when troubleshooting these types of rendering errors, I will open the link in different browsers to see what I can rule out.


## GitHub Security Features

Originally, I created the [hackathon repo](https://github.com/100stacks/1password-passage-hashnode-hackathon) as a [Private repo](https://docs.github.com/en/repositories/managing-your-repositorys-settings-and-features/managing-repository-settings/setting-repository-visibility), then converted it to a Public Repo. It appears that when I converted the repo to [public visibility, I lost access to the image link.](https://docs.github.com/en/repositories/managing-your-repositorys-settings-and-features/managing-repository-settings/setting-repository-visibility#making-a-repository-public)

```javascript
<Error>
    <Code>AccessDenied</Code>
    <Message>Access Denied</Message>
    <RequestId>4AWNBE4E25HZQEW3</RequestId>
    <HostId>
        9N97rbcFk7VA4KSYW5I2nVBfXk7kxn8SLXb161Me59+jy1Z2SwvYOwa6BJ8jmiCEAGy5PTCyK3M=
    </HostId>
</Error>
```


## Keep flexing your muscles 🧠💪

As software developers, you will come across many opportunities to troubleshoot errors. It's fundamental to our careers. No matter where you are in your career, you will have to flex your muscles multiple times a day, so keep exercising them. 😊

---
@builditdeploy article photo by <a href="https://unsplash.com/es/@markuswinkler?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Markus Winkler</a> on <a href="https://unsplash.com/photos/wpOa2i3MUrY?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>
Hello spiderfoot
Tags: osint, spiderfoot, security, 100daystooffload
Published: 2023-06-27 21:04:22

[spiderfoot](https://www.spiderfoot.net/attack-surface-monitoring/) is a cool OSINT (Open Source Intelligence) tool that is easy to get started with, and the code can be found here at [GitHub](https://github.com/smicallef/spiderfoot).

This tool fits in the [reconnaissance](https://attack.mitre.org/tactics/TA0043/) phase of the ATT&CK Matrix for Enterprise. It's always good to use these kind of tools on your self to see what information is out there in the public about you.

So far I have only tried to scan in passive mode, however there are other modes to use and it has many modules that can be used in the scan. Check out their site for more information.

This is how I installed it on my machine, see GitHub for the latest instructions on how to run/install the tool.

```bash
wget https://github.com/smicallef/spiderfoot/archive/v4.0.tar.gz
tar zxvf v4.0.tar.gz
cd spiderfoot-4.0
pip3 install -r requirements.txt
python3 ./sf.py -l 127.0.0.1:5001
```

Then browse to the url http://127.0.0.1:5001 to start your scan.
Setup Laragon As Local Server For Laravel Project
Tags: laravel, laragon, localserver, webdev
Published: 2023-06-27 20:51:17


Laragon is a powerful local development environment and server stack for PHP web applications. It provides a seamless and user-friendly experience for developers, offering a complete solution with features like an Apache web server, MySQL database, PHP interpreter, and additional tools like Git, Composer, and Node.js. Laragon simplifies the setup and management of development environments, allowing developers to focus on building and testing their applications efficiently.

So first you need to download laragon from there official site by visiting - 

> https://laragon.org/docs/install.html


![This is a window of Laragon after Installation](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8g8b9oo1600u9c5yo49k.png)


After that I would like to change some Preferences -


![This is a window of Laragon Preference Manu](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3ddrcgoov7boiehcbpbd.png)

then set Services and Port like given - 


![This is a window of Laragon Services and Port](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7s1itdb82egdqmk6f6rd.png)

I do prefer Ngnix instead of Apache server. 

After that put your laravel projects on the following directory - 

> C:\laragon\www

Note: You may change directory as you want form preference > General Tab


![preference > General Tab](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bq5fvktea7x02aki5t2i.png)

Now, you can access your projects from your browser by the folder name and .test domain like -


> myfoldername.test

**Extra Tips:**

You can change root file path of laragon projects -

> Menu > Nginx > sites-enabled 


![Menu > Nginx > sites-enabled](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/id6x8p8couuwl71ysssr.png)

Change root path: 

> root "C:/laragon/www/myfoldername/public";

![Laragon File Root Path Change](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fzwprx61ah7lbp10yi3s.png)
OSDC-2023-OPEN SOURCE PROJECT
Tags: osdc, python, github, git
Published: 2023-06-27 20:50:40

Hi everyone,
As part of the [OSCD course](https://github.com/OSDC-Code-Maven/osdc-2023-03-azrieli),
Today I want to update you on an open source project I built called [stringmatching](https://github.com/zoharasulin/string-matching-app-service/tree/main)
I would love for you to use it, I needed it in order to identify between 2 names that are accepted in my system and to assess whether the names are the same and what is the percentage of closeness between them.
I found a library that uses the [Lewinstein distance algorithm](https://he.wikipedia.org/wiki/%D7%9E%D7%A8%D7%97%D7%A7_%D7%9C%D7%95%D7%99%D7%A0%D7%A9%D7%98%D7%99%D7%99%D7%9F) and its name is [FuzzyWuzzy](https://github.com/seatgeek/thefuzz)
And in addition I added tests and used the [Flask library](https://pypi.org/project/Flask/) to get 2 inputs and the ability to calculate the percentage of proximity of the strings in the html view.
It seems like something small but when I wanted such a thing for my work I couldn't find it and it took me some time to find the libraries and prepare a service.
That's why I want to offer you my project and reveal it so that if you ever need something like this you can use it.
You can change the function and add data that is intended for your specific project.
I added a test and CI file, I hope I helped you and look again at the [README file](https://github.com/zoharasulin/string-matching-app-service/blob/main/README.md) in the project.

For any question, comment or clarification, I would appreciate it if you could contact me and I will answer as soon as possible.
Successfully,
Zohar.
Ruby Method of the Day: Array.new with Block
Tags: ruby, array, rubymethodoftheday
Published: 2023-06-27 20:47:55

---
title: Ruby Method of the Day:  Array.new with Block
published: true
description: 
tags: ruby, array, RubyMethodOfTheDay
---

One of the call sequences for method [Array.new](https://docs.ruby-lang.org/en/master/Array.html#method-c-new)  takes a block, allowing you to populate the new array with anything you want:

```ruby
Array.new(size) {|index| ... }
```

This returns an array of the given `size`; the block is called with each successive integer `index`; the block's return value becomes the element for that index:

```
a = Array.new(3) {|index| "Element #{index}" }
a # => ["Element 0", "Element 1", "Element 2"]
```

More methods at [#rubymethodoftheday](https://dev.to/t/rubymethodoftheday).
Episode 23/25: ng-conf, Signals with Ryan Carniato and Ben Lesh
Tags: webdev, angular, javascript, programming
Published: 2023-06-27 20:43:17

ng-conf published two recordings (keynote and Signals) on YouTube. The ModernWeb Podcast discussed the difference between Signals and RxJs with Ryan Carniato and Ben Lesh as its guests.

{% embed https://youtu.be/WI8RYerSaWQ %}

## Ng-Conf Recordings

ng-conf, one of the largest Angular conferences, took place in mid-June, and the first two videos from the event are already available on YouTube.

During the conference keynote, Minko Gechev and Jeremy Elbourn, both members of the Angular team, provided an overview of the current developments in Angular and shared insights on what to expect in the future.

{% embed https://youtu.be/D3sEqH9MwEE %}

Additionally, the conference marked the official go-live of two new Request for Comments (RFCs) that introduce changes to the authoring format, bringing a new syntax for control flow and deferred loading in Angular templates.

The second talk, which is also available on YouTube, was presented by Emma Twersky and Alex Rickabaugh, also part of the Angular team. They delved into Signals and explained how to utilise them in Angular 16.

{% embed https://youtu.be/BBhJJ0XJkfU %}

## Ben Lesh & Ryan Carniato - Modern Web Podcast

In a recent episode of the ModernWeb podcast hosted by Rob Ocel, Ryan Carniato, the creator of SolidJs, and Ben Lesh, the maintainer of RxJs, were featured guests discussing Signals.

Ryan highlighted that Signals, with their synchronous nature, are better suited for addressing templating and rendering challenges. He drew a comparison to spreadsheets and their formulas to emphasise the simplicity of Signals.

**Direct Link to Ryan's statement**

{% embed https://www.youtube.com/watch?v=cPVbfiAEbac&t=628s %}

Ben mentioned that one of the worst things that happened to RxJs was the pipe operators. If it would be just the Observable and nothing else, he argued that RxJs might have been used to implement Signals in all frameworks. So RxJs would act as a kind of foundation.

**Direct Link to Ben's statement**

{% embed https://www.youtube.com/watch?v=cPVbfiAEbac&t=1705s %}

From a technical perspective, it was quite an advanced discussion as both are not application developers but framework and library authors.

## Joshua Morony - Is Angular Changing TOO much?

If you have concerns about the rapid pace of Angular's advancements, Joshua Morony's latest video will likely alleviate your worries as he addresses this topic.

{% embed https://www.youtube.com/watch?v=GkD5QH2Rndw %}

## New Releases

Several new releases were announced as well, including version 16 of the RxAngular suite, along with minor releases for Cypress, Ionic, and Nx.

{% embed https://www.rx-angular.io/ %}

- [Cypress 12.15](https://docs.cypress.io/guides/references/changelog#12-15-0)
- [Ionic 7.1](https://github.com/ionic-team/ionic-framework/releases/v7.1.0)
- [Nx 16.4](https://github.com/nrwl/nx/releases/tag/16.4.0)
The Quick Guide To Writing A Function For Beginners
Tags: javascript, beginners, tutorial
Published: 2023-06-27 20:15:53

As beginners to the world of JavaScript and Software Engineering, Functions are often one of the first things we learn how to write.
Below, we will discuss the basic anatomy of a function (the bare bones that act as a framework for building more complex functions).

As a refresher: Functions are something we can make once, then call on many times later in our code. This means we need to build both the function to act as a "container" and put the action we want repeated inside of it.

First let's look at a function's most basic format, then discuss what is on each line:

**function nameOfFunction (valuesGoHere) {
     return (values, strings, or interpolation);
}**


**Writing the first line of our function:**
First we use the **function** keyword...
Next we choose a descriptive name for our function...
We'll follow this with () parenthesis. The values we put inside the parenthesis are determined by what kind of function we are making, and what we want our function to do.
We'll end this line with a { opening curly bracket.

**Writing the "middle" line(s) of our function:**
This is where we will put the code that will be used when we call the function later.
First, we will either use the keyword **console.log();** (for our own developer use) or **return();** (to have the function return something).
Inside the () parenthesis, we will now put a **string** or **value** or even use **interpolation**.

**Writing the last line of our function:**
Lastly, to fully contain the function, we must end with a } closing curly bracket.

This framework is the basic building block on which more complex functions can be built.
#DEVDiscuss: Developing SaaS Products
Tags: devdiscuss, saas, development, startup
Published: 2023-06-27 19:43:46

Time for #DEVDiscuss — right here on DEV 😎

{% embed https://dev.to/zenstack/how-to-build-a-scalable-saas-backend-in-10-minutes-with-100-lines-of-code-using-zenstack-1h7c %}

Inspired by @jiasheng's [Top 7 post](https://dev.to/devteam/top-7-featured-dev-posts-from-the-past-week-2cg4), tonight’s topic is...developing SaaS (software as a service) products!

In their post, @jiasheng shares about their project @zenstack and how it can be used to build "a scalable SaaS backend in 10 minutes with 100 lines of code" 🔥

> It’s hard to build a scalable SaaS system. Having been involved in the development of four commercial SaaS products at my previous company, I've come to realize the multitude of complexities that arise compared to typical consumer products. Among these complexities, one prominent area lies in the intricate realm of permission control and access policies.

### Questions:

- **What's more important to you when building a SaaS: reducing complexity, or having lots of features and functionality?**
- **How have you approached access control with SaaS apps in the past?**
- **How does building SaaS at the startup level differ from working on a SaaS at the larger, commercial level?**
- **Any triumphs, fails, or other stories you'd like to share on this topic?**
Why Do We Obsess Over Speed So Much?
Tags: discuss, speed, performance
Published: 2023-06-27 19:34:09

Over my time in the dev space I've noticed something I find worrying. There is this unnatural focus on speed when talking about... literally anything.  

I am always seeing; "it's the fastest x...", "it delivers x the fastest...", "it's the most fast..."  

From package managers, build tools to frameworks. Vite, Bun, Pnpm and recently Nextjs - the main focus seems to be speed.  

Most cases when I've heard discussions on package managers, speed has always been on "how fast" one is over another.  

This makes no logical sense to me. As a developer, patience should one of your strong points. So why does speed seem to get more attention?

## Why I Think Focusing On Speed Is Not Wise
Let's say you had something you were working on and you had to ensure certain metrics were working as efficiently as possible; say speed, performance and quality.  

If you focused more on speed, the other two would suffer as a result. In your effort to make things faster, the other aspects of what you are working have the potential of becoming subpar.

In my view, if we worked on making things better across the board, the speed aspect will inherently improve.

--- 

Every time I hear "x is faster", I am brought to this quote:  

> My goal is not to be *faster* but **better**. Faster comes as a side effect.
> - Mark Tellez


My question now is to you all:

# Why Are We So Obsessed with Speed?


--- 
###  Thank you for reading, let's connect!
Thank you for visiting this little corner of mine. Let's connect on [Twitter](https://twitter.com/Psypher1), [Polywork](https://www.polywork.com/psypher1) and [LinkedIn](https://www.linkedin.com/in/jamesmidzi/)
How I grew my dev podcast with podcast clips for social media
Tags: podcast, marketing, socialmedia, productivity
Published: 2023-06-27 19:33:14

So I recently started a podcast about my journey from career path of a developer to a founder.

The biggest shift I've experienced thus far is having to focus on bringing user to my product as opposed to focusing soley on making a product better, more scalable, faster, more resiliant.

One way for acquiring more users has been (other than running ads) starting a podcast.

But while I initially thought things will be easy sailing I was proven otherwise.

Growing my podcast has been one of the hardest things Iv'e done, but one of the most rewarding at the same time.

All I can say is that posting podcast clips on social media was biggest growth factor **by far**!

I used this [guide on growing your podcast using podcast clips on social media](https://chopshopai.com/blog/posts/podcast-clips-for-social-media) by Jessica Levy about growing podcasts on social I really recommend, cheert!

Yuval
My first GitHub project?
Tags: beginners, programming, python, discuss
Published: 2023-06-27 19:28:41

Following my Codeacademy lesson, I'll now provide the link to my portfolio project. A basic questionnaire in python3 & published in GitHub. 

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

That's all there is to it. I'd like to hear your opinions on what i should do next!

https://github.com/DeGrozza/Odd-questionare