teleren/devto huggingface dataset:
Managing unexpected scenarios
Tags: performance, testing, management, career
Published: 2022-03-02 23:42:46

When we develop a product we are aware that often bugs can happen, or unpredictable events can affect the product when the customer is using it. I'm sure that no one wants to get a bad review or a call from an angry customer telling them that the platform that he/she is using is not working correctly. The worst scenario for every team is that one of the critical functionality isn't working. 

This is an approach for a small team of developers, very often to keep the product up and running we need to move super fast, sometimes this means leaving things for later and moving on with the critical things.

Scenario: The server is getting loaded with multiple requests from the application so it's throwing errors.

Possible solutions:

**Infra-side**
*Scale horizontally*
If you have your servers on the cloud then add another server and configure your load balancer. The customer probably won't notice the delay, however, this means that we are going to pay something $$ for this unplanned scale.

*Scale Vertical*
Again under the same premise of getting our servers in the cloud we can upgrade the characteristic of the machine (add more RAM, CPU, etc). Again the customer probably won't notice the delay, however, this means that we are going to pay something $$ for this unplanned scale.

**Server-side** 
Verify if your server has a configuration that is limiting the number of requests. In the case of using Nginx if the server is being overloaded with requests, it will start to throw the same response code. Make sure to use CDN for static content & cache strategies for files that are being served like jpg, js, mp3, etc.

**Code-level**
*Add interceptors at frontend level*
This means that when the frontend receives a request indicating a memory issue the frontend is going to handle the request that is sent to the server. This means that we need to consider what are the critical functionalities that need to serve and what are the ones that can wait till the server gets fully recovered.

