teleren/devto huggingface dataset:
Simplificando o desenvolvimento React: 5 maneiras inteligentes de usar o spread operator
Published: 2023-12-09 03:00:00


O operador spread, representado pelas reticências, tem como finalidade a manipulação de arrays e objetos por meio da desestruturação. Vejamos cinco formas de utilizá-lo no React:
#1. Passando Props: 
É comum passarmos propriedades com o mesmo nome entre componentes. Utilizando o spread operator, é possível passá-las de forma menos verbosa e mais clara, inclusive propriedades com nomes diferentes.

![Image Passando Props](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/crjlngq0ojdxu6mpbvoe.png)


#2. Atualizando Estados: 
De acordo com a documentação do React, não é possível modificar um estado diretamente. Portanto, é necessário reatribuir um novo valor utilizando a função do useState. Essa função retorna um callback cujo argumento é o último valor do estado.

![Image Atualizando Estados](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/iu6clbpvbop6klifaktx.png)


#3. Customizando Componentes de Bibliotecas: 
Ao utilizar bibliotecas, temos componentes prontos à disposição, mas às vezes esses componentes precisam de alterações que se adequem ao nosso fluxo de trabalho. No exemplo abaixo, apresentamos um modelo de Modal customizado que resolve um problema comum de responsividade em Modais de bibliotecas como MUI e AntD.

![Image Customizando Componentes de Bibliotecas](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/r4fsfojwz4jsg9s2biqo.png)


#4. Importando Estilos: 
Ao utilizar objetos externos para estilização, conseguimos separar a interface do usuário da lógica, permitindo o aproveitamento desses estilos em mais de um local.

![Image Importando Estilos](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2e8h1wbwv2dogvlw6fvo.png)

#5. Passando um Valor Variável para uma Função:
O operador spread pode ser utilizado para passar um conjunto variável de itens para uma função. Isso é útil quando queremos repassar diversos argumentos de forma dinâmica.

![Image assando um Valor Variável para uma Função](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ove853hah30evyi3f1rg.png)

Essas são algumas das maneiras em que o operador spread pode ser empregado no React para facilitar a manipulação de dados e aprimorar a legibilidade do código.
AWS Lambda with CloudWatch for Seamless EC2 State Change Notifications through SES.
Tags: iam, ec2, ses, lambda
Published: 2023-12-09 02:46:49


Creation of IAM:

1.	Search for iam in the console and create an IAM select lamda and then under policies search for ses and assign ses full access and again search for cloudwatch and then choose cloudwatch full access also then create a role by entering the role name.


Creation of EC2 :

1.	Create one EC2 instance.

Creation of SES:

1.	Search for SES then click on SES and fron the left side we have to select Email addresses and then click on verify a new email address.
2.	Enter the name of the email address and send a request. The receipient should accept the request then only our SES will come to veryfying state otherwise that will be in the pending stste only.
3.	NOTE: Amazon recently updated SES service we have to search for SES in the console and from left side we have to click on verified identities then create a new identity and choose email then enter our mail address and create no need to click anything else.
4.	


Creation of Lambda Function:

1.	Search for lambda in the console and click on the function and create a function bby selecting runtime as python and under role select from the existing role what ever we created earlier.
2.	Create the code and test.
3.	Here we are sending this mail to 3 receipients and also source is venkyy82@gmail.com


```

import json
import boto3

def lambda_handler(event, context):
    subject="Attention Please" 
    client=boto3.client('ses')
    body="""
         <br>
         This mail is comming from aws lambda Event Trigger.
         production server is down!!
         """
    message={"Subject":{"Data":subject},"Body":{"Html":{"Data":body}}}
    response=client.send_email(Source="venkyy82@gmail.com",Destination={"ToAddresses":["venkyy82@gmail.com","venkat.yeduru@gmail.com","venkateswarareddy227@gmail.com"]},Message=message)
    print("This mail is sent Successfully")

```

Creation of cloudwatch event trigger:

