teleren/devto huggingface dataset:
Integer to void* conversion
Published: 2022-04-10 15:36:41

I came across this intriguing OpenGL code snippet 

```
glVertexAttribPointer(colorAttrib,              
                      1,                        
                      GL_FLOAT,                 
                      GL_FALSE,                 
                      3*sizeof(float),          
                      (void*)(2*sizeof(float)) // FTW?!
                      );
```

glVertexAttribPointer's signature says the last argument is of type `void*`. This argument is supposed to tell OpenGL what the offset is into a vertex buffer array data. 

This looked surely wrong to me--how the hell can you cast an integral type to a pointer and use that pointer meaningfully? To demonstrate that this doesn't compute, I wrote a simple program like so:

```
#include <iostream>
using namespace std;


void fooFunc(void* ptr) {
    int* intptr = reinterpret_cast<int*>(ptr);
    cout << *intptr << endl; // **Crashes here as expected**
}


int main() {
    fooFunc((void*)(12*3));
    return 0;
}
```

Sure enough, it crashes when it tries to de-reference the  int pointer because the void* that the int* is converted from is pointing to garbage memory.

While it was clear that it was garbage memory, it wasn't immediately clear to me how the value of that pointer could be used. Understanding that was the key to unlocking how this awkward OpenGL API was working.

In `fooFunc`, `ptr`'s value was 0x24. Clearly, garbage memory. But, it's also the result of the integer expression 12*3 from which the pointer was created in the calling code! Now, how can this be useful for anyone?!

Consider this new version of `fooFunc`

```
void fooFunc(void* ptr) {
    size_t intval = reinterpret_cast<size_t>(ptr);
    cout << intval << endl; // ** prints 36 **
}
```

Now, we have managed to make something out of the dangling void pointer! We have managed to get the integral value that the caller wanted to pass to this function without passing an integral value, instead the caller passed a pointer!

Now, why can't glVertexAttribPointer simply use an integer parameter type and save us the trouble of staring hard at this mysterious looking code? The answer, like it most often is in cases like this is--legacy. Apparently, there was time when OpenGL would allow glVertexAttribPointer()'s last parameter to be used to specify a pointer to the vertex data array in the CPU memory. Post VBOs, we transfer the vertex data to the GPU via glBufferData() call and don't need to pass it via glVertexAttribPointer() call. The Khronos group decided to make this API backward compatible and decided to overload the last parameter to allow the user to set an offset into vertex buffer array data. So, we ended up with this awkward **(void*)(2*sizeof(float)** cast from integer to pointer.

References:
https://stackoverflow.com/questions/28063307/in-opengl-why-does-glvertexattribpointer-require-the-pointer-argument-to-be-p
https://stackoverflow.com/questions/58679610/how-to-cast-an-integer-to-a-void-without-violating-c-core-guidelines
Day 2: I didn't quit (yay!)
Tags: productivity, beginners, journaling
Published: 2022-04-10 15:22:24

Hi, or Hi again!
so I almost quit today. but fortunately I didn't. here's what happened... 
So yesterday I decided I would be writing my daily random articles early in the morning as it recommended in several motivation videos that you should start your day productively. but as always (especially weekends) I woke up feeling too lazy to do anything and one thing led to another and it was already 4PM and I was still finding excuses against sitting down and just typing something. 
I realized as good as the result will be I will not be able to make it even to 1 week consistently so I decided I was going to do what I always do => QUIT
I logged in just to make yesterday article private so no one will know how I started a challenge and failed the next day. and forgot all of this as if nothing happened and that's when I found that yesterday article had got 80+ views and 6 comments which is viral to me I don't even know how a first post can be seen by that many people
mainly I started this thinking there will be no one viewing any post but I really appreciate everyone that took their time to view or comment on yesterday post you really saved and motivated me to take it so seriously from now on 

to someone out there struggling at any challenge I know  for a fact that _consistency is the key_ but it's easier said than done 

signing off.....
About roles in the front-end development department
Tags: webdev, beginners, css, javascript
Published: 2022-04-10 15:15:32

