teleren/devto huggingface dataset:
How to Build a Real-Time Object Detection with your own voice
Tags: python, openc, yolo, computervision
Published: 2023-03-23 18:18:24

Check out our latest video tutorial!
In this tutorial, we show you how to create a voice-controlled object detection system using the YOLO algorithm. 
By combining object detection with speech recognition, you can create a system where you can say a word or phrase, and the system will detect the specified object in the camera frame and draw a rectangle around it.

This hands-on tutorial is perfect for anyone interested in learning about object detection, speech recognition, or just wants to build a cool project that combines the two. You'll learn about YOLO, how to set up the necessary libraries, how to train your model, and how to use voice commands to detect specific objects in real-time.

If you are interested in learning modern Computer Vision course with deep dive with TensorFlow , Keras and Pytorch , you can find it here  : http://bit.ly/3HeDy1V

Before we continue, I actually recommend this book for deep learning based on Tensorflow and Keras : https://amzn.to/3STWZ2N

check out our video here: https://youtu.be/fd1msoIpM5Q

You can find the code in the video description.

Enjoy,
Eran

#Python #OpenCV #ObjectDetection #ComputerVision #googlespeechrecognition #speechrecognition #Yolo
Rsuite inputpicker active outline color change
Published: 2023-03-23 18:18:23

I'm using rsuite inputpicker I need to change active inputpicker outlin-color change I'm using many css styles  I can't change please eany one help me🥰🥲
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hshhibgmzehindsjjdw4.jpeg)
C++ if
Tags: cpp, beginners, programming, tutorial
Published: 2023-03-23 18:07:00


Hello everyone
today we will talk about if in C++


You can use these conditions to perform different actions for different decisions

`The C++ programming language has the following selection statements:`

1. 
 Use if to specify a block of code to execute `if` a specified condition is true.


1. 
Use `else` to define a block of code that executes if the first condition is false.


1. 
If the first condition is false, use `else if` to specify a new condition to test.


1. 
Use a switch to specify multiple alternative blocks of code to be executed.

**The if statement.**

`if` - Use the if statement to specify a block of C++ code to execute `if` a condition is true.

```
if (condition) 
{
  // block of code to be executed if the condition is true
}
```


`Note that if written in lowercase letters. Converting to uppercase (IF or IF) will cause an error.`

**In the following example, we test two values ​​to determine whether 20 is greater than 18. If the condition is true, print the text:**

```
#include <iostream>
using namespace std;

int main()
{

int num 80;
int num1 = 70;

if(num > num1)
{
cout << "80 is greater than 70";
}

return 0;
}
```
How to invoke system commands using in Rust
Tags: rust, windows, tutorial, beginners
Published: 2023-03-23 17:55:04

