teleren/devto huggingface dataset:
Looking for US Based Fully Remote Job?
Published: 2023-07-02 09:33:08

Hey!
I'm Avinash Vagh from India, I'm running "Remote Profile" Newsletter.
We just want to acknowledge that we run the Remote Profile Newsletter. Its been 3 week since we started.

If you’re developer with ( 3-5 or more year ) of experience then we highly recommended you to check out our newsletter. Fresher can also check it out.

What you can expect from the newsletter:
→ Globally Remote Company (Worldwide Hiring)
→ All companies profiles shared in the newsletter are must-hiring in India
→ 1 profile per issue
→ Company’s details
→ Founder's details
→ Networking opportunities
→ open job positions at the current company
→ Newsletter (Mon-Fri, 12:00 PM)

Here's a link to join our email list.
https://remoteprofile.beehiiv.com/subscribe


![Subscriber Base](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lc6knle7io8vzkq74ymw.png)

We're growing🚀 

Our Twitter Account is also Growing → https://twitter.com/remoteprofile
The (key) prop in React
Tags: react
Published: 2023-07-02 02:05:17

Working with arrays in React may lead to React internal warning message that can be viewed in the browser console:

	

```
Warning: Each child in a list should have a unique "key" prop.
Check the render method of `Array name`.
```
  
 
 
Using a special key prop allows React internally to keep track of each element in the array of JSX, so that in case any of the elements are added, updated or deleted, React can optimize performance and keep track internally of those changes.
 

```
function Numbers(){
   const numbers = [1, 2, 3, 4, 5]

   const newNumbers = numbers.map(number=> { 
     return <li>{number}</li>
    }
return (
   <div>
      <li>
         {newNumbers}
      </li>
   </div
  )
}
```





in the example above, the error message:

```
Warning: Each child in a list should have a unique "key" prop.
  Check the render method of `newNumbers`.
```


will be shown on the browser console and to fix this error we must give each (li) element a special key prop, like so:

```
   const newNumbers = numbers.map(number=> { 
     return (
      <li> key={number}
        {number}
      </li>
      )
    }
```





This special key prop allows React internally to keep track of each element in the array of JSX, so that in case any of the elements are added, updated, or deleted, React can optimize performance and keep track internally of those changes. 

The key should be a unique value associated with each element from the array. Since each element in the array is unique, we can just use each element for the key prop.

Any time we are creating an array of JSX elements, we must use the key prop.

Let's see a couple more examples of how this key prop can be used.

**With Objects**
It is often best to use the objects's id as the key:



```
const users = [
  { id: 1, firstName: "Duane", lastname: "Watson" },
  { id: 2, firstName: "Duane", lastname: "Johnson" },
]

const userHeadings = users.map(user => {
   return <h1 key={user.id}>{user.firstaName}</h1>
  })
```




**With Non-Unique Arrays**
If the array elements are not unique, and can't use the id, the element index position might be used:



```
const numbers = [0, 1, 2, 3, 4, 5]

const newNumbers = numbers.map((number, index)=> {
  return <div key={index}</div>
});
```




While this will make the error message go away, it's not necessarily the best approach and React recommend only using the index as a last resort.
#LearnedToday: Omatsuri
Tags: learnedtoday, webdev, javascript, css
Published: 2023-07-02 09:12:00

Omatsuri is a collection of open source browser tools for everyday use!

My favorite is the "Triangle Generator" which creates CSS code from a super easy to use GUI!

🔗 https://omatsuri.app

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ovs30q5lqtm72bhzfemn.png)
PostgreSQL Basics: Exploring "SELECT"
Tags: postgressql, postgres, tutorial, beginners
Published: 2023-07-02 09:10:04

In this tutorial we will be exploring the select statement for querying the database.

It is one of the most complex statement in PostgreSQL because of many number of clauses it provide for writing flexible queries.

## Basic Syntax

```
SELECT
   select_list(here you define needed attributes)
FROM
   table_name;

```