Three years ago, Chris Coyier wrote about [The Great Divide](https://css-tricks.com/the-great-divide/). This article stuck with me for a long time since I always considered CSS my strongest skill. Then, last year Brad Frost wrote about [front-of-the-front-end and back-of-the-front-end web development](https://bradfrost.com/blog/post/front-of-the-front-end-and-back-of-the-front-end-web-development/). This article also stuck with me, primarily because of the following definition: “A front-of-the-front-end developer is a web developer who specializes in writing HTML, CSS, and presentational JavaScript code.” That’s what I do.

I recently figured that I would call myself a **website developer**, emphasizing the **website** part heavily. It is because all other terms are somewhat vague.

Take CSS developers as an example. Does a CSS developer need to know presentational JavaScript?

Take JavaScript engineers as an example. Does a JavaScript engineer need to know accessibility basics?

Take UX engineers as an example. Does a UX engineer need to know SEO basics?

Take web developer, full-stack, and front-end developer positions. You couldn’t possibly tell what these positions imply. These terms are just too broad, and they assume too many things.

So, I’ll call myself a website developer from now on. That means I know SEO, accessibility, DNS basics, HTML, CSS,  presentational JavaScript, the Open Graph Protocol, etc. I just build websites. I don’t know how to make web apps, and I don’t use any JavaScript frameworks anymore.

For me, it doesn’t matter which technology is in the background. I know my way around WordPress, Hugo, Jekyll, Eleventy, Hexo, Shopify, HubSpot, and whatever, but that doesn’t matter. What matters is that the final code should be the same. It should have functional code that could be processed by users, browsers, screenreaders, crawlers, and who knows what else. As a website developer, all I care about is that my sites are performant, optimized, and easily consumed.

Although I am not looking for a new position, I like to browse available jobs and read the requirements. Some companies do a great job explaining the role in detail. On the other hand, some companies don’t even state which team is hiring. For example, a front-end developer part of a product team has an entirely different job than one part of the marketing team.

I guess what I am trying to say is that we live in 2022, and we still don’t have a system for making distinctions between these roles. No wonder we have so many bad sites, no wonder it is hard to find a good developer, no wonder we have developers arguing over the usage of frameworks, be it CSS or JavaScript ones, and no wonder wrong persons do wrong jobs.

I hope this is just my point of view and that the reality is better. But unfortunately, I somehow feel like it is the other way around and that the reality is actually worse.
Deepgram x DEV Hackathon Submission x Deepgram-translator
Tags: hackwithdg
Published: 2022-04-10 15:12:14


<!-- [Instructions]: # (To submit to the Deepgram Hackathon on DEV, please select the template that corresponds with the challenge you are submitting to and delete the content for the other submission type. You are encouraged to submit as many times as you would like, but please create a separate submission template for each project.) -->

<!-- ✨Pro Tip: You can link all of your submissions together by adding `series: {your series name here}` to each post in the header section – right between “tags” and “description. ✨ -->

— 

<!-- [Template 1: Build Challenge]: # (Select this submission template if you have built an application using Deepgram for this hackathon.) -->


### Overview of My Submission
Deepgram-translator is a tool for converting a speech (which is then converted to text by Deepgram API) to specified language. Users have a choice to choose any language in which they want to convert their message.

**Working**

* Used react to create this app.
* Added allow microphone functionality.
* Passed the input speech to Deepgram API to get the required text.
* Then took the result obtained and passed it thorugh libretranslate api to get the translated text.


### Submission Category: 

Accessibility Advocates


### Link to Code on GitHub

{% github https://github.com/anshnarula5/deepgram-translator %}


Live Project : https://deepgram-translator.vercel.app/

### Additional Resources / Info

*Screenshots*

![Demo](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3lx9r0lp9gcpdv45ole8.jpg)
![Demo](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xl3odtrspd3t93ubqlqb.jpg)

*Demo Video* : https://drive.google.com/drive/folders/1T696e1MeVjpNtpUceVIU5NaefP0chHZO?usp=sharing



### Future Updates 

* Improve UI of the app.
* Add more features including speech-to-text API.

  
    
—
Boost your app accessibility with AI Speech Recognition (Deepgram)!
Tags: hackwithdg, react, showdev, javascript
Published: 2022-04-10 15:05:05

### Overview of My Submission

The goal is to provide extra way to input value. It could be really helpful for people with disabilities, anyone that have problems with typing on a keyboard. You can fill any input using pointer and voice! Cool!

### Submission Category: 

Accessibility


### Link to Code on GitHub

{% github  https://github.com/pavelee/react-deepgram-example %}

### Additional Resources / Info

I am using react as a frontend app.

**It's important to remember that react frontend app is not necessary. You can integrate proxy with any other type of app. It's just REST API!**

The process is pretty simple.

- Display Deepgram component
- Ask permission to microphone (browser)
- Record your voice
- Sending audio to proxy
- Proxy ask Deepgram for transcription
- Proxy responses with transcription, error or warring about no transcription (eg. user need to repeat louder)
- User receives transcription and apply to input

![process gif](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x6n5skgl52tetmn2vta4.gif)

#### Proxy from technical aspect.

It's node.js + express.js to handle API requests and communicate with Deepgram (using Deepgram SDK)

```
// endpoint to upload and transcript
app.post("/audiotranscript", upload.single("file"), async (req, res) => {
    let filepath = req.file.path
    let language = req.body.language;
    let transcript = await deepgramTranscript(deepgramApiKey, filepath, language);
    res.send({ transcript: transcript });
});
```

#### Fronted from technical aspect. 

It's simple handler you pass proxy url and setter for your value.

I prepared two visualizations of usage. I am using antd design as component library.

Using wrapper that creates popover to any React component.

```
<DeepgramHandlerPopover
    setValue={setNotepadValue}
    proxyUploadUrl={proxyUploadUrl}
>
    <Input.TextArea
        rows={20}
        value={value}
        onChange={(ev) => {
            setValue(ev.target.value);
        }}
    />
</DeepgramHandlerPopover>
```

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

Using modal (small devices friendly)

```
<DeepgramHandlerModalButton
    setValue={setNotepadValue}
    proxyUploadUrl={proxyUploadUrl}
    buttonProps={{
        type: "primary",
    }}
/>
```

![modal](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/637ric30p4xn1a7s4udl.png)

If you have other idea you can easy just wrap handler:

```
<MyCoolComponent>
    <DeepgramHandler
        setValue={setValue}
        proxyUploadUrl={proxyUploadUrl}
    />
</MyCoolComponent>
```

#### Final thoughts 

I really appreciate what Deepgram has created. It is really well working, even with my unclear English. Amazing how tech industry improving our lives! <3
Published my first notion template as a product on Gumroad
Tags: productivity, product
Published: 2022-04-10 14:58:59

[Link](https://shreyashpingle23.gumroad.com/l/ntnhp?_gl=1*136veum*_ga*MTQxMTMyMzM4MC4xNjQ5MjU5NDM5*_ga_6LJN6D94N6*MTY0OTYwMTUwOC40LjEuMTY0OTYwMjg1OS4w)
I published my first template as a product on Gumroad. Go check it out it just costs 1$....
Gruvbox, o melhor tema que eu já usei
Tags: braziliandevs, womenintech, trans
Published: 2022-04-10 14:51:11

## A importância de um tema confortável

Antes de tudo, precisamos entender a importância de um tema confortável.

Passamos diversas horas por dia em frente aos nossos monitores, em editores de texto, *IDE's*, terminais,etc. Por conta disso, precisamos fazer melhores escolhas em relação ás fontes que usamos no nosso dia a dia (tenho um artigo sobre [fontes para pessoas desenvolvedoras](https://dev.to/feministech/fontes-para-pessoas-desenvolvedoras-1404)), e também em relação aos nossos temas. Por isso, nesse artigo, vou falar sobre o meu tema favorito, o [Gruvbox](https://github.com/morhetz/gruvbox)

## O quê é o Gruvbox?

Gruvbox é um tema para diversas plataformas, tendo uma paleta de cores mais "retrô", com um fundo cinza escuro, com uma fonte branca levemente amarelada.

![Print do Gruvbox escuro](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/57ofyxh9g8q15qsc3bqm.png)

Gruvbox também tem uma versão clara, tendo um fundo cinza claro com um texto preto levemente verde.


![Print do Gruvbox claro](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/l5yh1yiv57y02nbic8mp.png)

## Benefícios do Gruvbox

Essa paleta de cores mais pedente ao verde, amarelo, laranja,etc. é muito melhor para a nossa visão do quê paletas com cores mais contrastantes, pois são cores mais agradáveis para estarmos em contato por várias horas seguidas. Aumentando o tempo que podemos passar em frente dessas telas de maneira confortável.

Além disso Gruvbox está disponível na maior parte dos editores, terminais, e até mesmo navegadores. Então você vai conseguir usar esse como o tema da maior parte das suas aplicações.

## Finalização

Nesse pequeno artigo te mostrei o melhor tema que eu já utilizei, o [Gruvbox](https>//github.com/morhetz/gruvbox)!

Muito obrigada por ler ❤️🏳️‍⚧️ e me segue nas redes, é tudo [@lissatransborda](https://twitter.com/lissatransborda) 👀
What does your job bring you?
Published: 2022-04-10 14:50:31

##### *What does your job bring you?*

You work hard, keep your LinkedIn updated, learn new skills and follow the trends.

Only for a better job and higher salary?
Yes. That might be. But is that all?

I've always wanted to work abroad, but I have only started learning English recently. So, these days, I've been focusing on learning English more than advancing my career. As you know, learning another language takes a lot of time and effort, and with my current situation, it takes too much energy to work on both my career and a new learning. This is why I've decided to concentrate on improving my English until I am comfortable with the language.

I had the following thoughts and worries.

* I will have to put together my resume when I search for a job abroad, but what will I write on my resume if I don't study hard for my career? Currently, I have two years of experience, but do I have enough skills at the moment?

* As a front-end engineer or a web developer, I think I need to have diverse knowledge about front-end, back-end, DevOps, browsers' characteristics, trendy libraries, frameworks, etc. Of course, you don't need to be a professional in all fields; but, do I have necessary skills in individual field?

* The web environment is rapidly changing. New things are coming out every day. Will I be able to keep myself updated with the change? 

Some of these thoughts were constantly there before making my decision.

Career wise, in the past I was jogging, but now, as I focused on English, I've decided to walk. I've decided this knowing there are people who are running and that there are even those who are walking as fast as I can run. 

Whenever the worries listed above come to my mind, I feel depressed.

Then somehow, the question : **What does my job bring me?** came up

Why did I start this job?
I started this job because I liked coding.
I could do anything I want with my computer within my knowledge.

I code at work now.

I like it, I make money with it.

Isn't it too good to be true???

What an ideal world.

Why do I have to get depressed with those worries?

Why? 

Do I have to become the best developer?

Is that what I want?

I thought listing my ultimate goals would be helpful to answer those questions.

##### My Ultimate Goals

- Work abroad
- Live in other countries
- Share programming knowledge
- Read and Listen to anything I want in English
- Interact with other developers around the world

Then I asked myself.

- If I can become fluent in English, is it okay to hold on to my career while I learn English? - Yes.
- If I get to know that I'm not as good as other developers, would it prevent me from enjoying my job? - No.

Now my worries have gone and I manage to concentrate on my goals in my own way.

**Why did you start your job?**

**What does your job bring you?**

**What are your ultimate goals?**
Langkah Budidaya Bunga Baby’s Breath
Published: 2022-04-10 14:49:06

**Langkah Budidaya Bunga Baby’s Breath**


**1.Siapkan Benih Bunga Baby Breath**
Ciri-ciri – ciri-ciri benih bunga baby breath yang bagus dan berkualitas :

Pilih toko bunga yang sudah tentu dan jual beragam tipe benih bunga yang berkualitas.
Kemudian periksalah lebih dulu paket benih bunga baby breath, yakinkan benih terbungkus rapi pada kondisi kering dan tidak lembab.
Yakinkan jika benih mempunyai ukuran yang serupa.
Untuk menunjukkan kualitas dan kelaikan tanam, anda dapat memendamnya lebih dulu ke sebuah tempat.
Lihatlah, bila ada benih yang mengapung maknanya benih itu tidak pantas tanam.
Pilih benih yang terbenam untuk selanjutnya ditanamkan.

2.Persiapan Media Tanam Bunga Baby Breath
Bila anda menanam di tanah langsung karena itu yakinkan tanah sebagai tanah yang bagus dengan struktur yang gembur.
Dan membersihkan lebih dulu tempat sekitaran dari bebatuan dan rumput liar yang bisa menghalangi perkembangan dan kesuburan bungan nanti.
Ukurlah pH tanah, tanah yang bagus untuk menanam bunga hias ialah tanah yang tidak begitu asam dengan pH sekitaran 6 sampai di atas 7.
Jika pH tanah terlampau asam, karena itu anda dapat lakukan proses pekapuran lebih dulu dengan dolmit sambil lakukan pemupukan.
Gemburkan dan tambah pupuk kandang ke tanah dengan perbedaan 2 : 1.
Lalu bikinlah lubang tanam , tetapi jika ingin menanamnya dalam pot, pilih pot berdiameter lebih kurang sekitaran 20cm sampai 30 cm.
Isikan pot dengan tanah kombinasi pupuk kandang dan arang sekam dengan perbedaan 2: 1: 1.
Kemudian bikinlah lubang tanam sejumlah 5cm dengan kedalaman 5cm.

[3.Penyemaian Bunga Baby Breath](https://budidayabisnis.com/cara-budidaya-bunga-babys-breath-yang-simple/)


Persiapkan polybag atau tray semai. Untuk tempat tanam, berbentuk tanah gembur digabung pupuk kandang dan sedikit sekam.
Benih ditaburkan ke media semai dan ditutup dengan tanah semai ( tanah kombinasi ).
Siram benih secara teratur sore dan pagi dengan spray.
Taruh di tempat dengan cahaya matahari bagus dan nantikan sampai benihnya tumbuh 3 sd 5 cm. Dan benih siap untuk dipindahkan.

4.Perpindahan Bunga Baby Breath
sumber : https://budidayabisnis.com/
Alihkan bibit dengan disekop dengan sekop kecil.
Tanah bawaaan busa dilepaskan dengan menggoyahkan bibit secara perlahan-lahan.
Upayakan bibit janganlah sampai cacat terhitung akarnya.
Masukan bibit dan tutup dengan tanah dari tempat tanam.
Taburi pupuk diatasnya dan tanah dipadatkan.


5.Perawatan Bunga Baby Breath
Bunga Baby's Breath
Bunga Baby’s Breath

Sesudah menanam bunga baby breath, anda harus juga lakukan perawatan supaya keelokannya selalu terbangun. Untuk menjaganya tidak terlampau susah, anda perlu lakukan penyiraman, pemupukan dan beragam hal yang lain seperti menjaga tanaman hias yang lain. Untuk memperjelasnya, berikut rinciannya :

Penyiraman harus dilaksanakan secara tepat dan teratur minimum 1 kali dalam satu hari memakai sistem spray.
Anda dapat lakukan pemupukan kelanjutan tiap dua minggu sekali sambil lakukan penyiangan dan memberi gizi tambahan tiap satu minggu sekali.
XML::Enc 0.06 Released
Tags: perl, xmlenc, xml
Published: 2022-04-10 14:46:28

XML::Enc is written to be a generic Encryption/Decryption module for XML.  While it does not currently support all of the requirements of https://www.w3.org/TR/xmlenc-core/ it supports enough to encrypt and decrypt XML documents.

The trial version of Net::SAML2 0.54 uses XML:Enc to decrypt an EncryptedAssertion.

The latest version 0.06 is a minor version that simply increased the minimum required version of Crypt::AuthEnc::GCM to 0.062.

XML::Enc supports the following data encryption methods:

1. tripledes-cbc
2. aes128-cbc
3. aes192-cbc
4. aes256-cbc
5. aes128-gcm
6. aes192-gcm
7. aes256-gcm

XML::Enc supports the following Key Transport encryption methods:

1. rsa-1_5
2. rsa-oaep-mgf1p
Python 101 - annoying UnboundLocalError
Published: 2022-04-10 14:40:03

UnboundLocalError is an error you must have encountered when you learn Python. Let us try to understand this error.

## Starting Point

This code snippet can run. Although we do not assign variable x inside inner_function(), it searches variable x from enclosed scope, which is simple_function().

```
def simple_function():
    x = 10

    def inner_function():
        return x

    return inner_function()


print(simple_function()) # 10
```

Now we try do assignment to variable x. This time we face **UnboundLocalError**. Why is that?

```
# Unable to run
def simple_function():
    x = 10

    def inner_function():
        x = x + 10
        return x

    return inner_function()


print(simple_function()) # UnboundLocalError: local variable 'x' referenced before assignment
```

When we do an assignment to a variable, this variable is treated as local variable to that scope. Python will shadow any variable in outer scope. For example, it will not care variable x in the simple_function.

When Python interprets the part `x + 10`, it tries to reference variable x, and then add value 10 to it. However, it does not know where the variable x is in local scope, i.e. the inner_function block. So Python prompts the UnboundLocalError error.

## Solution

If you want to reference variable x from the simple_function scope, you need to use the **nonlocal** keyword.

The nonlocal keyword means the variables are neither global nor **local** to the function. It instructs Python to look for the variables in outer scope, the simple_function block in our case.

```
def simple_function():
    x = 10

    def inner_function():
        nonlocal x
        x = x + 10
        return x

    return inner_function()


print(simple_function()) # 20
```