teleren/devto huggingface dataset:
5 Principais Profissões de Tecnologia que são as mais cotadas para crescerem em 2021
Tags: firstpost, tech
Published: 2020-12-12 17:08:46

#####Recentemente, o Linkedin publicou um estudo sobre as principais profissões que cresceram em 2021, separei as 5 principais profissões voltadas ao ramo de Tecnologia. Espero que gostem<3.
 
**1. Engenheiro(a) de Cybersegurança**
Fornece soluções de redes seguras capazes de assegurar que não aconteça ataques cibernéticos que possam prejudicar a segurança dos dados de uma empresa, impedem invasões de sistemas e instalações de vulnerabilidades.

Principais conhecimentos:
* Docker Products;
* Ansible;
* DevOps; 
* Amazon Web Services(AWS); 
* Kubernetes

**2. Cientista de dados**
São especialistas que possuem conhecimento técnico para resolver problemas complexos. O Cientista de Dados cria algoritmos e efetua análises para construir modelos e extrair insights desses dados.

Principais conhecimentos:
* Estatística 
* Machine Learning;
* Linguagem R e Python;
* Bancos de dados;
* Tecnologias de visualização de dados e criação de relatórios;
* Hadoop e MapReduce
* Business Intelligence 

**3.Engenheiro(a) de dados** 
É um engenheiro de software especializado em back-end, são responsáveis por gerenciar dados e desenvolver algoritmos para transformar dados primitivos em informações úteis para análises, com foco na otimização do desempenho destas informações.

Principais conhecimentos:
* Apache Spark; 
* Apache Hadoop;
* Apache Hive;
* Bancos de dados; 
* Linguagem R e Python;
* Ciência de dados


**4. Especialista em IA**
É responsável por projetar e criar instrumentos artificiais para solucionar problemas ou para que façam suas atividades de forma independente.
Principais conhecimentos:
* Machine Learning; 
* Deep Learning;
* Linguagem Python;
* Ciência de Dados;
* Inteligência Artificial;
* Cloud Computing

**5. Programador(a) JavaScript**
A linguagem JavaScript, atualmente, é uma das principais tecnologias em ascensão, juntamente com seus frameworks. Com esta linguagem, é possível desenvolver para WEB, Mobile, Desktop, iOS, Android, entre outros.
Principais conhecimentos:
* React.js;
* Node.js;
* Angular;
* Git;
* MongoDB

Graças a todo cenário de 2020, percebemos que a área de tecnologia houve um desenvolvimento inesperado e agradável, alavancando muito profissionais de tecnologia e fazendo com que empresas percebessem o quão necessário são estes profissionais para o seu crescimento.
`` print('Obrigada por chegar até o final<3') ``
3 Ways to Make`target="_blank"` Accessible
Tags: html, css, a11y, webdev
Published: 2020-12-12 17:06:10