we separate column/attributes by `,`. Incase we need all the available columns in table, instead of writing all columns name separated by `,`, we use `*`.

Select statement selects mentioned columns from the table mentioned in from statement.

Note: From clause is not mandatory. if you do not need retrieve data from any table, you can just use Select statement.

Also, all statements are case insensitive in PostgreSQL. Hence select is same as SELECT or Select.

**Evaluation flow:**


![Flow of program](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/see54bihmfh4xzwbuxtu.png)

As, you can see from clause is executed before select clause.

## Different Clauses of SELECT

- **DISTINCT:** It is used to Select distinct rows.
- **ORDER BY:** It is used to Sort rows.
- **WHERE:** It is used to Filter rows.
- **LIMIT or FETCH:** They are used to Select a subset of rows from a table.
- **GROUP BY:** It is used to Group rows.
- **HAVING:** It is used to Filter groups.
- **Join:** There are many types of joins like `INNER JOIN`, `LEFT JOIN`, `FULL OUTER JOIN` and `CROSS JOIN`. All of them are used to join tables.
- **Set operations:** Different set operations can be performed using `UNION`, `INTERSECT`, and `EXCEPT`.

## Practical Examples

**Code**
```
SELECT first_name FROM customer;
```

**Output**

![Retrieved Table results](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/adr4t7wv320ilwiwsbal.png)


**Code**
```
SELECT
   first_name,
   last_name,
   email
FROM
   customer;
```

**Output**

![Retrieved Table results](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gzmg7vpwku0f0agavflk.png)

**Code**

```
SELECT * FROM customer;
```

**Output**

![Retrieved Table results](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/12wa2p2prb75ve7wmcpz.png)

That's it for today!
Feel free to reach me out, if you got any confusion.
Thanks for reading!
Learning Svelte - Intro
Tags: beginners, svelte
Published: 2023-07-02 07:41:27

[This is my learning log. Some of the contents here may be incorrect.]

**Abstract**

- Svelte is a **compiler **not a framework.
- It compiles the code for production at build time into a single, vanilla, JS bundle.
- No extra scripts or libraries are shipped to production.
- Often results in a faster running website.

**Prerequisite**
- knowledge of HTML&CSS, JS
- Node.js v8+ must be installed.

**Guide Reference**
https://learn.svelte.dev/tutorial/welcome-to-svelte
https://www.youtube.com/watch?v=UGBJHYpHPvA

**Note 1**
- just installed svelte template.
- npm run dev

As a previous react user, this feels like more closer to Vanilla JS + styled components. Somehow it offers component feature. Script tag may only be used once per file. HTML base compiler like django's template? This seems intuitive.

**Note 2**
Component✅ (next post topic)
state management✅
- https://blog.devgenius.io/state-management-in-svelte-b045213c9138

Looks like simpler than react.js. Called Svelte Context API and Svelte stores.

May use context here to let it available anywhere within an app.

`
<script>
  import { setContext } from 'svelte'
  const thisObject = {}
  setContext('thisKey', thisObject)
</script>
`
To allow thisKey available in a different component within the app, import it by using the getContext function.

`<script>
  import { getContext } from 'svelte'
  const thisObject = getContext('thisKey')
</script>
`
And here may be the spot. Svelte handles state management via stores(an objects that hold a value and can let developer know when the value changes). There are 2 kinds of stores : '(1)writable' and '(2)readable' stores.

`
<!-- anime.js -->
<script>
  import writable from 'svelte/store'
  export const city writable('millennium school club')
</script>
`

**URLs of state management in svelte**
https://blog.logrocket.com/application-state-management-svelte/
https://www.koderhq.com/tutorial/svelte/store-state-management/
https://auth0.com/blog/state-management-in-svelte-applications/
Init.
Tags: ruby, rails, community, discuss
Published: 2023-07-02 07:28:24

Hey there!

