teleren/devto huggingface dataset:
Managing cognitive load
Tags: psychology, career, softwaredevelopment, coding
Published: 2020-05-06 04:26:46

---
title: Managing cognitive load
published: true
description: How not to turn into a computer when you work on one all day
tags: psychology, careers, softwaredevelopment, coding
---

Doing challenging technical work can starve your social and creative sides because it forces you to strive for correctness all the time. You have to take deliberate steps to maintain a sense of balance, well-being and humanity.

I find joy in the abstraction, logic and ingenuity that software development entails. But the work can take a toll.

To debug effectively, you have to think like a computer and play out how a system works in your head. Do this for many hours every day, and you may begin to feel like a computer yourself.

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

Our work affects us more than we realize. At times, afraid I might permanently lose touch with the other parts of myself, I've considered quitting engineering entirely.

But the underlying problem of getting sucked into technical work at the expense of other parts of one's life and personality isn't a sad reality to be accepted. The issue can be avoided. I've found that the key is managing cognitive load.

Put another way, you’ve got to avoid overworking your brain’s RAM. Never let it spin too hot for too long.

Following a few guidelines makes a huge difference. For one, you can give your intellect a rest by walking or exercising. Anything physical is going to make your mind work less.

Slightly less obvious: creative and analytical tasks use different mental muscles. Take advantage of this distinction by taking creative breaks to rest your analytical chops.

Seek out conversations about something other than that problem you’re solving. A simple chat can be a fun way of remembering that not everything needs to fit into a perfectly logical box.

I like listening to podcasts in a language I’m learning to get some extra low-effort exposure. This isn’t for everyone, but for me it's a fun way of switching things up during the day. Things like this can can keep you sane and balanced. Know what they are for you, and consider setting goals for them so the time you spend doesn’t feel wasted.

Finally, use a system of notes to record your thoughts and ideas in digital or paper form. Make lists and draw pictures, and revisit them often. By writing down what you’ve already figured out, you give your mind more space. This keeps it from getting bogged down.

It is possible to do technical work without feeling like it's turning you into a robot. Coding doesn't have to be antithetical to being social. You can embrace being a nerd, be successful in your career and still be a real human being in the rest of your life. It just requires self-awareness and being disciplined with your time.
Angular Phaser & Electron Integration Template
Tags: angular, github, design, typescript
Published: 2020-05-06 03:47:09

It has always been my dream to create a video game, and I'm starting to do some work with Phaser, as I am pretty familiar with typescript. I started a project and got some work done before figuring that I should strip back the assets and some implementation to provide a clean little template. I have a repo for it and thought I might share:


https://github.com/TBosak/game-template


Flexbox is one of my favorite web layout frameworks, so I included it in implementation as well. It should be super easy to implement a fantastic UI in a matter of hours.

The repo has gotten a lot of traffic, so I am considering a rename and branding to see how big I can make it. I'm working on fancy names and logos. Let me know what you think.
Top 5 DEV Comments from the Past Week
Tags: bestofdev
Published: 2020-05-06 02:50:18

---
title: Top 5 DEV Comments from the Past Week
published: true
description: Highlighting some of the best DEV comments from the past week.
tags: bestofdev
cover_image: https://res.cloudinary.com/practicaldev/image/fetch/s--7VrAA2ln--/c_imagga_scale,f_auto,fl_progressive,h_420,q_auto,w_1000/https://thepracticaldev.s3.amazonaws.com/i/qmb5wkoeywj06pd7p8ku.png
---

