teleren/devto huggingface dataset:
Video: Take screenshots using built-in commands in Chrome/Edge
Tags: web, chrome, edge
Published: 2021-01-30 18:50:31

---
title: Video: Take screenshots using built-in commands in Chrome/Edge
published: true
date: 2021-01-30 00:00:00 UTC
tags: web, chrome, edge
canonical_url: https://swimburger.net/blog/web/video-take-screenshots-using-built-in-commands-in-chrome-edge
cover_image: https://swimburger.net/media/sglhi1hj/screenshot-social.png?anchor=center&mode=crop&width=1000&height=420
---

Chromium browsers such as Chrome and Edge have many lesser known features. One of those features is the ability to take screenshots of your current tab content. In this video you will learn about the 4 different ways to take screenshots in Chromium browsers:

{% youtube E7l-uCAUFEo%}

If you prefer written content, check out my blog post: [How to take screenshots using built-in commands in Chrome/Edge](https://swimburger.net/blog/web/hidden-gem-take-screenshots-using-built-in-commands-in-chrome-edge).
MongoDB Aggregation Pipeline Challenge - Challenge 21
Tags: webdev, mongodb, challenge, 365daysofcoding
Published: 2021-01-29 23:55:42

Another Challenge!

Big Ice Cream Co is the largest ice cream franchisor in the US. Each of their 100+ franchisees has between 1 and 25 locations. Each location tracks its customer satisfaction score which can be below average, average, or above average. The CEO of Big Ice Cream Co wants to see a report that shows the customer satisfaction scores for each location grouped by franchisee.


Example:

| franchiseeId | franchiseeName | belowAverage | average | aboveAverage | totalLocations |

|---------------------|---------------:|--------------|---------|--------------|----------------|| 

search | True | 1 | 10 | 14 | 25 || 

institutionCodes | False | 10 | 3 | 0 | 13 || 

aggregatorPartnerId | True | 0 | 3 | 0 | 3 |


This data is stored in the franchising MongoDB, there are two collections:


1. franchisee

2. locations


Franchisee schema
```
{
    companyName: { type: String },
    signedDate: { type: Date },
    owner: { type: String }
}
```
Locations Schema
```
{
    franchiseeId: { type: ObjectId },
    address: {
        state: { type: String },
        city: { type: String },
        zip: { type: String },
        streetAddress: { type: String },
        secondaryAddress: { type: String }
    },
    customerSatisfactionScore: { type: String, enum : ['below average','average', 'above average'] }
}
```

As usual, I will be posting the solution in another post! I will post this solution with an explanation tomorrow!
Refresh Setup
Tags: archlinux, linux
Published: 2021-01-29 23:53:34

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

My OS broke 2 days ago because while I was -Syu, my neighborhood had a blackout. What luck, right?

Anyways I had to reformat my OS and just started new again. I have to say that I am happier now with this setup than when I had it.

I made my ncmpcpp much nicer than the last time. I switched my terminal (urxvt) colorscheme and font to Hack instead of the RobotoMono.

I actually got Vim to use the colorscheme to what I want which is Tokyonight and also have the AirlineTheme to be the same.  It is amazing.
My neofetch now also shows the correct song being played.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/fvtq4jc10aji15ob15my.png)
It really helps when you have a lot of your dotfiles in github.
I’m 53. Just graduated from University. What do I do now? 
Tags: advice, discuss
Published: 2021-01-29 23:32:58

---
title: I’m 53. Just graduated from University. What do I do now? 
published: true
description: advice for old dog
tags: advice, discuss
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/bq62agmpzeh7pk23ritm.jpeg
---

I’m 53. Just finished this part of University. Hold a senior role in the broadcast industry. How to transition into the dev community on a professional level? Basically - get a job outside of broadcast. 

Things to consider when advising:

1. I’ve never applied for a job in my life. Ever. 
2. I’m used to extreme pressure. At the second by second level.  
3. I’m used to getting people to perform at a high enough level to get what is needed done, done. 

Any advice on how to proceed from here, would be greatly appreciated. I’m in Sydney, Australia.
Automation Common Utilities
Tags: java, selenium, appium, testing
Published: 2021-01-29 22:46:11

Utility classes are an efficient way of allowing you to create methods that you often re-use in your code.