I'm thrilled to have this platform to share my passion for programming, specifically when it comes to the enchanting world of **Ruby**. Here, I'll be taking you along on my personal exploration of the **Ruby language**, the **Ruby on Rails framework**, and the incredible development ecosystem that surrounds them. But that's not all – I'll also be sharing exciting updates about my side projects and shedding light on the impactful work being done by the **RubySantaMarta** non-profit organization and its events.

For as long as I can remember, programming has been a captivating journey for me. The elegance and expressiveness of Ruby have always fascinated me, and its ability to bring joy to the coding process is truly remarkable. Through this blog, I hope to share that joy and inspire others to embark on their own Ruby adventures.

Together, we'll delve into the intricacies of the Ruby language, from the fundamentals to advanced concepts. I'll share tips, tricks, and best practices that I've picked up along the way, helping you write clean, efficient, and elegant code. We'll explore the power of Ruby on Rails, uncovering how this transformative framework can be harnessed to build remarkable applications that make a real impact.

I'll also be sharing info about my side projects – those passion-driven endeavors that allow us to explore new ideas and stretch our creative muscles. I hope to inspire you to embark on your own side projects, unleashing your creativity and embracing the joy, outside the constraints of conventional projects.

Lastly, I am proud to announce **the foundation of the RubySantaMarta non-profit organization**. This is going to be the place to be for Ruby developers in my hometown **Santa Marta, Colombia**, but everyone around the globe will be invited to attend (personally or virtually) all of our events/meetups. Through this blog, I'll keep you informed about our initiatives and opportunities to get involved. Together, we can make a difference and contribute to the vibrant ecosystem we know only Ruby has to offer.

Make sure to follow me so you never miss a single post. Also, I invite you to connect with me on social media, where we can share our thoughts, exchange ideas, and engage in thought-provoking discussions.

Welcome!
Day 2
Published: 2023-07-02 07:10:38

Today I solved the following problems from Striver DSA sheet. Also today I was able to figure out a dynamic programming solution on my own so I am very psyched about it.

