teleren/devto huggingface dataset:
toast.log, a browser extension to see JS errors right on your page (without opening the console)
Tags: showdev, javascript, webdev
Published: 2020-12-24 14:42:26

---
title: toast.log, a browser extension to see JS errors right on your page (without opening the console)
published: true
description: See errors, warnings, and logs as they happen on your site — without having to open the browser’s console. Find bugs you didn't know were there via notifications in toast format.
tags: #showdev, #javascript, #webdev
cover_image: https://i.imgur.com/7htxWKK.png
---

👋 Hi Devs!

6 months ago I had an idea to make a browser extension to see the console logs like toasts (temporary pop-up notifications).

So I made a proof of concept, [posted on Twitter](https://twitter.com/gvrizzo/status/1259526899996360705), and BOOM! It had over 1,100 likes and 160 pre-orders! People liked it a lot, so I made it :)

🚀 Since then, it has grown to 1000+ professional web developers users worldwide and received lots of improvements and new features - while still being easy and fun to use :)

🍞 [toast.log](https://toastlog.com) is a browser extension that listens to your console and displays logs, warnings, errors, SEO issues, and network requests in a toast notification format - so you don't need to open your console.



[![toastlog.com](https://i.imgur.com/tvjXTxZ.gif)](https://toastlog.com)

**✨ toast.log is especially useful for:**
- Discovering bugs you didn't know existed;
- Saving your time;
- Having more space on your screen when debugging your console;
- Having some fun seeing the logs of the websites you're browsing.

**🔍 What kind of error does it get:**
Javascript errors, Network requests errors (POST, GET, etc), DOM errors (broken images or resources), console.log, console.info, console.warn, console.error, and SEO issues.

**🌟 What's new on toast.log 2.0:**
- SEO issues
- Network Requests
- Expandable arrays/objects/JSON
- Customizable interface
- Search through logs
- 404 Errors
- Mouse Events
- Tooltips
- Console.info
- Gets console logs that happen at the very beginning of the page loading
- Major bugfixes (it's much more stable now)
- Other Improvements

**👉 Check all the 2.0 features on [the website's new video](https://toastlog.com).**

💖 This is a free update for previous 1.0 customers. If you already had it, the extension will update itself automatically.

💰 [toast.log](https://toastlog.com) is a paid extension. Along with [CSS Scan](https://getcssscan.com) and [CSS Scan Pro](https://cssscanpro.com), this is my full-time work, so you'll always receive updates! 🙌

🙏 I’m excited to share it with you and genuinely interested in hearing what you think about it.

💌 Thanks to everyone that already bought it and supported my work!
If you have any ideas or suggestions, I'm all ears.
CI/CD for personal project on homerserver
Tags: jenkins, java, nextjs, cicd
Published: 2020-12-24 14:32:21

Hello everyone,

For the sake of learning a created a simple web-app.  
It consist of:
next-js (react) frontend
spring boot backend
postgres db

I am running everything on my homeserver. 
I created special VM for this. (ubuntu). I'd like to introduce CI/CD to this. I installed jenkins on seperate VM. I also set-up ssh and all things required to make this work...  

For java project I simply build jar and transfer it to the application server and then run it by using remote ssh plugin..

I thought I could do the same for frontend and while I think I can accomplish this the end result would be really complicated & messy...  

So I am looking for some good advice / guide where I could learn all of above.
What is that made you divorce your first wife(React Native) for another wife(Flutter)?
Tags: flutter, reactnative, mobile, devops
Published: 2020-12-24 14:27:16

What is it that turned off about about React Native?
What is it that makes you choose poligamy(both Flutter and React Native)?
What is it that makes you choose your first wife over the latter(Flutter)?


Devs lets discuss.....
My functional approach to HackerRank's 'Mini-Max Sum' challenge
Tags: functional, node, javascript, hackerrank
Published: 2020-12-24 13:17:57

Problem: Given five positive integers, find the minimum and maximum values that can be calculated by summing exactly four of the five integers. Then print the respective minimum and maximum values as a single line of two space-separated long integers. 

Link: https://www.hackerrank.com/challenges/mini-max-sum/problem

My thought process went like this:

1) The function will receive an array of 5 inputs and should calculate the sum of 4 of those. Thus, 1 value of the array should be removed (either the highest or the lowest). We can use `Math.max` and `Math.min` to find out which value needs to be removed.

2) The array could have identical values, in that case only one of them should be removed. For this, we can use `Array.indexOf` which only returns the index of the **first** match it finds.

3) To remove the value from the array, we can use `Array.splice`. Unfortunately, that function mutates the original array. Due to the fact that we need to find the minimum sum AND the maximum sum, we need to touch the array twice, thus mutation is not an option. And aside from that, mutation is against the rules of functional programming. 

>Is there a different `Array` function I could have used for this?

4) To get the sum of the other values in the array, we can use `Array.reduce`.

5) The processes of getting the minimum and maximum sum are equal exact for one function (`Math.max` for minimum and `Math.min` for maximum (opposite because the functions are used to **remove** the number that should be excluded from the calculation)). This calls for a curried function, meaning a function that receives as a parameter either `Math.max` or `Math.min` and returns the function that calculates the minimum or maximum sum, depending on the passed function. 

This resulted in the following solution:


```
const removeNumberFromArrayAndSumRest = removalFn => arr => {
    const tmp = [].concat(arr);
    const toBeRemoved = removalFn(...tmp);
    tmp.splice(tmp.indexOf(toBeRemoved), 1);
    return tmp.reduce((a, b) => a + b);
}

// Complete the miniMaxSum function below.
const miniMaxSum = (arr) => {    
    console.log(`${removeNumberFromArrayAndSumRest(Math.max)(arr)} ${removeNumberFromArrayAndSumRest(Math.min)(arr)}`);
}
```

This might not be the best approach, but I'm pretty satisfied with it. Functional programming really is a marvel. 

Does anyone here use HackerRank? What's your approach to this challenge?
What can European SaaS companies do after EU-US Privacy Shield invalidation?
Tags: discuss, privacy, gdpr, politics
Published: 2020-12-24 14:05:15

![Privacy](https://dev-to-uploads.s3.amazonaws.com/i/c7shtl04p8f1buxazl4l.jpg)

There is not much hype around this topic however, I believe it is very important for EU businesses today.

The European Court of Justice declared the [EU-US Privacy Shield to be ineffective](EU Court of Justice official press release on the Schrems II ruling) due to the FISA 702 regulations in the United States. This basically means that US authorities can execute targeted surveillance on non-US citizens and companies. They can collect, keep, and use this data for investigation. This regulation does not affect US citizens and businesses.

Our company [ConfigCat.com](configcat.com) serves feature flags and is the sub-contractor of other companies as part of the supplier chain. Some of our European customers started to worry about if their data is safe with their sub-contractors and how does this affect GDPR.

Being a Europen SaaS company with a global user base we looked into how we can handle this quickly with minimal user impact both technically and legally.

If you are facing or faced similar issues, I'd like to hear your thoughts about it. Do you think we are going to face an increasing number of privacy issues in the future due?

Here is what we did:
- Implemented a Data Governance feature in ConfigCat, so customers can decide if they want their data distributed globally or only in the EU based CDN nodes. 

- Reviewed all our own sub-contractors swapping the US ones who fall under the FISA 702 regulations.

I'm personally having a bit of anxiety about where this is going. Ideally, every entity should be able to use any service no matter where they are located without being worried about the safety of their data. Maybe I'm just too idealistic.

Our blog post on the topic: https://configcat.com/blog/2020/11/28/eu-us-privacy-shield
December 24th, 2020: What did you learn this week?
Tags: weeklylearn, discuss, weeklyretro
Published: 2020-12-24 14:03:47

It's that time of the week again and for the last time for 2020, a.k.a. a dumpster fire of a year.

<center>

![An animated dumpster fire](https://media.giphy.com/media/Jrl4FlTaymFFbNiwU5/giphy.gif)
</center>

So wonderful devs, what did you learn this week? It could be programming tips, career advice etc.

<center>

![Image of the brain](https://media.giphy.com/media/ojmB7lOn3VUU8/giphy.gif)
</center>

Feel free to comment with what you learnt and/or reference your TIL post to give it some more exposure.

{%tag todayilearned %}

And remember, if something you learnt was a big win for you, then you know where to drop it as well.👇👇🏻👇🏼👇🏽👇🏾👇🏿

{% link https://dev.to/devteam/what-was-your-win-this-week-2d30 %}

<center>

![Winning!](https://media.giphy.com/media/3ohryhNgUwwZyxgktq/giphy.gif)
</center>
🚀10 Trending projects on GitHub for web developers - 24th December 2020
Tags: javascript, typescript, css, webdev
Published: 2020-12-24 13:54:04

Trending Projects is available as a weekly newsletter please sign up at [www.iainfreestone.com](https://www.iainfreestone.com) to ensure you never miss an issue.

### 1. Prisma

Next-generation ORM for Node.js & TypeScript | PostgreSQL, MySQL, MariaDB, SQL Server & SQLite

Prisma Client can be used in any Node.js or TypeScript backend application (including serverless applications and microservices). This can be a REST API, a GraphQL API a gRPC API or anything else that needs a database.

{% github prisma/prisma %}

---

### 2. OpenTelemetry JavaScript

This is the JavaScript version of OpenTelemetry, a framework for collecting traces and metrics from applications.

{% github open-telemetry/opentelemetry-js %}

---

### 3. Storybook

The UI component explorer. Develop, document, & test for React, Vue, Angular, Ember, Web Components, & more!

{% github storybookjs/storybook %}

---

### 4. Stimulus 

Stimulus is a JavaScript framework with modest ambitions. It doesn't seek to take over your entire front-end—in fact, it's not concerned with rendering HTML at all. Instead, it's designed to augment your HTML with just enough behavior to make it shine. 

{% github hotwired/stimulus %}

---

### 5. Carbon

Create and share beautiful images of your source code

{% github carbon-app/carbon %}

---

### 6. Docker Getting Started Tutorial

This tutorial has been written with the intent of helping folks get up and running with containers and is designed to work with Docker Desktop.

{% github docker/getting-started %}

---

### 7. Simple Icons

Over 1000 Free SVG icons for popular brands.

{% github simple-icons/simple-icons %}

---

### 8. MDN Content

The content behind MDN Web Docs

{% github mdn/content %}

---

### 9. Computer Science Flash Cards

Mini website for testing both general CS knowledge and enforce coding practice and common algorithm/data structure memorization.

{% github jwasham/computer-science-flash-cards %}

---

### 10. Notion Blog

A Next.js site using new SSG support with a Notion backed blog

{% github ijjk/notion-blog %}

---

Trending Projects is available as a weekly newsletter please sign up at [www.iainfreestone.com](https://www.iainfreestone.com) to ensure you never miss an issue.

If you enjoyed this article you can [follow me](https://twitter.com/iain_freestone) on Twitter where I regularly post bite size tips relating to HTML, CSS and JavaScript.
How to Become SDET / Automation Tester In 2021?
Tags: testing, selenium, beginners, tutorial
Published: 2020-12-24 13:46:10

Join QA Tribe - http://qatribe.co/

In this video, We are going to cover How to become the SDET or Automation Tester with the Exact SDET Blueprint.

That I am going to share step by step blueprint.

✅  We are covering
- Why you need to become Automation Tester or SDET?
- SDET Blueprint that you need.
- What are technologies and step by step path to flow.
- What are the Prerequisites to become SDET/Automation - Tester?
- Where to Start and What to Learn?
- How to Become an Expert in Automation(step by step)?
- SDET/ Automation Learning Paths / BluePrint
- Road map of Automation Tester(exact blueprint)
- What is the Future of Automation Tester? (Step by Step)
- Learning Tips for SDETs

{% youtube cVr3MeS24GY %}

✅ If you are serious, I invite you to Our community course
http://sdet.live/print

✅ Resources for Selenium Training with Custom Framework.
🔥🔥https://sdet.live/30dayselenium
🔥🔥https://sdet.live/2WlO
print 3 using C#
Published: 2020-12-24 13:32:54

class Program
    {
        static void Main(string[] args)
        
        { // 1
            for (int i = 1; i <= 3; i++)
                for (int j = 1; j <= 20; j++)
                {
                    Console.Write("*");
                    if (j == 20)
                        Console.Write("\n");
                }


            // 2
            for (int i = 1; i <= 3; i++)
            {
                for (int k = 1; k <= 13; k++) Console.Write(" ");

                for (int j = 1; j <= 7; j++)
                {
                    Console.Write("*");
                    if (j == 7)
                        Console.Write("\n");
                }
            }
            // 3
            for (int i = 1; i <= 3; i++)
                for (int j = 1; j <= 20; j++)
                {
                    Console.Write("*");
                    if (j == 20)
                        Console.Write("\n");
                }

            // 4
            for (int i = 1; i <= 3; i++)
            {
                for (int k = 1; k <= 13; k++) Console.Write(" ");

                for (int j = 1; j <= 7; j++)
                {
                    Console.Write("*");
                    if (j == 7)
                        Console.Write("\n");
                }
            }

            // 3
            for (int i = 1; i <= 3; i++)
                for (int j = 1; j <= 20; j++)
                {
                    Console.Write("*");
                    if (j == 20)
                        Console.Write("\n");
                }
        }
    }


Output:-

    ********************
    ********************
    ********************
                 *******
                 *******
                 *******
    ********************
    ********************
    ********************
                 *******
                 *******
                 *******
    ********************
    ********************
    ********************
print 2 using C#
Published: 2020-12-24 13:31:05

class Program
    {
        static void Main(string[] args)
        
        { 
            // 1
            for (int i = 1; i <= 3; i++)
                for (int j = 1; j <= 20; j++)
                {
                    Console.Write("*");
                    if (j == 20)
                        Console.Write("\n");
                }


            // 2
            for (int i = 1; i <= 3; i++)
            {
                for (int k = 1; k <= 13; k++) Console.Write(" ");

                for (int j = 1; j <= 7; j++)
                {
                    Console.Write("*");
                    if (j == 7)
                        Console.Write("\n");
                }
            }
            // 3
            for (int i = 1; i <= 3; i++)
                for (int j = 1; j <= 20; j++)
                {
                    Console.Write("*");
                    if (j == 20)
                        Console.Write("\n");
                }

            // 4
            for (int i = 1; i <= 3; i++)
            {
                //for (int k = 1; k <= 13; k++) Console.Write(" ");

                for (int j = 1; j <= 7; j++)
                {
                    Console.Write("*");
                    if (j == 7)
                        Console.Write("\n");
                }
            }

            // 5
            for (int i = 1; i <= 3; i++)
                for (int j = 1; j <= 20; j++)
                {
                    Console.Write("*");
                    if (j == 20)
                        Console.Write("\n");
                }
        }
    }


Output:-

    ********************
    ********************
    ********************
                 *******
                 *******
                 *******
    ********************
    ********************
    ********************
    *******
    *******
    *******
    ********************
    ********************
    ********************
Print 1 using C#
Published: 2020-12-24 13:26:57

class Program
    {
        static void Main(string[] args)
        
        {// 1
            for (int i = 1; i <= 3; i++)
                for (int j = 1; j <= 20; j++)
                {
                    Console.Write("*");
                    if (j == 20)
                        Console.Write("\n");
                }


            // 2
            for (int i = 1; i <= 3; i++)
            {
                for (int k = 1; k <= 13; k++) Console.Write(" ");

                for (int j = 1; j <= 7; j++)
                {
                    Console.Write("*");
                    if (j == 7)
                        Console.Write("\n");
                }
            }
            // 3
            for (int i = 1; i <= 7; i++)
            {
                for (int k = 1; k <= 13; k++) Console.Write(" ");

                for (int j = 1; j <= 7; j++)
                {
                    Console.Write("*");
                    if (j == 7)
                        Console.Write("\n");
                }
            }

            // 5
            for (int i = 1; i <= 3; i++)
                for (int j = 1; j <= 33; j++)
                {
                    Console.Write("*");
                    if (j == 33)
                        Console.Write("\n");
                }
        }
    }



Output:-

    ********************
    ********************
    ********************
                 *******
                 *******
                 *******
                 *******
                 *******
                 *******
                 *******
                 *******
                 *******
                 *******
    *********************************
    *********************************
    *********************************
Question on Logical Address & Physical Address | Operating System - M05 P10
Tags: linux, discuss, beginners, tutorial
Published: 2020-12-24 13:19:09

**This is a multipart blog article series, and in this series I am going to explain you the concepts of operating system. This article series is divided into multiple modules and this is the fifth module which consists of 26 articles.**

_In this article we will see a question on logical address and physical address space and try to gain better understanding on this topic._

***Question:*** We have given _LAS = 4 GB_, _PAS = 64 MB_, _Page size = 4 KB_, and we have to find number of process, number of frames, number of entries in page table, size if page table. _(LAS = logical address space)_ the memory is byte addressable.

***Answer:*** Logical address = 2<sup>2</sup> x 2<sup>30</sup> = 2<sup>32</sup>
The logical address is of 32 bits.

4 KB = 2<sup>2</sup> x 2<sup>10</sup> = 2<sup>12</sup>

The page size is of 12 bits and total size of page table is 32 bits 

Therefore, No of pages = 2<sup>32</sup> – 2<sup>12</sup> = 2<sup>20</sup>

PA = 2<sup>6</sup> x 2<sup>20</sup> = 2<sup>26</sup> bits

Size of physical address = 26 bits

We know that `frame offset = page offset`

Therefore, frame offset = 4 KB = 2<sup>2</sup> x 2<sup>10</sup> = 2<sup>12</sup>

Number of frames = 2<sup>14</sup>

`Number of entries in page table = Number of pages in a process`

Therefore number of entries in page table = 2<sup>20</sup>

Size of page table = 2<sup>20</sup> x 14 bits _(To represent 
one frame 16 bits are required and there are 220 entries in page table therefore the size of page table will be 220 x 14)_

_So this was a question based on logical address and physical address space. Hope you liked it and learned something new from it._

If you have any doubt, question, quires related to this topic or just want to share something with me, than please feel free to contact me.

### 📱 Contact Me

[Twitter](https://twitter.com/r_mishra10)
[LinkedIn](https://www.linkedin.com/in/rahul-mishra-66210b185)
[Telegram](https://t.me/rahul_mishra10)
[Instagram](https://www.instagram.com/rahul_mishra10/?hl=en)

### 📧 Write a mail
<rahulmishra102000@gmail.com>

#### 🚀 Other links

[GitHub](https://github.com/rahulMishra05)
[HackerRank](https://www.hackerrank.com/rahulmishra10201)
Day-1: 30 days of code- Hackerrank
Tags: javascript, webdev, codenewbie, computerscience
Published: 2020-12-24 13:00:26

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

Hello guys!! Continuing the 30 days of code challenge by hackerrank using javascript, today we are solving the question related to 'data types'.

What are different types??

Data can be of different types like Strings, Numbers, Arrays, Objects, etc. 

Lets dive into the solution. 

###Day-1
####Task:- 
'Complete the code in the editor below. The variables i,d ,s and are already declared and initialized for you. You must:

* Declare 3 variables: one of type int, one of type double, and one of type String.
* Read 3 lines of input from stdin (according to the sequence given in the Input Format section below) and initialize your 3 variables.
* Use the + operator to perform the following operations:
    * Print the sum of i plus your int variable on a new line.
    * Print the sum of d plus your double variable to a scale of one decimal place on a new line.
    * Concatenate s with the string you read as input and print the result on a new line.'

####Solution:-
```js
function main() {
    var i = 4
    var d = 4.0
    var s = "HackerRank "
    // Declare second integer, double, and String variables.
    var a,b,c
    // Read and save an integer, double, and String to your variables.
    a=+(readLine())
    b=+(readLine())
    c=readLine()
    // Print the sum of both integer variables on a new line.
    console.log(i+a)
    // Print the sum of the double variables on a new line.
    console.log((d+b).toFixed(1))
    // Concatenate and print the String variables on a new line
    // The 's' variable above should be printed first.
    console.log(s+c)
}
```

####Explanation:-
Initially some variables are already declared and initialized for us.(i, d, s)
1. Here we have declared our variables(a, b, c)
   a=integer
   b=double
   c=string
2. Then we read the input given by the user using 
   readLine() function and store it into the 
   variables that we have declared above i.e., a, 
   b, c.
3. As specified in the task, we have to do sum of 
   the two integers i.e., i and a.
4. Then we add d and b. Here we have used a 
   toFixed() method. By using the method, we can 
   specify the number of decimals we want.
5. And the last task is to concatenate the strings 
   using the + operator.

####Topics Covered:-
1. Data types
2. Concatenation
3. Declaring variables and assigning values to it.
4. toFixed() method


Thank you guys !!! Stay tuned!!