Adding utilities to your automation infrastructure based on Appium/Selenium is tough and takes a long time to implement so that I’m sharing some common utility classes in Java.

**Utility classes criteria:**
* A Utility class should be final.
* A Utility class should contain a private constructor.
* A Utility class should only contain final static fields.
* A Utility class should only contain static methods.

Notes: 
Used open-source libs only.
Please follow the above criteria in creating your customized utility class.

[TestNG Retry Listener](https://gist.github.com/naelabdeljawad/f47f125870e13c9472253b84e389adad)
[Appium Utilities](https://gist.github.com/naelabdeljawad/5e1af8fd7f4c783c8e460182daf8871f)
[Appium Capabilities CSV Manager](https://gist.github.com/naelabdeljawad/95fb86354316e04bc1daabb43006e1ed)
[Selenium Utilities](https://gist.github.com/naelabdeljawad/896cb822ff65ee071e41d6d8eafe3167)
[PDF Utilities](https://gist.github.com/naelabdeljawad/ae402d94b3b5be571bdb99a1790f6358)
[File Reader Utilities](https://gist.github.com/naelabdeljawad/d1075e2e54a640f560d2c428a7485fde)


Happy Testing 😊
New Dark Mode
Tags: showdev, wordpress, php, javascript
Published: 2021-01-29 22:15:38

Our [website](https://nightwolf.dev) now has a toggle for Dark/Light mode! 

A little javascript was used to toggle the sun/moon appearance, the dark-mode body class, and setting a cookie to store which mode you prefer.

Within the body tag, we read the cookie with PHP to apply the dark mode class if applicable on page load. 

Let me know what you think? Thank you!

---
#### Visit our website at [https://nightwolf.dev](https://nightwolf.dev) and follow us on [Facebook](https://www.facebook.com/NightWolfDevelopment) and [Twitter](https://twitter.com/nightwolfdev)!
---
What problem do you want  to solve when use Express.js inside AWS Lambda?
Tags: discuss, serverless, node, aws
Published: 2021-01-29 22:11:15

Hi! Two months ago I have published article **Six reasons why you shouldn’t run Express.js inside AWS Lambda**. 

And looks like there are many people that disagree with this. Maybe somebody here can provide another props and cons of Express.js inside AWS Lambda? 

Links:

* dev.to - https://dev.to/max_vynohradov/six-reasons-why-you-shouldn-t-run-express-js-inside-aws-lambda-2o88

* medium.com - https://medium.com/dailyjs/six-reasons-why-you-shouldnt-run-express-js-inside-aws-lambda-102e3a50f355

* hackernoon.com - https://hackernoon.com/6-reasons-why-you-should-not-connect-expressjs-and-aws-lambda-b71n31st

* reddit.com - somebody created 3 topics - https://www.reddit.com/search/?q=Six%20reasons%20why%20you%20shouldn%E2%80%99t%20run%20Express.js%20inside%20AWS%20Lambda
The Linux script command.
Tags: python, beginners, linux
Published: 2021-01-29 21:48:43



Linux has a built in command called script. Invoking it generates a file that effectivly records everything which is subsequently typed into and/or displayed in the terminal until such time ctrl d is pressed. Doing so ends and saves the session. Play back in the terminal is as simple as invoking another command together with the path to the saved file.    

```bash
script --help

Make a typescript of a terminal session.

Options:
 -a, --append                  append the output
 -c, --command <command>       run command rather than interactive shell
 -e, --return                  return exit code of the child process
 -f, --flush                   run flush after each write
     --force                   use output file even when it is a link
 -o, --output-limit <size>     terminate if output files exceed size
 -q, --quiet                   be quiet
 -t[<file>], --timing[=<file>] output timing data to stderr or to FILE
 -h, --help                    display this help
 -V, --version                 display version

```

Simply entering...

```bash
$ script --t=script_log -q scriptfile
```
...will invoke `script` and recording of the terminal session.

To play back the session it's...
```bash
scriptreplay --timing=script_log scriptfile
```
More details for reference [here](https://linoxide.com/linux-command/script-command-recorder/). Could be good to include in a repo as a means to demonstrate functionality of a CLI. More typical I suppose would be to screen record a recorded demo...

---
**URL Scraper and site map builder.**

{% vimeo 506287073 %}

I have coded a CLI scraper and site map builder. A first for me. Enjoying the process and learning. Got to a point of mostly tweaking. Time to move on. Good enough will do. Here's the repo on [GitHub](https://github.com/alxtrnr/alxscrpr).
How do I zip files in node.js?
Published: 2021-01-29 21:47:04

Hello, I have a client app which shows a list of PDFs . I want the user to be able to check some of them and click a download button which will download a zip file containing all the files. The way I can think of doing this is creating a folder in the backend placing all the files in it, zipping and sending. Is there any way I can create a zip on the fly and send it instead of having to download all the files in the backend?
How do I redirect a service outgoing traffic to another local SOCKS5 service running on port 1080?
Published: 2021-01-29 21:32:57

Hello,

I want to redirect a service outgoing traffic to another local socks5 service running on port 1080

OS: Ubuntu 20.04

This is what I currently have.

- SSC -> shadowsocks client service (running in docker containers)
- SSS -> shadowsocks server service (running in docker containers)
- Surrounded number in dot lines -> service port

![See this picture][1]


And this is what I really want. 
![See this picture][2]


This is where I need a solution.
*The solution could be with iptables*
![See this picture][3]

I tried these solutions adjusted to my case but they did not work for me:

[How to send all internet traffic to a SOCKS5 proxy server in local network?](https://android.stackexchange.com/questions/221389/how-to-send-all-internet-traffic-to-a-socks5-proxy-server-in-local-network)

[How to force all Linux apps to use SOCKS proxy](https://superuser.com/questions/1401585/how-to-force-all-linux-apps-to-use-socks-proxy)

  [1]: https://i.stack.imgur.com/3KAIT.jpg
  [2]: https://i.stack.imgur.com/57kAV.jpg
  [3]: https://i.stack.imgur.com/0DRJf.jpg
Introducing: Open Web Docs!
Tags: webdev, beginners, javascript
Published: 2021-01-29 21:06:49

Open Web Docs is a new collective project between [Google](https://web.dev/open-web-docs/), [Microsoft](https://blogs.windows.com/msedgedev/2021/01/25/welcome-open-web-docs/), Mozilla, [Coil](https://press.coil.com/press-news/coil-is-proud-to-support-open-web-docs), [W3C](https://www.w3.org/blog/2021/01/welcome-to-open-web-docs/), Samsung, and [Igalia](https://www.igalia.com/2021/01/25/Open-Web-Docs.html), to support the creation and maintenance of strategic web platform documentation. 

Open Web Docs is dedicated to supporting browser-agnostic, community-driven, and high-quality web developer documentation. **This new initiative is not a new documentation site, instead, Open Web Docs is committed to improving existing platforms through many different community contributions.**

{% twitter 1353748877111918593 %}

Open Web Docs collaborators are supported by sponsors like Coil, Google and Microsoft, Igalia, and many other donors on Open Collective.

Open Web Docs long term roadmap will be published soon. However, the   [initial goals](https://github.com/openwebdocs/project/blob/main/2021-goals.md) are focused on supporting MDN's recent [infrastructure transition](https://hacks.mozilla.org/2020/12/welcome-yari-mdn-web-docs-has-a-new-platform/) and contributing to core web technology documentation, browser compatibility data, and JavaScript documentation on MDN Web Docs. 

You can learn more or join the adventure at the [Open Web Docs collective](https://opencollective.com/open-web-docs) page, on [GitHub](https://github.com/openwebdocs), or by following [@OpenWebDocs](https://twitter.com/OpenWebDocs) for more exciting updates.
How do I redirect a service outgoing traffic to another local SOCKS5 service running on port 1080?
Published: 2021-01-29 20:53:36

Hello,

I need to redirect a service outgoing traffic to another local socks5 service running on port 1080

OS: Ubuntu 20.04

This is what I currently have.

- SSC -> shadowsocks client service (running in docker containers)
- SSS -> shadowsocks server service (running in docker containers)
- Surrounded number in dot lines -> service port

![See this picture][1]


And this is what I really want. 
![See this picture][2]


This is where I need a solution.
*The solution could be with iptables*
![See this picture][3]

I tried these solutions adjusted to my case but they did not work for me:

[How to send all internet traffic to a SOCKS5 proxy server in local network?](https://android.stackexchange.com/questions/221389/how-to-send-all-internet-traffic-to-a-socks5-proxy-server-in-local-network)

[How to force all Linux apps to use SOCKS proxy](https://superuser.com/questions/1401585/how-to-force-all-linux-apps-to-use-socks-proxy)

  [1]: https://i.stack.imgur.com/3KAIT.jpg
  [2]: https://i.stack.imgur.com/57kAV.jpg
  [3]: https://i.stack.imgur.com/0DRJf.jpg
Using API's in your React App pt. 2 
Tags: react, javascript, functional
Published: 2021-01-29 20:18:45

Today I'm going to continue working with the [Open Map API](https://openweathermap.org/api) we are going to see how we can make our data more dynamic. First I'm going to build out a user input field so the users of my app can enter any city they'd like and not just get the weather for one city.

To accomplish this task we will navigate back to the `forecast.js` component and refactor the code inside the `<button>` tag. Since I want my users to be able to enter any city they choose we will need to add a `<form>` tag, that will look something like this;
```
           <form onSubmit={getForecast}>
                <input
                    type="text"
                    placeholder="Enter City"
                    maxLength="50"
                    value={city}
                    onChange={(e) => setCity(e.target.value)}
                    />
                <label>
                    <input
```
Now if you navigate to your browser you will see you now have an input field for city. The next thing I want to refactor is the fact that currently our temperature is being set in Kelvin(what even is that?) so we will give our users options to choose from Fahrenheit or Celcius. To accomplish this I added two radio buttons one for each unit of measure, that looks like this;
```
                    <input
                        type="radio"
                        name="units"
                        checked={unit === "imperial"}
                        value="imperial"
                        onChange={(e) => setUnit(e.target.value)}
                        />
                    Fahrenheit
                </label>
                <label>
                    <input
                        type="radio"
                        name="units"
                        checked={unit === "metric"}
                        value="metric"
                        onChange={(e) => setUnit(e.target.value)}
                        />
                    Celcius
                </label>
```

So, what is this `setUnit` you might be asking. Well, I have added that to my state as you can see below, with the initial value set to `'imperial'` we can use this to grab the value that the user selects then display that unit of measure. 

So now if you enter a city name and select the radio button for the unit of measure you'd like you will see something like the below.


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

 
There we go! We have accomplished our goal of making our weather app more dynamic. Next week I will add some styling, see you then!
Using DFS to implement getElementById
Tags: javascript, webdev, algorithms
Published: 2021-01-29 19:42:12

Being a front-end engineer, there could be less chances on implementing data structure and advanced algorithms in daily development work. However, to be hired as a front-end developer, we still need to know data structure and algorithms.

I was very skeptical on why engineers need to be evaluated on the theoretical knowledge rather than working skills and knowledge. But as time goes on and getting more experience as a developer, I do understand the importance of such theoretical knowledge.

One of the great advantages of having good understanding of data structure is that when analyzing a system, one can identify what data structure could be a best fit. And after the data structure is set, one can find what could be the best algorithm to be used as well if needed.

For examples, let's think about HTML DOM. For people who know data structure, they will instantly think that HTML DOM is in [tree](https://en.wikipedia.org/wiki/Tree_(data_structure)) structure. And furthermore, let's make an assumption that browsers do not provide DOM API. In order to find a specific DOM element in the HTML, one can guess what the best algorithm would be to implement that search functionality. In this case, DFS/BFS. For people who do not contain the knowledge of data structure and algorithm, this would be too challenging task or they could end up poorly-performing solution.

Here is a few lines of code to implement DFS that traverses a tree  in Javascript. 

```js
/**
 * @param {TreeNode} root
 * @void
 */
const dfs = (root) => {
  const stack = [root];
  while (stack.length > 0) {
    const node = stack.pop();
    console.log(node.val); // print a node
    for (const child of node.children) { 
      stack.push(child);
    }
  }
};
```

And with slight changes to the DFS function, we can easily implement a search function by DOM id.

```js
/**
 * @param {HTMLElement} root
 * @param {string} id
 * @returns {HTMLElement|null}
 */
const getElementById = (root, id) => {
  const stack = [root];
  while (stack.length > 0) {
    const node = stack.pop();
    if (node.id === id) {
      return node;
    }
    for (const child of node.children) { 
      stack.push(child);
    }
  }
  return null;
};
```

It's that simple! With that in mind, you can basically implement your own DOM traversal/search functions using your knowledge in tree data structure (though your colleagues would not approve your PR).

Knowing data structure and algorithm will definitely help your daily development. It will open up more opportunities as you know more about it. And also once you have a mindset installed thinking about data structure/algorithm upfront before implementing something, it will help you to produce better and more efficient solution.
Why is Happy Wheels shutting down?
Published: 2021-01-29 08:23:15

[Happy Wheels](https://happywheelsgame.io/) - one of the most interactive games and the most played online free web browser-based game of all time.
The game is best known for its graphic violence and features several player characters, who use different, sometimes atypical, vehicles to traverse the game's many levels. 
Happy Wheels is a side-scrolling, physics-based, there is a dark and tricky physics-based puzzling arcade game that is fun for some and horrifying for others. 
Features: over 60 unique and challenging levels, deadly obstacles: spikes, mines, wrecking balls, harpoons, and much more, smooth, realistic physics...

How To Play https://happywheelsgame.io
Use arrow keys to move.
Use the space key to primary action (after ejecting: Grab).
Use Shift/Ctrl to perform secondary actions.
Use Z to eject.

Tips and Tricks
You can pause/resume/restart on the game screen.
You can change character in-game.
You can view/save your replay.
Linux travado por falta de espaço: Uma solução
Tags: braziliandevs, linux, mint, tutorial
Published: 2021-01-29 19:41:27

Hoje vou passar pra você uma dica simples que pode te ajudar como me ajudou. Sabe aqueles avisos que seu SO dá quando o espaço em disco está ficando cheio? Pois é. Meu Linux Mint travou, eu tinha 95GB só para ele, não sei como encheu e também não consegui acessar a interface do Cinnamon para remover alguns programas.

###Uma opção
Rodando pela internet, depois de muito trabalho eu encontrei uma possível solução no StackExchange. Pelo que parece, o Linux reserva parte do disco, não sei qual o motivo, cerca 5% pra ele. Então, a proposta é apagar alguns arquivos e também diminuir essa reserva pra 1% só para poder acessar seu Linux normalmente e poder remover alguns programas, apagar alguns logs, ou o que mais você puder apagar.

###Resolvendo(Ou tentando...)
Não sei como sua distro vai se comportar, se aparecer na tela de login da interface, pressione "ctrl + alt + F1", o F1 pode ser substituído até o F6 caso o F1 não abra, depois faça o login. Com a sessão aberta no terminal use o comando `df -h` para confirmar seu espaço livre. Observe a coluna "Montado em", esta indica o que é usado em cada partição. O sistema fica instalado onde tem apenas uma barra "/" e o nome da partição é a primeira coluna, algo como "/dev/sda8", que é o meu caso. Pra mim apareceu que tinha 4GB livre, mas para o sistema constavam 0% livres, foi o que mais achei estranho.
Então execute o comando a seguir, com usuário `root` para diminuir o espaço reservado(substitua /dev/sda8 por sua partição raiz do sistema) e caso sua distro seja derivada do Debian/Ubuntu, como o Linux Mint, você vai precisar usar o comando "sudo" antes dos comandos deste tutorial para poder dar permissão de administrador.

`tune2fs -m1  /dev/sda8`

ou

`sudo tune2fs -m1  /dev/sda8` para usuários de Debian e derivados

Agora tente acessar sua interface gráfica e apague o que puder na raiz do seu sistema, principalmente programas e arquivos temporários, ou, caso você use a mesma partição para o sistema e os arquivos pessoais, apagar vídeos e músicas também vai te ajudar. Se não sabe o que pode apagar, apenas desinstale programas que não são do sistema. Após remover uma boa quantidade de arquivos/programas, execute novamente no `df -h` e veja se já liberou pelo menos uns 6% a 8% da partição raiz(/). Estando tudo certo, volte a configuração de reserva para um tamanho maior, até porque não sei para que serve :D

`tune2fs -m5  /dev/sda8`

###E então...
Depois de concluir, eu percebi que o Timeshift estava tentando fazer backup mesmo sem espaço suficiente para o backup completo e acabou ocasionando esse problema. Então é isso. Espero que tenha lhe ajudado a resolver a curto prazo o seu problema assim como resolveu pra mim, agora posso voltar a escovar bytes. Abraço!

##Referências
https://unix.stackexchange.com/questions/34140/tell-fs-to-free-space-from-deleted-files-now