teleren/devto huggingface dataset:
Github commit searcher
Tags: redishackathon
Published: 2022-08-27 07:29:00

### Overview of My Submission

**What?** 
This is basic project to find messages in your commit history.

**Why?**
I was thinking to create app to get information from my commits if i want to find some important message that was wrote before.

**How?**
To get information was used Github-API and to run Redis locally was used Docker.

**Improvement ideas**

- use GitHub Actions to update information automatically
- save more dat and filter this data in frontend
- use advance caching from Redis to increase performance

### Submission Category: 

~~MERN~~/RERN(Redis,Express,React,Node) Mavericks

### Language Used
- JavaScript

### Tech-Stack
- Redis to store data (database)
- Redis to search data (search engine)
- Node with express (backend)
- React (frontend)


### Link to Code

{%embed https://github.com/Yordaniss/commit-searcher %}

Licence: MIT

### Additional Resources / Info

[Github-Api](https://docs.github.com/en/rest)
[Docker-Image](https://hub.docker.com/_/redis)

### Collaborators

Solo project

* _Check out [Redis OM](https://redis.io/docs/stack/get-started/clients/#high-level-client-libraries), client libraries for working with Redis as a multi-model database._
* _Use [RedisInsight](https://redis.info/redisinsight) to visualize your data in Redis._
* _Sign up for a [free Redis database](https://redis.info/try-free-dev-to)._
9 useful code snippets for everyday JavaScript development || Part 2
Published: 2022-08-27 07:16:47

Hello Everyone

Welcome to this JS code snippets series. Thanks a lot for all the love to the 1st part of this post.

This is the 2nd post with 4 JS code snippets that you can use in your everyday JavaScript development.

Read the first 5 code snippets [here](https://dev.to/swastikyadav/9-useful-code-snippets-for-everyday-javascript-development-part-1-478a).

## 6. Form data to Object.
This snippet will make your life a lot easier by converting form data into object which you can directly use as payload.

```javascript
const formToObject = form =>
  Array.from(new FormData(form)).reduce(
    (acc, [key, value]) => ({
      ...acc,
      [key]: value
    }),
    {}
  );

formToObject(document.querySelector('#form'));
// { email: 'test@email.com', name: 'Test Name' }
```

- First use the **FormData** constructor to convert HTML form into FormData.
- Convert FormData into an Array with **Array.from**.
- Use **Array.prototype.reduce** to achieve the desired object from array.

## 7. Generate UUID in browser
Let's say you need a unique id/key for every item in your list. With this snippet you can generate unique id/key right in your browser.

```javascript
const UUIDGeneratorBrowser = () =>
  ([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, c =>
    (
      c ^
      (crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (c / 4)))
    ).toString(16)
  );

UUIDGeneratorBrowser(); // '7982fcfe-5721-4632-bede-6000885be57d'
```

- Use **Crypto.getRandomValues()** to generate a UUID.
- Use **Number.prototype.toString()** to convert it to a proper UUID (hexadecimal string).

## 8. Check if a string is valid JSON.
If you have ever accessed an object from localStorage, you know that you get a stringified version of that object.

And, now you want to check if that stringified object is valid JSON or not.

The below snippet will help you exactly with that.

```javascript
const isValidJSON = (str) => {
  try {
    JSON.parse(str);
    return true;
  } catch (err) {
    return false;
  }
};

// Example
isValidJSON('{"name":"John","age":30}');
// true
isValidJSON('{name:"John",age:30}');
// false
```

- In the try block, we parse the string with **JSON Parse** method.
- If string in invalid JSON, catch block will return false else true.

## 9. Array to CSV
You have an array of data, and you want to convert it to CSV, so that you can open it on excel or google sheet.

Well, Vanilla JS can do that also for you.

```javascript
const arrayToCSV = (arr, delimiter = ",") =>
  arr.map((row) => row.map((value) => `"${value}"`).join(delimiter)).join("\n");

// Example
arrayToCSV([
  ["one", "two"],
  ["three", "four"],
]);
// '"one","two"\n"three","four"'
```

- The Array map method is used to iterate over each level of the array and join each value with a defined delimiter.

--------------------------

So, that is it for this post. If you anyhow liked this post, make sure to show your support.

I also run a weekly newsletter, so you can join me there also: https://swastikyadav.com

Thank You!
🚀𝗧𝗵𝗲 𝘀𝗶𝗺𝗽𝗹𝗲𝘀𝘁 𝘄𝗮𝘆 𝘁𝗼 𝗴𝗲𝘁 𝗹𝗲𝗻𝗴𝘁𝗵/𝘀𝗶𝘇𝗲 𝗼𝗳 𝗮𝗻 𝗼𝗯𝗷𝗲𝗰𝘁 𝗶𝗻 J𝗮𝘃𝗮S𝗰𝗿𝗶𝗽𝘁.
Tags: javascript, webdev, programming, beginners
Published: 2022-08-27 07:08:44

🚀𝗧𝗵𝗲 𝘀𝗶𝗺𝗽𝗹𝗲𝘀𝘁 𝘄𝗮𝘆 𝘁𝗼 𝗴𝗲𝘁 𝗹𝗲𝗻𝗴𝘁𝗵/𝘀𝗶𝘇𝗲 𝗼𝗳 𝗮𝗻 𝗼𝗯𝗷𝗲𝗰𝘁 𝗶𝗻 𝗷𝗮𝘃𝗮𝘀𝗰𝗿𝗶𝗽𝘁 𝗶𝘀 𝘂𝘀𝗶𝗻𝗴 𝗼𝗯𝗷𝗲𝗰𝘁.𝗸𝗲𝘆 𝗺𝗲𝘁𝗵𝗼𝗱 

 ✔️ 𝑇ℎ𝑒𝑟𝑒 𝑖𝑠 𝑛𝑜 𝑏𝑢𝑖𝑙𝑡-𝑖𝑛 𝑓𝑢𝑛𝑐𝑡𝑖𝑜𝑛 𝑜𝑟 𝑝𝑟𝑜𝑝𝑒𝑟𝑡𝑦 𝑎𝑣𝑎𝑖𝑙𝑎𝑏𝑙𝑒 𝑡𝑜 𝑐𝑎𝑙𝑐𝑢𝑙𝑎𝑡𝑒 𝑡ℎ𝑒 𝑙𝑒𝑛𝑔𝑡ℎ/𝑠𝑖𝑧𝑒 𝑜𝑓 𝑎𝑛 𝑜𝑏𝑗𝑒𝑐𝑡.


✔️ 𝘛𝘩𝘦 𝘖𝘣𝘫𝘦𝘤𝘵.𝘬𝘦𝘺𝘴() 𝘮𝘦𝘵𝘩𝘰𝘥 𝘳𝘦𝘵𝘶𝘳𝘯𝘴 𝘢𝘯 𝘢𝘳𝘳𝘢𝘺 𝘰𝘧 𝘢 𝘨𝘪𝘷𝘦𝘯 𝘰𝘣𝘫𝘦𝘤𝘵'𝘴 𝘰𝘸𝘯 𝘦𝘯𝘶𝘮𝘦𝘳𝘢𝘣𝘭𝘦 𝘱𝘳𝘰𝘱𝘦𝘳𝘵𝘺 𝘯𝘢𝘮𝘦𝘴.

____________________________________


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/89zn0ormvhrl8adnnxlo.jpg)
Watering Plants
Tags: python, programming, beginners, warmi
Published: 2022-08-27 07:05:00


##PROBLEMA
LeetCode:Watering plants 
Vas a utilizar un cántaro para regar. En el jardín tienes n plantas,cada planta necesita una cantidad especial de agua,si no tiene suficiente agua para regar una planta ,vuelves al río a llenar el tanque de agua.
##EXPLICACION
Plantas a regar [1,2].
Capacidad del cantaro 2.
vas a la planta 1 (pasos 1) ,la nueva cantidad del cantaro es 1.
vas a la planta 2 ,la cantidad del cantaro no es suficiente vuelves (pasos 2 de vuelta y 1 de ida),la nueva cantidad del cantaro es 0.
Total de pasos:1+2+1=4
##SOLUCION
La suma de los pasos es igual a, estoy segura de que lo pensaste,continuemos con el caso de explicacion.
1. _**Luego que el cantaro queda sin capacidad**_ para regar a x planta ,la posicion*2 es la distancia que recorre,despues lo vuelvo a llenar.


2. Ahora si tengo capacidad _**solo adiciono +1**_ a mis pasos,se que regare a todas las plantas ,eso significa que dare todos los pasos que es igual a la cantidad de plantas a regar.



![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tioavnp7s9hv3obc5pcw.png)
 
Total = 2+(1)*2=4

##MENSAJE FINAL
¡vamos juntos, aprendamos juntos!

Author:Melany E. miembro de Pyladies el Alto
¿Por qué es importante normalizar los conjuntos de datos?
Tags: machinelearning, datascience, aprendizajeautomatico
Published: 2022-08-27 07:01:16

La estandarización de datos es una práctica común en la ciencia de datos y el aprendizaje automático. ¿Qué significa realmente y por qué es beneficioso?

Definición
==========

Estandarizar un conjunto de datos significa transformar los datos para que tengan una media de 0 y una desviación estándar de 1. Esto se suele hacer restando la media de cada punto de datos y dividiéndola por la desviación estándar.

Visualmente, esto significa convertir un conjunto de datos como este:

![](https://res-3.cloudinary.com/hc43cqwj4/image/upload/q_auto/v1/ghost-blog-images/Captura-de-Pantalla-2022-08-22-a-la-s--7.11.41-p.-m..png)![](https://res-4.cloudinary.com/hc43cqwj4/image/upload/q_auto/v1/ghost-blog-images/normal-data.png)

A uno como este:

![](https://res-2.cloudinary.com/hc43cqwj4/image/upload/q_auto/v1/ghost-blog-images/Captura-de-Pantalla-2022-08-22-a-la-s--7.07.46-p.-m..png)![](https://res-4.cloudinary.com/hc43cqwj4/image/upload/q_auto/v1/ghost-blog-images/scaled-data-1-.png)

Veamos algunas de las ventajas de la normalización:

Precisión
=========

La normalización permite realizar comparaciones más precisas entre los puntos de datos. Si dos puntos de datos están en escalas diferentes, puede ser difícil saber si son realmente diferentes entre sí o si la diferencia se debe sólo a la escala. La normalización de los datos elimina este problema.

Rendimiento de los algoritmos de aprendizaje automático
=======================================================

Otra razón por la que la estandarización es importante es que puede ayudar a mejorar el rendimiento de los algoritmos de aprendizaje automático. Muchos algoritmos de aprendizaje automático se basan en el descenso de gradiente, y requieren que todas las características estén en una escala similar para funcionar correctamente. Si las características no están estandarizadas, el algoritmo puede tener dificultades para converger en una solución.

Evitar los valores atípicos
===========================

Por último, la estandarización también puede ayudar a reducir la cantidad de ruido en los datos. Si hay muchos valores atípicos en los datos, pueden tener un impacto significativo en los resultados de cualquier análisis que se realice. Estandarizar los datos puede ayudar a filtrar parte del ruido y hacer que los resultados sean más fiables.

Esperamos que este artículo le haya proporcionado algunas ideas sobre el popular concepto de estandarización de los conjuntos de datos en la ciencia de los datos y sus muchas ventajas.

Mira este post en Art Of Code: https://es.artofcode.tech/por-que-es-importante-normalizar-los-conjuntos-de-datos/

Crédito imagen: <https://unsplash.com/@mbaumi>
Why is it important to standardize datasets?
Tags: datascience, machinelearning
Published: 2022-08-27 06:55:21

Data standardizing is a common practice in data science and machine learning. What does it actually mean and why is it beneficial?

Definition
==========

Standardizing a dataset means to transform the data so that it has a mean of 0 and a standard deviation of 1. This is often done by subtracting the mean from each data point and then dividing by the standard deviation.

Visually, this means turning a dataset like this:

![](https://res-3.cloudinary.com/hbig9cpoo/image/upload/q_auto/v1/ghost-blog-images/Captura-de-Pantalla-2022-08-22-a-la-s--7.11.41-p.-m..png)![](https://res-4.cloudinary.com/hbig9cpoo/image/upload/q_auto/v1/ghost-blog-images/normal-data.png)

Into this:

![](https://res-2.cloudinary.com/hbig9cpoo/image/upload/q_auto/v1/ghost-blog-images/Captura-de-Pantalla-2022-08-22-a-la-s--7.07.46-p.-m..png)![](https://res-4.cloudinary.com/hbig9cpoo/image/upload/q_auto/v1/ghost-blog-images/scaled-data-1-.png)

Let's see some of the benefits of standardizing:

Accuracy
========

Standardizing allows for more accurate comparisons between data points. If two data points are on different scales, it can be difficult to tell if they are actually different from each other or if the difference is just due to the scale. Standardizing the data eliminates this issue.

Performance of machine learning algorithms
==========================================

Another reason why standardization is important is that it can help improve the performance of machine learning algorithms. Many machine learning algorithms are based on gradient descent, and they require that all features be on a similar scale in order to work properly. If the features are not standardized, the algorithm may have a hard time converging on a solution.

Avoiding Outliers
=================

Finally, standardization can also help to reduce the amount of noise in the data. If there are a lot of outliers in the data, they can have a significant impact on the results of any analyses that are performed. Standardizing the data can help to filter out some of the noise and make the results more reliable.

We hope this post gave you some insights into the popular concept of standardizing datasets in data science and its many benefits.

Check out this post in Art Of Code: <https://artofcode.tech/why-is-it-important-to-standardize-datasets/>

Image credit: <https://unsplash.com/@mbaumi>
jQuery
Tags: javascript
Published: 2022-08-27 06:54:13

* `$(event.currentTarget).val();` can get the value from form elements.
* `.change()` method can be used among `<input>,<textarea> and <select>`. It triggers an event when the value is changed with a mouse.
* `.addClass(className)` and `.removeClass(className)` both don't have a period inside the parenthesis.
* `$('#id').animate({},time)` the first parameter is an object containing the css properties.
* `$(this)` inside the event handler doesn't need to run the second DOM query.
* `parent.append(child)` will add the child to the parent
* `$('target').attr('id', 'value_of_your_id')` add an id to the target
* slim jQuery doesn't have JQuery UI
Onboarding onto a new team
Published: 2022-08-27 06:49:40

I had previously worked at a development agency, and many many many small companies. This taught me how to hit the ground running with at least a basic understanding of the product I was working on within several weeks or even days.

Here's how I do it. 

1. Get set up on the shared & local test environments ASAP.
2. Learn how to create and use test data.
3. Get set up the VPN & HTTP/S proxy.
4. Learn the little bureaucratic processes and rules around getting access.
5. Mosey around the code, the databases, the logs, and the user interface, etc.
6. Read through the Requirements, wireframes, UI designs and flows, and key tickets for the project.
7. Search Github for frequently used keywords to see how the functions & services connect together. 
8. Have short video call sessions with at least 1 member of each team - backend, frontend, mobile, and so on, to get to know them as a person & build rapport.
9. Ask the people who've been on the team for the longest if they have any special tricks for navigating around the organisation you work for, and any productivity tips they might have. 
10. Do some ad-hoc testing. Try stuff out on the user interface or postman, and observe the UI & logs & the DB & the proxy to see what happens. 
11. Preference 'hanging out' in the office to 'doing work' in the office. You learn more about the team and product by talking to team members about how they do their work, and asking to see what they're working on, than sitting in a corner working on your ticket for the day.
12. Buddy up with an established team member.
Conditional Formatting using SPFX field customizer
Tags: spfx
Published: 2022-08-27 06:45:39

I have a field name called Security(choice field) and other field name is Sensitivity. I want to copy the values of Security in Sensitivity in the list view. For example if value of security is Internal then in sensitivity column also it should show Internal in the list view only irrespective of the values stored in sensitivity. In laymen term Both field should show same values. I am new in spfx environment. Please help. I am using react framework. Let me know if you need any other details.
Booking Appointments with Twilio, Notion, and FastAPI
Tags: generalprogramming, notion, twilio, python
Published: 2022-08-27 06:38:26

Most businesses run around the concept of appointments. Appointments allow you to schedule different events for different individuals. For example, before seeing a doctor, it might be necessary to book an appointment. Businesses can leverage the power of WhatsApp to allow their customers to book appointments easily just by sending messages. They can also get updates or check the status of their appointments through WhatsApp messages.

In this tutorial, you’ll learn to use Twilio’s WhatsApp API with the Notion API and FastAPI to create appointments and get their statuses as well. You will use Notion for storing data, Twilio for sending WhatsApp messages, and FastAPI for API and business logic.

Read the full blog on [Twilio](https://www.twilio.com/blog/booking-appointments-twilio-notion-fastapi).

Thanks for reading 💜

---

I publish a [monthly newsletter](https://www.ravsam.in/newsletter/) in which I share personal stories, things that I am working on, what is happening in the world of tech, and some interesting dev-related posts which I come across while surfing the web.

Connect with me through [Twitter](https://twitter.com/ravgeetdhillon) • [LinkedIn](https://linkedin.com/in/ravgeetdhillon) • [GitHub](https://github.com/ravgeetdhillon) or send me an [Email](mailto:ravgeetdhillon@gmail.com).

— [Ravgeet](https://www.ravgeet.in/), *Full Stack Developer and Technical Content Writer*
Random Meal Generator - #001 of #100Days100Projects
Tags: webdev, javascript, programming, beginners
Published: 2022-08-27 06:35:00

I have completed my first project Random Meal Generator using codepen

Learned about:
1. Google fonts
2. CSS responsive styling media queries
3. Learned JavaScript Fetching API Data
4. Handling API data appropriately and displaying on the UI

{% codepen https://codepen.io/darshanghorpade/pen/WNzBRbb %}
Need Help to Learn Algo & DS
Tags: programming, cpp, algorithms, help
Published: 2022-08-27 06:20:15

I learned basic programming. I have solved several problems in various online judge. Now I want to learn Algorithms and Data Structures to improve my programming skills and become regular in competitive programming.

**I want such a site where first there will be a discussion/explanation about an algorithm/data structure, there will be code/pseudo code and at the end some problems related to that algorithm will be given so that by solving the problems I can become more experienced in that algorithm/data structure.**

Please help if there is any such site.

Thank you.
Machine Learning Projects
Tags: machinelearning, ai, flask
Published: 2022-08-27 06:12:01

Check out my other [machine learning projects](https://machinelearningprojects.net/machine-learning-projects/), [deep learning projects](https://machinelearningprojects.net/deep-learning-projects/), [computer vision projects](https://machinelearningprojects.net/opencv-projects/), [NLP projects](https://machinelearningprojects.net/nlp-projects/), and [Flask projects](https://machinelearningprojects.net/flask-projects/) at [machinelearningprojects.net](https://machinelearningprojects.net/)
CSS selector in depth(compound class selector)
Tags: css, beginners, webdev, programming
Published: 2022-08-27 06:04:48

We all know about the class, id ,type and universal selector. In this article we learn about the more advanced css selector.

## Compound Class selector

let’s create one html and one css file and link the the html file to the css. Write this code for understanding the compound class selector.

```
<!DOCTYPE html>
<html lang="en">
  <head>
    <title></title>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link href="selector.css" rel="stylesheet" />
  </head>
  <body>
    <!--Compound class selector-->
    <div class="box red">Box-1</div>
    <div class="box yellow">Box-2</div>
    <div class="circle yellow">Box-3</div>
  </body>

```

```
.box {
  height: 100px;
  color: red;
}
.circle {
  height: 200px;
  color: green;

```

Now if you want to select the second div for styling. There is problem.If apply our style using class selector box then first and second both get selected.If you apply style using yellow last two div gets selected. To only select the middle div element we need to use the compound class selector.


![Table to understand the compound class selector](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pqsvtvm6yo275utdxo7l.png)


**There is no space between each of .class portions of the compound selectors.**

Now style our second div using compound class selector.


```
.box.yellow {
 color:purple;
 height : 200px;
 
}
```

Let’s see the output of our code.

second div content became purple.


![html output](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/phg3b2eved2omwz0r3nx.png)
How to call a method or trigger a function from one component to another in Nuxt
Tags: vue, nuxt, javascript, beginners
Published: 2022-08-27 06:03:00

I need trigger a function from one component to another. I don't know it's necessary or not <span class="emoji-outer emoji-sizer"><span class="emoji-inner" style="background: url(chrome-extension://gaoflciahikhligngeccdecgfjngejlh/emoji-data/sheet_apple_32.png);background-position:59.9882491186839% 67.97884841363103%;background-size:5418.75% 5418.75%" data-codepoints="1f605"></span></span>. But whatever here is the solution for you - 

Suppose two component. One of them we can called `A` component and another can be called as `B` component- So I will trigger `A` component function  from `B` component.

In component `A`- 

```js
created() {
        this.$root.$refs.A = this;
    },

// and here is the method which I called from `B` component
methods:{
      print(){
        // your others function logic
        console.log('A component function called')
      
    },
```

And Now I called this `print` function from `B` component via a function.

In component `B` - 
```js
methods:{
  printFromA(){
        this.$root.$refs.A.print();
    }

}
```

voila!!! check your console 😇
Thank You.
I now have an animated sprite!
Tags: runtdeale, rust, bevy, gamedev
Published: 2022-08-27 05:56:11

So recently I've been working on refining the texture-handling system for my game, [RuntDeale](https://github.com/CalinZBaenen/RuntDeale/).
But, I finished polishing it (for now), so I ended up trying to do something a little more fancy for my next test-drive.

So, since I'm new to using Bevy and I don't know how much I truly understand, I decided to make a test "system" called `speeen` to test out how I could write a system for changing what the player looks like.
The function, in the words of Ceave Gaming, was "surprisingly simple", to make. Only five lines are used in the body.
```rust
/// Makes the player SPEEEEEEEEEEN.
pub fn speeen(
    mut spin_delay:ResMut<Timer>,
    mut player:Query<&mut TextureAtlasSprite, With<Player>>,
    time:Res<Time>
) {
    spin_delay.tick(time.delta());
    if spin_delay.just_finished() {
        for mut sprite in player.iter_mut() {
            sprite.index = (sprite.index+1) % 4;
        }
    }
}
```

Anyways,
if you want to check out the test or leave feedback on my game, I'd greatly appreciate it.

<center><h1><b>Thanks for reading!<br/>Cheers!</b></h1></center>
Library for bidirectional communication without WebSocket using Streaming request / Streaming response
Published: 2022-08-27 05:49:22

[Streaming request](https://developer.chrome.com/articles/fetch-streaming-requests/) is enabled from chrome 105. With streaming request, you can stream data to server - you can stream data to server gradually even when length of whole data is not known.(Needs HTTP/2 server) Meanwhile, [Streaming response](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API/Using_readable_streams), that has been usable from long time ago, is feature that get streamed data from server gradually. It is not able to use those two features on one HTTP connection because of limitation of current browser's implementation, but if you use two connections to download and upload you can do bidirectional communication between server and client without WebSocket. [Chatting example](https://github.com/azukiazusa1/fetch-upload-streaming-chat-app)

But above example has some problem: it uses stream like websocket. But streaming request and response guarantee order of messages like TCP but [not](https://fetch.spec.whatwg.org/#http-fetch) [guarantee](https://stackoverflow.com/questions/57412098/does-fetchs-response-body-chunks-correspond-to-http-chunks) separation of each messages. Even if you sent A and B separately, receiver may receive them as AB, not A and B. So we need to construct protocol when use streaming request or response, like constructing protocol over TCP to guarantee separation of messages. [Sibal](https://github.com/Lunuy/sibal) is protocol library that made to those features. Sibal is made with [TransformStream](https://developer.mozilla.org/en-US/docs/Web/API/TransformStream) of [Stream API](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API), you can easily construct communication environment that guarantee message-separation on environment with Stream, like web or node. [HTTP/2 Chatting example using Sibal](https://github.com/Lunuy/fetch-upload-streaming-chat-sibal)

If you have any question, feel free to comment.