teleren/devto huggingface dataset:
Why does not postgres use my index?
Tags: postgres, database
Published: 2024-06-05 04:40:20

_This is a quick note_

## 1. Query Conditions Not Matching the Index
- The index is not on the columns being queried.
- The query does not use the leading columns of a composite index.
- The query is not written in a way that takes advantage of the index's order.
- The query uses functions or operations that prevent the use of the index (e.g., using functions like LOWER() on the column in the query).
- Data type mismatches between the column and the query can prevent index usage. Ensure that the data types match exactly.

## 2. Query Planner's Cost Estimates
- PostgreSQL's query planner estimates the cost of using the index and might decide that a sequential scan is cheaper.
- The statistics for the table are outdated or inaccurate, leading the planner to make suboptimal decisions. Running ANALYZE can help update these statistics.

## 3. Index Selectivity
The index is not selective enough. For example, if a column has many **duplicate values**, scanning the index might not save much time compared to a sequential scan.
Hoisting for dummies (aka me)
Tags: javascript, webdev, beginners, career
Published: 2024-06-05 04:35:16


_**TL/DR:**
Hoisting is a useful JavaScript feature that allows you to use variables and functions before they are declared. However, it's crucial to remember that only declarations are hoisted, not assignments. The keywords `let` and `const` have different hoisting behaviours, and strict mode can be used to avoid potential hoisting-related issues._

---

## A quick guide to hoisting 🏗️

Hoisting is one of those buzzwords you hear about only two times in your dev life, one is during that pesky interview and the other is when you're in school. But guess what? I never learned it (or maybe I did and forgot, sorry teacher). So, let's find out what the mystery of ✨hoisting✨ is.

The textbook definition of hoisting is **_to lift something heavy, to move from a lower position to a higher position._**

Interesting... But still doesn't click for me.