*Verify your ORM connections*
Verify that you are not using (wrongly) transaction connection in your ORM at backend level, remember that you will block access to the DB if you are using a transaction code (e.g you have a GET endpoint some_domain/users/125, and for some reason, you are opening a transaction and store something in the DB, then close and return the response. This works great ... for at least 20 requests or at least, after the amount is being passed, let's say 30RPS the new requests are being queued, this means that a request that takes 2 seconds is taking 1 minute, and so on).


The most important advice, use proper logs, test the scenario of your catch (in your try{ ...} catch(...) {...}), because of time we don't usually check this, and in the Merge request process is not simple to notice if the process to log is the proper one.

This is everything, for now, let me know what you think and if you consider other tips that can be useful for the people who land in this post.
Pern Stack pagination middleware
Tags: pernstack, node, javascript, express
Published: 2022-03-02 23:11:50

```js

module.exports = (table, _max_limits) => {
    // global variable
    let queryString = `select * from ${table}`
    let arr = []
    let results = {}

    find(queryString)
        .then((data) => arr = data)
        .catch(err => res.status(400).json({ err }))


    return (req, res, next) => {
        // like convention
        const { page, limit } = req.query

        // user input
        const intPage = parseInt(page, 10) || 1
        const intLimit = parseInt(limit, 10)
        // control user limit
        const intCtrLimit = intLimit > _max_limits ? _max_limits : intLimit // user limit > _max_limits

        // algorithms
        let totals = arr.length
        let numberOfPages = Math.round(((totals) / intCtrLimit))
        let startIndex = (intPage - 1) * intCtrLimit
        let endIndex = ((intPage * intCtrLimit) - 1)

        // output
        let prevPage = (intPage > 0 && intPage <= numberOfPages) ? intPage - 1 : 1
        let nexPage = (intPage < numberOfPages) ? intPage + 1 : numberOfPages // not equals but is add one

        // errors gestion
        if (intPage <= numberOfPages) {
            if (intPage > 0) {
                results = {
                    log: `result of request : page=${intPage} & limit=${intCtrLimit} `,
                    totals,
                    prevPage,
                    nexPage,
                    numberOfPages,
                    limit: intCtrLimit,
                    startIndex,
                    endIndex: endIndex + 1 // like array slice 
                }
            }
        }

        // like user paigination
        let paginateDatas = arr.slice(results?.startIndex, results?.endIndex)
        results.datas = paginateDatas

        // like middleware principe
        req.paginateResults = results
        next()
    }
}


```
Learning to Code: Starting at the Base of Mt. Annapurna
Tags: beginners, codenewbie
Published: 2022-03-02 23:00:11

Why didn't I go with the cliché of world's tallest mountain for my title? Because I feel that learning to code is more about the difficulty. I want to climb to the peak and it will be very difficult. As I start climbing I feel at a disadvantage, I know in order to get there I will need to make sure I understand all the tools at my disposal, when, how, and why to use them and how they work however I will be learning this as I go up. I also currently lack a strong foundation of the basics with which to expand into more complicated and advanced techniques but I will be learning them on the way hopefully streamlining my process and becoming efficient. One thing to note is I am by no means a mountain climber, you're more likely to catch me reading comics/manga, playing video games, or cooking up a recipe I found on YouTube or TikTok. 



![manga](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/894dfso4vhlltrgtqo8z.jpeg)

![gaming](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/07bhi4otkfjvwc9xbzgr.jpg)

![cooking](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zumddqkn1fh7yfdl018e.jpeg)


With this first post I wanted to give a little insight to my train of thought and the mindset I will have as I start my climb up the mountain that is coding. 

So far I am midway in my second week of learning and I have a loose understanding of JavaScript. During my prework (learning before classes) and my first week I would dread anything to do with js. I felt like I was getting the labs and assignments done with blind luck. I would read the material, somewhat understand the subject, get to the implementation part and be utterly confused. Learning basic data types was fine until I got to Booleans, arrays, and objects. And don't even get me started on functions. When I started to get a handle on it they turned it into a Russian doll with first class functions, closure, and scopes. All of a sudden functions were recalling other functions that had functions nested inside. 

Now in my second week I feel like I am getting more into the coding mindset as suddenly I'm beginning to understand the Russian dolls, the different way functions can be expressed and represented, and how with nested functions you can essentially create partial functions that operate similarly like using a nested multiplier function and adding the first value to make a doubler separate tripler function. 

So I'm all typed out for now and will be going back into my climb. I will try to keep posting periodically and also make my posts more technical as I become more able to understand what it is I am doing and maybe someone can use this posts as a guide to help them on their own climb up the coding mountain.
What If You Don't Want To Be a Developer Anymore? w/ CTO Connection's Peter Bell
Tags: management, career, podcast, techtalks
Published: 2022-03-02 22:59:52

***Dev Interrupted has a new podcast page on Dev.to! [Have a listen over here!](https://dev.to/dev-interrupted)***

It used to be that in order to make your parents proud you had to go into management. Then along came the self-contained IC career path. Today, this dual-track career path remains the unchallenged standard of companies everywhere.

Or does it?

Peter Bell, the founder and CTO of [CTO Connection](https://www.ctoconnection.com/'), wants developers everywhere to know that there are several dev adjacent career paths. From product to dev advocate to sales engineer, Peter has the insights you need if you’ve ever considered switching up your career while utilizing your hard-earned skills as a developer. 

If you're an engineering leader, then Peter’s advice on the importance of building a community at your company is not to be missed. Through his work with CTO Connection, engineering leaders everywhere have found a community to call home - and a resource to leverage. In fact, CTO Connection bills itself as the “Stack Overflow for managers.” 

Peter is a gifted speaker and presenter, you won’t want to miss this episode!

{% spotify spotify:episode:5P1r1AOYYvawVcsMcW67GP %}

## Episode Highlights Include:
* (4:27) Dev adjacent career paths
* (14:05) Practical steps when considering a career change
* (16:00) Building the "[Stack Overflow for managers](https://www.ctoconnection.com/about-us)"
* (26:21) How to create workplace communities that last
* (28:49) Why companies should treat learning programs like [technical debt](https://linearb.io/blog/technical-debt-ratio/)

## [You're Invited to INTERACT on April 7th](https://devinterrupted.com/event/interact/)

Join engineering leaders from Netflix, Slack, Stack Overflow, American Express & more at LinearB's virtual engineering leadership conference, [**INTERACT**](https://devinterrupted.com/event/interact/) on **April 7th, 2022.**

**1 day, 20 speakers, 1,000s of engineering leaders - all driven by the Dev Interrupted community.** If you are a team lead, engineering manager, VP or CTO looking to improve your team, this is the conference for you!

[**Learn more here**](https://devinterrupted.com/event/interact/)


![Join INTERACT at https://devinterrupted.com/event/interact/](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2xhtonct1vkpjhrtzfl3.png)
Welcome Thread - v166
Tags: welcome
Published: 2022-03-02 22:57:16

---
title: Welcome Thread - v166
published: true
description: Welcome to DEV! A thread of hellos and intros.
tags: welcome
canonical_url: 
---

![Baby leopard waving hi](https://media.giphy.com/media/5WLjeGKqhCK0E/giphy.gif)

### Welcome to DEV!

1. Leave a comment below to introduce yourself! You can talk about what brought you here, what you're learning, or just a fun fact about yourself.

2. Reply to someone's comment, either with a question or just a hello. 👋 

**Great to have you in the community!**
How to configure Vega-Embed for a single Altair chart?
Tags: python, altair, datavisualization, vega
Published: 2022-03-02 22:57:08

By default, in the upper right corner of each [Altair](https://altair-viz.github.io/) chart, there is a dropdown menu with various options. This menu comes with [Vega-Embed](https://github.com/vega/vega-embed), the package used under the hood to [render the charts](https://altair-viz.github.io/user_guide/internals.html).

The Vega-Embed menu can be customized differently for each chart. For this example, we will define a menu with only the options to export the chart as PNG or SVG. Also, the default name of the generated file will be "bar_chart" instead of "visualization", and we will increase the resolution for the PNG image. So, let's see how we can do it using the `properties()` method and the `usermeta` argument!

First of all, let's define a dictionary with all the necessary metadata:

```python
metadata = {
    "embedOptions": {
        "actions": {
            "export": True,
            "source": False,
            "compiled": False,
            "editor": False,
        },
        "i18n": {"SVG_ACTION": "Export as SVG", "PNG_ACTION": "Export as PNG"},
        "scaleFactor": 5,
        "downloadFileName": "bar_chart",
    }
}
```

To keep only the items to `export` the chart, we start by removing the remaining ones (setting them to `False`) from the menu. Second, we renamed these items to "Export as SVG" and "Export as PNG", respectively (`i18n`). Third and fourth, specifically for exporting the chart as PNG, we changed the resolution scale factor from 1 to 5 (`scaleFactor`) and chose "bar_chart" (without the file extension) as our new default filename (`downloadFileName`). For more details on these items and other options, check the [README file in the Vega-Embed repository](https://github.com/vega/vega-embed#options).

Now, assuming we already have a chart (like the one in this [example available in the Altair documentation](https://altair-viz.github.io/gallery/simple_bar_chart.html)), we pass the dictionary defined earlier as an argument to the `properties()` method:

```python
alt.Chart(source).mark_bar().encode(x="a", y="b").properties(usermeta=metadata)
```

If you want to adapt this example to a [compound chart](https://altair-viz.github.io/user_guide/compound_charts.html), make sure you use the `properties()` method on the "final chart" and not on each of the "intermediate charts":

```python
alt.hconcat(
    alt.Chart(source).mark_bar().encode(x="a", y="b"),
    alt.Chart(source).mark_bar().encode(x="a", y="b"),
).properties(usermeta=metadata)
```

Finally, if you have any questions or suggestions, feel free to leave a comment below!
Bir vaqtda Github va Gitlab'ga parolsiz push qilish
Tags: github, gitlab, beginners, tutorial
Published: 2022-03-02 22:15:32

### Video ko'rishni afzal ko'radiganlar uchun 👇
{% embed https://youtu.be/qShhiEMLusk %}

### `SSH Key`larni yaratish
1. terminal'da `~/.ssh` degan papkaga boramiz
2. papka ichida quyidagi kommandalar orqali `github` va `gitlab` uchun alohida `ssh key`lar yaratamiz. *Github va Gitlab email addresslarni to'ldirish esdan chiqmasin. Ular bir xil bo'lsa ham hechqisi yo'q :)* 
```sh
ssh-keygen -t rsa -C "your@github.email"
ssh-keygen -t rsa -C "your@gitLAB.email"
```
   2.1. `github` va `gitlab` emaillarini to'ldirish esdan chiqmasin
3. `~/.ssh` papkasi ichida `code config` komandasi orqali yangi **config** degan fayl yaratamiz va quyidagi kodlarni saqlaymiz
```sh
Host github.com
    Hostname github.com
    User git
    IdentityFile ~/.ssh/github

Host gitlab.com
    Hostname gitlab.com
    User git
    IdentityFile ~/.ssh/gitlab
```
4. **Github**ga kiring va *Settings > SSH and GPG keys*'ga borib **New SSH key** tugmasini bosing.
   3.1. **Title** degan joyiga *key* uchun istalgan nom bering.
   3.2. `~/.ssh` papkada hosil bo'lgan **github.pub** fayl ichidagi hamma tekstni ko'chiring va **Title** tagidagi *tekst maydon**ga tashlang. 
   3.3 **Add SSH Key** tugmasini bosing.
5. **GitLab**ga borib *Preferences > SSH Keys* sahifasiga boring.
   4.1. `~/.ssh` papkada hosil bo'lgan **gitlab.pub** fayl ichidagi hamma tekstni 
   4.2. **Key** degan *tekst maydon*ga yuqorida ko'chirilgan tekstni tashlang
   4.3. **Title** degan joyiga *key* uchun istalgan nom bering.
   4.4. *Expiration Date*ga shu **key** qachongacha ishlashi kerakligini tanlang. **1 yil keyingi sanani kiritish tavsiya qilinadi*
   4.5. **Add Key** tugmasini bosib yakunlang

Hammasi tayyor! Endi siz `git remote` qo'shishda **HTTPS** linklarni EMAS `SSH` linklarni qo'shishingiz kerak bo'ladi.
> Masalan: Tayyor repositoriyaga quyidagi kodlarni kiritsangiz, u github va gitlab'ga bir vaqtning o'zida kod yuklay oladi. 
```sh
git remote add github "github repo ssh link"
git remote add gitlab "gitlab repo ssh link"
```
Day 6 in Redesigning Nasa's Astronomy Picture of the Day
Tags: api, webdev, discuss, opensource
Published: 2022-03-02 22:05:10

It has definitely been a while since I last posted. Unfortunately, I have not been spending every single day on the project, so I'm going to start again. 

---

## 🚀 Here is what I have learned so far

### What is an API?

Formally, an API is an Application Programming Interface. It is used almost everywhere on the internet and is a gate-key to information stored on a database or where-ever it is stored so developers like us can easily access it. 

> An API is a set of defined rules that explain how computers or applications communicate with one another. 

---

### Request? Response? 

Those two words are exceptionally important, and are commonly used words when making or talking about APIs. 

A Request is what is sent to the Web server's URI by your API which consists of verbs generally. Uniform Resource Identifier or URI, is a locater with a compact string of characters which identifies resources and locates a resource by depicting its primary access mechanism. Theres a ton of information on how a URI works, but is out of scope for this project. I could come across it in the future, if that does happen, I will document my entire journey through that. I have linked a few resources to support my explanation.

---

## ⚙️ Changes to the project

So today I have organized the /src directory in the project. Instead of having everything in the /src directory, I have created a components folder with each component having their own directory, then a static folder to put all of the pictures and svgs. 

![Folder Structure](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/p71qtdjsjtkaywbi4qk3.png)
 
As you can see from this image, everything is made, and placed, were it will be for the foreseeable future. 

---

Once again, thank you for reading this blog, it's been the longest I have gone without posting, and I will make a comeback with maintaining my weekly streak. 

If you want to be notified on any changed on this project, follow my [Twitter](https://twitter.com/EWNaidoo)! I keep track with the things I do and regularly post this projects documentation on DEV.to (which was not that much since I have not posted in a while), and put any useful information that could a lot in your life. 

If you would like to see this project, consider checking my [Github](https://github.com/H12M54AM/nasa-astronomy-webpage) project and my [Github account](https://github.com/H12M54AM)!

See you Next Time!

---

## 📚 Resources - What is an API?
* [IBM - API](https://www.ibm.com/cloud/learn/api)
* [RapidAPI - API](https://rapidapi.com/blog/how-to-use-an-api/)

## 💻 Resources - Request? Response?
* [IBM - URI](https://www.ibm.com/cloud/learn/api)
* [Digital Guide - Ionos | URI](https://www.ionos.com/digitalguide/websites/web-development/uniform-resource-identifier-uri/)
* [US Department of Veteran Affairs - URI](https://www.oit.va.gov/Services/TRM/StandardPage.aspx?tid=5205)
* [Wikipedia - Uniform Resources Identifier](https://en.wikipedia.org/wiki/Uniform_Resource_Identifier)
Building Website from Scratch - Part 6
Tags: webdev, shriekdj, codewithshriekdj, beginners
Published: 2022-03-02 22:17:08

## Preface.

So Now I Made Some Changes About an Search Bar.

I Created the Search bar and Hero Section on Home Page of The Website.

* * *

## Section Addition in `<body>` tag.

I Added Given Code in `body` tag before `main` tag and after `header` tag.

```html
<form method="GET" action="/search">
  <label>Search Here : </label>
  <input type="search" name="search-key" placeholder="Enter Your Query" />
  <input type="submit" />
</form>
```

* * *

## Search Bar and Label Configuration..

I added the `for` attribute to `label` tag.

> By Doing this Whenever we click the label element it automatically clicked to input bar as well.
> 
> > The `name` attribute of `input` tag is used by back-end server as key name for dictionary of inputs in form.

```html
<label for="search-id">Search Here : </label>
<input type="search" id="search-id" name="search-key" placeholder="Enter Your Query" />
```

* * *

### Also Hero Section In main tag added

> Like Given Below.

```html
<section class="hero">
  <img src="#" alt="Hero Section Image" />
  <h1 class="page-title">Home Page</h1>
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</section>
```

* * *

## Pull Request
{% github https://github.com/shriekdj/site-from-scratch/pull/15 %}

* * *

## GitHub Repo
{% github shriekdj/site-from-scratch %}

Star The Repo 😉 If you like.
Web 2.0 and web 3.0
Published: 2022-03-02 21:47:49

**Next will be Blochain**
The difference between Web2.0 and web3.0. 
  Web 2 is the second generation of internet focused interaction, while web 3 focuses on decentralization and semantics learning.
  Web 2 network own the data, meaning there's no privacy to your data, web 3 you have ownership over your data. 
  Web 2 focuses on community development, web 3 focuses on empowering the individual users. 
Thanks for reading. 
You can join https://blockgames.gg/, https://nestcoin.com/ and https://zuri.team/ for internship. They've been doing wonderfully well in the tech space.
Criando os primeiros códigos
Published: 2022-03-02 21:42:18

Quando comecei os estudos em programação tive muita dificuldade em encontrar cursos para estudar e realizar as práticas para criar meus primeiros códigos, então, como primeira contribuição nessa plataforma, vou deixar uma pequena lista de sites que estão me ajudando nesse processo de iniciante na área.

**1. Curso em Vídeo | [YouTube](https://www.youtube.com/c/CursoemV%C3%ADdeo) :**

A plataforma Curso em Vídeo, apresentada por Gustavo Guanabara, tem como objetivo disponibilizar cursos gratuitos no YouTube, que vão desde o básico até o avançado, trazendo linguagens como JavaScript, Python e até HTML e CSS. Por ter uma linguagem simples, começar a estudar por essa plataforma foi de muita importância para avançar nos conteúdos da programação.

- 💻 Códigos no GitHub: 
[Curso de JavaScript](https://github.com/danieleolivs/JavaScript).

**2. PrograMaria | [Plataforma](https://www.programaria.org/) :**

Outra importante organização é a PrograMaria, principalmente por seus eventos, participar de alguns deles, como a SprintPrograMaria, foi importante para conhecer mais sobre Inteligência Artificial. Além desses eventos, a plataforma também tem um projeto de bolsas de estudo para o curso online de programação, que também é um grande passo para criar códigos.

**3. Imersão Alura | [Plataforma](https://imersao.dev/) :**

A Alura, plataforma de estudos online, tem disponibilizado diversas imersões gratuitas sobre programação, que vão desde a criação de jogos a aplicação de React em Projetos. Assim, por ter várias aulas com uma linguagem mais simples, canais de conversação e espaço para tirar dúvidas, participar desses eventos foi de grande ajuda para aprofundar meus conhecimentos e também estudar sobre novas tecnologias.

- 💻 Códigos no GitHub: 
[Sciflix](https://github.com/danieleolivs/SCIFLIX),
[Aluracord](https://github.com/danieleolivs/Aluracord),
[Bruxa Hipsta](https://github.com/danieleolivs/BruxaRipsta),
[Imersão CSS](https://github.com/danieleolivs/ImersaoCSS),
[CodePen](https://codepen.io/DanieleOliveira).

**4. Next Level Week | [Plataforma](https://www.rocketseat.com.br/) :**

A plataforma Rocketseat disponibiliza durante alguns dias do ano a Next Level Week, uma semana inteira de conteúdos gratuitos sobre programação, uma ótima forma de treinar e criar novos projetos para o portfólio. Também possuem um canal de dúvida e a possibilidade de interação com outras pessoas programadoras, o que auxilia nesse processo inicial da aprendizagem.

- 💻 Códigos no GitHub: 
[Rocket.q](https://github.com/danieleolivs/Rocket.Q),
[Ecoleta](https://github.com/danieleolivs/Ecoleta),
[Proffy](https://github.com/danieleolivs/Proffy)