teleren/devto huggingface dataset:
Shallow Copy vs Deep Copy in JavaScript
Tags: webdev, javascript, beginners, programming
Published: 2024-06-24 04:15:35

When working with objects in JavaScript, understanding the difference between shallow copy and deep copy is crucial. This knowledge helps avoid unexpected behavior, especially when dealing with nested objects.

## Shallow Copy
A shallow copy duplicates the top level of an object but does not recursively copy nested objects. Instead, it retains references to the original nested objects. Here are some common methods for creating shallow copies: `Object.assign()` and the spread operator `{...object}`.

Example

![Code snippet of the shallow copy](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bdlqzhux11cgxotb9sa5.png)
In this example, changing the `fullName` in narutoCopy does not affect the original naruto object.

However, with nested objects, a shallow copy only copies the references:

![Nested Shallow Copy Code Snippet](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/a5k6qxyvla0ndrohofj0.png)

In this case, both narutoDetails and narutoDetailsCopy have the same reference to the parent's object. Changing the father property in `narutoDetailsCopy` also changes it in `narutoDetails`.

## Deep Copy
A deep copy duplicates an object along with all the objects it references, recursively. The easiest way to achieve this in JavaScript is by using `JSON.parse(JSON.stringify(object))`. For more complex scenarios, libraries like lodash provide deep copy functions.

Example

![Deep Copy Code Snippet](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/szargw7l1y9iwvz2seph.png)

In this example, `borutoCopy `is a completely independent copy of `boruto`. Changes to `borutoCopy `do not affect `boruto`.
Creating a Windows 11 VM that is highly available
Tags: webdev, beginners, devops, programming
Published: 2024-06-24 04:03:41

In Microsoft Azure search for "Virtual machines" and click create "Azure virtual machine." When on the basic settings tab, select your Azure subscription, and the resource group. Enter a name for the virtual machine. Select the same region as your virtual network. For the availability options choose multiple zones for high availability. Select the "Windows 11" image. Configure the administrator account with a username and password. Click Review and Create and once validation has passed click create. 

![highly available vm](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6vk9xswqyx8thj1rzmli.png)
Leetcode - 503. Next Greater Element II
Published: 2024-06-24 03:52:50

key - in order to start in circular way ->
generally we iterate  starting from  i=0 ,  j = (i+1)  but since this is circular 
we iterate  i=0 , j = (i+1) % nums.length



in order to move to next element generally we do j++ or j = j +1
but since this is circular the next element of j will be (j+1) % nums.length


**Sample working **->

suppose when i goes to 3 , as j = i+1 ie 4 it crossed the end incase of nums = [1,2,1] , (i+1) % 4 ie 4 % 4 gives 0 , so it starts from index 0 instead of going to index 4


**Learning**

we can fill array of size n with -1 using new Array(n).fill(-1);

we can use break statements in for loops to exit out of loop

continue statement will skip one iteration


```javascript
/**
 * @param {number[]} nums
 * @return {number[]}
 */
var nextGreaterElements = function(nums) {
    const n = nums.length;
    const result = new Array(n).fill(-1)
   
    for (let i = 0; i < nums.length; i++) {
        let j = (i + 1) % nums.length; // Start from next index in a circular manner

        while (j !== i) {
            if (nums[j] > nums[i]) {
                result[i] = nums[j];
                break; // Break out of the loop once we find the next greater element
            }
            j = (j + 1) % nums.length; // Move to the next index in a circular manner
        } 
    }

    return result;
};
```

Please do follow the series if you are struggling with leetcode questions 😇
Leetcode - 929. Unique Email Addresses
Published: 2024-06-24 03:51:41

Lets quickly go into the solution for the unique email addresses problem

we can see every email in _localName + @ + domainName_ this form

```javascript
let localName = email.split('@')[0] ?? '';
const domainName = email.split('@')[1];
```

And the question tells if localName has + sign in it we need to ignore the rest of the characters after it , example "m.y+name@email.com" is equal to "m.y@email.com"

