teleren/devto huggingface dataset:
Rails Performance Monitoring w/ Prometheus
Published: 2023-12-12 03:18:19

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

## gem yabeda-prometheus

* [yabeda-rb](https://github.com/yabeda-rb/yabeda) - Extendable framework for collecting and exporting metrics from your Ruby application

* [yabeda-rb blog post](https://www.dtreelabs.com/blog/rails-performance-monitoring-with-grafana-prometheus-and-influxdb) - May 2022

## Rails 7.1 Compatibility

Rails 7 excludes Webrick which yabeda uses.  I was able to monkey-patch this to get it working.

```rb
# /config/initializers/yabeda_prometheus.rb

module Yabeda
  module Prometheus
    class Exporter
      class << self
        def start_metrics_server!(**rack_app_options)
          Thread.new do
            default_port = ENV.fetch("PORT", 9394)
            app = rack_app(**rack_app_options)
            server = Puma::Server.new(app)
            server.add_tcp_listener(ENV["PROMETHEUS_EXPORTER_BIND"] || "0.0.0.0", ENV.fetch("PROMETHEUS_EXPORTER_PORT", default_port))
            server.run
          end
        end
      end
    end
  end
end

Yabeda::Prometheus::Exporter.start_metrics_server!
```

## Alternative work around

Found this gist for running prometheus exporter as stand-alone process.  Might give this a try instead especially if I got with a multi-process instead of multi-thread env.

* https://gist.github.com/Envek/96f297c1dfbac8ae5afa7e4abff78f0b - Running prometheus exporter as stand-alone process.

```rb
# Example of how to launch separate process to export all metrics from Ruby processes on the same host/container.

# IMPORTANT:
# You MUST configure Direct File store in official Prometheus Ruby client for this to work.
# See https://github.com/yabeda-rb/yabeda-prometheus#multi-process-server-support

# Example of configuration that should be made for additional process to export all metrics
# Here: export Sidekiq metrics from not worker process. See https://github.com/yabeda-rb/yabeda-sidekiq#configuration
ENV["YABEDA_SIDEKIQ_COLLECT_CLUSTER_METRICS"] = 'true'
ENV["YABEDA_SIDEKIQ_DECLARE_PROCESS_METRICS"] = 'true'

# Boot Rails application
APP_PATH = File.expand_path('../config/application', __dir__)
require_relative '../config/boot'
require_relative '../config/environment'

# Run exporter
default_port = ENV.fetch('PORT', 9394)
::Rack::Handler::WEBrick.run(
  Yabeda::Prometheus::Exporter.rack_app,
  Host: ENV['PROMETHEUS_EXPORTER_BIND'] || '0.0.0.0',
  Port: ENV.fetch('PROMETHEUS_EXPORTER_PORT', default_port),
  AccessLog: []
)
```
Por que utilizar um elemento form quando submit campos com JavaScript?
Tags: javascript, programming, portugues
Published: 2023-12-12 02:47:56

_**Nota:** apenas traduzi o texto abaixo e postei aqui._


Uma pergunta que muitas vezes aparece para nós é a seguinte:

Se estivermos "preventing" o comportamento default de `form submission` e tratando-o manualmente (por exemplo, com a Fetch API), há mais algum motivo para usar a tag `<form>`? (exceto o `form submission` com tecla `enter`/`return`...)

Quando comecei minha jornada para o desenvolvimento web, tive a mesma pergunta.

_**Observação rápida**_: adoro quando as pessoas fazem perguntas que você acha que são óbvias para todos os outros. Freqüentemente, há outras pessoas que estão se perguntando a mesma coisa, mas têm medo de perguntar.

Existem dois motivos pelos quais você ainda deve usar um elemento form:

- Isso torna sua vida mais fácil.
- Semântica (e a acessibilidade que daí resulta).

## Usar um elemento form torna a vida mais fácil

Considere um grupo de campos sem um elemento form.

```html
<label for="username">Nome do usuário</label>
<input type="text" id="username">

<label for="password">Senha</label>
<input type="password" id="password">

<button id="signin">Logar</button>
```

Você pode "listen" os cliques no `#signin button`.

Mas essa não é a única maneira de alguém submit um form. Eles poderiam realizar "focus" no button e apertar a barra de espaço. Eles poderiam pressionar a tecla `Enter` em qualquer campo do form.

Agora você está analisando pelo menos três event listeners diferentes para "listen" adequadamente as form submissions.

### Um event listener para governar todos eles

Em vez disso, vamos agrupar os campos em um form element com o ID #signin.

```html
<form id="signin">
    <label for="username">Nome do usuário</label>
    <input type="text" id="username">

    <label for="password">Senha</label>
    <input type="password" id="password">

    <button id="signin">Logar</button>
</form>
```

Com esta configuração, você pode attach um submit event ao `#signin form`, e ele será disparado em qualquer uma dessas situações.

Quer os usuários cliquem no button, usem a barra de espaço para pressioná-lo ou pressionem a tecla Enter em um dos campos, um único `event listener` capturará o comportamento do usuário para que você possa conectá-lo e executar seu JavaScript.

## Semântica e acessibilidade

A segunda razão é a semântica.

Se algo for um formulário, use um elemento form. Isso ajuda dispositivos assistivos, como screen readers, a compreender melhor o conteúdo da página e fornecer à pessoa que os utiliza informações mais significativas.

Realmente não há muito mais a dizer aqui. Se algo for um formulário, use o elemento form.

## Fonte

Newsletter de [Go Make Things](https://gomakethings.com/)
Hello World in Assembly (x86-64)
Tags: assembly, tutorial, linux
Published: 2023-12-12 02:34:43

## Introduction

Welcome to Assembly x86_64! If you're here, you probably fall in to one of these categories: being forced to learn this for school/a job, or being genuinely interested in learning this. Or maybe you just stumbled across this and you thought "Why not? It can't be that hard." 

Well, it is that hard. I'll give you the code, and then explain it after. 


### The Code
```x86asm
section      .data                     ; this is where variables are initialized
    msg      db   "Hello, World!", 0xa ; 0xa is a newline
    msglen   equ  $ - msg

section      .text                     ; this is the code section
    global   _start                    ; declare entry point
_start:                                ; define entry point
    mov rax, 1                         ; sys_write(
    mov rdi, 1                         ;   STDOUT_FILENO,
    mov rsi, msg                       ;   msg,
    mov rdx, msglen                    ;   sizeof(msg)
    syscall                            ; );

    ; exit
    mov rax, 60                        ; exit
    mov rdi, 0                         ;   exit_status
    syscall                            ; );
```

I'm hoping you're still here. Although probably not :grin:. 

Anyway, here's the line-by-line:
1. This is the section where variables are declared
2. Declare the `msg` variable to the size `data byte`, or 8 bits. `;` starts a comment. 
3. Set the `msglen` variable to a `sizeof(msg)`
4. This is the code section.
5. This line declares the entry point, called `_start`
6. This line starts the definition of the `_start` function
7. `rax` is the system call id. So exit is 60, stdout is 1, 2 is stderr, etc.
8. This line sets the file descriptor (fd) to 1, which is stdout.
9. "Invoke" the message
10. "Invoke the message length
11. `syscall` means "execute the stuff that I just made."
12. Set `rax` to 60, which is `sys_exit`
13. This line is the exit status
14. Call the code. 

I'm still learning though, so if I'm wrong, please correct me. 

By the way, it's a fantastic idea to align Assembly code to maintain the nearly non-existent readability. Please also use comments (I didn't because I described it afterword). 

There are plenty of great books and videos on how to learn Assembly. If you still want to learn it, find one! I recommend [this YouTube playlist](https://www.youtube.com/watch?v=BWRR3Hecjao&list=PLetF-YjXm-sCH6FrTz4AQhfH6INDQvQSn&index=1).

(Also, if you know how to add syntax highlighting for this code block, please tell me in the comments :slightly_smiling_face:)
A New Look for git.rela.dev
Tags: webdev, programming, git, design
Published: 2023-12-12 02:15:26

> Brought over from [the Rela blog](https://rela.dev/blog/new-look-git-rela-dev).

As of this week, [the RelaGit site](https://git.rela.dev) has been overhauled with a totally new appearance.
The old style of the site was a bit too homogeneous, and it was decided that it lacked some of the elegance and confident design that was wanted to convey.

As you can see [in this old deployment](https://git-rela-dpsmegyab-tcm-collaborate.vercel.app/), the old landing page lacked both the brand identity and confidence. But let's break down the hero section:

- *The Navigation Bar:* There's only one way to phrase it, weak. It lacks a strong gap between items and therefore feels cramped, it is also always at full white, which makes interactions feel uninteresting and not considered. In the new design, the bar sits back from the screen, taking more space but feeling less intrusive because of the dimmed colors and the more considered spacing.

- *The Hero Text:* Sites that have their product name as their hero text don't convert well. The too-dim subtitle also didn't help, it looked like an afterthought. In the new design, the hero text is a description of the client, and the subtitle is baked into the hero. I've also scrapped the call to action button in favour of a linear design, with intuitive call to actions later down in the page.

- *The Image:* The one thing that remained mostly the same is the image, it's still a simple photo of the client, although I've updated the diff that is shown in the screen to give a more complete view of the client's look.

---

Along with the obvious changes, I also replaced the disabled download button with a waitlist signup field. By entering your email, you will be added to the waitlist for the client, and you will be notified when it is ready for beta testing.

## Continued Development of the client

Don't worry, this hasn't stopped development on the client, this month alone has seen the below changes:

- There's now an integrated branch picker, which dynamically responds to any changes made remotely or locally and simplifies the many commands that can be used to interact with branches.

- Logical a11y flow has been improved throughout the app, with the simplification of settings, auto-focusing of dynamic elements, and the integration of more focus traps.

- The app now has a proper onboarding process, with a beautiful first-open screen, and a multi-step, hands-on tutorial that guides you through the app's most common features.

![The new branch picker, with a branch being created.](https://rela.dev/uploads/4.png)

---

That's all for now, check out the [new site](https://git.rela.dev) today, and sign up for the waitlist!

Au revoir! 👋
Glassix - One inbox, countless smiles
Tags: chatbots, whatsapp, multichannel, ai
Published: 2023-12-12 02:08:27

Glassix is a sophisticated AI-powered unified messaging platform designed to streamline customer conversations across all digital channels – including instant messaging apps, SMS, email, live chat, and social media. 

Since its launch in 2015, Glassix has been committed to revolutionizing the customer experience for a new era of business leaders, now serving thousands of clients through an expanding range of digital messaging channels. 

As a secure and comprehensive platform, Glassix offers a rich suite of features available through a subscription model. It includes intuitive, visual chatbot tools that are easy to use, requiring minimal to no coding skills. Clients can quickly deploy advanced conversational AI powered by GPT-4 for immediate impact or utilize the Glassix API for more tailored experiences. 

Collaborating with a global network of integration partners, Glassix caters to a diverse clientele, ranging from well-established brands and rapidly expanding companies to small businesses.

[https://www.glassix.com](https://www.glassix.com)
Function Scope in JS
Tags: javascript
Published: 2023-12-12 02:05:01

Functions in Javascript run in the scope they are defined, not in the scope they are executed.

```
var baz;
(function() {
  baz = function() {
    return foo * bar;
  };
  var foo = 20;
  var bar = 2;
})();

console.error(baz());

//output: 40
```
I will be posting tricks I have been using in my journey.

So follow me on [LinkedIn](https://www.linkedin.com/mynetwork/discovery-see-all/?usecase=PEOPLE_FOLLOWS&followMember=mohdahshandanish).
Crypto Recovery Expert with Daniel meuli web Recivery
Published: 2023-12-12 01:20:41

Hackers have become interested in Bitcoin, the virtual currency that has taken the world by storm, in addition to investors and computer aficionados. Cybercriminals seeking to take advantage of weaknesses in the digital sphere find it an appealing target due to its decentralized structure and enormous financial gain potential. With Bitcoin's value and popularity rising, there is a greater risk of theft than ever before. A growing number of people have been left saddened and financially crippled by Bitcoin theft instances in recent years. In order to steal Bitcoins, hackers use sophisticated methods to get unauthorized access to digital wallets, online exchanges, and even individual computers. Due to the decentralized and irreversible nature of Bitcoin transactions, victims have few options for tracking down and recovering stolen money. Daniel Meuli Web Recovery is one group that distinguishes out from the others in this dangerous environment and gives victims of Bitcoin theft a glimpse of hope. Daniel Meuli Web Recovery has established a reputation for being an expert in navigating the complicated world of cryptocurrency theft, since they are the only team that is still in operation and committed to helping people recover access to their stolen Bitcoin. Daniel Meuli Web Recovery's distinct methodology and unwavering dedication to their clientele distinguish them from other recovery services. They are aware of how difficult and depressing it may be to deal with the fallout from a Bitcoin theft. For this reason, they work hard to give their clients a kind and understanding atmosphere during their recuperation, in addition to first-rate technical solutions. I have worked with Daniel Meuli web recovery and I can say for sure that they are legitimate. Get in touch with these expert via email:   
Danielmeuliweberecovery (AT) email.com Or vist Website   
                                                     https: // danielmeulirecovery.pro/
Telegram  At Danielmeuli 

Regards.
SFTP vs FTPS
Tags: programming
Published: 2023-12-12 01:14:46

Recently, I have finished working on an SFTP file transfer implementation. While learning and exploring both SFTP and FTPS protocols,I discovered that we often get confused between SFTP and FTPS.

FTP and SFTP enable secure file access, but they differ in certain ways. 

SFTP is secure, fully encrypted, and securely integrated with firewalls.

FTPS, on the other hand, add a layer of encryption using SSL or TLS. It offers faster file transfer compared to SFTP.

I will be posting tricks I have been using in my journey.

So follow me on [LinkedIn](https://www.linkedin.com/mynetwork/discovery-see-all/?usecase=PEOPLE_FOLLOWS&followMember=mohdahshandanish).
React developer portfolio template use framer motion to animate components
Tags: portfoliopage, framermotion
Published: 2023-12-27 18:24:15

---
title: React developer portfolio template use framer motion to animate components
published: true
date: 2023-12-12 00:41:00 UTC
tags: PortfolioPage,FramerMotion
canonical_url: https://reactjsexample.com/react-developer-portfolio-template-use-framer-motion-to-animate-components/
---

# My Developer Portfolio
 ![React developer portfolio template use framer motion to animate components](https://reactjsexample.com/content/images/2023/12/Code_2023-12_20-36-23.jpg)

[Demo](https://rtharusha.netlify.app/)

Welcome to my personal developer portfolio! This project serves as a showcase for my skills, projects, and experiences.

## Features

- **Responsive Design:** The portfolio is designed to provide a seamless experience across various devices.

- **Project Showcase:** Highlighting some of my notable projects with project descriptions and live/demo links.

- **Contact Form:** A contact form for easy communication.

- 
# Usage

## 1. Clone the Repository

```
git clone https://github.com/randilt/react-dev-portfolio.git
```

## 2. Navigate to the Project

```
cd react-dev-portfolio
```

## 3. Install Dependencies

```
npm install
```

## 4. Start development server

```
npm run dev
```

The portfolio will be available at [http://localhost:5173/](http://localhost:5173/) by default.

## 5. Customize

- Edit the content inside the src/content folder.
- I have divided the content into seperate files to make it easier as information.js (include data about user), projects.js(includes data about user’s projects), skills.js (includes data about user’s skills), socials.js(includes social links of user)

### If you’ve found my project useful for your personal developer portfolio, I’d really appreciate it if you could include a link back to the project. It helps showcase the work and contributes to the community. Thanks a bunch!

## GitHub

[View Github](https://github.com/randilt/react-dev-portfolio?ref=reactjsexample.com)
Indent the output of 𝐉𝐒𝐎𝐍.𝐬𝐭𝐫𝐢𝐧𝐠𝐢𝐟𝐲
Tags: javascript
Published: 2023-12-12 00:36:01

While working with the Oracle Field Service plugin in Javascript, I have observed that many developers use 𝐜𝐨𝐧𝐬𝐨𝐥𝐞.𝐥𝐨𝐠(𝐉𝐒𝐎𝐍.𝐬𝐭𝐫𝐢𝐧𝐠𝐢𝐟𝐲()) and struggle with the structure of objects on the console. The 𝐉𝐒𝐎𝐍.𝐬𝐭𝐫𝐢𝐧𝐠𝐢𝐟𝐲() method provides an option to properly indent the output on the console for debugging, which can be very helpful for understanding the structure of the objects.


```
// JSON.stringify 
const person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
console.log(JSON.stringify(person));
/*
output
  {"firstName":"John","lastName":"Doe","age":50,"eyeColor":"blue"}
*/

// Indent the output with one space
console.log(JSON.stringify(person,null,"\t"));
/*
output
  {
	"firstName": "John",
	"lastName": "Doe",
	"age": 50,
	"eyeColor": "blue"
}
*/
```

I will be posting tricks I have been using in my journey.

So follow me on [LinkedIn](https://www.linkedin.com/mynetwork/discovery-see-all/?usecase=PEOPLE_FOLLOWS&followMember=mohdahshandanish).
Work Focus Techniques: Strategies for a More Productive Day?
Tags: discuss, codenewbie, beginner
Published: 2023-12-12 00:00:00

---
published_at : 2023-12-12 00:00 +0000
---
Focusing on work is a common challenge. What techniques could individuals try to enhance their focus, and how might implementing these strategies positively impact their work?
<br>
Follow the CodeNewbie Org and #codenewbie for more discussions and online camaraderie!
{% embed https://dev.to/codenewbieteam %}
Brainstory for Law Students
Published: 2023-12-11 22:58:23

---
title: Brainstory for Law Students
published: true
date: 2023-12-12 00:00:00 UTC
tags: 
canonical_url: https://blog.brainstory.ai/law-students/
---

Brainstory’s open-ended speaking interface gives you the best practice for hypos (hypotheticals). Share your results with your classmates to easily compare arguments!

## Here’s how you can get started

1. Make a free Brainstory account

You get 10 hypos for free.

1. Read your hypo out loud to Brainstory

This will give Brainstory context on the situation, and allow you to reference different facts of the situation.

1. Start thinking out loud

Don’t worry if you ramble— this isn’t a cold call! As you’re thinking, Brainstory will encourage you with open-ended questions. It won’t _give_ anything away.

1. Share your Brainstory with classmates

When you share your hypo with classmates, they’ll be able to give you feedback. Maybe they have a counterargument you missed, or a completely different angle to add! Share to find out.
GIT RESET
Tags: git, github, webdev, programming
Published: 2023-12-11 23:57:59



## Usecase

My most common usecase for git reset is when i stage changes by mistake. Maybe i make some changes that involve multiple things and i want to divide them into seperate commits. 

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

If you add them, git tells you this

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


```
use "git restore --staged <file>..." to unstage
```

since you know `.` denotes the whole directory, you try `git restore --staged .` and it unstages the changes. Here comes `reset` with its shorter syntax, just `git reset` and voila your changes are gone. 

## Usage

`git reset` is mainly used to undo commits.
`git reset <commit hash>` and it will delete all commits up until that commit and most importantly KEEP THE CHANGES or to be most specific move the changes to the working directory.

That's why git reset without providing a commit, moves changes from the staging area to the working directory 

`git reset --hard` deletes the changes so if you run this command bare it will delete the working directory and the staging area GONE but UNTRACKED FILES ARE NOT AFFECTED. 

This behavior for untracked files is the same with any git reset command, it's not specific to the `hard` option.

`git reset --hard <commit hash>` will delete changes up to that commit.
Chiselled Ubuntu containers GA
Tags: docker, containers
Published: 2023-12-11 23:52:04

Smaller [Ubuntu container images][chiselled]. But I think it still low level tools for building such images, unlike [distroless] where you can use it right away.

[distroless]:https://github.com/GoogleContainerTools/distroless
[chiselled]:https://canonical.com/blog/chiselled-ubuntu-ga
Crypto Recovery Expert with Daniel meuli web Recivery
Published: 2023-12-11 23:46:52

Hackers have become interested in Bitcoin, the virtual currency that has taken the world by storm, in addition to investors and computer aficionados. Cybercriminals seeking to take advantage of weaknesses in the digital sphere find it an appealing target due to its decentralized structure and enormous financial gain potential. With Bitcoin's value and popularity rising, there is a greater risk of theft than ever before. A growing number of people have been left saddened and financially crippled by Bitcoin theft instances in recent years. In order to steal Bitcoins, hackers use sophisticated methods to get unauthorized access to digital wallets, online exchanges, and even individual computers. Due to the decentralized and irreversible nature of Bitcoin transactions, victims have few options for tracking down and recovering stolen money. Daniel Meuli Web Recovery is one group that distinguishes out from the others in this dangerous environment and gives victims of Bitcoin theft a glimpse of hope. Daniel Meuli Web Recovery has established a reputation for being an expert in navigating the complicated world of cryptocurrency theft, since they are the only team that is still in operation and committed to helping people recover access to their stolen Bitcoin. Daniel Meuli Web Recovery's distinct methodology and unwavering dedication to their clientele distinguish them from other recovery services. They are aware of how difficult and depressing it may be to deal with the fallout from a Bitcoin theft. For this reason, they work hard to give their clients a kind and understanding atmosphere during their recuperation, in addition to first-rate technical solutions. I have worked with Daniel Meuli web recovery and I can say for sure that they are legitimate. Get in touch with these expert via email:   
Danielmeuliweberecovery (AT) email.com Or vist Website   
                                                     https: // danielmeulirecovery.pro/
Telegram  At Danielmeuli 

Regards.