This is a weekly roundup of awesome DEV comments that you may have missed.  You are welcome and encouraged to boost posts and comments yourself using the **[#bestofdev](/t/bestofdev)** tag.

@nas5w shared their answer to **[What is your top tool that most devs would be surprised you use regularly?](https://dev.to/jess/what-is-your-top-tool-that-most-devs-would-be-surprised-you-use-regularly-4ckh)**:
{% devcomment oam5 %}

@hyftar talked about the benefits of occasionally recreating the wheel in **[One thing led to another and I built my own static site generator today](https://dev.to/ben/one-thing-led-to-another-and-i-built-my-own-static-site-generator-today-5enj)**:
{% devcomment oe2b %}

@bipinrajbhar adds some more info to the `===` operator **[The Lies of "===" operator](https://dev.to/giandodev/the-lies-of-operator-1dfm)**:
{% devcomment ob82 %}

@aroldev shows how to say "Hello, World!" in "Chicken" ... **["Hello, World!" but in 30 different languages!!!](https://dev.to/muhimen123/hello-world-but-in-30-different-languages-3ii1)**.  Should we start supporting syntax highlighting for Chicken?:
{% devcomment ocf1 %}

@tomstreeter talks about some of the history behind CSS Floats in **[Anyone here still using CSS Floats?](https://dev.to/luisaugusto/anyone-here-still-using-css-floats-3gd)**:
{% devcomment oe40 %}

See you next week for more great comments ✌
JavaScript: Promises explained with simple real life examples
Tags: javascript
Published: 2020-05-06 13:28:50

---
title: JavaScript: Promises explained with simple real life examples
published: true
date: 2020-05-06 02:17:53 UTC
tags: javascript
canonical_url: https://www.ma-no.org/en/programacion/javascript/javascript-promises-explained-with-simple-real-life-examples
---

Handling asynchronous data flows is complex, who hasn't faced creepy codes ?
A Promise is an object that represents the termination or failure of an asynchronous operation. Since most people consume already created promises, this guide will explain first how to consume them, and then how to create them.


Essentially, a promise is a returned object to which callback functions are attached, rather than passing callbacks to a function.

Read on [📖!](https://www.ma-no.org/en/programming/javascript/javascript-promises-explained-with-simple-real-life-examples)
Code newbie and anxiety!
Tags: codenewbie, anxiety, mentalhealth
Published: 2020-05-06 01:43:00

<p>I had plans to write about something different today. I even started on the post where I talk about my career change, moving to Canada, and how all that led me to web development, but I'm feeling a little anxious, and my first advice to destress is to - <strong>PUT IT OUT THERE!</strong> -. </p>

<p>Anxiety feeds on itself, and other thoughts. The more we let it locked inside our heads, the faster and bigger it grows. So, <strong>PUT IT OUT THERE!</strong> Either on a post here on dev.to, over the phone with a friend, or however you feel comfortable doing it.</p>

<p>For me, in particular, I rather seek guidance, advice or a kind response in people I don't really know that well, over family or close friends. You may find that weird, but that's the only way I don't feel judge. When I'm anxious, the sightless condescending tone puts me in defensive mode. Especially if it's from a person I love or care. To my relief, I don't feel the same about co-works or I would be F****. hahaha!</p>

<p>Se I'm even laughing by the end. Feeling lighter already! Thank you, whoever you are!</p>

<em> I saw the link for <a href="https://dev.to/impwalker/depression--anxiety-in-programming-9op">this post<a/> on Twitter and that's what motived me to right</em>
Detect and track your errors in production and fix it!
Tags: javascript, node, logs, errors
Published: 2020-05-06 01:40:24

Hi Everyone!

Today, I talk about track errors in production.

Detecting errors is very important for Dev and DevOps team, It's much better when you detect de error and fix it before the client sends a notification, especially if your error is in production, for that you have many options :).

First, you should put the correct format in the logs of your app, ok... if you don't have logs, maybe you should install the log module.

**Recommend format:** [DATE][ENVIRONMENT][APP][PROCESS_ID/THREAD_ID] message: <ERROR_STACK>

Why I put the "process id" or "thread id"? If you run the cluster mode or multicore (with thread) you need to know if the error causes a domino effect in another process/thread (anyway, this is optional).

Ok, you have logs... your module of logs constantly block the I/O thread? is it efficient when printing your app logs? No? Ok... change your log module.

**Note:** Don't forget the format of your logs and especially use an efficient logger.

This is the way for improving your logs for seeing the errors in production... but, what about if I want to see the real-time error? (What??)

**R: [Bugsnag](https://www.bugsnag.com/) or [Sentry](https://sentry.io/welcome/)**

Yes, you have to register, then get the client token. When you have the token, incorporate the Sentry/Bugsnag module into your application (use the token) and your **app must send the error through the client**. That is all, you will see all error (nearly real-time) and if you configure logs by environment and client... much better :)

Finally, I want to share the log module for Node.js I most use: [Winston](https://github.com/winstonjs/winston). If you want to read more about logs, [click here](https://www.loggly.com/blog/benchmarking-popular-node-js-logging-libraries/)

**Note:** This is applicable for other languages, runtime and more.

Good luck guys!

I hope you like this post :)
What are the misconceptions of non-tech folks when working with devs on web projects?
Tags: discuss, watercooler, webdev, react
Published: 2020-05-06 01:01:51

I am preparing a blog post for non-tech folks to manage their expectations but also explain how we work. For instance, I will mention that the idea of "simple" tasks is different when it comes to code (centering on PWA being an example), or that if they send us a text, oftentimes it's not just "copying and pasting it".

**What are the biggest misconceptions you think non-techies have about web dev?**

***
cover photo by by Andrea Piacquadio from [Pexels](pexels.com)
O que é um Email Transacional?
Tags: self, email, emails
Published: 2020-05-06 03:01:49

---
title: O que é um Email Transacional?
published: true
date: 2020-05-06 00:53:43 UTC
tags: Self,email,emails
canonical_url: https://marquesfernandes.com/o-que-e-um-email-transacional/
---

Emails transacionais são um tipo de e-mail automatizado entre o remetente e o recebedor. Diferente dos emails promocionais, um email transacional é disparado mediante eventos, interações com um serviço ou uma plataforma e não com uma empresa em si. São normalmente pré programados e disparados após uma interação, como, por exemplo, a criação de uma conta que requer verificação do email.

Existem diversos usos para os emails transacionais, falaremos um pouco sobre os principais usos desse tipo de email:

## Confirmações

Talvez o uso mais comum dos emails transacionais seja para confirmar a ação de um usuário. Quando um usuário cria uma conta, ou realiza uma compra, um email transacional é disparado para informar o usuário que essa ação ocorreu com sucesso.

## Notificações

Alertas e notificações enviadas por plataformas e aplicações são um tipo de email transacional bastante comum. Por exemplo, quando um usuário deseja receber notificações de interações que ocorreram em seu serviço, ou quando você deseja informar seu usuário sobre alguma possível mudança em sua conta, ou serviço.

## Convites

Muitas plataformas disponibilizam ferramentas para convidar outros usuários para o seu serviço. Quando uma plataforma permite que seu usuário use o seu canal ao invés de abrir seu programa de email e enviar diretamente, podemos considerar essa interação como um email transacional.

O post [O que é um Email Transacional?](https://marquesfernandes.com/o-que-e-um-email-transacional/) apareceu primeiro em [Henrique Marques Fernandes](https://marquesfernandes.com).
Python Career Opportunities: Your Career Guide To Python Programming
Tags: python, ganeshkavhar
Published: 2020-05-06 00:46:51

---
title: Python Career Opportunities: Your Career Guide To Python Programming

published: True

description: 

Python Career Opportunities :
Inclination towards being curious and hands-on is desired as Python demands that we get our hands dirty and like to fiddle around the system for errors and other issues:

In an independent 3rd party survey, it has been found that the Python programming language is currently the most popular language for Data Scientists worldwide:

tags: python , ganesh kavhar
---
Spread VS Rest Operator
Tags: javascript
Published: 2020-05-06 00:15:27

The **...** (_dot, dot, dot_) operator as I like to call it :smile:, has been around since the introduction of [ES6](https://www.tutorialspoint.com/es6/es6_overview.htm), and has helped a lot
of javascript developers manipulate arrays and other iterables easily.

The ... operator can either be called spread or rest depending on where or how it is being used. Let's look at scenarios where it is known as the spread operator.

_NB: For the purpose of the post we'll be using arrays, though the ... operator also works on other iterables._

### Spread Operator (...)

Lets take the array as a bottle. The spread operator allows you to grab all the content of the bottle without grabbing the bottle itself and putting that content wherever we want. Let's take a look at the following code.
```javascript
const animals = [🦁, 🐘, 🐍, 🦍, 🐯];
const someOtherAnimals = [...animals];
// someOtherAnimals now contains 🦁, 🐘, 🐍, 🦍, 🐯 and
// animals remains unchanged
```
Here, the spread operator is used to copy the content of the _animals_ array into the _someOtherAnimals_ array. The spread operator can also be used to copy the contents of multiple arrays into another array.
```javascript
const wild = [🦁, 🐘, 🐍, 🦍, 🐯];
const domestic = [🐐, 🐔, 🐱, 🐶];
const animals = [...wild, ...domestic];
// animals now contains 🦁, 🐘, 🐍, 🦍, 🐯, 🐐, 🐔, 🐱, 🐶 and
// both wild and domestic remains unchanged.
```

### Rest Operator (...)

The rest operator allows to us to represent an indefinite number of arguments as an array. So unlike the spread operator that _spreads_ out the elements in an array, the rest operator (or the gather operator as some people call it) groups multiple elements into an array. Here's how that would work
```javascript
const addAll = (...numbers) => {
    return numbers.reduce((acc, num) => acc + num);
};
const sum = addAll(1, 2, 3, 4); // sum is 10
const sum1 = addAll(1, 2, 3, 4, 5, 6, 7, 8, 9, 10); // sum1 is 55
```

In the addAll function, we're are gathering all the arguments regardless of the how many, into the _numbers_ parameter and then returning the sum. That way, we can modify the numbers parameter like we would modify a normal array. Another example of how we could use the rest operator is shown below

```javascript
const multiplyByNum = (multiplier, ...numbers) => {
    return numbers.map(num => num * multiplier);
};

const multiplyBy2 = multiplyByNum(2, 1, 2, 3, 4);
// multiplyBy2 is [2, 4, 6, 8]
```
In this case, we are collecting the first argument as the multiplier parameter and gathering all other elements into the numbers parameter as an array, then multiply each number by the multiplier.

In summary, the spread operator _spreads_ the content of an array, while the rest operator _gathers_ elements (arguments to a function) into an array.
How to get TimeZoneInfo on Windows and Linux
Tags: sharp, snippet
Published: 2020-05-08 07:50:10

---
title: How to get TimeZoneInfo on Windows and Linux
published: true
date: 2020-05-06 00:00:00 UTC
tags: sharp,snippet
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/ykn90s8q6wyaegn4o2az.jpg
description: Lets see how we can get the TimeZoneInfo regardless of whether the code is running on Windows or Linux
canonical_url: https://www.ankursheel.com/blog/get-time-zone-info-windows-linux
---

Recently, I ran into a small issue with timezones. On my local system, I was able to get the timezone but as soon I deployed, I started getting an error.

## Problem

Unfortunately, Windows and Linux use different timezone systems

- On Windows, they are identified by a value provided by Microsoft and takes a form such as “New Zealand StandardTime”.
- On Linux/OSX, they are identified by a value provided by IANA in the TZDB and takes a form such as“Pacific/Auckland”.

This makes it a little tricky to get the TimeZoneInfo, especially, if you want to make sure the code works regardless ofthe system it is running on.

## Solution

The easiest way I have found to solve this is to check if the Windows value exists in the list of time zones. If itexists, use the Windows value to get the time zone info, else use the IANA value.

```csharp
var nzTimeZone = TimeZoneInfo.GetSystemTimeZones().Any(x => x.Id == "New Zealand Standard Time")
    ? TimeZoneInfo.FindSystemTimeZoneById("New Zealand Standard Time")
    : TimeZoneInfo.FindSystemTimeZoneById("Pacific/Auckland");
```
i3-dmenu-desktop and desktop applications
Tags: linux, i3, desktop
Published: 2020-05-05 23:23:49

Here is three locations your desktop launchers (e.g. `i3-dmenu-desktop`) might look inside to list desktop applications :

- /usr/share/applications
- /usr/local/share/applications
- ~/.local/share/applications

Note that in reality it searches for "applications" folder inside the folders listed under the environment variable `$XDG_DATA_DIRS`.
MY VERY FIRST CLI APP
Tags: codenewbie, ruby
Published: 2020-05-05 21:44:38

I have gotten through my 8th week during my bootcamp experience. Oh man! It’s been a rollercoaster… As I mentioned on my first blog post I started my bootcamp with Flatiron School knowing literally zero about tech and all this different world. Now I know the basics of Ruby, It’s a technical language for sure and I have to say it has not been easy for me to learn this! But I have something really cool  to share and that is I have built my first CLI application! 


I AM VERY EXCITED!

{% vimeo 233979216 %}



Now let me tell you how fascinating is my Movie Tracker Command Line Interface Application, let me take a step back and tell you about what were my  project requirements. 

1. I Gathered Data from an API (Application Programing Interface)    
2. Create a CLI application(how easy!) 

Let’s start!  So where did I start? I needed an API so I started my research and found a website called RapidAPI, you can find any type of API you’d like, I thought making a Movie Tracker, I thought is a good idea for my very first CLI app, It was going to be simple and a very good way to provide clean code.

 So now the cool stuff begins! 

I started with my BUNDLER GEM set up, I went to my XCODE terminal and typed “bundle gem movie_tracker” and it created most of my files, once my workspace opened on my VSCO I created my three class.rb. Once I started putting code on the files I was getting a better idea of what I was creating...Is a very simple not too long application, I tried to be as clean but creative on my code always giving the right commands to it. I feel very accomplished with what i’ve done. My Movie Tracker CLI app, searches for any type of movie you want to see, first you will see a WELCOME message, followed by two more messages “Get ready to find a movie!” and “Enter a movie title or type exit” if you look for a title you will find the movie you want to watch plus some extra information about the movie like  Type, Year and IMDb; after you see this information you get to have the option to select one movie from the options you have, you will give the number of the option to the Movie you want to see and more information about it will be display such as Plot, Genres, Director, Actors and Runtime after that my loop keeps going and you can either look for another Movie or Exit the search. 

You can see my code here : {% github https://github.com/sarisgar28/movie_tracker no-readme %}

Thank you for reading and Happy Coding!
Node.js v14: What's New?
Tags: node, javascript
Published: 2020-05-05 23:15:03

---
title: Node.js v14: What's New?
published: true
description: Let's dive into the updates that Node.js version 14 gives us!
tags: #nodejs #javascript
canonical_url: https://auth0.com/blog/nodejs-v-14-whats-new/
---
That's right! Node.js version 14 is here! 🎉

Whether you have upgraded your Node version already or are thinking about doing it soon, let's discuss some of the things that this new version gives us! We'll even chat about older versions and what to expect there in the coming months.

[Read on 📖](https://auth0.com/blog/nodejs-v-14-whats-new/?utm_source=dev&utm_medium=sc&utm_campaign=nodejs_14)
Building a Book app with NextJs, Hasura & gqless
Tags: hasura, nextjs, gqless, graphql
Published: 2020-05-05 23:12:52

---
title: Building a Book app with NextJs, Hasura & gqless
published: true
description: 
tags: Hasura, NextJs, gqless, graphql
---
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/recjshfjz7tx88dbf42m.png)


qgless, it’s a tool that makes you generate the queries at runtime based upon the data your app consumes, which means converting the paths into GraphQL queries.

> A GraphQL client without queries ✨

## Step 1: App setup

So, let's start by installing NextJs:

```javascript
npx create-next-app <app-name>
```
we need to install some dependencies
```javascript
yarn add —dev @types/react @types/node
```
Then cd <app-name> and create a new file named tsconfig.json at the root of your project and run this command npm run dev to generate typescript config for Next.js.

## Step 2: work with gqless

Install the gqless dependencies

> Important: If using Typescript, ensure version is 3.7.0+
```javascript
yarn add gqless
yarn add @gqless/cli -D
```
Create a new file named .gqlessrs.json at the root of your project, with the following contents (follow the instructions here to set up codegen and generate all the types from your schema):
```javascript
{
    "url": "http://localhost:4000", // For the url, use your Hasura GraphQL endpoint
    "outputDir": "graphql",
    "headers": {}
}
```
Next, add a generate script to your package.json:
```javascript
"scripts": {
    "generate": "gqless generate"
}
```
After you run the generate command, you should see a new folder in your app where you specified the outputDir.

In your component import the Books query

```javascript
import React, { Suspense } from 'react'
import { query, books } from "../graphql";
import { graphql } from "@gqless/react";
```

That’s all you need. You should now have your Hasura endpoint and your application making a query to view the data which you can now display in your template.

```javascript
const Books = graphql(() => {
    return (
    <div>
      {query.books.map(book => {
          return <div key={book.id}>{book.title}</div>;
      })}
    </div>
  );
});
export default function Home() {
    return (
    <div>
      <Suspense fallback="loading">
        <Books />
      </Suspense>
    </div>
  );
}
```
You can find the demo app [here on GitHub](https://github.com/heithemmoumni/nextjs-gqless-books-demo).