**PROBLEM 1:** Search in a 2-D matrix: Took some time, but was able to figure out the most optimal approach, O(log(rows * log(cols))

**PROBLEM 2:** Implement pow function: Solved it optimally in O(log(n))

**PROBLEM 3:** Majority Element I: Was able to figure out O(N) time and space solution but learnt about Bayers' Voting Algorithm to reduce space to O(1)

**PROBLEM 4**: Majority Element II: Almost same concept as previous

**PROBLEM 5:** Reverse Pairs: Had solved 'Count Inversions' yesterday, hence was able to solve it on my own.

**PROBLEM 6:** Unique Paths: First solved it using DFS approach which had exponential time complexity. Then was able to boil it down to O(m * n) using memoization dynamic programming on the recursion.
Code Reuse and Modularization: How Do You Maximize Efficiency and Promote Reusability?
Tags: discuss
Published: 2023-07-02 07:00:00

Hey, devs! Let's talk about a crucial aspect of our craft: code reuse and modularization. Reinventing the wheel can be a time-consuming and error-prone endeavor. So, how do you tackle this challenge in your projects? What strategies do you employ to make your code more reusable, efficient, and maintainable? 

Share your tips, tricks, and experiences, and let's level up our coding game together!

Follow the DEVteam for more discussions and online camaraderie!

{% embed [https://dev.to/devteam](https://dev.to/devteam) %}
Coding 101: Is HTML a Programming Language? Why or Why Not?
Tags: codenewbie, beginners, discuss, webdev
Published: 2023-07-02 07:00:00

> Let's settle the age-old debate: Is HTML truly a programming language or not? Join the discussion to explore the essence of HTML, dissect its features, and uncover the reasons behind its classification as a markup language rather than a traditional programming language. 

_This week's discussion series is dedicated to helping beginners on their coding journey by addressing common doubts and misconceptions. We will delve into fundamental concepts, explore essential tools, and shed light on industry practices, providing clarity and guidance to those who are new to coding. If you're an experienced developer, your valuable insights, explanations, and best practices are highly encouraged and appreciated to support and mentor aspiring coders!_

Follow the [CodeNewbie Org](https://dev.to/codenewbieteam) and [#codenewbie](https://dev.to/t/codenewbie) for more discussions and online camaraderie!

*{% embed* https://dev.to/codenewbieteam *%}* 

<a href="https://www.freepik.com/free-vector/computer-with-binary-code-screen_30509691.htm#query=coding%20101&position=16&from_view=search&track=ais">Image by brgfx</a> on Freepik
JavaScript Console Object #18
Tags: javascript, programming, beginners, react
Published: 2023-07-02 06:50:54

// console object method 
// the console.log has servel method log being are as follow :
asserts() --> // used to asserts 
clear() -->   // clear the console 
log() ---->   // output the message to the console
table()--->   // display the tabular data 
  obj = {a:1, b:2, c:3, d:4}
  console.table(obj)
warn()--->    // used for warning 
error()--->   // used for error 
info()---->  // used for special information  

[](https://replit.com/@SkSage/JavaScript-Console-Object-25#script.js)
2023 On Prem Kubernetes Container Attached Storage Options
Tags: kubernetes, selfhost, homelab, homeserver
Published: 2023-07-02 06:14:59

## Problem
As some of you may know I’ve been running my in-home on premises server for the last 6 years. Originally that was accomplished through a single-node micro k8s kubernetes cluster. However due to increased workloads I had to expand to a multi node kubernetes cluster. It became clear to me that my existing storage solution microk8s-hostpath would not be sufficient since true production storage had the following requirements.

## Storage requirements
In order of importance:

**Resilient to node failure**: Given the need to perform regular security and operating system level node upgrades as well as hardware failures, the data had to be resilient to the temporary or complete catastrophic failure of a machine.
Diverse workload support: I run a plethora of different applications each with their own unique storage needs. The storage solution had to be versatile, providing support for block file and object storage
**Ease of management**: To maintain a lean operation and minimise the risk of human error, I needed a solution that was easy to install, configure, and manage. Moreover, an ideal storage solution would offer automatic healing of damaged data nodes and provide a straightforward path to disaster recovery.

## Evaluation
### OpenEBS Mayastor - https://mayastor.gitbook.io/introduction/
#### Pros
Mayastor caught my eye with its high performance and replication features for data protection, which are critical in a production environment.

#### Cons
However, its limited support for diverse applications and excessive manual configuration needs were major drawbacks. Additionally, the solution's immaturity and specific huge_pages requirement, which caused compatibility issues with PostgreSQL, made it less appealing.

### Longhorn - https://longhorn.io/ 
#### Pros
Longhorn stood out due to its ease of management and handy features such as volume snapshots, backup, and restore, which are key to maintaining data integrity.

#### Cons
Nevertheless, Longhorn's limitation of only supporting read-write operations on a single node at a time posed a significant challenge to my requirement of resilience to node failure.

### Rook-Ceph - https://rook.io/
#### Pros
Rook-Ceph impressed me with its comprehensive support for diverse applications, scalability, and resilience. Its maturity and the backing of a robust community and wide adoption provided further confidence.

#### Cons
One hiccup I encountered with Rook-Ceph was its requirement for full drives for provisioning, which presented challenges with my partitioned drives.

## Conclusion
After careful evaluation, Rook-Ceph emerged as the optimal choice for my multi-node on-premises MicroK8s cluster.
Turn a checkbox into a button without any javascript.
Tags: css
Published: 2023-07-02 05:44:45

Sometimes checkboxes aren't the best UI/UX for your users, especially if you have a lot of options that you need to give to a user to choose from. 

This technique allows you to turn a checkbox into a button, creating a larger click area and also giving better context to what the user is selecting.

NOTE: In the HTML it's important that the input comes before the label. 

{% gist https://gist.github.com/JudeLawrence/9781dcb31acd10389f8632bcd3edd729 file=checkbox_button.html %}


{% codepen https://codepen.io/Jude-Lawrence/pen/abQwNGy %}


And that's it. If you have any questions or it's not clear what's going on, or even if you have a better way of achieving this, feel free to comment below.
Developer Mid Term Report Cards
Tags: discuss, career, devjournal, codenewbie
Published: 2023-07-02 05:43:39

How would you rank the first half of 2023. What have you learned this year so far, how are you doing in your dev journey and where do you want to end up once the year ends?

If you enjoy my technology-focused articles and insights and wish to support my work, feel free to visit my Ko-fi page at https://ko-fi.com/philipjohnbasile. Every coffee you buy me helps keep the tech wisdom flowing and allows me to continue sharing valuable content with our community. Your support is greatly appreciated!
how to fix Connection closed by remote host
Tags: linux
Published: 2023-07-02 03:42:49

"Connection closed by remote host" is an error message that typically occurs when a network connection between two devices is abruptly terminated by the remote device or host. This message is often displayed in command-line interfaces, terminal windows, or log files when a connection is unexpectedly terminated.

{% embed https://www.howtouselinux.com/web-stories/linux-network-commands %}

There can be several reasons for the "connection closed by remote host" error message, including:

1. Network issues: The remote host may have experienced a network problem, such as a loss of connectivity, power outage, or hardware failure, which caused the connection to be terminated.

2. Firewall or security settings: If there are strict firewall rules or security configurations in place, they may be blocking or terminating the connection from the remote host.

3. Idle timeout: Some systems or network devices have idle timeout settings, which automatically close inactive connections after a certain period of time to free up resources.

4. Server overload: If the remote server is overloaded with requests or experiencing high traffic, it may forcibly close connections to manage its resources effectively.

5. Misconfiguration or software issues: There could be misconfigurations or software bugs on either the client or server side, leading to unexpected termination of connections.

To check more about how to fix this issue, you can refer to this article: [6 ways to troubleshoot connection closed by remote host](https://www.howtouseubuntu.com/system/6-ways-to-troubleshoot-connection-closed-by-remote-host/)
Blockchain success starts here
Tags: blockchain
Published: 2023-07-02 03:37:19

Blockchain is a technology that allows for decentralized and secure record-keeping. Its basic use involves creating a tamper-proof and transparent ledger of transactions or information. Here are some common applications of blockchain:

Cryptocurrencies: The most well-known use of blockchain is in cryptocurrencies like Bitcoin and Ethereum. Blockchain ensures the security and integrity of transactions, enabling digital currencies to operate without the need for a central authority, such as a bank.

Smart Contracts: Blockchain enables the execution of self-executing contracts called smart contracts. These contracts automatically enforce the agreed-upon terms and conditions when specific predefined conditions are met. Smart contracts eliminate the need for intermediaries and provide transparency and automation to various industries like supply chain management, real estate, and insurance.

Supply Chain Management: Blockchain can track and verify the provenance and authenticity of products across the supply chain. It allows stakeholders to trace the movement of goods from the source of origin to the end consumer, ensuring transparency and reducing the risk of fraud or counterfeit products.

Voting Systems: Blockchain can be utilized to create secure and transparent voting systems. It enables secure and immutable recording of votes, preventing tampering and ensuring the integrity of the electoral process.

Healthcare Records: Blockchain can be used to create a secure and interoperable system for storing and sharing healthcare records. It allows patients, doctors, and healthcare providers to access and update medical records while maintaining privacy and security.

Intellectual Property Protection: Blockchain can be used to establish proof of ownership and protect intellectual property rights. By timestamping creations and transactions on the blockchain, artists, musicians, and content creators can prove the authenticity and ownership of their work.

Decentralized Applications (DApps): Blockchain provides a platform for building decentralized applications, also known as DApps. These applications run on a network of computers, ensuring transparency, immutability, and resistance to censorship.

These are just a few examples of the basic uses of blockchain. The technology has the potential to revolutionize various industries by providing enhanced security, transparency, and decentralization.