1.	Search for cloudwatch in the console and from the leftt hand side we have to select the Rule under events.
2.	Select the event pattern and then under service name search for ec2 and event type is ec2 (termination.) ec2 instance state change notification.
3.	Then  select specififc state under that we have to select stopped and any ec2 instance/specific ec2 instance we can select specific ec2 instance under that we have to add ec2 instance_ID.
4.	Create trigger then choose lamda select what is our lambda function nmae and create the rule.
5.	While creating cloudwatch rule we can select ec2 under this ec2 many events will be there. we can choose what ever we want.
6.
Business Intelligence and Analytics: A Comprehensive Guide
Tags: businessintelligence, dataanalytics, bigdata, predictiveanalytics
Published: 2023-12-09 02:12:06

## Introduction

In the modern business landscape, data is king. With the advent of digital technology, businesses are generating and collecting more data than ever before. This data, when properly analyzed and utilized, can provide valuable insights that can drive business growth and efficiency. This is where Business Intelligence (BI) and Analytics come into play.

## What is Business Intelligence?

Business Intelligence (BI) is a technology-driven process that involves the collection, integration, analysis, and presentation of business information. The purpose of BI is to support better business decision making. Essentially, Business Intelligence systems are data-driven Decision Support Systems (DSS).

BI encompasses various tools, applications, and methodologies that enable organizations to collect data from internal systems and external sources, prepare it for analysis, develop, and run queries against the data, and create reports, dashboards, and data visualizations to make the analytical results available to corporate decision-makers as well as operational workers.

## The Role of Analytics in Business Intelligence

While Business Intelligence provides the right information at the right time to the right people, Analytics goes a step further. Analytics is the systematic computational analysis of data or statistics. It involves studying past historical data to research potential trends, analyze the effects of certain decisions or events, or evaluate the performance of a given tool or scenario.

Analytics can be used to predict future trends or outcomes, which is known as predictive analytics, or understand the reasons behind a certain occurrence, which is known as prescriptive analytics.

## The Power of BI and Analytics

Together, BI and Analytics provide powerful tools for businesses. They can:

- **Improve Decision Making**: With accurate, up-to-date information, decision-makers can make informed choices that benefit the business.
- **Increase Operational Efficiency**: BI and Analytics can identify areas where resources are being wasted or processes can be streamlined.
- **Identify New Opportunities**: Through trend analysis and predictive analytics, businesses can identify new markets, customer segments, or product opportunities.
- **Gain Competitive Advantage**: Understanding your own data as well as market trends can give businesses a competitive edge.

## Conclusion

In the age of big data, Business Intelligence and Analytics are crucial tools for success. They allow businesses to navigate the complex landscape of modern business, making sense of data, and using it to drive growth and efficiency. Whether you're a small business owner or a leader in a large corporation, understanding and utilizing BI and Analytics can give you the tools you need to succeed in today's competitive marketplace.

Remember, data is only as good as what you do with it. So, harness the power of BI and Analytics, and let your data guide you to success. Happy analyzing!
Sublime Text: Editing
Tags: sublimetext, cheatsheet
Published: 2023-12-09 01:58:48

| Shortcut | Action |
| --- | --- |
| `Ctrl` `X` | Cut line |
| `Ctrl` `Enter` | Insert line after |
| `Ctrl` `Shift` `Enter` | Insert line before |
| `Ctrl` `Shift` `Up` | Move line/selection up |
| `Ctrl` `Shift` `Down` | Move line/selection down |
| `Ctrl` `L` | Select line - Repeat to select next lines |
| `Ctrl` `D` | Select word - Repeat selects other occurrences |
| `Ctrl` `M` | Jump to closing parentheses - Repeat to jump to opening parentheses |
| `Ctrl` `Shift` `M` | Select all contents of the current parentheses |
| `Ctrl` `Shift` `K` | Delete line |
| `Ctrl` `K, K` | Delete from cursor to end of line |
| `Ctrl` `K` `Backspace` | Delete from cursor to start of line |
| `Ctrl` `]` | Indent current line(s) |
| `Ctrl` `[` | Un-indent current line(s) |
| `Ctrl` `Shift` `D` | Duplicate line(s) |
| `Ctrl` `J` | Join line below to the end of the current line |
| `Ctrl` `/` | Comment/un-comment current line |
| `Ctrl` `Shift` `/` | Block comment current selection |
| `Ctrl` `Y` | Redo, or repeat last keyboard shortcut command |
| `Ctrl` `Shift` `V` | Paste and indent correctly |
| `Ctrl` `Space` | Select next auto-complete suggestion |
| `Ctrl` `U` | Soft undo; jumps to your last change before undoing, change when repeated |
| `Alt` `Shift` `W` | Wrap selection in HTML tag |
| `Alt` `.` | Close current HTML tag |
| `Alt` `Q` | Hard wrap line to ruler column setting |

