teleren/devto huggingface dataset:
Taking down a revenue-generating component
Tags: programming, career, learning, docker
Published: 2023-09-28 21:03:12

I've taken down production at Sky before, a revenue-generating component.

Specifically, the component for processing and fulfilling orders from [skystore.com](http://skystore.com).

We were in the process of migrating this component from eu-west to eu-central and unbeknownst to me I thought we were ready to go ahead with deleting the cluster in eu-west... we definitely weren't.

The repo was already configured to deploy to eu-central and all references to eu-west had been deleted. There were no references to eu-west anywhere, apart from the remaining k8s production pods.

Luckily we have a docker registry that an engineer on our team knew how to use to find a deployment of the production pods on eu-west so we could rectify my mistake.

Production was down for a good 20 hours or so in which we had amassed 25+ orders worth about £300 on the queue.

Definitely a learning experience. Made me realise it's not a bad thing to slow down from time to time and understand the consequences of my actions.
Discussion of the Week - v4
Tags: bestofdev, discuss
Published: 2023-09-28 20:59:04

In this weekly roundup, we highlight what we believe to be the most thoughtful, helpful, and/or interesting discussion over the past week! Though we are strong believers in healthy and respectful debate, we typically try to choose discussions that are positive in nature and avoid those that are overly contentious.

Any folks whose articles we feature here will be rewarded with our Discussion of the Week badge. ✨

![The Discussion of the Week badge. It includes a roll of thread inside a speech bubble. The thread is a reference to comment threads.](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yvizv31dpchucxic2lxc.png)

Now that y'all understand the flow, let's go! 🏃💨

## The Discussion of the Week

This one goes to Sadeedpv (@sadeedpv) for initiating ["Thoughts on Bun so far?"](https://dev.to/sadeedpv/thoughts-on-bun-so-far-1dhk):

{% embed https://dev.to/sadeedpv/thoughts-on-bun-so-far-1dhk %}

The Bun hype train is chugging along... 🚂 But is the hype warranted? Sadeedpv's short'n'sweet discussion poses some solid open-ended questions and puts the focus on the comments. Folks have been chiming in, outlining their concerns and expressing a healthy amount of skepticism, while also still showing some cautious optimism.

Props to @alaindet who shared a good point about competing standards, along with an entertaining xkcd comic that succinctly pokes fun at the proliferation of standards:

{% embed https://dev.to/alaindet/comment/29g4g %}

The thread with @joelbonetr, @lionelrowe, and @cmgustin was also quite productive and enlightening. Notably, Joel pointed to a recent post by @thejaredwilcurt titled "[Bun hype. How we learned nothing from Yarn](https://dev.to/thejaredwilcurt/bun-hype-how-we-learned-nothing-from-yarn-2n3j)" as a resource that might be of interest to folks who are looking into Bun.

{% embed https://dev.to/joelbonetr/comment/29g0a %}

If any readers here have thoughts to share, don't hesitate to hop into the comments of the post and let us know what's on your mind!

## What are your picks?

The DEV Community is particularly special because of the kind, thoughtful, helpful, and entertaining discussions happening between community members. As such, we want to encourage folks to participate in discussions and reward those who are initiating or taking part in conversations across the community. After all, a community is made possible by the people interacting inside it.

There are loads of great discussions floating about in this community. This is just the one we chose to highlight. 🙂

I urge you all to share your favorite discussion of the past week below in the comments. And if you're up for it, give the author an @mention — it'll probably make 'em feel good. 💚
Fundamentals Of Network Engineering For Backends.
Tags: backend, networking, systemdesign
Published: 2023-09-28 20:53:56

##Welcome to the Fundamentals Of Network Engineering For Backends

Welcome to the comprehensive resource center for the **Fundamentals Of Network Engineering For Backends** series. This collection of articles serves as a cornerstone for understanding the core principles and practices associated with network engineering, particularly in the context of backend systems. Whether you're a seasoned network professional or just starting your journey in this field, this series will provide you with valuable insights and knowledge.

## Overview

The **Fundamentals Of Network Engineering For Backends** series is designed to help you grasp the essential concepts and techniques necessary for effective backend design and management. If you're looking to deepen your understanding of network engineering or are pursuing a career in backend development, this series is a valuable resource.

## Course on Udemy

For those who prefer a structured learning experience, you can access the course through the following link: [Fundamentals of Networking for Effective Backend Design](https://www.udemy.com/course/fundamentals-of-networking-for-effective-backend-design/) by [Hussein Nasser](https://www.udemy.com/course/database-engines-crash-course/#instructor-1). It offers a guided curriculum and hands-on exercises to reinforce your learning.


## Articles in the Series

Here are some of the topics we'll cover in this series:

1. [**Fundamentals of Networking**](https://dev.to/olatisunkanmi/fundamentals-of-networking-connecting-the-digital-world-1ka0): Understand the fundamentals on Networking, The Why and How.

These articles will serve as a valuable reference as you progress through the series and deepen your knowledge of network engineering for backends.

## Regular Updates

This page will be regularly updated to ensure that you have access to the latest articles and resources related to the series. Check back often to stay up-to-date.

Thank you for joining me on this educational journey. I am excited to be your guide in mastering the fundamentals of network engineering for effective backend design. Stay tuned for my upcoming articles, and don't hesitate to explore the Udemy course for a structured learning experience.
What Is jQuery?
Published: 2023-09-28 20:51:02

For those who use JavaScript, you might have heard about CSS or HTML before. If you don't know, CSS and HTML are file types that you use to work on front-end development. This is basically what you see when you open a website. (1) A word or sentence could be at a specific location on the page, have different colors, and have a certain font style. (2) There could be a square or rectangle of a random color on the page. (3) Maybe there is an image of something or a photo of a location.

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

Normally trying to use JavaScript to work on the front end of a website is a bit tricky. jQuery is a JavaScript library that makes it easier to work on the front end of a website by wrapping multiple lines of code that you would have to write into a method, making your code a lot cleaner and simpler to use commands. For example, by hovering over a sentence you can change its color to a different color. Then you can make it change back to its original color when you’re not hovering over it. Another example
would be to change the default background color to a different color, when the the website first runs.


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

Besides making it easier to use JavaScript on a website, jQuery also simplifies other methods, not just CSS and html manipulation.
  .Effects and animations
  .AJAX
  .Utilities
jQuery also has plugins for other tasks you may need. Thanks to that, jQuery became popular
among some big companies, such as:
.Google
.Microsoft
.IBM

If you are interested in jQuery, I recommend that you learn a bit of HTML and CSS code first. HTML code is like the framework of a website, while CSS code is the website decorator that gives it some color, making the website not look like just a blank white page with some words/Sentences. If you are still interested in learning jQuery, I linked some sites I used when making this blog at the bottom of this page. All images used are screenshots from the linked websites.



sites used:
https://www.w3schools.com/jquery/jquery_intro.asp
https://www.youtube.com/watch?v=JjIvF0yikGU&t=410s
Badge for Security FAQs: Strengthening Online Trust
Tags: javascript, security, beginners, programming
Published: 2023-09-28 20:48:44

1. Introduction
In the virtual realm, where the exchange of information happens at lightning speed, users often question the [safety ](https://safezonea.com/badge-for-security/)and security of their online interactions. As a result, businesses and websites must find innovative ways to assure users of their commitment to security and transparency. One such innovative solution is the "Badge for Security FAQs."

2. The Significance of Trust
Trust is the foundation of any successful online interaction. Whether it's purchasing a product, sharing [personal ](https://safezonea.com/security-jackets/)information, or simply browsing a website, users need to feel confident that their data and privacy are protected. Without trust, user engagement and conversion rates can plummet.

3. Understanding Security FAQs
Security FAQs are a collection of frequently asked questions related to the safety and [security ](https://safezonea.com/mini-security-cameras/)of a website or online service. These FAQs address common user concerns and provide detailed answers, reassuring users and alleviating their doubts.

4. The Role of Security Badges
Security badges are visual representations of a website's commitment to security. When users see these badges prominently displayed, they are more likely to trust the platform. Incorporating a badge for Security FAQs takes this a step further by directly addressing security-related questions.

5. Types of Security Badges
Security badges come in various forms. Some of the most recognized ones include SSL certificates, [antivirus ](https://safezonea.com/apple-security-alert-tips/)endorsements, and privacy seals. The badge for Security FAQs is a unique addition that focuses explicitly on answering user queries related to security.

6. Designing an Effective Badge
The design of your Security FAQs badge matters. It should be easily recognizable, visually appealing, and convey a sense of trust. A well-designed badge can capture the user's attention and signal a commitment to security.

7. Placement Matters
Where you display your Security FAQs badge matters. It should be prominently featured on your [website](https://safezonea.com/security-shirts-professionals/), especially on pages where users may have security concerns, such as login, payment, and personal data entry pages.
redux
Published: 2023-09-28 20:41:16

1. cart
```
import { PayloadAction, createSlice } from "@reduxjs/toolkit";
import Cookies from "js-cookie";
const initialState = {
  loading: true,
  cartItems: [],
};

const cartSlice = createSlice({
  name: "cart",
  initialState,
  reducers: {
    addToCart: (state: any, action: PayloadAction) => {
      const actionItem: any = action.payload;
      const existItem = state.cartItems.find(
        (val: any) => val._id === actionItem._id
      );
      if (existItem) {
        state.cartItems = state.cartItems.map((val: any) =>
          val._id === existItem._id ? actionItem : val
        );
      } else {
        state.cartItems = [...state.cartItems, actionItem];
      }
      Cookies.set("cart", JSON.stringify(state));
    },
    removeToCart: (state: any, action: PayloadAction) => {
      const actionItem: any = action.payload;
      state.cartItems = state.cartItems.filter(
        (val: any) => val._id !== actionItem._id
      );
    },
  },
});

export const { addToCart, removeToCart } = cartSlice.actions;
export default cartSlice.reducer;

```
2. store provider

```
"use client";

import { Provider } from "react-redux";
import { store } from "./store";

export function StoreProvider({ children }) {
  return <Provider store={store}>{children}</Provider>;
}

```
Los Static Site Generators. HTML y CSS Vanilla?!
Tags: html, gatsby, astro, css
Published: 2023-09-28 20:23:47

Un Static Site Generator es una herramienta que permite generar sitios web estáticos a partir de contenido y plantillas predefinidas. A diferencia de los CMS tradicionales, que generan el contenido de forma dinámica en el momento de la solicitud, los Static Site Generators generan el sitio web completo de antemano y solo requieren servir los archivos estáticos al cliente.

La principal ventaja de utilizar un Static Site Generator es la mejora en el rendimiento y la velocidad de carga del sitio web. Al generar el sitio estático de antemano, se eliminan los tiempos de procesamiento en el servidor y se reduce la cantidad de solicitudes al mismo. Esto se traduce en tiempos de carga más rápidos, lo que mejora la experiencia del usuario y puede tener un impacto positivo en los rankings de búsqueda.

Además del rendimiento, los Static Site Generators ofrecen otras ventajas. La simplicidad en el desarrollo es una de ellas. Al emplear plantillas y contenido predefinidos, los desarrolladores pueden centrarse en la estructura y el diseño del sitio web sin preocuparse por la generación de contenido dinámico. También se facilita la implementación y el despliegue del sitio web, ya que solo se requiere servir archivos estáticos, lo que permite usar servicios de hosting más simples y económicos.

Sin embargo, los Static Site Generators también presentan algunas limitaciones. Al generar el sitio web de antemano, cualquier cambio en el contenido requiere regenerar todo el sitio, lo que puede ser un proceso lento y costoso en términos de recursos. Además, si se requiere funcionalidad dinámica, como formularios interactivos o autenticación de usuarios, es posible que los Static Site Generators no sean la mejor opción.

La historia de los Static Site Generators se remonta a principios de la década de 2000, cuando surgieron los primeros generadores estáticos, como Jekyll. A medida que las tecnologías web evolucionaron, también lo hicieron los Static Site Generators, con la incorporación de características como la generación incremental y la capacidad de trabajar con múltiples lenguajes de programación y frameworks.

En cuanto a los casos de uso recomendados, los Static Site Generators son ideales para sitios web con contenido principalmente estático, como blogs, páginas de documentación y sitios de comercio electrónico con un catálogo estable. También son una excelente opción para proyectos con un enfoque en el rendimiento y la seguridad, ya que al servir solo archivos estáticos, se reduce la superficie de ataque y se minimiza el riesgo de vulnerabilidades.

En resumen, los Static Site Generators son herramientas poderosas que ofrecen ventajas significativas en términos de rendimiento, simplicidad de desarrollo y despliegue. Si tienes un proyecto con contenido principalmente estático y deseas optimizar la velocidad de carga y la experiencia del usuario, un Static Site Generator puede ser la elección adecuada para ti.
web3.py and Polygon testnet Mumabi: ExtraDataLengthError
Published: 2023-09-28 20:22:29



If you ever find yourself with `ExatrDataLenghtError` when you try to write something from your Python script (via `web3.py`) into smart contract deployed on Mumbai, you should consider injecting `geth_poa_middleware` into instance of `web3Provider`   

```
from web3.middleware import geth_poa_middleware
self.w3Provider = Web3(Web3.HTTPProvider(provider))
self.w3Provider.middleware_onion.inject(geth_poa_middleware, layer=0)
```

And this should solve situation. 

Reason for this error is fact that some Proof-of-Authority implementation like go-ethereum (geth) doesn't implement yellow paper fully. It has some difference that need to be adjusted with  middleware that web3.py provide us. Naimlly  `extraData` field in each block shoould be maximum of 32-bytes and Geth’s PoA is 97 bytes. So this middleware modifies the block data before returning it.

Here us full error message:


`web3.exceptions.ExtraDataLengthError: The field extraData is 97 bytes, but should be 32. It is quite likely that you are connected to a POA chain. Refer to http://web3py.readthedocs.io/en/stable/middleware.html#proof-of-authority for more details. The full extraData is: HexBytes('0xd78301000483626f7288676f312e32302e38856c696e75780000000000000000761548136a5f1862a71b2101f065486f94dd9914103df62281b714ce1d57c23d615abbff096f646f1e8428ebfd13fb59ca6d8a82e26735873e603739cf7d8a7d00')`


More on  this error you can find in `web3.py` official documentation[web3py](https://web3py.readthedocs.io/en/stable/middleware.html)
Section `Why is geth_poa_middleware necessary?`
The ugly part of CSS-in-JS
Tags: css, javascript, webdev
Published: 2023-09-28 20:12:26

One often-overlooked aspect of CSS-in-JS is its "dark side"—the "JS" part. What does this mean? Essentially, when you're writing your styles **within** JavaScript, you expose yourself to the quirks and intricacies of JS itself.

### The Issue Illustrated

Consider the following example:

{% embed https://codesandbox.io/embed/css-in-js-ugly-part-vcmtx5 %}

You might notice that the styles defined in `IBreakStyles` aren't applied as expected. Digging into the element with your development tools reveals a complete absence of styles.

### The Root Cause

The culprit is a stray closing curly bracket within the template literal:

```js
const IBreakStyles = styled.p`
  padding: ${({ $count }) => $count + "px"}}; /* <-- The offender */
  color: red;
  background-color: blue;
`;
```

What happens is that the CSS-in-JS library (in this case, styled-components) interprets the template literal in a specific way. This leads to parsing the CSS via JavaScript, and the stray curly bracket disrupts the intended behavior—likely closing some parent block in the JS logic.

### The Silent Problem

The real issue is the absence of any alert mechanism: no errors are thrown, and no red squiggly lines appear in your editor to warn you. If you're fortunate, your editor's CSS-in-JS tooling might catch this, but that's not a guarantee.

### A Thought to Ponder

Given these complexities, it's worth questioning if a separation of concerns—CSS in CSS files and JS in JS files—might not be a more foolproof approach, much like the "good old times."

Best regards,  
Andi
No changelog for your open source project? We'll make one for you for Hacktoberfest!
Tags: hacktoberfest, ruby, javascript, hacktoberfest23
Published: 2023-09-28 20:05:16

Our company helps dev teams keep their open source dependencies up to date. One thing we do is plan and implement large complex upgrades (e.g. Rails) using software and people. Along the way we've used LLMs to categorize thousands of breaking changes in changelogs and Github releases. We've run into lots of projects that have a) no changelog at all, or b) undocumented changes. We're all human!

So for Hacktoberfest, we'd like to offer to all Ruby and Javascript maintainers: if you need help creating or augmenting a changelog, let us help! You can write to founders@infield.ai and we'll assign you a contributor from our team. We'll be working throughout the month of October. Cheers!
Are you an HTML expert? Find out with the new State of HTML 2023 survey
Tags: html, webdev, frontend, discuss
Published: 2023-09-28 20:00:55

If you're familiar with the State of JavaScript or State of CSS surveys, there is now a brand new [State of HTML survey](https://stateofhtml.com/en-US) that is still open.

**How did you do? Is HTML already one of the languages you continuously keep up with?**

This was definitely an (expected) humbling experience for me after 10 years of web development:

![State of HTML survey results: Of the 131 features mentioned in the survey, you have used 37 and heard of 6 more, which puts you in the top 47% of all respondents](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6aoc26qzae8lpvj93o1c.png)

I feel like HTML can get glossed over in web development since it's not a _programming_ language and therefore assumed you can just learn the tags at the beginning and never worry about it again. So many online courses have you "learn HTML in one day." Granted, you can definitely get started after a day but there is so much to continuously learn; I still sometimes struggle with selecting the proper tag to represent specific content for semantics and for accessibility. (Don't even get me started on form tags).

And based on this survey, there are so many new tags and APIs that continue to come out. There were so many things I hadn't even heard of. A lot may not be applicable to what you do day-to-day, but it's definitely a reminder to research things even if you think you already know.
APIWorld 2023 Pass Giveaway!
Tags: api, developers
Published: 2023-09-28 19:56:28

APIWorld 2023 Pass Giveaway!
As a member of the APIWorld Advisory Board, I've received a limited number of free passes, each valued at $100. No email is required! Grab yours here: https://perfai.ai


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