teleren/devto huggingface dataset:
Adding elements in a list
Tags: python, coding
Published: 2023-11-27 20:52:56


This is the code with no AI.

```
def addEveryOtherElement(intArr):
    if intArr/2 ==0 then 
    result = intArr++
    return result
```

I created this code with AI. "[Recursion](https://recursionist.io/)" AI code review's suggestion as follows.

```
def addEveryOtherElement(intArr):
    result = 0
    for i, num in enumerate(intArr):
        if i % 2 != 0:
            result += num
    return result
```


My question;
Is the comma in for i, necessary? What role does it play?

AI's answer.
When using enumerate in a for loop, the enumerate function returns two values for each iteration: the element and its index. Therefore, the iterator of the for loop must specify two variables, which are separated by a comma ,.

Without comma, I got this SyntaxError so it is like using `enumerate(intArr):` and def `addEveryOtherElement(intArr):`, I have to use comma to make it aware that there are two declarative statements.

```
  File "script.py", line 3
    for i num in enumerate(intArr):
          ^
SyntaxError: invalid syntax
```
Multicloud: OCI-Azure Interconnect
Published: 2023-11-27 20:42:48



## OCI-Azure Interconnect Partnership:

- Oracle and Microsoft announced a partnership in 2019 to connect Oracle Cloud Infrastructure (OCI) and Microsoft Azure with a secure, low-latency, and high-throughput network known as OCI-Azure Interconnect.

- This partnership enables private connectivity between OCI and Azure, offering consistent network performance with around 2-millisecond latency.

## Benefits and Use Cases:

- OCI-Azure Interconnect allows for the establishment of a direct connection without the need for an intermediary network provider.

- It enables customers to migrate to the cloud or build cloud-native applications using the strengths of both OCI and Azure

-  Users can set up single sign-on between Microsoft Azure and OCI for Oracle applications, streamlining authentication.

- The private inter-cloud connection bypasses the public internet, enhancing security.

## Building Blocks

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

## Scenarios

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



## Step by Step Setup Process
TIL ternary operator
Published: 2023-11-27 20:34:00

I found ternary operator when tried to use conditional statements inside create()




```
condition ? expression_if_true : expression_if_false
```



Simple boolean condition:
```
x > 0 ? "positive" : "non-positive"
```

Checking for nil:
```
result = value.nil? ? "Value is nil" : "Value is not nil"
```

Nested ternary operators:
```
grade = score > 90 ? "A" : (score > 80 ? "B" : "C")
```

Assigning a default value:
```
name = user_name ? user_name : "Guest"
# or, using the ternary operator
name = user_name || "Guest"
```

Using ternary in method arguments:
```
puts x > 0 ? "Positive" : "Non-positive"
```
guia passo a passo para ajudar alguém com pouco conhecimento em Python com Excel
Published: 2023-11-27 20:30:02

> Totalmente gerado via chat gpt

### Pré-requisitos:

