teleren/devto huggingface dataset:
What are your thoughts on third-party cookie blocking?
Tags: discuss
Published: 2020-05-04 16:57:07

In March, safari [started blocking all third party cookies](https://webkit.org/blog/10218/full-third-party-cookie-blocking-and-more/). And, Google Chrome is also doing the same by 2022, with [some exceptions](https://brave.com/ok-google/).

At the moment, safari blocks **all third party** cookies which makes some tasks hard.

* Affiliate marketing? Most companies use third-party affiliate trackers. So, they cannot track users on Safari now. And, they won't be able to do it on Chrome after 2022. So, will third-party affiliate companies (like HasOffers, Tapfilliate) die?
* When using a third-party commenting platform, you'll always have to click the login button every time you need to comment using your account.

The only way to access third party cookies is by using the [Storage Access API](https://webkit.org/blog/8124/introducing-storage-access-api/), which requires the approval of the user. (The message on safari is like "Allow example.com to use cookies while browsing example2.com").

But, in safari, (unfortunately) this access permission is only valid for the current tab session (if you close the tab, you'll need to give access again). And, the user should click a button or tap the screen if we need to request access.

For commenting platforms, this works fine. We can show a login button and the user will need to click it every time to comment (Yes, it's annoying).

However, ad companies (including Google Ads), affiliate companies won't be able to track users. They can't add a button like "Track my data to give someone else a commission" and ask users for permission.

I have to say that this is definitely a good approach to user's privacy.

I'd like to ask, as devs, what are your thoughts on this update?
Divastra, my corona fighter website.
Tags: divastra, corona, website, project
Published: 2020-05-04 16:49:56

Thanks freind for giving so much love to my old corona fighter website.

Seeing your love I have redesigned with an unbeatable user experience.

It's new name is Divastra https://divastra.github.io 

It is having a lot of qualities to help us in fighting coronavirus. Just explore it.






It's my challenge that the quality content which I have provided on my website, you will get nowhere.




I am doing my part by contributing to anti corona movement in the way what I can do. Now its your part what you can do for your country. 

Just share it to your near and dear ones on whatsapp, facebook, and all social medias.


I'm not a proffessional, I'm also a student like you. If I can do this much then can't you just share it and become corona fighter. 

I will be hopping for a positive response from your side. 

This is the website link: https://divastra.github.io
100daysofcode Flutter
Tags: 100daysofcode, flutter
Published: 2020-05-04 16:42:54

day 56/100 of #100daysofcode #Flutter
Learning Flutter , courses Udemy from
@maxedapps

oday implements htt.post , some logic with loading
https://github.com/triyono777/100-days-of-code/blob/master/log.md
Remote Interviewing Tips for Developers
Tags: career
Published: 2020-05-04 16:36:48

I have been interviewing developers and engineers for years. Either for onsite positions or remote ones. Over the years I have realised that not many people share developer-specific tips for interviewing remote. This isn't about passing the interview technically speaking, but about how you can develop the "interviewing" skills that are going to help you ace your interview.

####Remote interviews can give you a huge advantage, you are in your own environment. If you are well prepared you will ace it.

Preparation and practice is key. 

Stay cool, Keep smiling, Keep your energy high. Video kills energy so look into the camera and talk to your interviewer. 

After a few goes's this will help you!


##TURN OFF ALL YOUR NOTIFICATIONS

Seriously, everyone can tell when you stop paying attention in an interview because you just got a notification about a new awesome post on Dev.to ;) 

Even though you are probably at home in front of your computer, remove as many distractions you possibly can.

##COMMUNICATING CLEARLY IS KEY

Get your camera in line with your eyes. 

Make sure people can see your face, avoid backlighting. 

Get a headset. 

Make sure you sound good.

Look into the camera. 

Respond to the interviewer by looking at them.

##PRACTICE WHITEBOARD & PAIR CODING INTERVIEWS

Pair coding and whiteboard interviews are both pretty standard for most dev jobs these days. You are still probably going to have to do one during your full remote interview process. 

The technology has got way better since I started doing this 8 years ago. There are many cool collaborative pair coding and whiteboarding tools. But let us be honest, they are all a bit of a nightmare the first time you use one!

Practice makes perfect.

This is going to make you look like a pro in the interview.

I hope this helps and if you want to know more...

#####YOU CAN FIND ALL MY REMOTE INTERVIEWING TIPS OVER ON MY 

{% medium https://medium.com/@emergingrecruit/how-to-ace-your-remote-interview-f33a1a45497a %}

###What are your top tips for interviewing?
How to Implement Dynamic Components on Vuejs
Tags: vue, javascript, frontend
Published: 2020-05-04 16:36:15

The single-page application is now a standard in most scenarios. Decoupling the business logic from the presentation brings enormous advantages in terms of efficiency and quality. The fact that most frameworks build a static set of files is an additional benefit for reducing hosting or deploying complexity. These characteristics are good for an enterprise application, but I found it quite limiting when I starting to develop the frontend of [RawCMS](https://github.com/arduosoft/RawCMS), my opensource headless cms. In fact, I needed a modular system where contributors could add features to the interface without any limitation or building anything. In this article, I will go over the step I have done presenting my final solution.
Spoiler: I ended using VueJs with Vuex and plain javascript. The result was a dynamic engine for loading components from any public URL and, if I could come back to the beginning, I will make the same decision again 😆

[Read Full Article](https://towardsdatascience.com/dynamic-components-vuejs-13c3e70431cc?source=friends_link&sk=ecdb0f936f8cae2a6ea3c17f3e9195ad)
I'm mapping Dev brands & logos out there. Would you add any other brand?
Tags: help, discuss, showdev, opensource
Published: 2020-05-04 16:35:57

Hello world,

This is my first post around here, since I've been working a on new brand for a personal project I wanted to share with you this map of dev-related brands, so you can use it as inspiration or even add other brand that could be trendy nowadays and I'm missing.

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

Thanks for passing by!
What I learned by adding webmentions to my blog
Tags: webmentions, gatsby, blog
Published: 2020-05-08 16:14:50

---
title: What I learned by adding webmentions to my blog
published: true
date: 2020-05-04 16:31:03 UTC
tags: webmentions,gatsby,blog
canonical_url: https://krzysztofzuraw.com/blog/2020/webmentions-on-blog
---

I’ve recently added [webmentions](https://indieweb.org/Webmention) to my blog.By using them you can get reactions/comments from e.g Twitter into your site. In such a way you are at least one step further in owning your content - especially one that youpost on social media. You can read more about all IndieWeb movement [here](https://indieweb.org/). Below are a couple of points that I learned from adding webmetions to my website:

- I’m really grateful for tutorials made by [Knut Melvær](https://dev.to/kmelve/getting-started-with-webmentions-in-gatsby-15e7)and [Sung codes](https://dev.to/dance2die/clientside-webmentions-in-gatsby-4bgc) - without them,it will take me a lot longer to add webmentions. If you need tutorials on how to add webmentions to your blog - I totally can recommend those. The rest of the points assume that you read those two tutorials
- When you need to validate your microformats - you can use netlify deployment previews instead of deploying and checking it every time on the production website as I did
- You need to somehow filter webmentions to get the right ones for the blog - I recommend youfollow advice from [here](https://www.knutmelvaer.no/blog/2019/06/getting-started-with-webmentions-in-gatsby/#07ba6529dc86)and add full url + slug to your gatsby context. You may avoid frustration on filtering and thinkingthat you are smart than the others - you aren’t
- If you happen to try figure out what are all possible values of `wmProperty` - please ping me as Idid not yet found documentation for that so right now only `mentions` from twitter are being shownon my site - maybe this blog post will trigger other so I can test them 😃
- Querying for `webMentionEntry` isn’t the same as querying for `allWebMentionEntry` and then filtering the results. The first one will give you only one entry for given url - where the other get all entries that you can use.
- In the end, two more resources that are worth reading: [Static Indieweb pt2: Using Webmentions](https://mxb.dev/blog/using-webmentions-on-static-sites/) & [Clientside Webmentions](https://www.swyx.io/writing/clientside-webmentions/)
Git is awesome and terrible at the same time
Published: 2020-05-04 16:30:42

Git is awesome, been using it for almost 3 years.
But whenever i run into complex git error's, i feel like I don't even recognize git commands altogether, madarian makes more sense than git then. But i never lost my work on git, sometimes it takes less time to code than fix git issues on the same code.
Anybody else who feels the same.
#Git #code #perplexing
How can I writer on_conflict in graphQl file
Published: 2020-05-04 16:11:58

how can I write on_conflict in graphQl file with multiple fields to avoid conflicts for bulk insert? I'm using a manifold plugin for client classes generation.
For example:
The below query I used hasura the same one I need to keep in graphQl file
mutation upsert_article {
  insert_article (
    objects: [
      {
        id: 2,
        title: "ex quis mattis",
        content: "Pellentesque lobortis quam non leo faucibus efficitur",
        published_on: "2018-10-12"
      }
    ],
    on_conflict: {
      constraint: article_pkey,
      update_columns: [title, content]
    }
  ) {
    returning {
      id
      title
      content
      published_on
    }
  }
}
Using Router Props in React
Tags: beginners, react
Published: 2020-05-04 16:04:00

It is common in React to use Routes from 'react-router-dom'.  One of the advantages of using Routes is the router props that are automatically provided with the route.  These router props allow you to go forward or back in your application and are helpful for sending a client to specific locations when they submit a form, or click on a button or link.

React-router-dom also provides the render method which is used to pass the router props to a specific component.

```react
<Route exact path='/'
       render={(routerProps) => {
         return (
           <HomePage handleLogin={this.handleLogin}
                     routerProps={routerProps} />
         )
       }}
/>
```  
This example explicitly shows how the router props are being passed to the HomePage component.  Other props can be passed to the component as well along with the router props.

In the home page component, the props will be used to push a user to a new page and route after they login successfully.  In the home page component there is a handleSubmit method that is called after a user enters in an email and password.  After the request comes back successfully, the router props are used to push a new route onto the history.

```react
this.props.routerProps.history.push(`/users/${id}`)
```
Another useful part of the router props is the match property that allows a component to access an id from the URL on the page.  Again the router props would be passed to the component that needs access to them using the render method.  An example of a component using the match property would be if a user clicks on a link that has a specific id and is redirected to the page with that id.  The router props could be used in the react life cycle method componentDidMount() to access the URL to load the correct page.

```react
componentDidMount() {
  const id = this.props.routerProps.match.params.id

  fetch(`http://localhost:3001/api/v1/groups/${id}`, {
      method: 'GET',
      headers: {
        'Authorization': `Bearer ${localStorage.getItem('token')}`
      }
    })
      .then((response) => response.json())
      .then((result) => console.log(result))
}
```
Another way to access the router props is to add an import statement at the top of the component and import 'withRouter'.

```react
import { withRouter } from 'react-router-dom';
```
Then in the export default statement at the end of the component you would wrap the component in 'withRouter'.
```react
export default withRouter(HomePage);
``` 
There are several ways to redirect or send a user to another route in an application and using the router props is one solution that can be successfully utilized with the history and match properties.
Yandex is hosting a webinar for junior devs
Tags: firstyearincode, beginners, codenewbie
Published: 2020-05-04 16:02:36

---
title: Yandex is hosting a webinar for junior devs
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/cm4ejwagcn0m5secdest.jpg
published: true
description: May 5 on Youtube
tags: firstyearincode, beginners, codenewbie
---

_Update:_ Thanks for tuning in, everyone! If you missed the webinar, you can catch the recording [at this link](https://www.youtube.com/watch?v=kOL08pJscxg).

----

Join me and Practicum by Yandex (a development bootcamp) tomorrow, May 5, for a free webinar where we'll discuss:

- Getting more job leads
- Improving your resume
- Avoiding burnout at work
- And more!

{% twitter 1257334294348955650 %}

If you'd like to submit questions in advance for the Q&A portion, you can do so [at this link](https://docs.google.com/forms/d/e/1FAIpQLSer3pPvl69QXV2FXKBzG17kPtzOIX4N2GLWKJwzUys17BAFzg/viewform).

Hope to see you there!
Patching my graphics driver in FreeBSD
Tags: Freebsd, gfx, c
Published: 2020-05-04 15:59:48

While going through an archive of content I made during the transition to some new hardware I found some steps in FreeBSD which may be useful to others in a similar situation. This was a while back and during that time finding a balance between a desktop environment, ZFS, and building up a development environment created some interesting outcomes. ZFS has many attractive features including it's ARC cache. Files will get cached on the system for faster access and allocates RAM while doing so. These settings can be adjusted and between releases 11 and 12 of FreeBSD ZFS received a major tune-up in this department. Back in the days of 11 it was common that between ZFS and my integrated i915 gpu they would start to fight for RAM. The culprit was the graphics card mainly and it was eating up RAM very quickly. My options were to reinstall everything with UFS instead and just deal with it, tear down my desktop and run headless, or actually try and sort out the i915 issue. I chose the latter because my development relied heavily on benchmarking the results while running on top of ZFS. Just searching around on Github I found a similar report and some good results for 12 but was not available for 11. I decided to patch this fix into 11 and test it out myself.

**Drop A GEM On 'Em**
GEM stands for Graphics Execution Manager and is a generic DRM (Direct Rendering Module) memory management framework. That is the description in the drm-memory man page. Many of the user land drivers in BSD actually track changes in Linux graphics drivers. There are places where they diverge and in this case that is where the issue was located.

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

While flipping pages and marking them as dirty what seemed to be missing was the correct memory management functions. This was easy enough to see in the patch for 12 so I began editing the code brought down from the FreeBSD ports collection. I just had to make sure it was added in there like so:

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

In the FreeBSD ports system most of the files being compiled can be found in the "work" folder. Even if you edit them recompiling will generally pull down the latest port files and overwrite them so what you really want is to patch the file. This can be accomplished with the "diff" command:

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

If you just "make" after building everything like I did here the compiler is well within reason to believe nothing needs to get built. Just be sure to "make clean extract patch" and everything should build. Running the command "make install" will deploy the code after building:

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

Afterwards I reported my results and everything ran much better. This kept me rolling until it was time to upgrade.
Python Zero to Hero - Ep.5 - Python Functions and Modules
Tags: python, tutorial, beginners, video
Published: 2020-05-04 15:58:42

---
title: Python Zero to Hero - Ep.5 - Python Functions and Modules
published: true
description: Today we go through a very important thing in Python - functions. I so thought the usage of it and some common mistakes that beginners could make. Also, we touch on importing modules - either it is a standard library or another python scripts.
tags: Python, Tutorial, Beginner, video
---
Today we go through a very important thing in Python - functions. I so thought the usage of it and some common mistakes that beginners could make. Also, we touch on importing modules - either it is a standard library or another python scripts.

You can get the slide deck [here](https://bit.ly/PyFunction) and the example code and homework form [GitHub here](https://github.com/Cheukting/python02hero). Ask questions at my [Twitch channel](https://t.co/7sqvTilzF1?amp=1)

Also, check out Naomi Ceder's [Twitch channel](https://t.co/hXhTu0ZIG8?amp=1) for more beginner's (slightly more advance) tutorial.
What is API Testing?  ||  30 Days of API Testing ||  Day 1 ( API Testing Explained)
Tags: tutorial, beginners, webdev, career
Published: 2020-05-04 15:36:40

We are going to learn about the What is API Testing and Why do we require API Testing.

In this series of 30 Days of API Testing - Introduction, We are going to start a 30 API testing challenge with Day 1.

[![30 Days of API Testing](https://i.imgur.com/JKV36nk.png)](https://youtu.be/yj_BG3WbBDA "30 Days of API Testing")

👉 Master API Testing(Full Course) -  https://www.learnapitesting.com

👉 Become Automation Tester - https://sendfox.com/thetestingacademy

### What is An API?

API stands for Application Programming Interface.
API is a defined set of rules, which contains clearly defined methods of communication. API helps different software components to interact with each other.

### What is API Testing?
API testing involves testing the collection of APIs and checking if they meet expectations for functionality, reliability, performance, and security and returns the correct response.

API testing is used to determine whether the output is well-structured and useful to another application or not, checks the response on basis of input (request) parameter, and checks how much time the API is taking to retrieve and authorize the data too. 

🚀 Tools and services I recommend:

Some of the courses that I recommend to become better Automation Tester 🙌🙌

✅Selenium Training and Certification -
https://scrolltest.com/go/edureka

✅Learn Jenkins for QA -
https://bit.ly/learnjenkins-p1

✅Programming Java -
https://bit.ly/learnjava2020-p1

✅Test Automation - 
https://bit.ly/learnautomation2020

✅API Testing - 
https://www.learnapitesting.com

✅Cypress Tutorial with LIVE Projects -
http://cypresstutorial.com

--
Be sure to subscribe for more videos like this!

[![ TheTestingAcademy](https://dev-to-uploads.s3.amazonaws.com/i/r7vcy6wbvyjbk1y1uu0o.png
)](https://www.youtube.com/TheTestingAcademy?sub_confirmation=1 "TheTestingAcademy")
Using Figma for Online Dungeons and Dragons
Tags: dungeons, dragons, figma, free
Published: 2020-05-04 15:22:32

---
title: Using Figma for Online Dungeons and Dragons
published: true
description: tips to run dnd online easy and free
tags: Dungeons,Dragons, Figma, free
---

I recently started dungeon mastering for a group. we tried to video but being spread across the world; video isn't great all the time so we started looking for different solutions

# First try: Google Sheets
while it was functional, it was hard to find good colors to represent the players and enemies and got confusing.

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

*I'm the pink one*


# Figma 
is a free, easy to use vector editing tool in the browser.

Figma has a built-in layout grid system so you can overlay it on top of your dnd map for the distance the free dnd maps I used are [here](https://2minutetabletop.com/product-category/free/)

The grid lines work for you but they don't work for people viewing an embed. There is a great Figma plugin called `Layout Grid Visualiser ` that creates a copy of your grid as a layer and boom, you have a great grid.

To allow people to call out the number I used a mono spaces font and set the spacing to `60%` so one character per square. 

People can then say `Pink A Green 1` or `PAG1`

this looks great but I didn't want everyone to have to sign up and they could see all the maps and layers for the campaign and spoil it for themselves; 

![](https://i.imgur.com/7gkAtif.png)

Sidenote: I also made some hero markers using just a circle and clipping mask.
Artwork by `E.M. Engel's`

![](https://i.imgur.com/2YQiwZP.png)

# Glitch

this web app lets you whip up experiments of HTML and js so I made a very basic landing page.

I added links to an HTML page with full-screen single Figma embed limited to 1 frame. 

Now I can plan out all my maps in secret for the campaign, list them on the page and hide and show them when needed!

When I move a character on the embed it will move in real-time without video streaming.

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

Finally, for voice, we are using discord but you could use anything, you could even just type it!
Frontend Mentor Challanges | PV Codes
Tags: webdesign, javascript, html, css
Published: 2020-05-04 15:20:01

Hey everyone!
 I’ve just completed the “Four card feature section” challenge.
Here’s a link to my solution: https://frontendmentor.io/solutions/html-css-and-js-qYGHte7Ab
Site Live Here: https://pvcodes-intro-component-with-signup-form-master.netlify.app
Repo Link: https://github.com/pvcodes/intro-component-with-signup-form-master