teleren/devto huggingface dataset:
Why do I want to become a software engineer?
Published: 2020-05-13 00:47:29

My journey has been anything but traditional. I have been contemplating this decision for quite some time now. But I can tell you this, my “why” is greater than any obstacle that I may face while I embark on this journey to become a Software Engineer. I would love to pursue a passion that is fueled by curiosity, innovation and creativity, all while supporting my family. This is my “why”, but how did we get here? Let’s take a journey.

I have always been intrigued by technology. Growing up in the era of the internet, we continue to advance our lives thanks to incredible innovation. During the early years of my professional career, I was blessed with an opportunity that changed my life and that’s when my journey began. Living in Austin, TX at the time, I began my career with an IT reseller called SHI. As I grew in my professional career, I wanted a more challenging experience and I was looking to add more creativity in my everyday work activities. Working for an IT reseller, I was constantly introduced to different technologies throughout my day and speaking to many IT professionals, I enjoyed speaking with the developers of the product. They had the ability to solve a problem with lines of code. What an ability to have!

A light bulb just went off in my head. How can I wield this power? How can I create something out of nothing? This thought process led to hours of research and endless YouTube videos on how to break into the industry. After speaking with many software engineers, ranging from traditional education upbringing (Computer Science majors) to self-learners, I made my decision to attend Flatiron’s online boot camp program. Talk about an exciting transition! I am excited as we start the first week of courses. I am already surrounded by so many like-minded individuals who want to create a better opportunity for themselves and their families.

I will continue to document my journey throughout my flatiron boot camp experience to encourage, motivate, and inspire others to follow their dreams and to never doubt your capabilities!
How to use Neovim or VIM Editor as an IDE for R
Tags: vim, neovim, rstats, datascience
Published: 2020-05-13 00:43:32

---
title: How to use Neovim or VIM Editor as an IDE for R
published: true
description: How to use Neovim or VIM Editor as an IDE for R
tags: VIM, Neovim, rstats, datascience
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/x2irypac754pk26bycli.png 
---

{% youtube nm45WagtV3w %}

In this tutorial, I demonstrate how to convert Neovim or VIM text editors into a fully functional IDE for R programming language. In addition to the primary plugin Nvim-R, I also show five other plugins that we can use to enhance our code editing capabilities in Neovim text editor.
AWS Amplify with Nader Dabit
Tags: webdev, javascript, beginners, podcast
Published: 2020-05-13 00:25:21


Original: https://codingcat.dev/podcast/0-10-amplify-with-nader-dabit