1. **Instale o Python:**
   Certifique-se de ter o Python instalado em seu sistema. Você pode baixar o Python em [python.org](https://www.python.org/downloads/). Durante a instalação, marque a opção "Adicionar ao PATH" para facilitar o acesso ao Python no terminal.

2. **Instale as bibliotecas necessárias:**
   Abra o terminal (ou prompt de comando) e execute os seguintes comandos para instalar as bibliotecas `pandas` e `openpyxl`:

   ```bash
   pip install pandas openpyxl
   ```

### Criando o Script:

1. **Crie um novo arquivo Python:**
   Abra seu editor de texto favorito (como VSCode, Notepad++, etc.) e crie um novo arquivo. Salve-o com um nome significativo, como `importar_excel.py`.

2. **Copie o Script:**
   Copie o seguinte código para o seu arquivo Python:

   ```python
   import os
   import pandas as pd

   # Pasta onde estão os arquivos Excel
   pasta_origem = 'caminho/da/sua/pasta'

   # Caminho do arquivo Excel central
   arquivo_destino = 'caminho/do/arquivo/central.xlsx'

   # Inicialize um DataFrame vazio para armazenar os dados
   dados_centrais = pd.DataFrame()

   # Loop pelos arquivos na pasta de origem
   for arquivo_nome in os.listdir(pasta_origem):
       if arquivo_nome.endswith('.xlsx'):
           caminho_arquivo = os.path.join(pasta_origem, arquivo_nome)

           # Ler dados do arquivo Excel atual
           dados_origem = pd.read_excel(caminho_arquivo)

           # Adicionar os dados ao DataFrame central
           dados_centrais = pd.concat([dados_centrais, dados_origem], ignore_index=True)

   # Salvar dados no arquivo Excel central
   dados_centrais.to_excel(arquivo_destino, index=False)

   print(f'Dados de todos os arquivos Excel foram copiados para {arquivo_destino}.')
   ```

   Certifique-se de substituir `'caminho/da/sua/pasta'` pelo caminho real da pasta que contém seus arquivos Excel e `'caminho/do/arquivo/central.xlsx'` pelo caminho desejado para o arquivo Excel central.

### Executando o Script:

1. **Abra o Terminal (ou Prompt de Comando):**
   Abra o terminal no mesmo diretório onde você salvou o arquivo Python.

2. **Execute o Script:**
   Digite o seguinte comando para executar o script:

   ```bash
   python importar_excel.py
   ```

   Isso iniciará a execução do script. Se tudo estiver configurado corretamente, o script deve imprimir uma mensagem indicando que os dados foram copiados com sucesso.

### Conclusão:

Esse guia fornece uma introdução básica sobre como executar um script Python para ler dados de vários arquivos Excel em uma pasta e agregá-los em um único arquivo Excel.
How To Deploy a React Passkey App to Cloudflare Pages
Tags: cloudflare, react, passkeys, cybersecurity
Published: 2023-11-27 20:28:11

## Cloudflare for Hosting and React for Web Development

In the rapidly evolving world of web engineering, Cloudflare and React stand out as pretty popular technologies / tools. Cloudflare, renowned for its content delivery and internet security services, offers Cloudflare Pages — a solution for web application hosting with robust DDoS protection. React, on the other hand, is celebrated for its component-based architecture, making web development seamless and efficient.

**_[Read the full blog post here](https://www.corbado.com/blog/cloudflare-passkeys)_**

## The Rise of Passkey-First Authentication

As digital security becomes a paramount concern, passkey-first authentication emerges as a robust solution. It’s here that Corbado positions itself as a viable solution, providing developers with an easy and effective way to integrate passkey authentication in their applications.

## Tutorial Overview: Deploying a React App with Cloudflare and Corbado

This tutorial offers a straightforward roadmap for deploying a React application with passkey-first authentication on Cloudflare Pages. The process can be summarized in a few essential steps:

1. Setting Up with Corbado: First, create a project on the [Corbado developer panel](https://app.corbado.com/signin#register). This step is crucial for obtaining the necessary credentials for passkey authentication.
2. Prepping the React Application: Utilizing [Corbado’s React example repository](https://github.com/corbado/example-passkeys-react), fork the repository to kickstart your project with a solid base.
3. Deploying on Cloudflare Pages: Cloudflare Pages facilitates the deployment process, with easy-to-follow steps for setting up and launching your application.
4. Fine-Tuning Your Project: The final step involves configuring your Corbado project to ensure seamless integration and functionality.

## Explore Further with Corbado
While this blogposts provides a snapshot of deploying a React passkey app using Cloudflare and Corbado, there’s much more to explore. For deeper insights and advanced configurations, visit the [detailed blog post on Cloudflare passkeys here](https://www.corbado.com/blog/cloudflare-passkeys).

**Conclusion**
The combination of Cloudflare Pages, React, and Corbado’s passkey solution represents a great way to make use of passkeys in a Cloudflare setup, offering a balance of speed, security, and user experience. It’s an exciting time for developers looking to harness the power of modern web technologies.
AWS CloudFormation introduces Git management of stacks
Tags: aws, git, cloudformation
Published: 2023-11-27 20:27:38




AWS CloudFormation now supports Git sync, enabling customers to synchronize their stacks from a CloudFormation template stored in a remote Git repository. A CloudFormation template describes your desired resources and their dependencies so you can launch and configure them together as a stack. 

This feature enables developers to speed up the development cycle by integrating CloudFormation deployments directly into their Git workflow and reducing time lost to context switching. You can enable CloudFormation Git sync through the AWS Console, CLI, and SDKs. Dynamic values such as stack parameters and tags can now be specified via a YAML deployment file, enabling customers to track historical changes to these values in a Git file stored in your remote repository. After setup, AWS will automatically sync the deployment file and CloudFormation template, updating your stack after every commit. To test CloudFormation changes before pushing them to production, teams can configure one stack to sync from a Git staging branch and another from a production branch. Git sync works with GitHub, GitHub enterprise, GitLab, and BitBucket. 

 This feature is available in the following regions: US East (N. Virginia), US East (Ohio), US West (N. California), US West (Oregon), Asia Pacific (Mumbai), Asia Pacific (Seoul), Asia Pacific (Singapore), Asia Pacific (Sydney), Asia Pacific (Tokyo), Europe (Paris), Canada (Central), Europe (Frankfurt), Europe (Ireland), Europe (London), Europe (Milan), Europe (Stockholm), and South America (São Paulo).
Elevate Your Squarespace Photography Portfolio Landing Page with Must-Use CSS Animations 🚀📸
Tags: squarespace, webdev, css, javascript
Published: 2023-11-27 20:27:00

Creating a memorable first impression is key when it comes to your photography portfolio landing page. With Squarespace's flexibility and the magic of CSS animations, you can add a touch of elegance and interactivity to captivate your audience. Let's explore three must-use CSS animations along with their codes to make your portfolio stand out:

## 1. **Image Hover Zoom:**

Allow your audience to dive into the details of your captivating images with a subtle zoom effect on hover.

```css
/* Add this code to your custom CSS settings */

.image-zoom {
  transition: transform 0.3s ease-in-out;
}

.image-zoom:hover {
  transform: scale(1.1);
}
```

Apply the class `image-zoom` to the images you want to have the hover zoom effect.

## 2. **Fade-In Animation:**

Ensure a smooth and stylish appearance of your content by adding a fade-in effect as visitors scroll down.

```css
/* Add this code to your custom CSS settings */

.fade-in {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-in.is-visible {
  opacity: 1;
  transform: translateY(0);
}
```

Apply the class `fade-in` to the elements you want to fade in. The class `is-visible` will be added automatically as visitors scroll.

## 3. **Text Slide-In:**

Engage your audience with dynamic text elements that slide in from the side.

```css
/* Add this code to your custom CSS settings */

.slide-in {
  opacity: 0;
  transform: translateX(-20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.slide-in.is-visible {
  opacity: 1;
  transform: translateX(0);
}
```

Apply the class `slide-in` to the text elements you want to slide in. The class `is-visible` will be added automatically as visitors scroll.

## Implementing the Animations:

1. Go to your Squarespace dashboard.
2. Navigate to **Design** > **Custom CSS**.
3. Paste the respective CSS code for each animation.

Remember to replace `.image-zoom`, `.fade-in`, and `.slide-in` with the actual classes you use in your portfolio.


![LoftyDevs](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7c07pphyabq694835cu3.png)

## Let's Bring Your Portfolio to Life!

Connect with LoftyDevs, your Squarespace experts, to seamlessly integrate these CSS animations into your photography portfolio. Elevate your online presence, engage your audience, and leave a lasting impression with captivating visual experiences! 🌟🖼️ #SquarespaceDesign #CSSAnimations #PhotographyPortfolio #LoftyDevs

**Connect with LoftyDevs:** [www.loftydevs.com](https://www.loftydevs.com) 🌐✨

**👉 Get in touch:** info@loftydevs.com
**👉 Book a call:** https://calendly.com/loftydevs/ready-to-maximise-your-squarespace-website
**👉 View services:** https://www.loftydevs.com/services
MO-201 Dumps: Elevate Your Exam Performance
Published: 2023-11-27 12:35:18

**Introduction**

In today's rapidly evolving professional landscape, staying ahead of the curve is imperative for career success. For individuals seeking to validate their Microsoft Office skills and enhance their career prospects, the MO-201 exam is a key milestone. This examination, part of the Microsoft Office Specialist (MOS) certification program, assesses an individual's proficiency in using Microsoft Office tools like Word and Excel.
Embarking on the journey to become MOS certified can be both exciting and challenging. However, with the right resources, such as MO-201 exam dumps, you can streamline your preparation process and increase your chances of success.

**Understanding the MO-201 Exam**

Before delving into the benefits of using exam dumps, it's essential to understand the <a href="https://shorturl.at/epzHS">MO-201 Dumps</a> structure and objectives. The MO-201 exam focuses on evaluating an individual's ability to perform tasks related to Microsoft Office, specifically Word and Excel. Topics covered include document preparation, data management, and advanced formatting.

**Why Choose MO-201 Exam Dumps?**

Comprehensive Content Coverage Exam dumps are curated by professionals who are well-versed in the MO-201 exam objectives. By using these dumps, you ensure that you cover all the necessary topics and are well-prepared for the exam.

**Real Exam Scenarios**

 MO-201 exam dumps often include questions that mimic the format and difficulty level of the actual exam. Practicing with these dumps helps you become familiar with the test environment and enhances your ability to tackle similar questions during the real exam.

Click Here More Info>>> https://shorturl.at/epzHS

Special Discount 60% off Through This Link >>>>https://shorturl.at/opDV6
CSS Flexbox TIL Blog
Published: 2023-11-27 19:53:32

Flexbox/Flexible Box Layout simplifies how to position elements.

-Flex containers and Flex items
  Flex containers are elements on page that contains flex items
  Flex containers set up using display property with flex or inline-flex

-Flex containers useful when in regards to changes in screen sizes

-Difference between display-flex and display-inline-flex:
  Flex is like a block level element which will take up the whole width of the page of the parent element while inline flex will take up only the necessary space and can share space with other elements side by side

-Justify Content Property (5)(Horizontal sorting)
  flex-start
  flex-end
  center
  space-around
  space-between

-Align Items (Deals with vertical sorting)
  flex-start
  flex-end
  center
  baseline
  stretch

-Flex grow property deals with very big parent container compared to its children

-Flex shrink

-Flex basis

-Be aware that there is the flex property and then a flex value within display property
  Can declare flex property in one line (grow, shrink, basis)

-Flex wrap
  Instead of wanting elements to shrink, may instead want to put onto next line if possible
    Wrap
    Wrap reverse
    Nowrap


-Align Content - like align items but instead of a single row, deals with aligning rows top though bottom (Declared on flex containers)
  Common Values:
    flex-start
    flex-end
    center
    space-between
    space-around
    stretch


-Flex Containers have 2 axis (Main and Cross)
  Main (Horizontal) Properties
    justify-content
    flex-wrap
    flex-grow
    flex-shrink
  Cross(Vertical) Properties
    align-item
    align-content

  Main and cross axis interchangeable with **flex-direction**

Flex Direction 
  column
  column-reverse
  row
  row-reverse

Flex flow property: used to call flex wrap and direction in one line
🧙‍♂️CSS Shorthand Essential Properties: Streamlining Your Styles
Tags: webdev, css, programming, frontend
Published: 2023-11-27 19:42:24

**CSS (Cascading Style Sheets) has several shortcuts and shorthand properties that allow you to write more concise and efficient code. Here are some common CSS shortcuts:**

<br>
## 1 **Margin and Padding:**

   - `margin`: You can set all margins at once using the `margin` property, or specific sides using `margin-top`, `margin-right`, `margin-bottom`, and `margin-left`.
<br>
     ```css
     margin: 10px 20px 30px 40px; /* top right bottom left */
     ```

   - Similarly, you can use the same approach for the `padding` property.
<br>
{% codepen https://codepen.io/Ishrat_Pinky/pen/gOqjvvX %}
<br>
2 **Border:**
   - `border`: Combines `border-width`, `border-style`, and `border-color` into a single property.
<br>

     ```css
     border: 1px solid #333;
     ```
<br>

3 **Background:**
   - `background`: Combines various background properties like `background-color`, `background-image`, `background-repeat`, etc.
<br>

     ```css
     background: #eee url('image.jpg') no-repeat center center;
     ```
<br>

4 **Font:**
   - `font`: Combines `font-style`, `font-variant`, `font-weight`, `font-size`, `line-height`, and `font-family` into a single property.
<br>

     ```css
     font: italic small-caps bold 16px/1.5 Arial, sans-serif;
     ```
<br>

5 **Transition:**
   - `transition`: Specifies multiple transition properties in a single declaration.
<br>

     ```css
     transition: property duration timing-function delay;
     ```
<br>

6 **Flexbox:**
   - `flex`: Combines `flex-grow`, `flex-shrink`, and `flex-basis` into a single property.
<br>

     ```css
     flex: 1 0 auto;
     ```

7 **Grid:**
   - `grid-template`: Combines `grid-template-rows` and `grid-template-columns`.
<br>

     ```css
     grid-template: 100px / 1fr 2fr;
     ```
<br>

8 **Box Shadow:**
<br>

   - `box-shadow`: Combines `box-shadow` properties.
     ```css
     box-shadow: 5px 5px 10px #888;
     ```
<br>

9 **Transform:**
<br>

   - `transform`: Combines various transform functions.
     ```css
     transform: translate(50px, 100px) rotate(45deg);
     ```
<br>

These shortcuts help make your CSS more concise and readable. However, be cautious not to sacrifice clarity for brevity, as overly complex shorthand properties might make your code harder to understand for others (or even yourself) in the future.
create email me link
Tags: webdev, web3, website, beginners
Published: 2023-11-27 19:34:49

Creating an "Email Me" link involves using HTML and the `mailto:` protocol. Here's a step-by-step guide:

**Step 1: Open a Text Editor**

Open a plain text editor like Notepad (Windows), TextEdit (Mac), or any code editor you prefer.

**Step 2: Write HTML Code**

```html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Email Me Link</title>
</head>
<body>

  <a href="mailto:your@email.com">Email Me</a>

</body>
</html>
```

**Step 3: Customize Email Address**

Replace `"your@email.com"` with your actual email address. For example:

```html
<a href="mailto:john.doe@example.com">Email Me</a>
```

**Step 4: Add Subject (Optional)**

If you want to pre-fill the subject, you can do so by adding `?subject=Subject%20Here` to the `href` attribute:

```html
<a href="mailto:john.doe@example.com?subject=Hello%20From%20Your%20Website">Email Me</a>
```

Replace `"Hello%20From%20Your%20Website"` with the desired subject. Note that spaces are replaced with `%20` in the URL encoding.

**Step 5: Add Body Text (Optional)**

To include a pre-filled body text, add `&body=Your%20Message%20Here` to the `href` attribute:

```html
<a href="mailto:john.doe@example.com?subject=Hello%20From%20Your%20Website&body=I%20enjoyed%20browsing%20your%20website.%20...">
  Email Me
</a>
```

Replace `"I%20enjoyed%20browsing%20your%20website.%20..."` with the desired body text. Again, note that spaces are replaced with `%20` in URL encoding.

**Step 6: Save and Test**

Save the file with an `.html` extension, for example, `index.html`. Open it in a web browser and click on the "Email Me" link to test if it opens your default email client with the specified email address, subject, and body.

That's it! You've created an "Email Me" link with optional subject and body text. Customize the HTML code further based on your specific needs.

Its best if you [create email me link](https://veilmail.io) with VeilMail.io

It hides your website email address behind a form captcha to make sure its a human and not a bot. It proetcts your email address from SPAM.
Simplifying Localhost HTTPS Setup with mkcert and stunnel
Tags: webdev, tutorial, node, productivity
Published: 2023-11-27 19:30:55

Introduction:
Have you ever needed to enable HTTPS on your localhost quickly and effortlessly? In this concise guide, requiring less than 2 minutes of your time, I'll walk you through a straightforward method that I discovered to achieve just that.

Why Enable HTTPS on Localhost?
In certain scenarios, like experimenting with an API that exclusively functions over HTTPS, enabling HTTPS on your localhost becomes essential. Avoiding the complexities of uploading code to external servers, such as DigitalOcean or platforms like Heroku, is particularly beneficial when dealing with non-production code.

**Solution:** mkcert – Your Zero-Configuration HTTPS Enabler
Meet mkcert, a user-friendly, zero-configuration tool designed for creating locally-trusted development certificates. Find it on its [GitHub page](https://github.com/FiloSottile/mkcert) and follow the instructions tailored for your operating system. For Mac users employing Homebrew, simply execute the following commands in your terminal: 

```bash
brew install mkcert
mkcert -install
mkcert -key-file ~/localhost-key.pem -cert-file ~/localhost-cert.pem localhost
```

Deciphering the Command:
- `mkcert`: The command-line tool facilitating the process.
- `-key-file ~/localhost-key.pem`: Specifies the path and filename for the private key file.
- `-cert-file ~/localhost-cert.pem`: Specifies the path and filename for the certificate file.
- `localhost`: The domain for which the certificate is generated.

Upon completion, two files, `localhost-key.pem` (private key) and `localhost-cert.pem` (certificate), will reside in your home directory.

Create a Certificate Bundle:
Run the following command to concatenate the key and certificate into a single file, `localhost-bundle.pem`, for future use.

```bash
cat ~/localhost-key.pem ~/localhost-cert.pem > ~/localhost-bundle.pem
```

Setting Up a Secure Tunnel with stunnel:
To overcome localhost's inherent lack of SSL/TLS support, we'll utilize stunnel. Install it with:

```bash
brew install stunnel
```

Initiate SSL for Your Local Server:
Start your local server and execute the following command, adjusting the port numbers if necessary:

```bash
sudo stunnel3 -f -d 443 -r 8000 -p ~/localhost-bundle.pem
```

Breaking Down the Command:
- `sudo`: Executes the subsequent command with elevated privileges.
- `stunnel3`: The command-line tool creating encrypted tunnels.
- `-f`: Runs stunnel in the foreground for real-time feedback.
- `-d 443`: Specifies the local port for encrypted traffic (default HTTPS port).
- `-r 8000`: Specifies the destination address and port of the local server.
- `-p ~/localhost-bundle.pem`: Specifies the path to the concatenated certificate and private key file.

Verify Your Setup:
If all steps are executed correctly, access [https://localhost](https://localhost) to ensure your secure local server is up and running.