[MDN](https://developer.mozilla.org/en-US/docs/Glossary/Hoisting) defines hoisting as: 

> the process whereby the interpreter appears to move the declaration of functions, variables, classes, or imports to the top of their scope, prior to execution of the code.

Ah. Now I get it. 

This means that regardless of the their actual placement within the scope, you can use them as if they were declared at the beginning. If you're familiar with the black magic of `var`, that is basically hoisting at it's finest. Just add functions, classes and imports into the mix. 

There is a few catches though. Only declarations are hoisted, not assignments. It also doesn't apply to arrow functions, as they are declared with the `const` keyword.

I'm a visual person, so I made some ~cool~ graphics using Figma. Check this out:

![Function Hoisting](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9niyi3syl1qlzr8uaxv8.png)

![Initialization](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qs0apxi59s4y457izdkt.png)

![Variable hoisting](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/k1v93ni854nncurt7ppy.png)

---

## Alright, I think that's it for me ┗(･ω･;)┛

Here are some key points to take home:
* **Variable and function declarations are hoisted:** Hoisting applies only to declarations, not assignments. For instance, the declaration ‘var headcount’ is hoisted, but the value assignment ‘var headcount = 10’ remains at its original location.
* **`let` and `const` behave differently:** Unlike `var`, which is hoisted to the top of its scope, `let` and `const` variables are declared in the place they are written. Attempting to access a let or const variable before its declaration will result in a reference error.
* **Hoisting in Strict Mode:** JavaScript offers a "strict mode" to prevent potential issues caused by hoisting. When running code in strict mode, `let` and `const` variables are no longer hoisted, ensuring clear and error-free code.

Hope you learned something with me today! (´◡`)

Bibi
What is Kitchen Cabinet Refacing
Published: 2024-06-05 03:55:32

Cost-Effective: Cabinet refacing is often much cheaper than a full cabinet replacement, making it a budget-friendly option for homeowners.

Time-Saving: Since cabinet refacing doesn't require the removal of the existing cabinets, the process is typically quicker and less disruptive than a full renovation. This means you can enjoy your newly updated kitchen in less time.

Environmental-Friendly: Refacing your cabinets instead of replacing them reduces waste by reusing existing materials. This makes it a more environmentally sustainable option compared to a complete cabinet replacement.

Customization Options: With a wide range of materials, colors, and styles available, you can customize your cabinet refacing to suit your taste and complement your kitchen's overall design aesthetic.

Increased Home Value: Updating your kitchen cabinets can significantly enhance the appearance and value of your home. Whether you're planning to sell or simply want to improve your living space, cabinet refacing is an investment that pays off.

https://one-kitchens.com
How to setup a Svelte project
Tags: webdev, javascript, beginners, tutorial
Published: 2024-06-05 03:55:15

# How to setup a Svelte project
You first have to have Node.JS and npm installed on your computer.
First of all run ``bun create vite .`` or ``npm create vite .`` for NPM users.
Use the down arrow key to scroll to Svelte, then hit enter.
Press JavaScript, or Typescript, your choice. Sveltekit is an advanced topic and if you are a beginner you should stick to Svelte/javascript.
AVIF Studio - Web page screen capture Chrome extension Made with Svelte and WebAssembly.
Tags: svelte, webassembly, screenshot
Published: 2024-06-05 03:46:37

Installation Link

https://chromewebstore.google.com/detail/avif-studio/bcnhebdciabcnffgcgdpkkniplccpfap?hl=en

{% youtube tB6EnN3DId8 %}

AVIF Studio - Web page screen capture Chrome extension Made with Svelte and WebAssembly.
Extension for webpage screen capture
Support all major image formats - AVIF/PNG/JPEG/WEBP/PDF .

A simple extension for capturing web page screenshots and save the captured screen to various image formats, such as AVIF , PNG, WEBP , JPEG & PDF images.

The captured screens can be annotated in a professional and awesome way. There are various tools that make labeling and annotating fun and interesting. Annotation templates are available to make the process as easy as possible.

This is a totally free extension please give it a try .
Im s mahibalan, i am doctor
Tags: devchallenge, frontendchallenge, css, javascript
Published: 2024-06-05 03:31:21

_This is a submission for [Frontend Challenge v24.04.17]((https://dev.to/challenges/frontend-2024-05-29), Glam Up My Markup: Beaches_

## What I Built

<!-- Tell us what you built and what you were looking to achieve. -->

## Demo
<!-- Show us your project! You can directly embed an editor into this post (see the FAQ section from the challenge page) or you can share an image of your project and share a public link to the code. -->

## Journey
<!-- Tell us about your process, what you learned, anything you are particularly proud of, what you hope to do next, etc. -->

<!-- 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. -->

<!-- We encourage you to consider adding a license for your code. -->

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


<!-- Thanks for participating! -->
Enhance Your ReactJS Code Quality with StrictMode A Comprehensive Guide
Tags: react, javascript
Published: 2024-06-05 03:30:57

---
title: Enhance Your ReactJS Code Quality with StrictMode A Comprehensive Guide
published: true
description:In ReactJS, StrictMode is a tool used to highlight potential problems in an application. It activates additional checks and warnings for its descendants, making it easier to identify unsafe lifecycles, legacy API usage, and other potential issues 
tags: react, javascript
# cover_image: https://media.licdn.com/dms/image/D5612AQG629zOoG8_YQ/article-cover_image-shrink_423_752/0/1717552191271?e=1723075200&v=beta&t=QIXC6JfGqci-ASWBBvpis6RQWGt83FkeZ5gk2f7O_8w
# Use a ratio of 100:42 for best results.
# published_at: 2024-06-05 03:22 +0000
---
In ReactJS, StrictMode is a tool used to highlight potential problems in an application. It activates additional checks and warnings for its descendants, making it easier to identify unsafe lifecycles, legacy API usage, and other potential issues 

[read more...](https://www.linkedin.com/pulse/enhance-your-reactjs-code-quality-strictmode-guide-haroon-jabarulla-6x9nc/?trackingId=eJVhv29nSuK6or5dDhCqmQ%3D%3D)

[#] Reactjs
The Rise of Large Language Models A basic understanding of Chatbot AI
Tags: beginners, ai, news, machinelearning
Published: 2024-06-05 03:25:42

Not even 5 years ago, the general predictions of AI were to change the labor market. Amazon robotics scared millions of warehouse workers. However, it’s becoming apparent the arts and entertainment market is the first industry to feel the full effects of AI.If you're curious about the future of AI and its potential impact on your work, check out the full article on Medium: 
https://medium.com/@PinkHatHacker
Transforming the Oil and Gas Industry Everyday
Tags: industry, infrastructureascode, terraform, cloudcomputing
Published: 2024-06-05 03:06:00

## Benefit from the Power of Brainboard to Make the Oil and Gas Industry More Efficient and Eco-Friendly on Every Level

### Safer Drilling, Better Analytic Insights, More Efficient Production, and Cleaner Skies

### **Democratize Access to IaC Through Training**

Don’t hire expensive consultants. With Brainboard, you can train your team at a fraction of the cost, democratizing access to Infrastructure as Code (IaC) and empowering your workforce.

### **Infrastructure Productivity Multiplier**

> The oil and gas industry is projected to spend up to $12.4 billion per year by 2030 on cloud computing and analytics, according to Statista. 

![Cloud Architecture Templates](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/eu83a1pw7rn4yhnnvp90.png)

This investment yields significant returns through increased production and efficiency. Brainboard offers the best solution that scales with your growth, providing the flexibility to scale up or down as needed.

### **Join the Green/Climate Efforts**

> Global emissions need to drop by 7.8% per year over the next decade to prevent further temperature increases, as stated by scientists and the UN.
 
The oil and gas sector, being the top energy source, must work diligently to reduce greenhouse gas emissions. Brainboard helps you align with green initiatives, contributing to a cleaner, sustainable future.

### **Empower, Standardize, and Enhance Data and Visualization**

![Design terraform cloud](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pspaed9d0p4tv8g6slxw.png)

Brainboard provides a decentralized, visual platform to store and access data with virtually no limit. This capability simplifies data analysis, aiding decision-makers in the oil and gas industry to make informed, impactful decisions.

### **Better Reliability and Lower Downtime**

Cloud data connectivity and security are crucial for safer operations in the oil and gas industry. Brainboard secures your valuable data while maintaining the connectivity and accessibility needed for safe drilling operations, reducing downtime and enhancing reliability.

## Supercompute the Oil & Gas Industry

Harness the power of Brainboard to transform your oil and gas operations. From safer drilling and better insights to increased efficiency and environmental sustainability, Brainboard is your partner in driving innovation and excellence in the oil and gas industry. [Talk to our experts](https://www.brainboard.co/contact-us) to learn more about how Brainboard can revolutionize your infrastructure.
Review bình xịt bọt tuyết cầm tay rửa xe ô tô có tốt không?
Published: 2024-06-05 03:05:46

Bình xịt bọt tuyết cầm tay là phụ kiện ô tô không thể thiếu khi rửa xe ô tô. Cùng Accecar khám phá tác dụng đặc biệt của bình xịt bọt tuyết cầm tay dung tích 2 lít với những đặc điểm độc đáo:

Chất liệu nhựa HDPE: Với chất liệu nhựa HDPE chất lượng cao, bình xịt bọt tuyết trở nên siêu bền và chắc chắn. Điều này đảm bảo rằng bạn có một sản phẩm lâu bền, đáng tin cậy để sử dụng trong thời gian dài mà không lo về vấn đề độ bền.
Mua bình xịt bọt tuyết cầm tay tại: [https://accecar.com/binh-xit-bot-tuyet-cam-tay/](https://accecar.com/binh-xit-bot-tuyet-cam-tay/)

Khả năng phun bọt tự động: Điểm nổi bật của sản phẩm này là khả năng phun bọt tự động. Điều này tiết kiệm thời gian và công sức, cho phép bạn dễ dàng tạo ra bọt mà không cần phải bắt đầu và dừng quá trình phun bọt thủ công. Bạn chỉ cần nhấn nút và thưởng thức một màn trình diễn bọt tuyết lấp lánh.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/btb9snguiol6tz3ozvwb.png)
Tặng vòi xịt rửa xe, tưới cây: Bình xịt bọt tuyết cầm tay này được tặng kèm vòi xịt đa năng, cho phép bạn không chỉ sử dụng nó để rửa xe một cách hiệu quả mà còn để tưới cây trong vườn. Điều này mang đến sự tiện ích và linh hoạt, giúp bạn tiết kiệm không gian và tiền bạc.

Diện tích phun bọt lớn 55 độ: Với diện tích phun bọt rộng lên đến 55 độ, bình xịt này đảm bảo bạn có thể phủ bọt lên diện tích rộng hơn một cách nhanh chóng và hiệu quả. Không còn lo lắng về việc bỏ sót những vết bẩn, bạn sẽ có một màn phun bọt hoàn hảo và đồng đều trên bề mặt.

Nhập khẩu chính hãng: Điều đáng tin cậy nhất về sản phẩm này là nó được nhập khẩu chính hãng. Điều này đảm bảo rằng bạn nhận được một sản phẩm chất lượng cao, tuân thủ các tiêu chuẩn và đáng tin cậy trong việc cung cấp hiệu suất vượt trội.
Hãy sử dụng bình xịt bọt tuyết cầm tay dung tích 2 lít với những tác dụng đặc biệt này để trải nghiệm những lợi ích tuyệt vời mà nó mang lại.
Xem tất cả các phụ kiện ô tô tại đây:  [https://accecar.com/phu-kien-o-to/](https://accecar.com/phu-kien-o-to/)
🚀 First Week of Computer Programming Courses: What I’ve Learned! 🚀
Tags: html, networking, beginners, webdev
Published: 2024-06-05 02:52:08


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

Diving into the world of programming has been interesting so far, and my first week was packed with tons of things I did not know and hands-on experiences. Here’s a glimpse of what I’ve learned so far:

🌐 Building a Responsive Website: I created a responsive website using HTML, showcasing the city I live in. I haven't used HTML since MySpace! lol

🤔 Who Owns the Internet? I was today years old to know that no single entity, including the government, owns the internet. It's a global network of networks, governed by protocols and standards. 

🔌 Network Components & Connections: I learned the basics of network infrastructure, understanding end devices, intermediate devices, and network media. This foundational knowledge is key for me to grasp how data travels across the internet.

📶 The true definition of "Bandwidth": I finally understand what bandwidth really means – it's not about a person's capacity lol, but the rate at which data is transmitted over a network connection.

💻 Bits and Bytes: Did you know the word "computer" has 64 bits? Eight bits make a byte, so 64 bits equal 8 bytes. Simple, but yet a fundamental concept in computing that I now know :) 

🚀 Supercomputers Are Real: Yes, they do exist! The US has the most supercomputers in the world with 161, including the world's fastest supercomputer, Frontier. 

I am excited for the weeks ahead and all the new knowledge and skills to come! Tune in next week for more learnings. 

If you are just starting your coding journey comment below the cool and interesting things you are learning!
What is cloud computing ?
Tags: learning, cloudcomputing, aws, azure
Published: 2024-06-05 02:08:18

In simple words, cloud computing is delivery of resource, IT environments that enable on-demand services like computing, storage, networking, which can be accessed over the Internet using a cloud provider.

**Advantages of Cloud Computing**

- _Agility_ 
Being able to implement technology services in a short time, being able to expand activities to new geographic regions.

- _Elasticity_
You provision the amount of resources actually needed, being able to increase or decrease the amount of resources that will be needed.

- _Cost savings_
Expenses are equivalent only to the IT consumed

**Types of Cloud Computing**

1. _(IaaS) = infrastructure as a service_
Instead of physically purchasing and managing servers, companies can rent these resources from a cloud provider such as: Virtual Servers, Operating Systems, Storage

2. _(PaaS)= plataform as a service_ 
Deliver development environments so that developers can create and manage applications. PaaS allows companies to focus on software development while the cloud provider manages the infrastructure. ex: azure, aws, heroku

3. _(SaaS)= software as a service_ 
software distribution where applications are hosted by a service provider and made available over the internet, and can be accessed via the web such as: netflix, google drive, dropbox


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

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ubpbucxqma2d8w0jet27.png)
The Backbone of Collaboration: Understanding Merge Request Reviews
Published: 2024-06-05 02:00:02

### Introduction

Merge request reviews form an integral part of successful collaborative projects, especially in the field of software development. They ensure high-quality code, facilitate knowledge sharing, and foster a more collaborative team environment. In this blog post, we will delve into the importance of merge request reviews, how to conduct them effectively, and some best practices to follow.

### Understanding the Importance of Merge Request Reviews

Merge request reviews are essential for maintaining the quality of code in a collaborative software development project. They provide a platform for developers to scrutinize proposed changes and spot any potential issues before they become part of the main code base. This process helps reduce bugs, enhances code readability, and improves the overall performance of the software.

> To ensure a smooth merge process, writing a clear and informative description for your pull request (PR) is crucial. This description helps reviewers understand the context and purpose of your changes. Here's a sample PR description for your reference: \[[link to sample](https://gist.github.com/iswanj/1a84bd1ffee825d59bd15ea5d2d42dc6)\]

### How to Conduct Effective Merge Request Reviews

Effective merge request reviews require a clear understanding of the project's goals and the specific changes proposed. Here are a few steps to follow:

1. Understand the context: Before starting the review, understand the purpose of the changes and how it fits into the overall project.
    
2. Check the code: Review the proposed changes thoroughly. Look for any code smells, potential bugs or performance issues.
    
3. Provide constructive feedback: Instead of just pointing out what's wrong, provide suggestions on how to improve the code. Remember, the goal is not just to find faults, but to help each other grow as developers.
    

### Best Practices for Merge Request Reviews

Adopting best practices for merge request reviews can streamline the process and make it more effective. Here are a few to consider:

1. Keep it small: Smaller merge requests are easier to review and less likely to introduce bugs.
    
2. Review regularly: Regular reviews can help catch issues early and reduce the time taken to integrate changes.
    
3. Foster a positive culture: Encourage open communication and respect for each other's opinions. This can help create a more collaborative and productive team environment.
    

### Conclusion

Merge request reviews are a critical tool in any collaborative development project. They help maintain code quality, share knowledge among the team, and promote a collaborative culture. By understanding their importance, learning how to conduct them effectively, and adopting best practices, teams can significantly enhance their productivity and the quality of their output.
Pipeline Validación de Código
Tags: azure, cloud, devops, spanish
Published: 2024-06-05 13:26:37

---
title: Pipeline Validación de Código
published: true
date: 2024-06-05 01:30:00 UTC
tags: Azure,cloud,DevOps,spanish
canonical_url: https://www.ahioros.info/2024/06/pipeline-validacion-de-codigo.html
---

Siguiendo con la construcción de nuestro pipeline para aplicaciones en react, vamos a agregar herramientas para validar el código del repositorio cada vez que realizamos un commit o un PR en el repositorio.

Antes de todo vamos a definir cada uno de estos conceptos.

<!-- agrega el botón leer más -->

	* Formato: Para realizar esto usamos las herramientas llamadas linter. Estas herramientas suelen venir con opciones para hacer también el análisis del cóigo. Esto no es nuevo ya en el lenguaje de programación C se utilizaba antes estas herramientas antes de la compilación.

    * Análisis: El análisis del código se puede realizar por medio de los linters o de otras herramientas especializadas, inluso podemos darle puntaje al código y así restringir que no se suba código que no cumpla con ciertas reglas o que esté por de bajo de un 89/100 de puntaje.
    
    * Test: En esta etapa realizamos los tests del código estos pueden ser unitarios o de integración.
    
    * Compilación: En esta etapa compilamos el código y si todo funciona correctamente podemos subirlo al repositorio.

En nuestro pipeline vamos a agregar cada una de las herramientas.

**Nota** : Estas son solo algunas herramientas, existen muchas más, y sobre el análisi de código más adelanteveremos como usar servicios de terceros, ya sea para analizar el código a nivel de seguridad, para validar la calidad del código, etc.

```yaml
stages:
  - stage: CodeValidation
    jobs:
      - job: CodeValidation
        steps:
        - task: NodeTool@0
          inputs:
            versionSpec: '15.x'
          displayName: 'Install Node.js'

        - script: |
            npm install
          displayName: 'npm install'

        - script: |
            npm run lint
          displayName: 'npm lint'

        - script: |
            npm install prettier && npx prettier . --write && npm run prettier
          displayName: 'npm prettier'

        - script: |
            CI=true npm run test
          displayName: 'npm test'

        - script: |
            npm run build
          displayName: 'npm build'
```

Acá te dejo el video de esta configuración por si tienes dudas:

{% youtube DTFuRxTkpX8 %}

<iframe allowfullscreen="" youtube-src-id="DTFuRxTkpX8" width="480" height="270" src="https://www.youtube.com/embed/DTFuRxTkpX8"></iframe>
How to make basic express api
Tags: express, javascript, api, webdev
Published: 2024-06-05 01:12:41

ExpressJS is a JavaScript framework that allows you to make advanced api for your web app

first you need to make a `my-project`folder

Then open terminal and type this code 

```
npm init -y
```
Then you need to install express, you can install express by this code

```
npm i express
```

After this code you need to replace `scripts` in your `package.json` file with this code

```
"scripts":{
  "start":"node app.js"
}
```

Then make `app.js` file
and pus this code inside your `app.js` file

```js
const express = require("express")
const app = express()

// /api route
app.get('/api',(req, res) => {
    res.send('hello world!') // this will return hello world! When you go to https://localhost:3000/api
})

// make app listen on port 3000
app.listen(3000, (req, res) => {
  console.log("app listening on https://localhost:3000")
})
```

then run 
```
npm start
```
And navigate to https://localhost/3000/api
And you'll see 'hello world!'
Text
That's it.