> ## Useful links
> - [Create Online cheatsheet](https://simplecheatsheet.com/)
> - [Sublime Text Cheatsheet](https://simplecheatsheet.com/sublime-text)
Reddit: Action
Tags: reddit, cheatsheet
Published: 2023-12-09 01:58:17

| Shortcut | Action |
| --- | --- |
| `A` | Upvote |
| `Z` | Downvote |
| `C` | New post |
| `R` | Reply to comments |
| `Ctrl` `Enter` | Submit comment or post |
| `S` | Save |
| `H` | Hide |
| `Q` | Open navigation |
| `Enter` | Collapse or expand comment |

> ## Useful links
> - [Create Online cheatsheet](https://simplecheatsheet.com/)
> - [Reddit Cheatsheet](https://simplecheatsheet.com/reddit)
SoundCloud: General II
Tags: soundcloud, cheatsheet
Published: 2023-12-09 01:57:55

| Shortcut | Action |
| --- | --- |
| `G` `H` | Navigate to history |
| `Shift` `S` | Shuffle |
| `Shift` `Down` | Decrease volume |
| `Shift` `Up` | Increase volume |
| `M` | Mute volume |
| `Left` | Seek backwards |
| `0-9` | Seek to position |
| `P` | Navigate to playing track |
| `H` | Show keyboard shortcuts |
| `G` `S` | Navigate to stream |
| `G` `P` | Navigate to profile |
| `Q` | Show next up |

> ## Useful links
> - [Create Online cheatsheet](https://simplecheatsheet.com/)
> - [SoundCloud Cheatsheet](https://simplecheatsheet.com/soundcloud)
Vim: Counts
Tags: vim, cheatsheet
Published: 2023-12-09 01:57:53

```
[count] <operator> <motion>
<operator> [count] <motion>
```
---
| Combination | Description |
| --- | --- |
| 2`d`d | Delete `2` lines |
| 6`y`y | Copy `6` lines |
| `d`3w | Delete `3` words |
| `d`5j | Delete `5` lines downwards |
| `>`4k | Indent `4` lines upwards |

> ## Useful links
> - [Create Online cheatsheet](https://simplecheatsheet.com/)
> - [Vim Cheatsheet](https://simplecheatsheet.com/vim)
AI Directory: Email assistant
Tags: aidirectory, cheatsheet
Published: 2023-12-09 01:57:51

* [![Favicon](https://icon.horse/icon/missiveapp.com) Missive](https://missiveapp.com)
* [![Favicon](https://icon.horse/icon/magicreach.ai) Magicreach](https://magicreach.ai)
* [![Favicon](https://icon.horse/icon/ellieai.com) Ellie](https://ellieai.com)
* [![Favicon](https://icon.horse/icon/superreply.co) Superreply](https://superreply.co)
* [![Favicon](https://icon.horse/icon/chatgptwriter.ai) Chatgpt writer](https://chatgptwriter.ai)
* [![Favicon](https://icon.horse/icon/superhuman.com) Superhuman](https://superhuman.com)

> ## Useful links
> - [Create Online cheatsheet](https://simplecheatsheet.com/)
> - [AI Directory Cheatsheet](https://simplecheatsheet.com/ai-directory)
Notify Yourself After Completing a Long-Running Bash Process
Tags: bash, programming, tip, beginners
Published: 2023-12-09 01:16:03

Recently, I worked on projects that take a long time to build. I often stared at the screen, waiting for these to complete, which often resulted in me sleeping off at my desk. Later, I improvised sleeping while listening to some podcasts, but I usually lost valuable time since I couldn't tell when the long-running tasks were done. If only I could get notified if a bash process is done.

## Say hello to the "say" command

The say command takes a string of text and reads it out loud. The example below says "brew upgrade done" when you're done upgrading your brew packages.

```bash
brew upgrade; say, "brew upgrade done."
```

Perhaps you often sleep off while listening to one of those monotonic dialogues between Lex Fridman and Elon; you could repeat the alert until you wake up with a little sprinkle of bash.
```bash 
brew upgrade; for i in {1..1000}; do; say "brew upgrade done"; done;
```

That would say "brew upgrade done" 1000 times unless you manually stop it(with ctrl+c).

If you don't wake up after 1000 iterations, you should close your laptop for the weekend sleep. Just sleep 😆. 

> ℹ️ The say command comes preinstalled with Macos (I think), but its equivalent should be available on your Linux distro. For example, on my Ubuntu desktop installation, I have `spd-say.`

Alright, that's it. Have a great weekend, you all.
Great ideas start with a scribble
Tags: firstpost, webdev, itservices, productivity
Published: 2023-12-09 01:42:31


![Cultivating brilliance begins with a simple scribble – where imagination meets the canvas of innovation. Ignite your digital journey with Qubit Systems.](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/c4ak3iggft7wmn91ft44.jpg)
Understanding Tanstack Query Keys
Published: 2023-12-09 01:34:16

 In React Query, the Query Key is a unique identifier that represents a specific query. They not only help you identify the query, but they also play a critical role in caching data.  At a high level, the Query Key is an array and can simply contain a single string or be more complex and contain nested objects. This identifier is used to manage the cache, track the status of queries, and enable efficient updates to the UI when data changes. This blog will give an understanding of that functionality and best practices on how to do that effectively so you can get React Query up and running in your project.

### Caching

To understand the role Query Keys play and how to use them you have to understand that the Query Cache is an object. In this object, the keys are your Query Keys that have been serialized and the value is the data returned from your query. Because of this, your keys will need to be unique to that specific query otherwise when React Query finds an entry for that key, it will use the value rather than use the query function to return the data. 

### Invalidating 
  
In React Query, when you invalidate a query the Query Function refetches and updates the data associated with a particular query. When data in the underlying source changes, you can use the `queryClient.invalidateQueries` method to mark a specific query or set of queries as stale. This triggers a refetch the next time the invalidated query is accessed.

For instance, if a user updates an item in a to-do list, the corresponding query fetching that list can be invalidated using this method:

```  
queryClient.invalidateQueries(queryKey);
```

By invalidating queries strategically, you ensure that the UI reflects the most up-to-date data without the need for a manual refresh. React Query's caching system then handles the refetch efficiently, maintaining a seamless and performant user experience.

### Structure

Structure your keys as an array from most generic to most specific, with as much detail as you see fit. Be sure to include any variables your function depends on. Consider breaking apart the URL with the information in each slash being a new element in the array.


```
/posts > ["posts"]
/posts/1 > ["posts", post.id]
/posts?authorId=1 > ["posts", {authorId: 1}]
/posts/2/comments > ["posts", post.id, "comments"]
``` 
 
 With this structure, you can invalidate everything related to posts with `["posts"]` and any specific post.id.

### Dynamic

One of the strengths of React Query is its ability to handle dynamic data fetching. Query keys can include dynamic parameters, allowing you to easily fetch data based on user input or other changing conditions.

```
const userId = getCurrentUserId(); // dynamic user ID const userQueryKey = ['user', userId];
```


In this example, the query key includes a dynamic `userId` obtained at runtime, allowing you to fetch data for a specific user dynamically.
1950Labs - Your one-stop partner for software development and UI design
Tags: software
Published: 2023-12-09 00:11:49

Your best alternative to freelance and independent contractors is in a nearshore location in the US time zone. We combine UX, UI, programming, and testing to help our clients from the US/EU/IL grow, win more projects, and get funded.

1950Labs is a boutique software development shop specializing in remote staffing. Our main strength is with Fintech. However, we work for automotive, health care, and other industries. We also run a UX/UI design department that delivers pixel-perfect results.

We manage the biggest local networking group of developers and designers (UruguayIT) and have an extensive talent pool across Latam. Due to that, if we don’t have the talent you need available, we can find it faster than any other company in the Latam region.

[https://1950labs.com](https://1950labs.com)
Focus Strategies: How Can You Enhance Productivity?
Tags: discuss, codenewbie, beginner
Published: 2023-12-09 00:00:00

---
published_at : 2023-12-09 00:00 +0000
---
Improving focus is a common goal for many. What strategies can individuals employ to enhance their focus, and how might these techniques positively impact their productivity?
<br>
Follow the CodeNewbie Org and #codenewbie for more discussions and online camaraderie!
{% embed https://dev.to/codenewbieteam %}
intrinsic vs extrinsinc
Tags: gamedev, writing
Published: 2023-12-24 16:21:51

---
title: intrinsic vs extrinsinc
published: true
date: 2023-12-09 00:00:00 UTC
tags: [ 'gamedev', 'writing' ]
canonical_url: https://onwriting.games/daily/20231209-2350-intrinsic-vs-extrinsinc/
---

In yesterday's email, I mentioned that _Slay the Princess_ falls into a case which I consider to be **extrinsic motivation** : when the princess in her spiritual state tells you that you have to bring her 3 vessels.

This is what's known as a "fetch quest". A request from a character for us to go **find something and bring it back**.

I am not against fetch quests (or not completely aganst them?), but basing an **entire game's progress** on "bring me 3 of something" feels a bit lazy, especially when other parts of the narrative are _so good_.

Intrinsic motivation comes from an **internal desire of the player to do something** ; this can be a question they want to answer, or simply an interest in seeing how the story unfolds, what consequences their actions may have, etc.

Extrinsic motivation is when there is _something external that makes us want to advance_. A fetch quest is an example of this: the player has no interest in obtaining that item, except because an external agent asked for it.

Another example could be completing an "Achievement" in a game.

_Slay the Princess_ has many achievements, and just seeing them there can make a player more eager to replay, but it's not the game that is generating this motivation, but the list of achievements.

For me, intrinsic motivation is **much more valuable** , it's the holy grail of keeping the player captivated in our story.

But when we're in trouble, and there's little time, planting extrinsic motivation is a **tool we always have at our disposal** , especially for replayability.
Adventofcode 🎄: Day 8 - ReactDom
Published: 2023-12-08 23:51:55

ReactDom is a Javascript library that provides a bridge between React and the browser's DOM (Document object model). It is specifically designed for rendering React components in web applications. React itself is a JavaScript library for building user interfaces, and ReactDOM is an essential part of it when it comes to rendering those interfaces in the browser. 

**KEEP CODING!!**
Planning for my last issue for OSD
Published: 2023-12-08 23:24:44

Due to a lack of time, I am planning to work on a feature/enhancement implementation for this project  [Track Your Regions](https://github.com/OhmSpectator/track-your-regions). 

I chose this project because the project owner was very helpful and understanding. For example, there were times when I did not know how to perform certain tasks with Git, and he provided assistance. He also suggested which tickets I should work on and explained them. I participated in discussions, and I have been working on this project since release 0.3. So, I believe this aligns well with the communication requirements of this release.


The plan is to work on this [issue](https://github.com/OhmSpectator/track-your-regions/issues/51) which involves creating a fallback mechanism for regions without geometry data. In my last pull request (PR), I noticed this issue, and the creator explained to me that there was no fallback yet. He mentioned that there is an issue opened for that.

There are three things that I have to do:


 - Add a conditional rendering in the RegionMap component that checks if the selected region has geometry data.

Add conditional rendering in the RegionMap component that checks if the selected region has geometry data.

After checking the RegionMap component when we fetch the geometry data using the fetchSelectedRegionGeometry() method, we can determine if the region has geometry by checking the returned object:
```js
regionGeometryCache.current.push({
          id: selectedRegion.id,
          hierarchyId: selectedHierarchy.hierarchyId,
          geometry: response.geometry,
});
```

Based on that, I can create a conditional component with React useState, but this may change after the PR review.

 - If the selected region lacks geometry data, render a button that calls the getGeometry function with force set to true.

This is related to the first requirement. I just have to show the button based on whether there is geometry, and then call getGeometry().

- Test the new functionality with different regions to ensure it works as expected.

Lastly, I will test the work I did by checking which can be done by using regions with geometry data and without it. It can also be validated by the owner.

I will start with this draft, and with 4 days left to work on this, I will begin by creating a draft PR with basic implementation on the 9th, then address feedback from the reviews, test it on the 10th, and probably polish it on the 11th.