If you want to invoke system commands in your [Rust](https://www.rust-lang.org/) program, you need to make use of the `std::process::Command` module. In this short post, i'll tell you how to use this module. For more infos on Rust you can visit the well documented [Rust book](https://doc.rust-lang.org/book/)

---
### Getting started
We wanna make sure that we import the `std::process::Command` module. To do that, go to your **main.rs** file.

```rust
use std::process::command;

fn main() {
     println!("Hello World!");
}
```
### spawn, output and status
Before we start invoking a system command, we must distinguish between three different methods to spawn a child process and run system commands.

- [`spawn`](https://doc.rust-lang.org/std/process/struct.Command.html#method.spawn)
- [`output`](https://doc.rust-lang.org/std/process/struct.Command.html#method.output)
- [`status`](https://doc.rust-lang.org/std/process/struct.Command.html#method.status)

> `spawn` -> Executes the commands as a child process and returns a handle to it. For more information on how to interact with `stdin/stdout` check out [this](https://stackoverflow.com/a/49597789/15274944) answer on stack overflow.

> `output` -> Runs the command as a child process and waits until the command finishes, then collects the output. If you want to print out the output of a command in real time, please refer to the `spawn` method.

> `status` -> Runs a command as a child process and waits for it to finish and collect its status.

---
### How to structure a command

We will use the command `ls` as an example
```rust
use std::process:Command;

fn main(){
   Command::new("ls")
           .arg("-a")
           .spawn()
           .expect("failed to execute command");
}
```
___
####For more examples visit the offical [docs](https://doc.rust-lang.org/std/process/struct.Command.html#method.spawn)

_I hope I could help you and you like my post._
Some good practices in React development
Tags: react, webdev, beginners, programming
Published: 2023-03-23 17:54:27

React is a popular JavaScript library used to create interactive and responsive user interfaces. However, like any technology, it is important to follow certain best practices to ensure code quality and maintainability. In this article, we will discuss some best practices for programming with React.

## Functional components vs. class components
Functional components are becoming more popular because they are simpler and easier to read and write. They do not require complex state management and do not require a lifecycle method, making them more efficient in terms of performance. Use class components when you need to manage state or work with lifecycle methods.

## Avoid directly modifying state 
Directly modifying state can lead to unexpected side effects and difficult-to-find bugs. Instead, use the setState method to update the state and make sure not to directly modify the initial state.

## Use meaningful property names
Give meaningful names to your properties so that your code is easy to understand and maintain. Avoid property names such as "a", "b", "c", etc. and instead use names that clearly describe their function.

## Break down your components into smaller components
Divide your components into smaller components to improve their readability and maintainability. Smaller components are easier to test and understand. Additionally, they allow for easier code reuse.

## Use propTypes and defaultProps
propTypes and defaultProps allow you to define property types and default values for your components. This makes your code easier to read and understand. Additionally, it helps to avoid errors related to missing or incorrect properties.

## Using Typescript
Using TypeScript on a React project can **improve code quality**, facilitate maintenance, reduce syntax errors, and improve collaboration between development team members through the use of strong types.

## Use debugging tools
React has built-in debugging tools, such as **React Developer Tools**, that allow you to track the states and props of your components. This makes debugging and performance troubleshooting easier.

## Use immutable state
It is recommended to use immutable state in your React application. This makes state management easier and reduces side effects. Use libraries such as **immutable.js** to work with immutable state.

## Avoid overusing computed properties
Computed properties can be useful in simplifying your code, but they can also make the code difficult to understand. Avoid using them excessively and keep them simple and easy to understand.

By following these best practices, you can improve the quality and maintainability of your React code. However, keep in mind that these practices are not exhaustive and you should continue to stay updated on the latest best practices.
Deploying Virtual Machine in Azure
Tags: programming, devops, cloud, azure
Published: 2023-03-23 17:53:15

The supply of computing services such servers, storage, databases, networking, software, analytics, and intelligence over the Internet (the "cloud") is referred to as "cloud computing," and it aims to provide quicker innovation, adaptable resources, and scale economies.
One of the largest and most reputable cloud computing service providers is **Azure** and Creating a Virtual Machine in Azure is as Simple as counting 1,2,3,4....You get the Point😄. Follow the steps and I assure you, your VM will be Up and Runing in Minutes. Let's Go

`Step 1. Sign In/Sign Up to the Azure portal: https://portal.azure.com`
`Step 2 . Navigate to **_All services_** blade in the Portal Menu, then select **_Virtual machines_**, and then click **_+Create_** and choose **_+Azure Virtual machine_** from the drop down.`
Step 3. Enter the following details on the Basics tab (leave the defaults for everything else).
`- Settings	Values
- Subscription	Use default supplied
- Resource group	Create new resource group
- Virtual machine name	myVM
- Region	(US) East US
- Availability options	No infrastructure redundancy options required
- Image	Windows Server 2019 Datacenter - Gen2
- Size	Standard D2s v3
- Administrator account username	azureuser
- Administrator account password (type in carefully!)	Pa$$w0rd1234
- Inbound port rules -	**Allow select ports **
- Select inbound ports	RDP (3389) and HTTP (80)`

`Step 4. Make sure HTTP (80) and RDP (3389) are chosen in the section Select inbound ports by switching to the Networking tab.`
Step 5 . Go to the Management tab, choose the Boot diagnostics under the Monitoring heading, and change its Value to Disable.
Step 6. I hope you still with Me? Great, I trust you.
`Step 7. Click the Review + create button at the bottom of the page after leaving the remaining values at their default settings.
Click the Create button when Validation is successful. The deployment of the virtual computer can take five to seven minutes.`
Prioritizing TDD Friendly Languages and Frameworks
Published: 2023-03-23 16:38:30

<p>
  Unit testing and <a href="https://www.techtarget.com/searchsoftwarequality/definition/test-driven-development">Test-driven development</a> (TDD) are crucial elements of software
  development. Unit tests ensure individual code units function correctly, while TDD emphasizes writing tests before writing code to meet expected requirements.
</p>

<p>
  As someone who enjoys TDD but dislikes writing unit tests, I appreciate the importance of testing and value an efficient development process. Unit tests should make development
  more enjoyable and not be an extra burden. They should be tools that help developers work faster, rather than additional tasks.
</p>

<blockquote className="p-4 bg-neutral-100 text-neutral-600 border-l-4 border-neutral-500 italic quote">
  <p className="mb-2">"Said a different way, unit tests when written to speed up my development process are amazing, but they are super annoying when written as a chore."</p>
</blockquote>

<p>
  When choosing a programming language or framework, prioritizing those that are easy to use with TDD is essential. <a href="https://golang.org/">Golang</a> is excellent for TDD
  when developing web apps because testing is simple and fast, making the process more efficient. In contrast, testing in Javascript can be tiresome, particularly on the frontend,
  where writing unit tests often feels like a task rather than a helpful tool.
</p>

<p>
  Changing personal development habits, such as moving from browser refreshing to running unit tests in <a href="https://www.php.net/">PHP</a> can pay huge dividends, despite
  taking time to adjust. This shift may not necessarily make one a faster developer on day one, however since PHP is fairly easy to test the benefits will be noticeable over time.
</p>

<p>
  I was prompted to write this post because I've noticed that many projects choose programming languages that are difficult to test, or new technologies that are associated with
  hard-to-test languages. For example, <a href="https://nodejs.org/en">Node.js</a> is a popular choice for serverless computing, even though it is harder to test than some other
  options. This has always confused me. The argument that Node.js is great because it is the same language on both the front and backend seems weak. What happen to picking the
  correct tool for the job?
</p>

<p>
  Of course, there are pros and cons to any technology decision, and it's not always possible to prioritize testing over other factors. However, I believe that developers should
  give greater consideration to languages and frameworks that facilitate TDD, as this can ultimately increase productivity.
</p>

<p>
  In short, unit testing should not be viewed as a chore, but as a valuable tool for developers. By prioritizing languages and frameworks that make it easier to write and run
  tests, we can improve the quality of our code and enhance the overall development experience.
</p>
Running StimulusJS & ImportMap with asset pipeline / Rails 6
Tags: rails, stimulus, importmap
Published: 2023-03-23 17:47:39

I've never been a fan of Webpacker. So when starting a new project back in the Rails 5.1 days I avoided Webpacker and stuck to asset pipeline.

We have a ton of Coffeescript. And later on we upgraded to Rails 6.1, but stuck to our beloved asset pipeline.

Now Rails 7 is in front of us, but we are not quite ready to move to Rails 7 yet. But we wanna start taking advantage of [StimulusJS](https://stimulus.hotwired.dev) and [ImportMap](https://github.com/rails/importmap-rails) and start slowly migrating our old Coffeescripts to ES6 and StimulusJS.

From the get go I tried converting to the full turbo suite, also upgrading Turbolinks 5 to the new Turbo. By the looks of it, it worked out great. But once I started to submit forms I realized we are far from ready to use Turbo. 
With Turbo by default, Rails / Turbo will commit all forms with Ajax and Turbo will require your controllers to render http bad request on error and redirect with http status 303 (see other). But Rails renders default 302 (found) and then Turbo will try to handle that response instead of actually redirecting. 

So we quickly gave up on Turbo. For now. That requires much more effort in our controllers than we were ready to do.

But back to the topic. Getting StimulusJS to work. I didn't care about ImportMap honestly, but StimulusJS does care. Either it's ImportMap or Webpacker and with that selection I had no doubt we needed ImportMap.

## TL;DR
I updated my Gemfile to add:
```
# Hotwire's modest JavaScript framework [https://stimulus.hotwired.dev]
gem "stimulus-rails", '~> 1.2.1'
# Use JavaScript with ESM import maps [https://github.com/rails/importmap-rails]
gem "importmap-rails"
```

I ran my `bundle install` and then installed ImportMap `rails importmap:install`
Finally I could run `rails stimulus:install`

Now in `app/assets/config/manifest.js` I added the lines:
```
//= link_tree ../../javascript .js
//= link_tree ../../../vendor/javascript .js
```

Also very import, I renamed my `app/assets/javascripts/application.js` to `app/assets/javascripts/gems.js` to avoid naming conflicts with the new Stimulus created `app/javascripts/application.js`.

And finally in `app/views/layouts/application.html.erb` I removed
```
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
```
in favor of:
```
<%= javascript_include_tag 'gems', 'data-turbolinks-track': 'reload' %>
<%= javascript_importmap_tags %>
```

Done.

Now I could run the mandetory test of creating my `hello_controller.js` and in a view add `<div data-controller="hello"></div>` and see my `connect()` method could write to the div innerText. Success!
API Architectural Styles
Tags: api, graphql, webdev, webhook
Published: 2023-03-23 17:37:01

## **What are the API Architectural Styles?**

The diagram below shows the common API architectural styles at a glance.


![API](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3be20drxg8qw2n1r1gr1.png)



🚀Let's take a closer look at the different architectural styles.

🤔How often do you know what architectural patterns are available?👀

### 🚀**REST:**

Proposed in 2000, REST is the most commonly used style. It is often used between frontend clients and backend services. It is compliant with 6 architectural constraints. The common payload formats can be JSON, XML, HTML, or plain text.

The six architectural constraints are:

- Uniform interface
- Stateless
- Cacheable
- Code on demand
- Layered system
- Client-server

### 🚀**GraphQL:**

GraphQL was proposed in 2015 by Meta. It provides a schema-based and type system suitable for complex systems where the relationships between entities are graph-like.

Let's understand it through the diagram. GraphQL can retrieve user and order information in one request, whereas in REST, it requires multiple calls to get the information for user and order.

GraphQL is not a replacement for REST. It can be built upon existing REST services.

### 🚀**WebSockets:**

WebSockets are a protocol that provides full-duplex communication over TCP. Clients establish WebSockets to receive real-time updates from the backend services.

Unlike REST, which always pulls data, WebSockets enable pushing.

### 🚀**Webhooks:**

Webhooks are usually used for third-party asynchronous API calls.

Let's understand how it works under the hood.

As shown in the diagram, we use Stripe and PayPal for payment channels and register a Webhook for payment results. When a third-party payment service is done, it notifies the payment service if the payment is successful or failed. Webhook calls are usually part of the system's state machine.

### 🚀**gRPC:**

Released in 2016, gRPC is used for communications among microservices. The gRPC library handles encoding/decoding and data transmission.

### 🚀SOAP:

SOAP stands for Simple Object Access Protocol. Its payload is XML only, suitable for communications between internal systems.

🤔Over to you: What API architectural styles have you used?

---

Share your feedback, and if you like it, then kindly retweet the first tweet😃

New to my profile? 🎉

Hey! I am Ayush, a full-stack developer from India. I tweet about my coding journey.

Follow [@ayushsoni1010](https://twitter.com/ayushsoni1010) for more such content😉
Understanding the difference: Primitive Vs Reference Data types in JavaScript.
Published: 2023-03-23 17:30:00

JavaScript has majorly two kind of data type categories,

1. Primitive Data type
2. Reference Data type

And the major differentiation between the two happens on the grounds of how the data types are stored in the memory. Below we will discuss about how this all works.


## Primitive data types 

These data types are stored in a much simple way than reference, below are the examples :

- Numbers 

- Strings

- Boolean

- Null

- Undefined

- Symbols

## How are they stored in the memory?

When a primitive data type is declared, it gets stored on the stack, and it is identified by the variable name used to declare it. 

Let's consider an example, 

```
let num1 = 29;
let num2 = num1;
//num1=num2=29;
//now we may reassign a new value to num1
let num1 = 45;
console.log(num1,num2);
//gives num1 = 45, but num2 = 29

```

This happens because each time we declare a primitive data type, this gets stored in a stack, i.e. the computer creates room for num1 and when we assign the same value to num2, it gets a separate memory location. Therefore, any changes to num1 do not reflect upon num2, since they both are stored at different places. 



## Reference data types

These types of data types are particularly objects. Examples are :

- Objects

- Functions

- Collections

- Arrays

- Dates


## How are they stored in the memory?

They are stored a bit differently in the memory, let's see how.

Whenever a reference data type is created, the variable name with which it is declared gets a pointer value assigned to it instead of the actual data value, this pointer value is an address to the memory location where the reference data type value is stored, in heap, a totally different memory location than the stack.
For example,

```
let arr1 = [1,2,4];
let arr2 = arr1;
//now we may reassign value to arr1 = [1,2,34];
let arr1 = [1,2,34];
console.log(arr1,arr2);
//gives an output where now arr1 = arr2 = [1,2,34];
 
```
This happens because when arr1 is created, the value gets stored in the heap, and arr1 gets a pointer as the value assigned, in the stack, and when arr2= arr1, arr2 gets a pointer with the same address value since the array was created only once, unlike in the case of primitive data type. Therefore, when a change is made to the array value, the change reflects in both arrays, since they point to the same value.
Five minute maintainers: Meet Pierre Sassoulas ✨
Tags: opensource, python, maintainers
Published: 2023-03-23 17:19:26

Introducing, Pierre Sassoulas! Pierre maintains pylint and a host of useful packages, but got his start in open source as a Wikipedia volunteer. Watch to learn more about Pierre and his journey in open source, and his impressions on the industry today!

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

You can also view this video on our [YouTube channel](https://www.youtube.com/@tidelift8670) and in the [Tidelift Community](https://community.tidelift.com).

Are you a maintainer who would like to be featured in our five minute maintainer series? Reach out to Lyn Muldrow, Senior Maintainer Advocate, at lyn@tidelift.com.
What is an idempotent API?
Tags: webdev, api, backend
Published: 2023-03-23 17:16:58

An idempotent API is an API that can be called multiple times with the same input parameters and produces the same result every time. In other words, calling an idempotent API multiple times with the same inputs should have the same effect as calling it once.


This is a desirable property for APIs that perform operations that are meant to be idempotent, meaning that they can be repeated multiple times without causing unintended side effects.

For example, consider an API that deletes a resource from a database. If the API is idempotent, then calling it multiple times with the same input (the ID of the resource to be deleted) should delete the resource the first time, and have no effect on subsequent calls.

To make an API idempotent, it is important to ensure that the API’s implementation is deterministic and does not have any side effects that are not idempotent. This means that the API should not modify any state outside of its own scope, and that it should always return the same result for the same input.

In practical terms, an idempotent API should be designed so that a client can retry a request that fails due to a network error or other transient issue without worrying about unintended side effects. For example, if a client sends a request to an idempotent API and does not receive a response due to a network error, it should be safe to retry the request without worrying about unintended side effects.

Overall, idempotent APIs are useful in many scenarios where repeatable, reliable, and predictable behavior is required.
Why we chose Rust to build an Open Source Payments Switch
Tags: rust, webdev, opensource
Published: 2023-03-23 17:16:00

It was a nothing more than a quick decision driven by love and hate: https://hyperswitch.io/blog/why-we-chose-to-build-hyperswitch-with-rust-cld2ssidl208801mld302cz3l5

[Checkout out our Github repository to pitch in and contribute](https://github.com/juspay/hyperswitch)