READ THIS NOTE: I have since learned that using `target="_blank"` [can introduce a security issue.](https://medium.com/sedeo/how-to-fix-target-blank-a-security-and-performance-issue-in-web-pages-2118eba1ce2f) So for accessibility and security's sake, I recommend eschewing `target="_blank"` altogether. I'm leaving this post up as an example of learning from showing your work. 


___________________
I was writing a static page for an open source project recently and I wanted to insert some links. Personally, I prefer the links that pop up in a new window. That way I can have one bajillion tabs open at once, like usual. (You shouldn't always write this attribute and personal preference is not a great reason to use it, as I [have learned](https://css-tricks.com/use-target_blank/).)

But how do you implement new tabs? Add a `target="_blank"` HTML attribute like so:  

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

The links were the main feature in this static page, and I wanted to check if I wrote them accessibly, so I tweeted at the [A11y Project] (https://www.a11yproject.com/) to check on my syntax. 

They helpfully pointed out that people using assistive technology [could be frustrated](https://www.a11yproject.com/checklist/#identify-links-that-open-in-a-new-tab-or-window) by a surprise window popping up.

So, what's the solution? 

There are a couple [things to try](https://www.w3.org/TR/WCAG20-TECHS/G201.html). 

You could add a warning in the name or label like so:

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

You could also use CSS to generate a warning. W3.org has [an example](https://www.w3.org/WAI/WCAG20/Techniques/working-examples/G201/new-window.html) of what that looks like:

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


You're gonna need a span inside your link, wrapping the warning message. 

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

Then you'll need to apply CSS classes to hide the warning message until you hover. W3.org has [more detail](https://www.w3.org/TR/WCAG20-TECHS/G201.html) on that.

Alternatively, you can add a `screen-reader-only` class to your span. 

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

Then you would add CSS like this: [source for CSS](https://codersblock.com/blog/external-links-new-tabs-and-accessibility/)

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

And there you have it. Three ways to make your `target="_blank"` attribute accessible.
미티어 커뮤니티 슬랙 주소
Published: 2020-12-12 16:52:11

오픈소스 미티어 사용자 커뮤니티의 슬랙 주소 입니다.

은근히 찾기가 쉽지 않더라구요.

링크는 1달 정도 유효기간인 듯 한데, 기간 이후 필요하신 분들은 댓글 달아 주시면 링크 업데이트 하겠습니다.

Join me on Slack — it’s a faster, simpler way to work. Sign up here, from any device: https://join.slack.com/t/meteor-community/shared_invite/zt-a9lwcfb7-~UwR3Ng6whEqRxcP5rORZw
Simple Quiz Application With Timer - Vue  
Tags: dohackathon, vue, javascript, github
Published: 2020-12-12 16:50:00

## What I built
A simple One Page Quiz Application Written in Vue 2. Which Can be used in any Quiz or Other Applications. 

### Category Submission: 
Random Roulette

### App Link
https://simple-quiz-vue-56qwg.ondigitalocean.app

### Screenshots
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/0knzqgiurh3tmzfl4qdw.png)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/oc1gsf9vzdvntv3nec7z.png)


### Description
This is an simple OnePage Application Written in Vue2. You can integrate it anywhere in your vueJS application. It has a simple timer with loading animations. Bootstrap-vue is used for the ui component. Since it is open source feel free to contribute to this simple quiz Application here: https://github.com/arpan45/simple-quiz-vue .

### Link to Source Code
https://github.com/arpan45/simple-quiz-vue 

### Permissive License

MIT License

Copyright (c) 2020 Arpan Adhikari


## Background
A simple Quiz App Can be integrated anywhere. Most of the Applications which are mainly focused on education purpose can use it for simple challenging Quiz.

### How I built it 
First time used the DigitalOcean App Platform for deploying my App. It auto detects everything from the repo.CI/CD is just buttery smooth with digital ocean app platform. I just put my code to GitHub . Building and Serving App was so easy with a clean interface. I just selected the repository and set the dist directory for deploying. That is it. You can deploy the Application in just a click.


[![Deploy to DO](https://mp-assets1.sfo2.digitaloceanspaces.com/deploy-to-do/do-btn-blue.svg)](https://cloud.digitalocean.com/apps/new?repo=https://github.com/arpan45/simple-quiz-vue/tree/main)


### Additional Resources/Info
I have used Unsplash for the landing page image.
Bootstrap-Vue as UI components Library.
How To Block IP Addresses In HAProxy
Tags: devops, haproxy, aws, alc
Published: 2020-12-12 16:30:47

**Update haproxy.cfg to add condition** `acl is-blocked-ip src -f /etc/haproxy/blocklisted.ips`
```
frontend fe-lehaproxy
        bind *:80

        acl is-blocked-ip src -f /etc/haproxy/blocklisted.ips
        http-request deny if is-blocked-ip

        acl letsencrypt-acl path_beg /.well-known/acme-challenge/
        use_backend letsencrypt-backend if letsencrypt-acl
        redirect scheme https code 301 if !letsencrypt-acl

frontend fe-verify
        bind *:443 ssl crt /etc/certs

        acl is-blocked-ip src -f /etc/haproxy/blocklisted.ips
        http-request deny if is-blocked-ip

        http-request set-header X-Forwarded-Proto https if { ssl_fc }
        default_backend mybackend
```

**Blocked list**
```
~:/etc/haproxy# cat blocklisted.ips 
32.66.111.255
11.129.81.18
```

**Requests from IP addresses within the blocklisted.ips file will receive 403**
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/q4vypyrdwg6pa1qrimir.png)

**Another way to block IP addresses is to update inbound rule of AWS ALC**
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/1xe6ha15nqotzyqczlcz.png)

**More about HAProxy**
- [How To Set HTTP-Request Header In Haproxy](https://dev.to/vumdao/how-to-set-http-request-header-in-haproxy-48bd)
- [HAProxy With Resolvers In Case Of AWS Application LoadBalancer](https://dev.to/vumdao/haproxy-with-resolvers-in-case-of-aws-application-loadbalancer-d1n)
MongoDB Import & Export commands
Tags: mongodb, webdev, codenewbie, beginners
Published: 2020-12-12 16:25:57

Import/Export BSON
  - mongorestore
  - mongodump

Import/Export JSON
  - mongoimport
  - mongoexport


---

**Thanks for reading 💙**  
Follow **@codedrops.tech** for daily posts.  
[Instagram](https://www.instagram.com/codedrops.tech/) ● [Twitter](https://twitter.com/codedrops_tech) ● [Facebook](https://www.facebook.com/codedrops.tech/)

Micro-Learning ● Web Development ● Javascript ● MERN stack ● Javascript  
**[codedrops.tech](https://www.codedrops.tech/)**
The 2 Career path of a Web Developer
Tags: webdev, freelance, employed
Published: 2020-12-12 16:19:40

When you are new and just starting to become a web developer and confused about what's the best programming language and framework you would choose to learn then this is for you. 

There are 2 types of career path for a Web Developer and this is very important before you decide what programming language you have to focus on because this two has a huge different to become a successful web developer. 

# Freelance Path  

- PHP 
- Javascript

In the freelance path, the most profitable skill at all times is WordPress. You need to have knowledge in PHP to build and customize WordPress themes effectively. 

You also have to learn javascript to manipulate your frontend.


# Employed Path

- Javascript 

If you would like a high chance to be hired as a Web Developer (even you have only 6 months of experience) then the best way is to learn Javascript programming because there's a huge demand for frontend developers nowadays. When you have good knowledge of javascript it's time for you to choose a JS framework like Angular, ReactJs, VueJs. Just choose one of them and master it. 



# Conclusion 

Of course both paths you must be good to write HTML and CSS to become a successful web developer. Hope it helps. :)
HTML revision tour
Tags: html, beginners, myselfrishi
Published: 2020-12-12 16:16:52

HTML and its structure

° HTML is a web designing language which is used to create and design websites. Haider display pages will be published on world wide web so that it will be visible to everyone.
° TML define the structure and layout of the web document.
° HTML stands for hypertext markup language.


Structure of HTML document

The HTML document can be divided into three basic part 3 basic parts are
1. HTML
2. Head
3. Body

Basics👇

HTML programming elements

HTML is the set of markup symbols or codes inserted in a file.
    The markup tale web Browser how to display a web page's words and images for the user.
Each Individual markup code is referred to as an element but this elements are popularly known as Tags.

Some important points!

● HTML is not a programming language.
● we can create HTML programs on a simple text editor like notepad.
● it consists of the markup tags which look like <HTML>...<html>
● it is saved with extension of .HTML.
● capital or small letter doesn't matter in Tags.
Learn Data Structures and Algorithms for free
Tags: algorithms, dsa, datastructures, free
Published: 2020-12-12 16:09:09

## Best free sites to learn **Data Structures And Algorithms**:

* [Cscode.tech](https://cscode.tech/dsa/)
* [GFG](https://www.geeksforgeeks.org/data-structures/)
* [Programiz](https://www.programiz.com/dsa)

####Best Instagram Page to Learn Programming 

[@computer_science_engineering_](https://www.instagram.com/computer_science_engineering_/)

* **Daily Unique Question**
* **Programming Contests Per Month**
* **Guess The Output Questions**
* **Point Out The Error Questions**
Enable HTTPS in LOCALHOST with OpenSSL for a NodeJS app🤓(with video)
Tags: node, security, localhost, https
Published: 2020-12-12 16:08:35

For different purposes, we might need to enable HTTPS in our LOCALHOST environment. In this video, I have tried to show how we can do that in few minutes. 🎯 
Enjoy 🌸

{% youtube ztyRMfk0bAg %}


/// Commands to generate certificate with OpenSSL ///

```
openssl genrsa -out key.pem
```
```
openssl req -new -key key.pem -out csr.pem
```
```
openssl x509 -req -days 9999 -in csr.pem -signkey key.pem -out cert.pem
```
```
rm csr.pem
```

SUBSCRIBE to YouTube Channel - https://www.youtube.com/c/TheDestroDevShow?sub_confirmation=1
LIKE FB Page - https://www.facebook.com/the.destro.dev.show/
Follow on Twitter - https://twitter.com/destro_mas
Follow on DEV - https://dev.to/destro_mas

Made with ❤️ in Berlin!

Cheers!
👋
"Why did you decide to study Software Engineering?"
Published: 2020-12-12 16:03:58

Hello, my name is Chris and I am 23 years old.  I am new to Software Engineering, and currently I am enrolled in the Flatiron School Online Software Engineering program.  For as long as I can remember I've always had an interest in Technology.  When I was younger I played a lot of video games, and still do just not as often.  I've always been super curious as to everything that's involved with creating a video game.  I want to gain knowledge and develop my skills as a software engineer in order to understand the process behind creating a video game.  I want to be able to create a video game in the future, and bring joy to the people who love playing video games as I did when I was younger.
Today I Fixed...
Tags: laravel, php, webdev
Published: 2020-12-12 15:44:44

I have been working on a website using Laravel 7 for a while. This is the first time I'm building something with Laravel. We use Passport for authentication and of course, API calls are authenticated with it as well.

So the bug I encountered was I wasn't able to call my API. I am using the "auth:api" middleware on my controller to authenticate my API requests. Ideally my request gets through, required I was authenticated and authorized, but instead I was always redirected to the login page.

Initially I thought something was wrong with the middleware but quickly ruled it out. In another part of the website API requests made through just fine. Clearly the middleware was working. Besides it's the middleware's correct behavior to redirect you to the login page if you aren't authenticated.

The only real difference between these two pieces of code was that in one I used `axios` to make the API request and in the other I used `fetch()`. The `fetch()` call was failing.

After a little digging and attentive reading of the docs (this was the hardest part of the whole process for me) I finally figured it out.

Recall that I am using Passport for authentication. It handles API authentication too out of the box. The way it does it is:

1. When you login an api token is made for you. This is sent back as a cookie (laravel-token by default).

2. Another cookie called xsrf-token is also sent back.

3. When making an API request the xsrf-token must be decoded using `decodeURIComponent()` and sent back as the x-xsrf-token header

`axios` would do step 3 automatically, I don't know how or why. When you use `fetch()` you need to do step 3 manually.
Solving day 12 of Advent of Code 2020 in JavaScript
Tags: challenge, adventofcode, javascript, video
Published: 2020-12-12 15:34:12

---
title: Solving day 12 of Advent of Code 2020 in JavaScript
published: true
description: JavaScript walkthrough of Advent of Code 2020 (day 12)
tags: challenge, AdventOfCode, javascript, video
series: Advent of Code 2020 in Javascript
---

{% youtube S4mFat32oPc %}
My Hackathon Entry!
Tags: dohackathon
Published: 2020-12-12 14:39:31

## What I built

I built my portfolio, to showcase my other work.

### Category Submission: 

Portfolio

### App Link

https://portfolio-2-bggv2.ondigitalocean.app/

### Screenshots

Screenshots will not be included because of privacy reasons. (Contact Info, Street Address, etc.)

### Description
 
This web app is my portfolio to show off my other projects. Also a Progressive Web App

### Link to Source Code

https://github.com/NathanHannon/portfolio

### Permissive License

MIT

## Background

The purpose of this app was to help in my job search by providing an easy way to show off my work, and web development skills. I also wanted to try out creating a Progressive Web App while I was at it.

### How I built it 

I used Digital Ocean's App Platform. I learned how to deploy websites to a cloud, and build a full stack web application. I also learned how to turn a website into a Progressive Web App

### Additional Resources/Info
This project was created using React.js Node.js, and PostgreSQL. The images are stored in a Google Cloud Bucket.
Turn Windows into a usable development environment with WSL
Tags: windows, productivity, docker
Published: 2020-12-12 15:19:30

---
title: Turn Windows into a usable development environment with WSL
published: true
description: How to set up Windows Subsystem for Linux, Visual Code and Docker for developing on windows
tags: windows, productivity, docker,
//cover_image: https://direct_url_to_image.jpg
---

I recently set up a development environment on my windows computer, using [Windows Subsystem for Linux (WSL)](https://docs.microsoft.com/en-us/windows/wsl/about).

This lets you effectively install a Linux OS on top of windows that works seamlessly with windows tools, and it's so much better than my previous experience of trying to develop on windows.

# Basic setup
1. [Install WSL](https://docs.microsoft.com/en-us/windows/wsl/install-win10)

2. [Install a tabbed terminal](https://www.microsoft.com/en-us/p/windows-terminal-preview/9n0dx20hk701?activetab=pivot:overviewtab) (Optional - I expect this will be fixed eventually, but the current default terminal is pretty useless)

3. [Set up Visual Code to work with WSL](https://code.visualstudio.com/docs/remote/wsl)

4. [Install Docker into WSL](https://code.visualstudio.com/blogs/2020/03/02/docker-in-wsl2)

These steps will let you work with Visual Code and terminals, and things will mostly just work as if you were actually working on Linux.

You can also run any Docker command from within WSL (after running `apt install docker`) and it will use the Docker daemon provided by Docker for Windows.

# (Optional) Configure the tabbed terminal
The terminal is a bit fiddly to configure as it requires editing a JSON file. You can open it by pressing `CTRL+,`

The profile settings look like this:

```json
{
    "guid": "{2c4de342-38b7-51cf-b940-2309a097f518}",
    "hidden": false,
    "name": "Ubuntu",
    "source": "Windows.Terminal.Wsl",
    "colorScheme": "One Half Dark",
    "fontSize": 15
},
```

At a minimum I would recommend changing the color scheme. Even after swapping out the terminal app, I found the default colors hard to read against a dark background.

For more info about the options you can refer to the [Windows Terminal documentation](https://docs.microsoft.com/en-gb/windows/terminal/customize-settings/profile-settings).

# WSL is pretty cool
So far I've been really impressed with how well this all works.

If you want to know more about WSL, I recommend this Hanselminutes podcast: [Inside Linux on Windows with WSL and Tara Raj](https://www.hanselminutes.com/646/inside-linux-on-windows-with-wsl-and-tara-raj)

> Windows 10 runs Linux natively! How is that possible? Scott talks to Microsoft's Tara Raj, the Program Manager for the Windows Subsystem for Linux. How does this technology work? Tara explains the internals of WSL to Scott in this episode.
Answering StackOverflow questions
Tags: stackoverflow, reputation
Published: 2020-12-12 15:05:15

By now, it is several years that StackOverflow is one of highest ranked resource of questions and answers for developers. Many of us, visit StackOverflow at least once a week. Codes and solutions posted on StackOverflow has been entered many code based world wide. Rather than its usage as a source of information, it is also a play ground for competitors who fight for higher reputation. Everybody loves those numbers in front of their user names, especially when it is shown with a K character.

Personally, I am too a fun of StackOverflow reputation. I feel it enriches my resume. Also, I feel it shows how I am a master of some field in spite of the fact some people believe that StackOverflow is not a good metric to show someone's expertise. By the way, I spend some of my time answering StackOverflow questions in an irregular manner. Some days I feel lucky because I found some good questions, answers them and hopefully they are accepted. When I am really lucky, I even answer out-of-my-skills questions. But some days, I read many questions and review many answers, however, I do not find a question to answer. The tougher problem is that my reputation does not get raised much by increasing amounts of just 10 or 20. I'd like a reputation of 50K which needs thousand of accepted answers.

The more I tries, the more work-arounds I find. I found that it is better to do my answering effort base on North America's timezones rather Middle East or even Europe's timezones. During working hours of Middle East, the frequency of questions are very low. It gets better when working hours of Europe begins and, it is in its highest rate when working hours of North America begins. Same is true for working days of the week. In most parts of the Middle East, Sunday is a working day. On Sundays, there are little question to answer despite the fact that Middle Eastern are on work.

I have created a list of watched and ignored tags. But they do help a lot. As soon as I try to answer a question, someone else has posted theirs. And the other way, when a question remains un-answered for a long time, it usually means it is not a simple question to answer.

Today, I did [some search and learnt some tips](https://meta.stackexchange.com/questions/17204/six-simple-tips-to-get-stack-overflow-reputation-fast):

* Avoid Wall-of-Text questions. They take way too much effort for little reward. And usually are syntax errors or bad structure.
* Post an answer even if the question already has 1–2 or even 3 answers. In these cases, take your time and answer well. This will usually net you a good sum of rep.
* Learn when to edit. Post a short answer at first and then edit. You have <5 minutes to make that answer shine.

I am still hopeful to find some ways to earn [reputations](https://stackoverflow.com/users/167670/) rapidly!
Destructuring from nested object and array
Tags: javascript, webdev, codenewbie, beginners
Published: 2020-12-12 14:31:34

```js
const response = {
  msg: "success",
  tags: ["programming", "javascript", "computer"],
  body: {
    count: 5,
    data: ["File 1", "File 2"],
  },
};

const {
  body: {
    data: [file1],
  },
} = response;

console.log(file1); // "File 1"
```

---

**Thanks for reading 💙**  
Follow **@codedrops.tech** for daily posts.  
[Instagram](https://www.instagram.com/codedrops.tech/) ● [Twitter](https://twitter.com/codedrops_tech) ● [Facebook](https://www.facebook.com/codedrops.tech/)

Micro-Learning ● Web Development ● Javascript ● MERN stack ● Javascript  
**[codedrops.tech](https://www.codedrops.tech/)**