```javascript
if (localName.includes('+')) {
    localName = localName.split('+')?.[0];
}

```
Also the question tells us that if we have . in email then it is considered as forwardable to the email , after replacing . (dot) with '' empty character

```javascript
if (localName.includes('.') || domainName.includes('.')) {
    isForwardable = true;
    localName = localName.replace(/\./g, '');
  }

  if (isForwardable) {
    return localName + '@' + domainName; //returning email
  } else {
    return ''; //returning empty string if not forwardible
  }

```


Complete code

```javascript
/**
 * @param {string[]} emails
 * @return {number}
 */


 const convertEmail = email => {
  let localName = email.split('@')[0] ?? '';
  const domainName = email.split('@')[1];

  let isForwardable = false;

  if (localName.includes('+')) {
    localName = localName.split('+')?.[0];
  }

  if (localName.includes('.') || domainName.includes('.')) {
    isForwardable = true;
    localName = localName.replace(/\./g, '');
  }

  if (isForwardable) {
    return localName + '@' + domainName;
  } else {
    return '';
  }
};
var numUniqueEmails = function(emails) {

    let uniqueEmails = new Set();
  emails.forEach(email => {
    const convertedEmail = convertEmail(email);
    if (convertedEmail !== '') {
      uniqueEmails.add(convertedEmail);
    }
  });
 return uniqueEmails.size;
};

```
Please do follow the series if you are struggling with leetcode questions 😇
A Cool Cat Alternative as Text Printer in Terminal
Published: 2024-06-24 03:49:35

I usually use cat to print printable texts in terminal. But, I few days ago I found cool tool like cat but it uses syntax highlighting and git integration. Its name is bat.

I show you what it looks like. I print uncomitted changed file and I use both cat and bat to see their differences.



![Using cat](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xqr1isaw4oor24hugifo.jpg)
*Using cat*


![Using bat](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/skbncztm05q9f06hs3hu.jpg)
*Using bat*
Data Compression: Under 256 characters
Tags: devchallenge, cschallenge, computerscience, beginners
Published: 2024-06-24 03:48:48