{% youtube https://www.youtube.com/watch?v=AieEzoPbwA4 %}

## Questions

What is AWS Amplify?

Do you see more people using AppSync vs. API Management?

We have had a hard time differentiating DynamoDB Scan/Query from what actually gets filtered through AppSync, any perspectives on how to avoid common issues with this?

Is there a way to debug using ` amplify mock function ` in VSCode with 4.18.0??

Do you recommend using Cloudfront to serve S3 images for your Amplify hosted site?

## Future

I know the video plugin is coming along, are there any other cool features coming out for Amplify that people should know about?
Oportunidades? Sim!
Tags: vagas, emprego, carreira, empreendedorismo
Published: 2020-05-13 00:23:35

O assunto do momento é a crise, a #covid19, o #coronaVírus. Frente as incertezas, pessoas estão preocupadas com carreira, emprego. Isso não está errado. Mas, o cenário acelerou processos principalmente na área de TI. Com pessoas dando aulas, cantores fazendo lives, na TV entrevistas, reportagens por vídeo conferencia. Os poderes do governo fazendo reuniões online. E todos falando do "novo normal". Toda essa estrutura foi acelerada e a tecnologia é o carro chefe de tudo isso. A aplicação do governo que distribui é um chatbot e oportunidades.

###Faça a sua oportunidade
Quando fiz Empretec que é um programa do Sebrae para empreendedores que eu recomendo que todos que tenham oportunidades façam. Sobrou vários vasilhames, minha ideia na época foi fazer suco de laranja. Ainda com aquele espirito empreendedor na veia e trabalhando na Baixou, que na epoca estava acelerada na Start You Up. Sempre que chegava para trabalhar, tinha um vendedor de água de coco na esquina, então decidi ver se ele tinha interesse. Disse que sim e pediu que eu separasse de cinco em cinco. Um dia estava chovendo e quando cheguei eu não vi ele. Em dado momento ele veio me procurar, como eu guardava no porta malas. Eu, falei com ele que pensei que ele não trabalhasse em dias de chuva. Ele me respondeu de forma que foi uma lição:

*- Em dias de chuva, sei que não vou vender tanta água de coco, por isso eu venho e vendo guarda chuva.*

Aproveite e melhore uma habilidade ou faça um projeto que está na gaveta.

"Transforme a crise em um oportunidade."*

No meio da crise a Picpay e Itaú estão contratando, assim como outras empresas.

[Link Picpay vagas](https://picpay.gupy.io/)
[Link Itaú vagas](https://trabalheconosco.vagas.com.br/itauunibanco/oportunidades)
[Link outras vagas](https://docs.google.com/spreadsheets/d/1Ga2Ov9U3T6RMguJtxyrLcwskpqqmnUJUOB4b0E1krLw/edit#gid=0)
Subscribe page html css lesson
Tags: css, html
Published: 2020-05-13 00:22:38

[Subscribe Me Demo](https://heggy231.github.io/chingu-webdev-speedrun-challenge/frontend/subscribe/)

- input type submit mean this will be a submit button
  value="Submit" will show up on the button

```html
    <form action="">
      <input type="text">
      <input type="submit" value="Submit">
    </form>
```

<p class="codepen" data-height="265" data-theme-id="dark" data-default-tab="html,result" data-user="heggy231" data-slug-hash="NWGBrqg" style="height: 265px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;" data-pen-title="html submit button">
  <span>See the Pen <a href="https://codepen.io/heggy231/pen/NWGBrqg">
  html submit button</a> by Heggyhere (<a href="https://codepen.io/heggy231">@heggy231</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://static.codepen.io/assets/embed/ei.js"></script>

- Pop the image, add 3-d effect using filter's drop-shadow

```html
img {
  filter: drop-shadow(1px 5px 3px rgb(11, 82, 11));
}

<!-- just blue outline around your image -->
img {
  filter: drop-shadow(1px 1px 1px blue);
}

```

- fit img into your container 

```html
img {
  display: block;
  margin: 0 auto;
  max-width: 100%;
}
```

- make `ul`, `li` into nav bar that is static, horizontal

```html
  <!-- Navbar section -->
  <nav class="navbar">
    <ul>
      <li><a href="http://">Gritt-ify</a></li>
      <li><a href="http://">Gritty Landing Banner</a></li>
      <li><a href="http://">Gritter</a></li>
    </ul>
  </nav>

```

```css
.navbar {
  /* stay on top page */
  position: fixed;
  top: 0;
  /* take up entire width of pg */
  width: 100%;
}

.navbar li {
  /* horizontal positioning of li */
  display: inline-block;
  padding: 7px 10px;
}

.navbar a {
  text-decoration: none;
  color: black;
}

```

- To delete default style for `ul`:

```css
#greets ul {
  list-style-type: none;
}

```

- To add special avatar to my unordered list `ul`:

```html

  <ul>
    <li><div class="avatar"></div><span>Hello Gritty Bear!</span></li>
    <li><div class="avatar"></div><span>What is for lunch?</span></li>
    <li><div class="avatar"></div><span>Salmon!</span></li>
  </ul>

```

```css

.avatar {
  background-image: url("../images/cookie.png");
  background-size: cover;
  height: 50px;
  width: 50px;
  border-radius: 50%;
  display: inline-block;
  /* keeps the avatar vertically aligned */
  vertical-align: middle;
  margin-right: 7px;
}

```
Testing React Components With Jest and React Testing Library
Tags: javascript, react, reacttestinglibrary, tdd
Published: 2020-06-04 16:13:54

---
title: Testing React Components With Jest and React Testing Library
published: true
date: 2020-05-13 00:06:42 UTC
tags: javascript, react, react-testing-library, tdd
canonical_url: 
---

[![](https://cdn-images-1.medium.com/max/2600/1*7wN5t9ILU0fpnhbMX2vtng.jpeg)](https://medium.com/swlh/testing-react-components-with-jest-and-react-testing-library-8815a51e9f1d?source=rss-269f954fad8c------2)

Using React Testing Library as an alternative to Enzyme when testing React components

[Continue reading on The Startup »](https://medium.com/swlh/testing-react-components-with-jest-and-react-testing-library-8815a51e9f1d?source=rss-269f954fad8c------2)
How to replace the audio in a video with the audio from another video with ffmpeg
Tags: linux, ffmpeg, productivity, tutorial
Published: 2020-05-13 00:03:28

{% youtube fXdaNnAe_MA %}

Follow me on [YouTube](https://www.youtube.com/channel/UCTHij3Ac5GizLsn5yB4IX_Q/) and [Twitter](https://twitter.com/FeuryDonald) for more video editing tricks with **ffmpeg** and a little **python** now!

I had someone email me asking how to solve the following problem:

> I would like to take video A, video B, and replace the audio in video A with the audio from video B

The approach they were trying was as follows:

1. Extract only the video from video A
2. Extract only the audio from video B, while also transcoding it a codec he needed it to be in
3. Merge these two files together

Now, this approach is fine but he encountered an issue. He claimed to need the audio in the a WAV file format but the WAV format wasn't compatible with the codec he needed to transcode the audio into.

So what does he do?

I showed him you can do all this in one command, avoiding this file format issue, while also not creating the intermittent files.

Let me show you the example I showed him and I will break it down.

```sh
VIDEO=$1
AUDIO=$2
OUTPUT=$3

ffmpeg -an -i $VIDEO -vn -i $AUDIO -map [0:v] -map [1:a] -c:v copy -c:a pcm_s8_planar $OUTPUT
```

> VIDEO=$1

This is the file he wants to use the video stream from, so in his case its video A.

> AUDIO=$2

This is the file he wants to use the audio from, making this video B.

> OUTPUT=$3

The file path to save the combined result to.

> -an -i $VIDEO

The **-an** option before the input means **ignore the audio stream**. This will give us only the video stream for this file. It also speeds up the command by avoiding having to read the audio stream.

> -vn -i $AUDIO

The **-vn** option before the input means **ignore the video stream**. This will give us only the audio stream for this file. It also speeds up the command by avoiding having to read the video stream.

> -map [0:v] -map [1:a]

The **-map** options make it so that we explicitly tell **ffmpeg** what streams of data to write out to the output, instead of it just figuring it out. This may have not been needed but I'd rather be explicit when I need to be.

> -c:v copy -c:a pcm_s8_planar $OUTPUT

The **-c:v copy** option makes so **ffmpeg** just copies the video stream over, avoiding a decode and re-encode. This makes it really fast.

the **-c:a pcm_s8_planar** option transcodes the audio stream to the codec he needed it to be in.

Lastly, we just tell **ffmpeg** to use the output path given

**aaannnddddd...**

**Drum roll please...**

It worked like a charm! He was very happy to be able to continue with his project.
New React Hook: 📦 use-is-mounted-ref
Tags: react, javascript, beginners
Published: 2020-05-12 23:53:46

Today I moved a hook that I use to fix the problem of setting the state to an unmounted component and commonly receives the following error:

```
Warning: Can only update a mounted or mounting component. This usually means you called setState, replaceState, or forceUpdate on an unmounted component. This is a no-op.
```

I created the following package:
[use-is-mounted-ref](https://github.com/helderburato/use-is-mounted-ref)

Maybe this can help you to solve this same problem. :)

Feel free to give feedback and share your experience with this topic.
I actually paid for some software, now what?
Tags: motivation, community, strength, creativity
Published: 2020-05-12 23:51:19

---
title: I actually paid for some software, now what?
published: true
description: Small, hopefully inspiring and motivational journey.
tags: #motivation #community #strength #creativity
---

We are very lucky, living in a time where software is readily available from convenient outlets in various flavours. Often created by developers of varying skills, backgrounds and interests. Each with slightly different goals in mind that are bound to cover your needs in one way or another - and that's not the best bit, a lot of it is free! 

Now, I appreciate not everybody will be in the same boat, but if not please humour me and join this brief journey if you have the time. ✨

We did it. We just paid for some software from a small, indie developer. It felt rather anticlimactic to be honest. I mean, we may have a few extra features or no ads but not much noticeable happened, at least not much immediately obvious. For a lot of people the journey ends here, often for me that's the case but a little perspective alteration can help breed motivation, engagement and greater fulfilment for all parties. 
This developer spend hours, days, possibly weeks building this software. Trying to drive people to it, creating graphics and marketing material watching for their first 10, 100, 1000 installs, their first 10, 100, 1000 reviews, their first $10, $100, $1000. They probably told their partner or friends about the success. Their own personal motivation shifted to creative ideas, enabling growth of the software, or even the creation of new products. It may not seem much, but this small act multiplied, created an exponential ripple in their life, in their own personal and our shared creative and monetary economies. It made a difference for us and our business, it helped encouraged and motivated us through these tough times. 💪

So before we dig too many unfinished rabbit holes together, back to the original Q - now what? 

Well, think of that journey, think of the happiness and motivation you may of provided and even go one further - write a review, provide some honest feedback to this other person. They're almost certainly going to read it, and just as likely to respond. Newly charged with the energy you helped provide, you may get a feature request granted.. or bug fixed.. or if nothing else, a connection with another person just doing their thing, just like you are. 💙
FREE PDF: Practice recursion with these 8 classic JavaScript exercices
Tags: javascript, beginners, free
Published: 2020-05-12 23:49:17

One of the very important CS concept that you need to learn is `recursion`.

> We say that a function is recursive if it calls itself until arrives to a result.

And what better way to learn about recursion than look at a few solutions on how this technique is used in the code. If you are a code newbie, the following booklet with JavaScript code samples may come handy:

[https://codeguppy.com/site/download/recursive_problems.pdf](https://codeguppy.com/site/download/recursive_problems.pdf)

Happy coding!
Starting working on my new Hackathon project
Tags: gftwhackathon
Published: 2020-05-12 23:02:35

---
title: Starting working on my new Hackathon project
published: true
description: Start post for the the Grant For The Web x DEV Hackathon!
tags: gftwhackathon
---

I'm excited that I am starting on building a Java Wrapper (for Android) for the inbuilt WebView creating a JavaScriptInterface that's able to expose the JavaScript API to Java.

The repo on GitHub is already live and I start creating the code.

{% github moagggi/AndroidWebMonetizationWrapper no-readme %}

Stay tuned and good luck on your submissons, too!
How to create pagination badges
Tags: javascript, react
Published: 2020-05-12 22:41:05

---
title: How to create pagination badges
created: 05/13/2020
published: true
description: Learn how to re-use pagination badges logic in all your projects.
canonical_url: https://aralroca.com/blog/pagination-badges
tags: javascript, react
cover_image: https://aralroca.com/images/cover-images/9_cover_image.jpg
---

*Original article: https://aralroca.com/blog/pagination-badges*

The purpose of this short article is to share a helper function to create typical paging badges. I have used this helper on several places and I think it can be useful for anyone who needs it.

<img src="https://aralroca.com//images/blog-images/39.gif" alt="Example of paging badges" class="center" />


The helper accepts a list of 3 options:

* `currentPage` - The current page, which will determine how badges are displayed with separators.
* `pages` - Total number of pages to display.
* `numBadges` (optional). Number of badges to be generated, by default is 5.

 It returns an array with the badges as `number`, filling `null` for the separators. This is implemented this way (in pure JavaScript instead of returning for example JSX) to reuse it everywhere: (P)React, Vue, Svelte, Angular... Even in Node or Deno.

```js
export default function pagesBadges({ currentPage, pages, numBadges = 5 }) {
  const maxBadgesSide = numBadges - 2;

  // Without separators case
  // ex: [1, 2, 3, 4, 5]
  if (pages <= numBadges) {
    return Array.from({ length: pages }).map((v, i) => i + 1);
  }

  const sideBadges = Array.from({ length: numBadges - 1 });

  // With a separator at the end case
  // ex: [1, 2, 3, 4, null, 49]
  if (currentPage <= maxBadgesSide) {
    return [...sideBadges.map((v, i) => i + 1), null, pages];
  }

  // With a separator at the beginning case
  // ex: [1, null, 46, 47, 48, 49]
  if (currentPage > pages - maxBadgesSide) {
    return [1, null, ...sideBadges.map((v, i) => pages - i).reverse()];
  }

  // In the middle (separator left + right) case
  // ex: [1, null, 26, 27, 28, null, 49]
  sideBadges.pop();
  const curr = Math.floor(sideBadges.length / 2);
  const center = sideBadges.map((v, i) => currentPage - curr + i);

  return [1, null, ...center, null, pages];
}
```

I've published the code in GitHub (~200 bytes) in case that you want to use it in your projects:

* https://github.com/aralroca/js-paging

This code is not providing any UI component, but it gives you the logic. With it you'll be able to create your paging component with the library/framework you want, to your liking. This partly offers a lot of flexibility in terms of design.

## Example of usage in React

Sandbox using the paging module in React:

{% codesandbox js-paging-j4hvd %}
Dependency Injection 
Published: 2020-05-12 22:13:10

I can’t seem to get my head around dependency injection in ASP .Net Core.. Like I know what it is but I can’t seem to think of a simple use case for it in my head. Can someone give like a simple example? Plus, it mentioned that whenever you’re injecting a dependency, you shouldn’t use the ‘new’ keyword but instead pass it into a constructor. Why?
Why I use OBS to Record Webcam Videos
Tags: productivity, video, streaming, beginners
Published: 2020-05-12 22:07:46

---
title: Why I use OBS to Record Webcam Videos
published: true
description: In this video, I compare several methods to record a webcam, and show why I like OBS the best 
tags: productivity, video, streaming, beginners
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/5atqlrsodf8vw8clvljx.jpg
---

Here I will do a comparison with the same webcam (Logitech 922 Pro), same microphone, and record it using:

- Windows Camera
- Logitech Capture
- Camtasia
- OBS Studio

And compare them all. OBS gives me the best results, as you'll see.
How 💥 not to wish someone happy birthday online 🎂
Tags: jokes
Published: 2020-05-12 21:58:31

So. It's today. Well at least still in this timezone.

A founder had his birthday today. And we tried to get him online to give him a surprise birthday song. You know, 🎂 happy birthday to you.... Happy birthday to you 🎂 🎉 🎈

But did he answer. Nope!

And when he did, only two of us were on the call. So it totalled 3 people. And we all know 3 + .14 makes ???

So no problem there 👍

So here are a few tips when wishing a person happy birthday online globally by way of suprise.

Simply don't do it.

Tip # 2. Read tip number one again.

Tip # 3. If they tell you that it was the nicest suprise ever after you finally get through and sing 🎂 happy birthday 🎂 you've failed to pull a crowd. But crushed it at international birthday greetings 💥.

Thanks to Jonas Denil for sharing their work on Unsplash.
Day 136 : Morning, Noon and Night
Tags: hiphop, code, coding, lifelongdev
Published: 2020-05-12 21:57:55

_liner notes_:
- Professional : Had a team meeting and attended a practice talk for the online conference coming up. The number of people registered has really jumped up in the past couple of days. I did a quick recording yesterday and the team added some music to it and an end card and posted it to Twitter. I retweeted it and got the finished video file and posted it to Instagram and did a post in the Orlando Developers Slack. Pretty good feedback on it. I try not to do too much self promotion, but there are a lot of cool talks I think people will enjoy. If you want to check register for FREE for the online conference and see the schedule, you can go to https://developer.nexmo.com/day Spent the rest of my day working on my blog post. Feels like I've been working on this post morning, noon and night. haha My goal is to get a lot better at writing technical blogs.

- Personal : Last night, I had some writer's inspiration and wrote up a good chunk of my blog post. Other than that, studied Japanese and went to sleep. haha

![Forest with a cabin and a small waterfall in Babcock State Park in West Virgina](https://dev-to-uploads.s3.amazonaws.com/i/r76kcl4dz34xrve139wg.png)

Going to finish writing up the draft for my blog post so I can get it submitted tomorrow morning. Once I finish that, I want to get some slides done for my presentation on Thursday because I want to get my script down and practice some more. Oh and study Japanese.

Have a great night!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube yer59AmW448 %}
Gitpods and vuejs 
Tags: gitpod, code, vue
Published: 2020-05-12 21:39:34

---
title: Gitpods and vuejs 
published: true
description: The first problem that I found is my server returnthe fallowing error:
tags: gitpod,code,vuejs
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/0pfms84gvek2399ea6e2.png
---
> The first problem that I found is my server returnthe fallowing error:
# "Invalid Host header"

For my vuejs application that I created in the gitpod service 
here is the solution to get the dev server running 


In the  vue.config.js add the fallowing note if you don't have a vue.config file 
you need to create one.

```javascript
module.exports={
    devServer: {
        disableHostCheck: true
    }
}
```
Then run npm run serve and you are good to go.
Wetzlar Devs Meetup
Tags: node, vue, sass
Published: 2020-05-12 21:27:54

---
title: Wetzlar Devs Meetup
published: true
description: local meetup here in wetzlar where I move not to long ago.
tags: node,vuejs,sass
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/wnkqofjdptodnpqqhwv1.jpg
---

Before the COVID-19 I was planing a local meetup here in wetzlar where I move not to long ago.

A simple developer meet-up to chat and have a beer or something, but we will see what happen after the current situation.
The site is build in vuejs before i got in to typescript 
Is host in Netlify, really simple  from Design to deployment.

Stack:
> Vuejs
> sass


https://wetzlarmeetup.netlify.app/