teleren/devto huggingface dataset:
Dev.to is fast - But ... How? 
Tags: askdev, ask
Published: 2020-03-25 18:21:08

---
title: Dev.to is fast - But ... How? 
published: true
description: Insights regarding the deployment of the Dev.to platform provided by the Dev engineers
cover_image: https://raw.githubusercontent.com/app-generator/static/master/misc/devto-react-dashboards-article-cover.jpg
tags: askdev, ask
---

Hello Dev Stuff,

This is an open discussion addressed to Dev.to engineers especially, regarding the deployment architecture. I was amazed a few months ago to see that one of my posts **[React Dashboards](https://dev.to/sm0ke/react-dashboards-open-source-apps-1c7j) - Open-Source and Free ** has more than 50k views and is the first item returned by Google for a super competitive keyword *react dashboards* in front of companies like **ColorLib**, **MadeWithReact** or **Creative-Tim**. 

The content of the article is not optimized at all, has a lot of text, images, and gifs loaded from Github and despite this, the article has a 100 Lighthouse score. 

**I have a huge thanks**, If someone from Dev stuff can provide more information regarding the production deployment (Proxy Server, Caching, Load balancing, Database, Distributed Servers, if any .. etc). 

I'll drop some stats regarding my article: 

> Google search - Pos #1 since Sept.2019

![React Dashboards Dev Article - Google results.](https://raw.githubusercontent.com/app-generator/static/master/misc/devto-react-dashboards-google-search.jpg)
  
> Lighthouse score - Desktop

![React Dashboards Dev Article - Lighthouse score for Desktop.](https://raw.githubusercontent.com/app-generator/static/master/misc/devto-react-dashboards-lighthouse-score-desktop.jpg)

> Lighthouse score - Mobile

![React Dashboards Dev Article - Lighthouse score for Mobile.](https://raw.githubusercontent.com/app-generator/static/master/misc/devto-react-dashboards-lighthouse-score-mobile.jpg)

> React Dashboards - Dev.to stats

![React Dashboards Article - Dev stats.](https://raw.githubusercontent.com/app-generator/static/master/misc/devto-smoke-stats-react-dashboards.jpg)

---
> Thanks again! Just keep up the good work & superfast deployments.
Few aws cli tricks
Tags: aws
Published: 2020-03-25 18:12:14

# Introduction

These are excitements of a newcomer to the aws-cli ecosystem. 

In summary
* Using aws cli without installing
* AWS Profiles
* aws-cli history

# Trick: Using aws cli without installing

I was following https://docs.aws.amazon.com/cli/latest/userguide/install-cliv2.html for installing version 2 of aws cli.

Three commands are needed to install it. If you don't want to install (like me), don't do last step.
```bash
curl "https://awscli.amazonaws.com/awscli-exe-linux-x86_64.zip" -o "awscliv2.zip"
unzip awscliv2.zip
sudo ./aws/install
```

Instead create a bash alias like this, which pointing `./aws/dist/aws` file
`alias aws=/<path/to/aws-extracted-folder>/dist/aws`

If you want use it all the time (which you probably want), just add above alias to your `~/.bashrc` or `~/.bash_aliases` (Bash aliases are loaded in most distros automatically, if not you might load it with `source ~/.bash_aliases`).

# Trick: AWS Profiles

This is a useful feature if you using multiple accounts of aws.
https://docs.aws.amazon.com/cli/latest/userguide/cli-configure-profiles.html


In short, create a profile by following command

`aws configure --profile theProfileName`

After passing proper credentials, you can use it with almost all commands. For example,

`aws s3 ls --profile theProfileName`

Actually, these values are stored in `~/.aws/credentials` (Linux & Mac) or `%USERPROFILE%\.aws\credentials` (Windows). I guess, you can edit and change if you want (I didn't test my self).

# Trick: History
Use following command once to enable
`aws configure set cli_history enabled`
Now onwards use following commands to see
`aws history list`
Installing Agda using Stack
Tags: agda, stack, emacs, haskell
Published: 2020-03-25 18:04:56

I recently installed `Agda` on my Linux machine, so I'll take note of what I did.

## Install `alex`, `happy`
`alex` is a tool to generate a lexical analyzer and `happy` is a parser generator. (They correspond to `lex` and `yacc` respectively.)

```
$ stack install alex happy
```

## Install `Agda`

```
$ stack install Agda
```

I failed to compile with an error message.

## Add to `stack.yaml` and install `Agda` again

Refer to the following part of the error message and add the following to `~/.stack/global-project/stack.yaml`:

```
Some different approaches to resolving this:

* Recommended action: try adding the following to your extra-deps in/home/(Username)/.stack/global-project/stack.yaml:

- hogehoge
- hugahuga
(Omitted)

Plan construction failed.
```

However, if you already have `extra-deps: `, add:

```
extra-deps:
- hogehoge
- hugahuga
(Omitted)
```

Install `Agda` again, repeat if it fails, and proceed if it succeeds.

## Set `agda-mode` to work with `Emacs`

```
$ agda-mode setup && agda-mode compile
```

## Install`Standard Library`
Version 1.1 has been installed.

```
$ mkdir -p ~/.agda/lib
$ cd ~/.agda/lib
$ wget https://github.com/agda/agda-stdlib/archive/v1.1.tar.gz
$ tar xvzf v 1.1 .tar.gz
$ echo "$HOME/.agda/lib/agda-stdlib -1.1/standard-library.agda-lib" > ~/.agda/libraries

$ agda-I-l standard-library
```

It's over. Yay! (^○^)
Creating a simple Notes web app with Vue and Firestore
Tags: vue, firestore, tutorial
Published: 2020-03-25 17:50:22

---
title: Creating a simple Notes web app with Vue and Firestore
published: true
description: A multipart tutorial on creating a note-taking app made with Vue and Firestore
tags: vue, firestore, tutorial
series: Vue Notes app
---

## Introduction to the short series
This is a multi-part tutorial on using Vuejs to create a Note-taking app. It uses Firestore as the database to store all the notes. This tutorial is divided into the following parts:

1. Starting a Vue project and setting it up (this article)
2. Creating a Firestore database
3. Connecting the Firestore database to the Vue app and sending notes to the database
4. Fetching notes from the database and displaying sorted notes
5. Adding a delete note functionality to the app

## Setting up the project
Start a new Vue project and replace the code in `App.vue`'s template with the following:

![App.vue component](https://dev-to-uploads.s3.amazonaws.com/i/stbn0s1owi1mpdbx8ee5.png)

If you haven't used Vue v3.x to create projects before, refer to [my previous article](https://dev.to/napoleon039/how-to-create-new-projects-with-the-vue-cli-3pgo). 

Here in this `App.vue` component, we have an input for the title of the note and a textarea for the content/main body of the note. There is a button that will add our note to a database.

Below this, is an unordered list that will display all our notes. There will also be a button beside each note which allows us to delete that particular note.

---

Let's create the data which will allow us to have a two-way binding with the note title and content.

![Adding data for two-way binding](https://dev-to-uploads.s3.amazonaws.com/i/qpl3xjjltdzvb5nhp17x.png)

We can access the contents of the input and textarea and get the title and content of a note. The `notes` array will hold all our notes. Now, we need a method that will add our notes to this array.

![A method to add all new notes to an array](https://dev-to-uploads.s3.amazonaws.com/i/x9en62a923jfebcj8d6z.png)

This method will check if the `title` and `content` are empty otherwise push them in our `notes` array. Setting the `title` and `content` to an empty string will clear the input and textarea. 

## Wrapping up
We have our new project set up, ready to have new notes added to it. We can enter a note title in the input and enter the contents of the note in the textarea. Clicking the button will add our note to an array.

We can display our notes in the unordered list with a `v-for`, but...after refreshing the page, all our notes will be gone! To make them persistent, we need a database to store all our notes. We will create a new Firestore database in the next part. Until then, feel free to ask any questions you have in the comments below.
Quick CSS Tip: Two-toned square join borders
Tags: css, webdev
Published: 2020-03-25 17:49:59

When you define a typical CSS border, the corners join together at a 45-degree angle:

![example of normal CSS border join](https://dev-to-uploads.s3.amazonaws.com/i/pujsfhvlyq7zpe24o4oz.png)

_`border-width` exaggerated for effect_

Instead, we can use a combination of `border` and `box-shadow` to produce a square border join:

{% codepen https://codepen.io/5t3ph/pen/jOPQPzx %}

[Open the Codepen](https://codepen.io/5t3ph/pen/jOPQPzx) to play around with the values, and set `$insetBorder` to false to place the bottom "border" below the left border.
Job Search Week 3
Tags: makers
Published: 2020-03-11 12:44:56

So this week I spent mainly working on my react and javascript skills so that I can hopefully build a full-stack MERN web application. Which I feel like I could get started on next week.

Day 1

I continued working on React on Monday because I want to build a full-stack project with some other people from my cohort. It's weird to use since you have to write all your HTML and CSS in a script tag but so far I'm liking it.

Day 2

On Tuesday I went into makers to get started on this project so we got our repository set up, but I was only about halfway through the course I was doing so I didn't fully understand what was going on so I decided to continue working on the react course I was doing.

Day 3

I finally finished my React course on Wednesday which I was happy about. So now I just need to organise a date to get started on the MERN application but in the meantime, I'll practice JavaScript.

Day 4

I got started on my JavaScript practice it's nice to go over the basics to rebuild a strong understanding of the basic principles of JavaScript but now I can't wait to get started on the project. JavaScript was the language which I started with so It's nice to get back into it after doing a lot of Ruby.

Day 5

I was going to Paris on Saturday so I spent Friday packing for Paris so unfortunately I didn't get any coding done but I'll be fully restored after a holiday so I'll be ready to make up for lost time.

Summary 

I feel like it was a good week I got to get React done and start some JavaScript. I didn't apply to any jobs this week which wasn't good but hopefully, I can send out some applications next week.
How to publish a message with priority in RabbitMQ
Tags: python, rabbitmq
Published: 2020-03-25 17:24:44

---
title: How to publish a message with priority in RabbitMQ
published: true
description: This article will describe how to publish and consume messages with priority in RabbitMQ
tags: python, rabbitmq
---

### Dependencies
- RabbitMQ (>=3.5.0)
- Python 3.6
- Pika

In this article, we will learn how to publish and consume messages with priority in RabbitMQ. We will be using python language and pika library for AMQP.

Here we are declaring queue with `x-max-priority` argument. This argument is integer number from 0 to 255. It describes that the queue can accept messages with max priority equal to this number.

```
import pika

queue_name = 'priority-queue'
max_priority = 10

# connect and get channel
parameters = pika.ConnectionParameters('localhost')
connection = pika.BlockingConnection(parameters)
channel = connection.channel()
# declare queue with max priority
channel.queue_declare(
    queue=queue_name, arguments={"x-max-priority": max_priority}
)
```

Publish messages with different priorities.
```
def publish(message, priority)
    message = message + str(priority)
    channel.basic_publish(
        properties=pika.BasicProperties(priority=priority),
        exchange='',
        routing_key=queue_name,
        body=message
    )
# message with priority 0
message = 'message-with-priority-'
publish(message, 0)
# message with priority 5
publish(message, 5)
```
Now consume messages from the queue and find that message with higher priority will be consumed first even if it was published later.
```
method_frame, header_frame, body = channel.basic_get(queue_name)
print(body)
# message-with-priority-5
method_frame, header_frame, body = channel.basic_get(queue_name)
print(body)
# message-with-priority-0
```

Source Code : [rabbitmq-priority-queue-example](https://github.com/hardiksondagar/rabbitmq-priority-queue-example)
Easy Project Management using Trello
Published: 2020-03-24 22:45:03

It is very easy to get bogged down when working on a project. Generally, the approach we take is to build out bits and pieces that make up the whole.
In my limited experience, I find myself constantly getting distracted, which makes me lose my direction, and then my motivation is spent trying to realign my train of thought. When this continues to happen, begins adding up to a lot of wasted time.
To combat this, I have been using Trello to manage tasks.

![Imgur](https://i.imgur.com/2kfakiS.jpg)

Trello gives you the ability to make columns based on whatever you want. For our purposes, I have followed a basic model of:
* Tasks to Do
* Tasks current being worked on
* Tasks on hold (due to needing other implementations first)
* Tasks Finished

For my team, we have also created a Resources column to dump any good info we can all use.

Within these columns, we can create *cards* for each task we assign for the project.
Cards can hold more than just the name of the task itself. When clicking into the card, we can utilize a number of different features to better identify the task at home.
Within the card, a very useful thing to do is to add a checklist for all the parts that make up the task. For example, we may be implementing a Game Over Function, but that only tells us so much. As below, we can break it down into the components that make up this function, and check them off as completed. This can signal to my group what is done, and what can still be worked on.

![Imgur](https://i.imgur.com/HvxgxWF.png)

Labels are also very useful- I have seen them used to note urgency of the task needing completion, but we are using it in a way to categorize the different tasks to divide them up effectively.

The due-date tool is useful as it will plot the card to a shared calendar, and supply alerts if you have a due-date approaching.

![Imgur](https://i.imgur.com/YwrQBDF.png)

Members is useful to assign specific tasks to a specific person. This notifies users individually and allows tasks to be filtered by user assignments.

On top of all of this, you can comment on cards, which will show up on the card itself, along with any history of activity that happened within the card.

Cards can hold a ton of helpful information, and can easily be moved between columns just by dragging and dropping. All together, this makes task management much easier and can help direct your attention at any point.

Note! I was NOT paid for this, but will happily accept any money :)
Continuous Integration as a Part of the QA Process
Tags: ci, testing, qa
Published: 2020-03-25 17:24:03

What is Continuous Integration, and why should it become an indispensable part of the QA process? Discover testing peculiarities, pros, and cons along with the list of tools that can be used for your project.

https://medium.com/@HireTester/continuous-integration-as-a-part-of-the-qa-process-6bb5f0616641
Suitcase PHP, public release
Tags: php, packages, sdk, api
Published: 2020-03-25 17:12:36

---
title: Suitcase PHP, public release
published: true
description: I've finally published my SDK builder package for PHP
tags: PHP, packages, SDK, api
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/vym76zex3f2rmraio72b.png
--- 
It's taken a little time, but I've finally released my PHP SDK builder package 🎉

This is the first public release of the package, allowing you to simply and easily build an SDK in PHP for your API. More examples will be added over time and as people ask for specific examples.

Open to thoughts and feedback!


https://packagist.org/packages/suitcasephp/builder
[MacOS] Biometria para 'sudo' no terminal
Tags: macos, sudo, fingerprint, terminal
Published: 2020-03-25 17:04:23

# Por que?

Todos nós sabemos que para utilizar o sudo no terminal precisamos digitar nossa senha de super usuário ou admin. Não seria muito interessante se sempre que precisarmos usar nossa senha, pudessemos usar a biometria do nosso Macbook?

# Para quem?

Esse tutorial é válido somente para usuários dos Macbooks com Sensor Biométrico.

# Como fazer?

1 - Vamos abrir o arquivo `/etc/pam.d/sudo` através do terminal utilizando o editor de sua preferência, no meu caso utilizarei o nano, que já vem por padrão instalado no MacOS a partir do comando: `sudo nano /etc/pam.d/sudo`

![Evidência sudo original](https://i.ibb.co/3v5hBTh/Captura-de-Tela-2020-03-25-a-s-13-36-39.png)

2 - Com o arquivo aberto, vamos adicionar uma nova forma de autenticação para ele por meio da linha `auth       sufficient     pam_tid.so` que deve ser adicionada na segunda linha do arquivo

![Evidência pam_tid.so](https://i.ibb.co/bJMnS8F/Captura-de-Tela-2020-03-25-a-s-13-41-27.png)

3 - Para fechar o arquivo basta pressionar `control + x` (^X) em seguida digite `y` para confirmar que quer salvar o arquivo e depois é só apertar `return` para sobrescrever o arquivo atual.

![Evidência Salvar](https://i.ibb.co/dfRXQN3/Captura-de-Tela-2020-03-25-a-s-13-57-09.png)

![Evidência Sobrescrever](https://i.ibb.co/pJzM9nw/Captura-de-Tela-2020-03-25-a-s-13-57-20.png)

Obs.: Com tudo feito, não se esqueça de encerrar o terminal para que ele recarregue as configurações de permissão e então você pode validar a alteração com o comando `sudo echo hello`

É isso pessoal, qualquer coisa é só comentar...
あまり汎用的じゃないgitのtips
Published: 2020-03-25 16:52:18

---
title: あまり汎用的じゃないgitのtips
published: true
description: 
tags: 
---

### upstreamにmergeされているbranchを全て削除

```shell-session
git branch | xargs git branch -d
```

### untracked filesを一括削除

本当に全部消えるので注意

```shell-session
git clean -fdx
```

### 特定のディレクトリにある最新のcommit hashを確認
```shell-session
cd ~/git/something_special && git log -1 | cat - | grep commit
```

### 特定のlocal branch以外全てのbranchを削除する

```shell-session
git branch | grep -v branch_name | xargs git branch -D
```

### 特定の単語を含むbranchを削除 

```shell-session
git branch | grep fix- | awk '{print $1}' | xargs git branch -D
```

### 2つのbranch間の同じファイルでdiffを取る

```shell-session
git diff master feature_branch_a file_to_be_compared.txt
```

### 2つのbranch間で別名のファイルでdiffを取る

```shell-session
git diff master:old.txt feature_branch_a:new.txt
```

### remote branchの削除

```shell-session
git fetch --prune
```
useful ssh-keygen tips
Tags: sshkeygen
Published: 2020-03-25 16:51:06

---
title: useful ssh-keygen tips
published: true
description: 
tags: ssh-keygen
---

## generates a public key from a secret key

```
ssh-keygen -y -f ~/.ssh/id_rsa > ~/.ssh/id_rsa.pub
```

## generates fingerprints from a public key

```
ssh-keygen -l -E md5 -f ~/.ssh/id_rsa.pub
```

## changing passphrase
```
ssh-keygen -p -f ~/.ssh/ssh_key.pem
```
BaseCS: Graph Theory Part 2
Tags: computerscience, basecs, codenewbie
Published: 2020-03-25 16:49:14

---
title: BaseCS: Graph Theory Part 2
published: true
description: Applying the theory of graphs into practice
tags: computerscience, basecs, codenewbie
series: BaseCS Season 2
---

Today's episode of BaseCS continues our investigation into graph theory!

We’ll start by learning how to apply the theory of graphs into practice, and see how to define a path through a graph in mathematical terms as an ordered list of directed edges. Then, we’ll shift into Leonard Euler’s mathematical proof, and learn about two new concepts: Eulerian cycles and Eulerian paths. Finally, we’ll investigate what conditions must be true in order for us to find an Eulerian cycle through a graph versus an Eulerian path! 

This whole series is sponsored by Heroku. A special thank you to Heroku for their ongoing support!

{% organization heroku %}

_To learn more about the history of graph theory and Leonard Euler, check out this quick and fun lesson:  [Byte Sized](https://dev.to/bytesized/byte-sized-episode-2-the-creation-of-graph-theory-34g1)._
some docker tips to delete containers and images
Tags: docker
Published: 2020-03-25 16:44:25

---
title: some docker tips to delete containers and images
published: true
description: 
tags: docker
---

#### deleting all the stopped containers

```shell-session
docker rm `docker ps -a -q`
```

#### deleting all the stopped containers except for recent 5 containers

```shell-session
docker ps -a -q | sed 1,5d | awk '{print $1}' | xargs --no-run-if-empty docker rm
```

#### deleting all the containers used more than 1 week ago

```shell-session
docker ps -a | grep -v 'hours ago' | grep -v 'days ago' | awk '{print $1}' | xargs --no-run-if-empty docker rm
```

#### deleting docker images which REPOSITORY and TAG is none

```shell-session
docker images | grep none | awk '{print $3}' | xargs docker rmi
```
First Streaming Ever - Git Security
Tags: security, showdev
Published: 2020-03-25 16:09:21

And I got absolutely no one live with me. 😔
But I **absolutely** loved the experience. 🤗

Through this "at home" period, I was thinking about live streaming Security Advocacy videos. I thought of Youtube and Twitch for that and finally moved to Twitch as it is very well integrated with the tool I am using ([OBS](https://obsproject.com)).

I set up my channel in a few minutes and was live after a few minutes. Just to try. 🧑🏼‍💻

I was really shaky but I enjoyed the process. I think that explaining things to an audience makes you way more aware about the thing that you are explaining (see the Lewis Pyramid of Learning that explains it).
![Lewis Pyramid of Learning](https://i.pinimg.com/736x/4a/e2/3b/4ae23b4c69014f9b6f529a8852b73d6e.jpg)

If you want to learn about Secret Leakage on Git, how to find them and how to remove them, let's have a look at my very first stream ever 🤗 : 
[https://www.twitch.tv/videos/575070434](https://www.twitch.tv/videos/575070434)

And tell me what you are thinking about it. 👨🏼‍🏫

Cheers
Help needed: Feign client communication
Published: 2020-03-25 16:23:23

Hey folks,

I need help with a solution w.r.t Feign client communication in microservices architecture. I need to add custom header before requesting another mircoservice usign feign client. Basically, I need pass some information for every request made from one micro service to another using feign client. This is for tracing information to pass trace context. 

Thanks in advance!
Best,
Navya