*This is a submission for [DEV Computer Science Challenge v24.06.12: One Byte Explainer](https://dev.to/challenges/cs).*

## Explainer

<!-- Explain a computer science concept in 256 characters or less. -->
Data compression is reducing bits needed to represent data.
S:`she sees sea`-needs 80bits(8bits/char).

_If_
- _only 3 words_(`she`,`sees`,`sea`) exist, S:"<u>00</u> <u>01</u> <u>10</u>"-6bits
- _all alphabets exist & S is only sentence_, S:"<u>1</u> <u>001</u> <u>01</u> <u>1</u> <u>01</u> <u>01</u> <u>1</u> <u>1</u> <u>01</u> <u>000</u>"(Huffman coding)-18bits.

### Additional Context

<!-- Please share any additional context you think the judges should take into consideration as it relates to your One Byte Explainer. -->
{% embed https://en.wikipedia.org/wiki/Huffman_coding %}

<!-- Team Submissions: Please pick one member to publish the submission and credit teammates by listing their DEV usernames directly in the body of the post. -->

<!-- Don't forget to add a cover image to your post (if you want). -->

<!-- Thanks for participating! -->
Java Scripts In Six Weaks
Published: 2024-06-24 03:44:52


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4d5jnyvw20v55yfm2j9g.gif)


[16:52, 6/21/2024] Nitin Kumar: www.instagram.com/p/C8KEOE_yqQa/?igsh=MWw3b2cyY3Y3eWFyeg==
[07:52, 6/24/2024] Nitin Kumar: 🌟 Journey to Mastering JavaScript in Six Weeks! 🌟

Hey everyone,

I'm thrilled to announce that I've started a six-week journey to master JavaScript! 🎉 Throughout the next few weeks, I'll be updating my progress, key learnings, and challenges on LinkedIn, Instagram, and the DEV Community.

🔍 What to Expect:
- Weekly Updates: Sharing what I've learned each week.
- Tips & Tricks: Handy tips for fellow learners.
- Collaboration: Let's connect and support each other in this learning journey.

If you're also learning JavaScript or interested in improving your skills, let's collaborate and learn together! 💪

Follow me for updates, and feel free to reach out if you'd like to share resources, ask questions, or connect with like-minded learners.
hashtag

@JavaScript 
@LearningJourney 
@Coding 
@Programming 
@WebDevelopment 
@Collaboration 
@LearningTogether
@Rowaida El-Shaprawy
@pythondev
A Brief History of Cyber Security
Published: 2024-06-24 03:43:01

Cyber Security is action to protect network and technolocy such as hardware, software, and data from cyberthreat. It is equally opposite to Hacking that is a criminal activity one that hack and crack a system, make a virus and steal the data instead of secure it.

A guy named Bob Thomas wrote a program that able to move across the network by itself and leave a small trail. He named it creeper, It is not actively malicious program because it doesn’t damage the data. It just prints the messages “I’m the creeper. Catch me if you can.”

Later, Ray Tomlinson saw it and he liked it. He modifed the program and make it self-replicated. Then it was accepted as computer worm.

Another worm named Morris Worm appeared in 1986 and caused mayhem on the internet. It attacked more than thousands of systems on the internet. It is around 10% computer that connected to internet.

But the program creator didn’t foresee ths consequences. More importantly this act also let to the formation of the computer emergency response team as a non-profit research center for systemic issues that micht affect internet as a whole.

Nowadays viruses were deadlier more invasive and harder to controle. We have already experianced cyber incidens on a massive scale and 2021 isn’t close to over but these atacks are anough to prove that cyber security is a necessity for corporations and small businesses alike
Custom Shopify Development for eCommerce Stores
Published: 2024-06-24 03:39:11


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

Boost Your eCommerce Success! 📈 Discover how our Custom Shopify Development Services can enhance user experience and drive sales. Check out our infographic to learn more! https://mobisoftinfotech.com/services/shopify
Computer Science Challenge - Structure Padding
Tags: devchallenge, cschallenge, computerscience, beginners
Published: 2024-06-24 03:35:29

*This is a submission for [DEV Computer Science Challenge v24.06.12: One Byte Explainer](https://dev.to/challenges/cs).*

## Explainer

Structure padding: Like neatly lining books on a shelf, compilers add empty bytes (padding) between struct members for faster processor access. This can make structs larger than expected!

## Additional Context
Consider this code:-
```c++
#include <iostream>

struct Data {
  char c; // 1 byte
  int i;  // 4 bytes (assuming 32-bit system)
};

int main() {
  std::cout << sizeof(Data) << std::endl; // Might be > 5!
}
```
Explanation:

- This code defines a Data struct with a char and an int.
- Similar to the previous example, we use `sizeof(Data)` to print the struct size. Here, padding might occur to ensure the int aligns with its preferred boundary (often 4 bytes on 32-bit systems).
- The expected size would be 1 (char) + 4 (int) = 5 bytes. However, the actual size might be greater due to padding. 
- If you ask me, then it will be 8 bytes, since we are assuming a 32-bit system that will read the memory in the chunks of 4 bytes. This does not allow other variables to take the left 3 bytes (8-5) space. Hence 8 bytes will get occupied by the object of struct `Data` for faster processor access.

**Note:**

The exact amount of padding can vary depending on the compiler and target architecture.


![Alan Turing the computer scientist explaining  the concept of structure padding in c++ pride month color palette rainbow color](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wmt3aft8zvtgb754xthk.jpeg)  
- This image is generated using the prompt:- "Alan Turing, the computer scientist, explaining  the concept of structure padding in C++ pride month color palette rainbow color"

<!-- Team Submissions: Please pick one member to publish the submission and credit teammates by listing their DEV usernames directly in the body of the post. -->

<!-- Don't forget to add a cover image to your post (if you want). -->

<!-- Thanks for participating! -->
One Byte Explainer: Large Language Models
Tags: devchallenge, cschallenge, computerscience, beginners
Published: 2024-06-24 03:34:16

*This is a submission for [DEV Computer Science Challenge v24.06.12: One Byte Explainer](https://dev.to/challenges/cs).*

## Explainer

LLMs communicate “like humans” by modeling our patterns. They’re limited: they only use patterns from training data. But: LLM training data is much larger than an average human’s memory. Like humans, when LLMs don’t know, they make stuff up (hallucinate).

## Additional Context

TEAM: @dchaley @lynnlangit
One Byte Explainer: Recursion
Tags: devchallenge, cschallenge, computerscience, beginners
Published: 2024-06-24 03:25:35

*This is a submission for [DEV Computer Science Challenge v24.06.12: One Byte Explainer](https://dev.to/challenges/cs).*

## Explainer

The recursive insight: split problems into simpler pieces. Sum 3 numbers by adding the 1st to the sum of the next 2. Divide & conquer the work then merge the parts. If you can solve the simplest, and you can make a problem simpler, you can solve anything.

## Additional Context

TEAM: @dchaley @lynnlangit
Save Money: Buy Used Books Online from Thrift Book Store
Published: 2024-06-24 03:22:14

Used books are usually significantly cheaper than new ones. By getting used, you are able to save yourself an amazing sum of money, rendering it simpler to develop your individual selection without breaking the bank. [Save Money: Buy Used Books Online from Thrift Book Store]([url=https://oneclickinfohub.blogspot.com/]Save Money: Buy Used Books Online from Thrift Book Store[/url]
)
INTRODUCTION
Published: 2024-06-24 03:14:50

Hi guys I am Ashwin A.K from chennai,Tamil Nadu,India currently persuing my bachelor's in AI and ML with handful of knowledge in python,c,java and all other technologies.My dream is to build and deploy a Robotic AI system with a longer vision and sustainable to all class of people. I hope this community will help me in all aspects THANK YOU!!
Partition, format, and mount a drive on Ubuntu
Published: 2024-06-24 03:13:49

Reference:

* https://www.howtogeek.com/106873/how-to-use-fdisk-to-manage-partitions-on-linux/

## List logical disks and partitions
`sudo fdisk -l`

## Partition the disk
`sudo fdisk /dev/sdb`

* Press `n` to create a partition
* Press `p` or `l` to create primary or logical partitions
* Press `w` to write your changes or `q` to quit

## Format the partition

* `sudo mkfs -t ext4 /dev/sdb1`
* `sudo mkfs -t ext4 -N 2000000 /dev/sdb1` - This will manually set the number of inodes to 2,000,000

## Mount disk
* `mount` - Shows what is mounted
* `mkdir /mnt/mydrive`
* `mount -t ext4 /dev/sdb1 /mnt/mydrive`

## Get disk's UUID
`ls -al /dev/disk/by-uuid/`  
or  
`blkid`

## Mount at boot

Add the following line to your `/etc/fstab` file adjusting the UUID to your device's id and the directory to where you want to mount:

`UUID=811d3de0-ca6b-4b61-9445-af2e306d9999	/mnt/mydrive	ext4	defaults 0 0`

`mount -a` - remounts filesystems from `/etc/fstab`
looking for #Funding
Tags: npm, architecture, linux, github
Published: 2020-05-24 02:13:32

C:\Users\TOSHIBA>npm fund
aladinet@3.0.0
+-- https://github.com/sponsors/feross
| `-- arch@2.1.2, safe-buffer@5.2.1
+-- https://www.patreon.com/feross
| `-- arch@2.1.2, safe-buffer@5.2.1
+-- https://feross.org/support
| `-- arch@2.1.2, safe-buffer@5.2.1
+-- https://github.com/sponsors/isaacs
| `-- glob@7.1.6, rimraf@3.0.2
+-- https://github.com/sponsors/sindresorhus
| `-- globby@11.0.0, xo@0.30.0, cli-truncate@2.1.0, figures@3.2.0, ora@4.0.4, p-map@4.0.0, plur@4.0.0, pretty-ms@7.0.0, p-limit@2.3.0, escape-string-regexp@4.0.0, boxen@4.2.0, is-installed-globally@0.3.2, term-size@2.2.0, make-dir@3.1.0, eslint-config-xo@0.29.1, eslint-config-xo-typescript@0.28.0, globals@12.4.0, ansi-escapes@4.3.1, type-fest@0.11.0, read-pkg-up@7.0.1
+-- https://github.com/chalk/ansi-styles?sponsor=1
| `-- ansi-styles@4.2.1
+-- https://github.com/chalk/chalk?sponsor=1
| `-- chalk@4.0.0
+-- https://github.com/sindresorhus/emittery?sponsor=1
| `-- emittery@0.6.0
+-- https://github.com/sponsors/jonschlinkert
| `-- picomatch@2.2.2
+-- https://github.com/yeoman/update-notifier?sponsor=1
| `-- update-notifier@4.1.0
+-- https://github.com/sponsors/ljharb
| `-- resolve@1.17.0, globalthis@1.0.1, array-includes@3.1.1, array.prototype.flat@1.2.3, object.values@1.1.1, es-abstract@1.17.5, is-string@1.0.5, es-to-primitive@1.2.1, has-symbols@1.0.1, is-callable@1.1.5, is-regex@1.0.5, object-inspect@1.7.0, string.prototype.trimleft@2.1.2, string.prototype.trimright@2.1.2, is-date-object@1.0.2, is-symbol@1.0.3, string.prototype.trimstart@1.0.1, string.prototype.trimend@1.0.1
+-- https://opencollective.com/core-js
| `-- core-js@3.6.5
+-- https://opencollective.com/node-redis
| `-- redis@3.0.2
+-- https://opencollective.com/typescript-eslint
| `-- @typescript-eslint/eslint-plugin@2.34.0, @typescript-eslint/parser@2.34.0, @typescript-eslint/experimental-utils@2.34.0, @typescript-eslint/typescript-estree@2.34.0
+-- https://opencollective.com/eslint
| `-- eslint@6.8.0
+-- https://github.com/sindresorhus/eslint-plugin-unicorn?sponsor=1
| `-- eslint-plugin-unicorn@19.0.1
+-- https://github.com/avajs/find-cache-dir?sponsor=1
| `-- find-cache-dir@3.3.1
`-- https://github.com/sponsors/mysticatea
  `-- regexpp@3.1.0, eslint-plugin-es@3.0.1
Explain it to me like I'm five: Why is SQLynx better than DataGrip?
Published: 2024-06-24 03:09:42

Imagine you have two sophisticated tools for managing information on a computer, akin to building blocks in a digital world. One is SQLynx, and the other is DataGrip.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5wwpb97xgvrwfl7hq9p7.png)
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/t3630gfn8crjv1ac44aj.jpg)
SQLynx functions as an advanced toolbox that facilitates rapid organization and retrieval of data. It features an intuitive interface with drag-and-drop capabilities, simplifying the management of tables and relationships, making it accessible for efficient use and quick adoption.

In contrast, DataGrip resembles a comprehensive reference book with extensive textual and numerical data. It provides robust functionalities for reading and understanding data but requires familiarity with technical terminology and a steeper learning curve.

SQLynx supports real-time collaboration, allowing multiple team members to concurrently operate on the same database, enhancing productivity and collaborative effectiveness. Its built-in smart SQL editor offers syntax highlighting, auto-completion, and syntax checking, aiding users in writing and debugging SQL queries swiftly.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/euclkik5kgwccs36jaf9.png)
Security is paramount with SQLynx, offering multiple authentication layers and data encryption to ensure data integrity. It includes comprehensive user permission management and configurable risk management features, such as real-time interception of high-risk operations like database or table deletions.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/67g73zgvw0gjk31h2tv5.png)
SQLynx's web-based architecture ensures cross-platform compatibility, operating seamlessly on any device with a web browser without requiring client software installation. This flexibility contrasts with DataGrip, which typically demands a robust computing environment for optimal performance.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tikujy91zzeltj38lcrf.png)
In summary, SQLynx excels in usability, collaborative capability, and security while offering a user-friendly experience across various platforms. DataGrip, although powerful in data analysis and management, requires a more technical understanding and is better suited for complex analytical tasks in controlled computing environments.
Comparing Top Backend Frameworks: C#, Python, Node.js, Go, Rust, C++, and Java
Tags: backend, webdev, devtoys
Published: 2024-06-24 02:58:14

In the ever-evolving landscape of backend development, choosing the right framework can significantly impact your project’s performance, scalability, and maintainability. This blog post will compare seven popular backend frameworks: C# (.NET), Python (FastAPI), Node.js (Express), Go (Gin), Rust (Rocket), C++ (Pistache), and Java (Spring). Each of these frameworks has its strengths and weaknesses, making them suitable for different types of applications. Let’s dive into the details.

## 👀 ===> Read the full article here! [Choosing the Right Backend Framework: A Comparison of C#, Python, Node.js, Go, Rust, C++, and Java - DevToys.io](https://devtoys.io/2024/06/23/choosing-the-right-backend-framework-a-comparison-of-c-python-node-js-go-rust-c-and-java/)
Canada Day Greetings
Tags: devchallenge, twiliochallenge, ai, twilio
Published: 2024-06-24 02:47:41

*This is a submission for the [Twilio Challenge ](https://dev.to/challenges/twilio)*

## What I Built
We have built a single web based application using Python-Flask, Pandas for data processing, and gunicorn for "wgsi". This application takes in input as a postal code and utilizes Twilio API - SMS, Voice system. Canada "National Anthem" is stored in the Twilio voice system as artifact, along with a text message 
(🍁Happy Canada Day🍁) to the predefined users. This can be further extended to more user inputs and be used for all social notifications, political campaigns, and civic holidays.

## Git Rep
   SaiGundas/Twilio-Cloud-AI-API-Challenge

## Demo
docker run -p 80:80 ayyangar/greetings-ca

![This is the Homepage with a Toronto skyline background along with a video which plays the first Canada Flag hosting event. Upon click on "next" button you'll be redirected to the next page to enter a postal code.](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/anvg0dkaltpu2n7nxe7f.png)

![This page takes in a postal code and finds the users from a predefined list](
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/f50oseslmnd33xuliify.png)

![This page renders the details of a user from the predefined list by given postal code. On-clicking the send greetings button, the user receives a call, that plays the National Anthem in call. A sms is also delivered with "Happy Canada Day" greetings.]
(https://dev-to-uploads.s3.amazonaws.com/uploads/articles/su33akjxd0lu31ofagqt.png))
 
![This page shows the greetings an image of the Canada flag, displaying multi colors on the page]
(https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fpc88ner4elkzbqhx03g.png)

![Twilio message logs](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fihvru39wn3c0i1wrfft.png)


![Twilio call logs](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/12miuq4g07ngxcewx2d3.png)



## Twilio and AI
We have used Python Pandas to process huge data into a data frame then used locate function for efficient processing of this data frame to be consumed by Twilio. Google AI Translator is used for sending the greetings in multilingual scripts.

## Additional Prize Categories

Twilio SMS and Voice API's has been successfully developed tested and deployed. "SendGrid" has been disabled for us as a trial account and SMTP was substituted.

Team Submissions: @sai_ag_1102 for Development
                       @ayan31 for Integrations

Thank you for this opportunity and looking forward. Happy Coding :smiley: