teleren/devto huggingface dataset:
LIVE CHAT APPLICATION
Tags: node, javascript, webdev, heroku
Published: 2020-06-08 19:45:36

Hye, everyone hope you are doing well. I recently come out with this great application that I created with the help of Socket.io, NodeJS,Javscript and other web tools. 

####This allows you 
##### 1. Live Chat
##### 2. Share Live location

My motto is your safety first, for this I uses SSL Keys in my heroku app that adds s in https. That makes it extra secure for my users. This is a great source for personal chat.
For using this APP you can visit over here - 

##### https://poder-chat.herokuapp.com/

You just need to share your Room ID with you partner, and then feel free to chat anything.

We are not able to see your chats as it's not stored anywhere it was just a moment. And when you refresh all of your chat is gone. So, there is no issue related to Security.

##### Hope you like it
##### Practical implementation - https://www.linkedin.com/feed/update/urn:li:activity:6675839469234520064/

##### And for using this web application 
Directly  visit over here - https://poder-chat.herokuapp.com/
When do I start?
Tags: development, frontend, backend, frameworks
Published: 2020-06-08 19:44:51

##Ever wondered when's a good time to start learning something new?
Well the truth is **NEVER!**

In my months of being a front-end developer, I've had issues on deciding when to start taking on new projects and or learning a new framework, language, platform or any other thing regarding going forward.

I'm highlighting this because I know that many of us face with problems like this. My best advise is to just **start** because if you wait for the right time, you'll never get it done.

**IF NOT NOW THEN WHEN**
What are some movies you watch for development inspiration?
Tags: watercooler, discuss
Published: 2020-06-08 19:27:25

I am a moviebuff and I watch a lot of movies. Some movies motivate us, some entertain us and some are so boring that they outright irritate us. There are some movies which show the zeal and consistency of developers and make us feel that we should work more consistently and with more aggression to achieve our goals.

What are some of the movies which the people of #DEVcommunity will recommend for watching as a morale booster for developers. 

I personally recommend watching
## The Social Network

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/nwr9lo47sml6r1vm3mnn.png)
## Jobs

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/14cliyhdy26lrb8xy5i0.jpg)

## Pirates of silicon valley

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/afz1c90xqr7cvw24y3wh.jpg)

And in TV series I would suggest 

## Silicon Valley 

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/60fu0ri9sd52hjyt4h6m.jpg)

## Mr. Robot

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/4mnd5m142p3wp66hgjkt.jpg)

What are your favourite movies and TV series inspiring you for development please mention in the comments. I would like to watch them  to get an extra bit of motivation for development.
What is Linux Server Hosting?
Tags: linux, hosting, webhosting, host
Published: 2020-06-08 19:23:41

Linux Hosting is any type of hosting using the operating system called Linux on the server. Linux is a Unix-like operating system provided as a free, open-source choice. Linux is the most common and widely used operating system in the web hosting industry.

Even though Windows OS is the most widely used OS for computers because of its simplicity to use, this isn’t the case with Windows Hosting. Windows Hosting is very complex compared to Linux Hosting. And it doesn’t support PHP, a scripting language which is widely used and very simple. This makes way for Linux Hosting. So no wonder Linux Hosting Powers about 80% of web servers in the world.

And we’re all price-conscious who need top-notch features at a very low price. This is why Linux Hosting is most preferred as opposed to Windows Hosting.

So the challenge here is to choose a web hosting provider who provides the best service for the money that we shell out. So there are some factors you need to analyze before going with a web hosting provider.

If it made you curious, learn more about [Linux hosting](https://www.onlinetoolsexpert.com/what-is-linux-hosting), which is probably the best hosting server this days.
Why should you refactor?
Tags: cleancode, refactoring, technicaldebt, programming
Published: 2020-06-17 09:14:31

---
title: Why should you refactor?
published: true
date: 2020-06-08 19:22:00 UTC
tags: cleancode,refactoring,technicaldebt,programming
canonical_url: 
---

You have been working on this feature for a long time. When the client pitched this great new addition, you felt this would take a week. And here you are working on a Saturday and nothing feels right. You start to question everything about your career choices, the impostor syndrome kicks in.

Maybe you are not as great as you think (many of us are not).

![Stressed out](https://images.unsplash.com/photo-1456406644174-8ddd4cd52a06?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2048&q=80)

## It’s not you, it’s Technical Debt

> “Technical Debt is a metaphor, coined by Ward Cunningham, that frames how to think about dealing with this cruft, thinking of it like a financial debt. The extra effort that it takes to add new features is the interest paid on the debt.”
> 
> Martin Fowler

Most of our work as programmers is paved by the need of stakeholders. The client usually wants something at the last moment and the conversation ends with, “just get it done before Y (an unimaginable deadline) or we will start loosing money”.

You need to opt for the “quick way”.

This is the curse of our craft, we have to make compromises that we know will come back to bite us (or another one of us) in the ass. These compromises allow us to meet the client’s deadline and save them money for now. Congratulations, the code is a step closer to a maintenance nightmare now.

You will surely be entertained when the next feature request comes in.

A few years go by. You keep adding features, layer upon layers of new code. Everything built upon the same code base, inheriting every misused design pattern and reflecting all your bad design choices. You are at the mercy of technical debt, if the interest rate is low it slow you down by days or weeks. If the rate is high, maybe you can’t even implement the feature without a rewrite.

* * *

## Pay the Debt with Refactoring

> “Refactoring is a disciplined technique for restructuring an existing body of code, altering its internal structure without changing its external behavior.”
> 
> Martin Fowler

Fear not Padavan, refactoring is the way we can repay this debt. Just like any other loan, we keep paying the debt via refactoring and get to keep our sanity.

To get started just remember the boy scout’s rule. Leave your code better than you found it. Make small, incremental changes that leave the code in a better state than it was found.

You should get started with this by,

- Naming your variables and functions well.
- Extracting each step of logic into a function.
- Keeping it DRY and removing duplicate code.
hello glitch {.com}; This is my Portfolio
Tags: html, css, javascript, node
Published: 2020-06-08 19:05:41

I love the name Glitch. Kind of remind me The Glitch Girl from Wreck-it-Ralph. Also everything about Cyberpunk, hacking and things like that. They are part of me now! I mean I just love coding. 
Recently I have found the site Glitch. It's a site where you can develop apps. It's an online social coding platform or maybe just a social coding platform. Same thing, I guess... (To be social is being online)
# First up: The Portfolio
Nobody knows me, right now. And I want to meet a lot of people who codes. I have a lot of friends who aren't coders. And with the amazing power of the Internet. I can do just that. And since I am not a celebrity, I have no marketing agency that idolizes myself. So I am going to talk about myself and my journey using my super power; coding a Web-page!
And while I am writing this article, I am building my portfolio. 
# What is going to be in my portfolio?
- The main thing would be obviously my unfinished projects. (I might mysteriously complete it, watch out!)
- Also I need to motivate and inspire our fellow coders.
- And definitely my current skills.
- My social links, so we can have fun socializing <3
- The timeline: Just to show-off how ahead I am. Also to track my progress...
- How I can be a Techie Activist... (Still figuring out)

# Why I want to be a close part of the community?
I love code more than anything. I met a few people who wanted to code. But many of them can't seem to stay on course. Most have diverted to other things. I tried to keep myself stay on track by just exploring the coding culture. Sometimes I would talk to them on why they started coding. What inspired them? I always tried to promote others to work hard on their dreams. You never know who might create change. And if I can at-least lift you, I am happy! Being part of this community WE CAN GROW TOGETHER!

# What I want to achieve from the community?
- Mostly feedback
- Inspirations
- Cool new resources
- Awesome people (yeah you!)

# How my Glitch Portfolio is different from a normal Portfolio?
In a normal portfolio my main goal is to attract people who want to utilize my knowledge for their business. I would be showcasing a lot of finished and attractive projects. But let's be real not everything I create is always attractive. But I always keep the code attractive. And in a normal portfolio, I don't get appreciated enough on the code. But it's the UI/UX that sticks out.
And on my Glitch Portfolio I could attract other coders. Expressing and collaborating on ideas that could make a life better. I don't know much about what to expect. I am thrilled! :)

> # You can find my Portfolio by [clicking here](https://rio-high-fives.glitch.me)!
The 7 Most Popular DEV Posts from the Past Week
Tags: top7
Published: 2020-06-08 18:54:11

---
title: The 7 Most Popular DEV Posts from the Past Week
published: true
description: A round up of the most-read and most-loved contributions from the community this past week.
tags: icymi
cover_image: https://thepracticaldev.s3.amazonaws.com/i/sfwcvweirpf2qka2lg2b.png
---
Every Monday we round up the previous week's top posts based on traffic, engagement, and a hint of editorial curation. The typical week starts on Monday and ends on Sunday, but don't worry, we take into account posts that are published later in the week. ❤️

### 1. Pillars of Strength
Kenny gives his friend, Damion Wright a shoutout for their [Linkedin post](https://www.linkedin.com/pulse/im-wearing-mask-its-covid-19-related-damion-wright/) on being a Black person in the workforce. Kenny's own notes on the factors that went into the "simple" decision of adding a profile picture on DEV are an important read. 

{% link https://dev.to/kawhyte/i-m-a-software-engineer-wearing-a-mask-but-it-s-not-covid-19-related-35n3  %}

### 2. Getting Resourceful with Web Development
Thanks to Jose, there's an awesome round-up of free and up-to-date resources on DEV for illustrations, CSS, Tailwind, and more! 

{% link https://dev.to/jfelx/40-high-quality-free-resources-for-web-development-10o3  %} 

### 3. Finding the Second Largest Number in an Array
A breakdown of the steps to answer a common, often tricky interview stumper — and Cat will be tackling more in the weeks to come! 🥳 

{% link https://dev.to/catcarbn/interview-q-s-decoded-issue-1-40i3 %}

### 4. Advanced Vim Movements
Sachin helps us level up from the Vim basics with some more advanced Vim movements to arrive at the configuration file.

{% link https://dev.to/thetinygoat/let-s-learn-vim-moving-and-the-configuration-file-4g45 %} 


### 5. Educated Guessing with Brute Forcing
Paula shares a brute force command they made that creates guessing options from a fitting range using a genetic algorithm.

{% link https://dev.to/terceranexus6/genetic-algorithms-for-brute-forcing-4e6j  %}

### 6. When Tech Gets Spooky

Heshie asks how you'd feel if every store you visited took a picture of you and then compared it with neighboring stores until they found the one that you're a customer at — **with your info**. You'd feel bad, right? This post explores a real-life (and all too common) example of this very creepy thing in practice. 

{% link https://dev.to/heshiebee/i-was-emailed-after-abandoning-a-registration-form-i-did-not-click-submit-this-is-not-ok-a63  %}


### 7. Good Partnerships = Good Code

Juraj shares their perspective on how to be a great partner to your team by avoiding common traps like renamings and code generalizations to put the focus where it counts: on being a great collaborator and producing quality work. 
 
{% link https://dev.to/mjuraj/i-made-over-1-000-code-reviews-this-is-what-i-learned-4e9e  %}
 

_That's it for our weekly wrap up! Keep an eye on dev.to this week for daily content and discussions...and if you miss anything, we'll be sure to recap it next Monday!_
Having trouble adjusting a new webpage
Tags: html, css, webdev, javascript
Published: 2020-06-08 18:40:17

Hi, I don't know very few things about WebDev. And my University wants a web resume (TBH They asked for a simple one but this is me who made it complex). So I used an template I found online, changed the data filled with mine deployed it on my local server. But there is a problem I can't solve.

Here is the link of the real author: http://www.pascalvangemert.nl/
And here is mine:debagnik.github.io/ResumeWeb

I guess you may notice the problem. The profile section of mine is getting merged with the background. I tried many times to find the problem but I didn't have any luck finding it.

github code: https:github.com/Debagnik/ResumeWeb

Please help I beg you. Most probably its the problem with the style sheet

Thanks
Mockaroo - Creating Test Data
Tags: salesforce, einsteinanalytics
Published: 2020-06-08 18:39:49

![1](https://dev-to-uploads.s3.amazonaws.com/i/tsqann49vcfs11vg6jkg.png)
![2](https://dev-to-uploads.s3.amazonaws.com/i/oyktbrth61f0plfgzo6b.png)
![3](https://dev-to-uploads.s3.amazonaws.com/i/is7zu9ex4gz8s95r4qxy.png)
![4](https://dev-to-uploads.s3.amazonaws.com/i/m4gix2olfopi7erwxibh.png)
![5](https://dev-to-uploads.s3.amazonaws.com/i/sp5uton2hksi5mmpkyhi.png)
DOM layout: How to get the width and height of DOM elements.
Tags: javascript, webdev, beginners, codenewbie
Published: 2020-06-08 18:30:34

*I will be sharing bite sized learnings about JavaScript regularly in this series. Follow along with me as I re-learn JavaScript. This series will cover JS fundamentals, browsers, DOM, system design, domain architecture and frameworks.*



`clientWidth`: The width of the element **inside** the element. 

`clientHeight`: The height of the element **inside** the element. 

`offsetWidth`: The width of the element including the border.

`offsetHeight`: The height of the element including the border. 

`pageXOffset`: horizontal scroll position

`pageYOffset`: vertical scroll position

`getBoundingClientRect`: A function to get the most precise position of an element on the screen. It returns an object with properties indicating the pixel positions of the sides of the element relative to the top left of the screen. Word of caution - calling getBoundingClientRect causes reflow. [More details here ] (https://gist.github.com/paulirish/5d52fb081b3570c81e3a)

{% jsfiddle https://jsfiddle.net/af9sdt0h/21/ %}
Meus primeiros 5 anos como desenvolvedora
Published: 2020-06-08 18:29:36

Eu sou Sarah, tenho 24 anos, sou natural de Natal/RN, e trabalho como Consultora de Desenvolvimento de Software na Thoughtworks, uma empresa global de consultoria de software. Eu acabei de completar 5 anos de experiência trabalhando com desenvolvimento, e resolvi escrever um pouco sobre a minha jornada até aqui.  

Eu sou graduada em Tecnologia da Informação pela [UFRN](https://ufrn.br/), e tenho dois cursos técnicos em Informática: Um é o curso técnico em manutenção e informática integrado ao ensino médio do [IFRN](https://portal.ifrn.edu.br/), e o outro é o curso de Informática para Internet do [IMD¹/UFRN](http://imd.ufrn.br/). 

Tive a minha primeira experiência profissional com desenvolvimento de software, durante o meu primeiro semestre da graduação. Trabalhei meio período por pouco mais de um ano sendo bolsista  para o setor de desenvolvimento do IMD¹. 

Desde então, passei por diversas outras equipes, e em cada experiência, aprendi novas tecnologias, novas metodologias de desenvolvimento, e aprendi e continuo a aprender a lidar da melhor maneira possível com pessoas. 

Em janeiro de 2020 eu fui convidada a participar do processo seletivo da Thoughtworks, e em março iniciei a minha jornada na empresa. Anos atrás eu ouvia falar muito bem das iniciativas de transformação social promovidas pela Thoughtworks, além dos incentivos dados de crescimento na carreira. Após 3 meses, posso dizer que estou muito feliz por ter aceitado a oferta, e estou ansiosa pelo que está por vir.  





--------------

¹IMD - Instituto Metrópole Digital, uma Unidade Acadêmica Especializada da Universidade Federal do Rio Grande do Norte (UFRN).


---------------


Tem feedback sobre meu texto, ou quer bater um papo comigo? Entra em contato comigo em sarahraqueld@gmail.com ou sarah.lima@thoughtworks.com =)
Centering a div with Flexbox
Tags: css, html
Published: 2020-06-08 18:27:15

I saw the tweet below on my timeline today:

{% twitter 1270049224378507267 %}

Here's a simple, no bullshit guide to centering content with CSS using Flexbox. [Make sure to check the Flexbox CanIUse to make sure your target browsers have good support for it, otherwise this might not work.](https://caniuse.com/#feat=flexbox)

# Creating the skeleton

To start, let's write some HTML. `parent-div` is the element that will hold the child div that we want to center.

```html
<html>
  <head>
    <title>Flexbox CSS Centering Example</title>
  </head>
  <body>
    <div id="parent-div">
      <div id="child-div">
        <h1>This is an example</h1>
      </div>
    </div>
  </body>
</html>
```

If you're wanting a good place to play around with this code in the browser, I recommend using CodePen. [Here's the pen with the HTML used for this post.](https://codepen.io/samwightt/pen/gOPaWQx) Just type in the CSS as we go along and you'll see everything updated in real time.

Our goal will be to get the `child-div` post centered within the parent div, both horizontally and vertically. We'll start by adding flexbox to the parent. Before we do this though, let's add some backgrounds to each of these elements so we can see where the browser is rendering them. Ugly, I know.

```css
#parent-div {
  background-color: red;
}

#child-div {
  background-color: black;
}
```

# Adding Flexbox to the parent

Making an item display using flex is simple: just use the [`display: flex;`](https://developer.mozilla.org/en-US/docs/Web/CSS/display#Inside) CSS property.

```css
#parent-div {
  background-color: red;
  display: flex;
}
```

You shouldn't notice any changes in how the element is rendering yet. Let's add some height and width to parent element, making it the height and width of the browser viewport:

```css
#parent-div {
  background-color: red;
  display: flex;
  width: 100%;
  height: 100vh;
}
```

# Centering the content

Now that we have a parent element the width and height of the screen, let's center the child element horizontally and vertically inside the parent div. We'll use the [`justify-content`](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content) and [`align-items`](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items) CSS properties to make this happen:

```css
#parent-div {
  background-color: red;
  display: flex;
  width: 100%;
  height: 100vh;
  justify-content: center;
  align-items: center;
}
```

And now we should see the child element centered inside the parent div!
Overcoming AWS Lambda Limitations with Fargate
Tags: aws, cloud, awscloud, devops
Published: 2020-06-08 18:14:51

Using Lambda with Fargate helps us to overcome the limitations of AWS Lambda. If you need to run a background process for more than 15 minutes or if you need more storage than 500 MBs, here's how you can do it:

➡️ Lambda function will get triggered based on your desired event source.

➡️ It will ingest the event in the SQS queue, and trigger Fargate to consume the event from the queue.

➡️ Since we'll be doing all the processing on Fargate, we'll overcome some of the hard limits of AWS Lambda.

**Example**
If you need to downlaod the file up-to 1 GBs of size, do processing and upload it to S3. AWS Fargate will be your go-to choice since it's practically not possible with AWS Lambda's hard limits.

---
If you have technical questions and suggestions, let's discuss them here, in [Github](https://github.com/MrHassanMurtaza) or say hi me in [LinkedIn](https://www.linkedin.com/in/mrhassanmurtaza/).
Add badges to repos in bulk
Tags: github, opensource, python
Published: 2020-06-08 18:14:45

Wrote a small interactive script in python which help updating badges to multiple repos at one go. You can checkout the repo [here](https://github.com/jayeshathila/badger) 

## Result

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/p4gfqpw1e9vg9ik9doa1.png)

## Usage:

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/v7lmqbx7cck0wdjd3b0t.gif)

Please feel free to leave a comment or raise a PR to contribute.
Guess the error message 
Tags: javascript, discuss, exception, question
Published: 2020-06-08 18:00:36

---
title: Guess the error message 
published: true
description: Find which error message will be shown when we execute this code.
tags: javascript,discuss, exception,question
---
Can you guess the correct error message this program will throw when executed, also do mention why?
 
```js
class HookExecutor {
  constructor() {
    this.hooks = [];
  }

  async exec() {
    try {
      this.hooks.forEach((fn) => fn());
    } catch (Err) {
      console.log(
        "Error 3: caught inside exec function where all hooks are executed."
      );
    }
  }

  process() {
    this.exec().catch((error) => {
      console.log("Error 2: caught inside new HooksExecutor.process", error);
    });
  }
}

const hookExecutor = new HookExecutor();
try {
  hookExecutor.hooks.push(async () => {
    console.log("I am a hooks");
    throw new Error("Serious Error!");
  });
} catch (err) {
  console.log("Error 1: Caught in global space", err);
}

hookExecutor.process();
```