teleren/devto huggingface dataset:
Games You Should Play
Tags: friends, games, life, goodtime
Published: 2023-01-06 18:52:20

---
title: Games You Should Play
published: true
date: 2021-04-23 23:04:00 UTC
tags: Friends,games,life,goodtime
canonical_url: https://greenido.wordpress.com/2021/04/23/games-you-should-play/
---
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/13ty71k87z08c89zwy3d.png)

[![](https://greenido.files.wordpress.com/2021/04/screen-shot-2021-04-22-at-14.57.02.png?w=1024)](https://greenido.files.wordpress.com/2021/04/screen-shot-2021-04-22-at-14.57.02.png)

Some of the best games out there are free and could be used with friends and family over FB Rooms (or Zoom).

If you have other suggestions – please let me know.
--

## Settlers Of Catan
Negotiation and trading – fun fun fun
https://www.catan.com/game/catan-universe
Free/Paid.

## Among Us
A classic from the NRiB OGs
https://store.steampowered.com/app/945360/Among_Us/
Free.

## Draw battle
Show your super power drawing skills
https://drawbattle.io/
Free

## Jackbox.tv
Great production value, variety of modes, easy drop in/drop out
https://jackbox.tv/

## Poker
Tons of clients out there! Would probably work best as directly advertised poker game night. 
Black Tie not required but encouraged
https://www.pokernow.club/

## Escape Room
There’s a few self-run online escape rooms that I’ve annecdotally heard are quite fun (better than some chaperoned virtual escape rooms)
Many options – Google will help here

## Spaceteam
A game of coordination amidst chaos: what better way to build teamwork and camaraderie
Mobile app

## Word Up
Zero learning curve, runs quick and smooth
Mobile app
Free

## One Night Ultimate Werewolf
Similar to Among Us, this game of deception moves fast and has just one round
https://netgames.io/games/onu-werewolf/
Free – A Fun one… lots of laughs.

## Codenames
Easy to learn, fun to play, scales to any number of players
https://codenames.game/
Free

## Avalon
This game of deception involves imperfect knowledge in the midst of good vs evil. Similar to One Night Ultimate Werewolf, but consists of five rounds instead of one
https://avalon.fun/
Free
How to Replace Loops using Recursion
Tags: javascript, tutorial, beginners, devops
Published: 2021-04-23 22:48:13

Recursion is the concept that a function can be expressed in terms of itself. To help understand this, start by thinking about the following task: Add the first n elements of an array to create the result of those elements. we can rewrite sum in terms of itself and never need to use a loop.

* Here is a for loop for this example:
```
function sum(arr, n) {
    var product = 0;
    for (var i = 0; i < n; i++) {
        product += arr[i];
    }
    return product;
  }

console.log(sum([2, 3, 4, 5], 3)); will display 9
```
* Here we write a recursive function, sum(arr, n), that returns the sum of the first n elements of an array arr. 
* Note: Recursive functions must have a base case when they return without calling the function again (in this example, when n <= 0), otherwise they can never finish executing.
```
function sum(arr, n) {
if (n <= 0) {
  return 0;
} else {
  return sum(arr, n - 1) + arr[n - 1]; //return sum(arr, n - 1) <—-calls itself
}
}
```
```
console.log(sum([2, 3, 4, 5], 3)); will display 9
```
```
// sum([2, 3, 4, 5], 3 - 1) + arr[3 - 1];
// sum([2, 3, 4 ,5], 2) + arr[2];
// sum([2, 3, 4, 5], 2) + 4;
//        n = 2

// sum([2, 3, 4, 5], 2 - 1) + arr[2 - 1];
// sum([2, 3, 4, 5], 1) + arr[1];
// sum([2, 3, 4, 5], 1) + 3; 
//      n = 1             3

// sum([2, 3, 4, 5], 1 - 1) + arr[1 - 1];
// sum([2  3, 4, 5], 0) + arr[0];
// sum([2, 3, 4, 5], 0) + 2;
//      n = 0             2

//      we hit our base case so now n = 0

// 0 + 2 + 3 + 4 = 9
// we want it to return 9 because 4 + 3 + 2 = 9;
```
3 steps to setup debugger for React Native app in WebStorm
Tags: reactnative, debugger, productivity, 5days5blogposts
Published: 2021-04-23 22:21:40

I always feel sorry for fellow developers who only use `console.log` for debugging. To me having the debugger in place is a whole different level of productivity while solving problems.

###Here's how you can easily set it up in WebStorm:

1. When having your project opened, go to `Run>Edit configurations...` or just press `⌃ + ⌥ + D` and then `0`
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/e0dt4af3u9ab8uug2705.png) 

2. In the following window press the `+` sign (or `⌘ + N`) and then search for `React Native`
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pzgula9dj1whyunyp3hn.png)

3. Give it a proper name and turn off the `Build and launch application` checkbox
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8xq79h5hseun13z3q5dz.png)
Optionally you can remove `Start React Native Bundler` step if you prefer doing it manually with `yarn start`
Then press `Ok`

###That's it!
Now you can go to `Run>Debug` or just hit `⌃ + D` (a new Chrome window should appear), run your app on a simulator or device (i.e. `yarn ios`), [enter the In-App Developer Menu](https://reactnative.dev/docs/next/debugging#accessing-the-in-app-developer-menu) and hit `Debug with Chrome`.

To verify if the configuration works fine just see if the logs are visible in the Debug Tool Window:
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ri6050xfwolvyvs3yz3o.png)

You can also add a breakpoint to check or manipulate the values at runtime:
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ejjxfo5qs56850lucr1f.png) 

You can learn more about debugging at the [Official React Native Documentation](https://reactnative.dev/docs/next/debugging)
Day 352 : Same Song
Tags: hiphop, code, coding, lifelongdev
Published: 2021-04-23 22:02:09

_liner notes_:
- Professional : Started off talking with a team member that lives in Greece. It's interesting to see how other countries have been handling the pandemic. I put in a request for a new laptop. I'll be starting to work on the Video API and my current one will not cut it. haha. Had a team meeting, it was good to see everyone. My latest blog post was published so that was cool. Worked on the slides for my presentation next week. Not a bad way to end the week and start the weekend.

- Personal : Last night, I watched some videos on how to set up Push Messaging for my new project. Watched an episode of "Dr. Stone" and went to bed.

![View through a clearing at a lake surrounded by pine trees with mountains in the distance.](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/arztzaiyqv6eqxycutyg.jpg)

Some more parts to build the inside of my van came in. Looks like there's a slight difference in one part that makes it incompatible with another piece. Good thing I only ordered on piece. So I ordered some more parts that should fit and that will come in next week. Kind of holding off until I get a few more pieces. This weekend, I need to record a video for a presentation happening next week. Working on tracks for the radio show now and want to work on the landing page for my next side project. I also want to launch that in a couple of weeks. A lot of stuff happening. Hopefully this weekend is productive. haha. Also, RIP Shock G. What is going on these past few weeks. One of my favorite joints.

Have a great night!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube CmFDyZ3ytg8 %}
Take care of your physiological needs to make optimal architectural decisions 🤔
Tags: 5days5blogposts, decisions, selfcare, architecture
Published: 2021-04-23 21:42:30

**As a software architect, your most important skill is making optimal decisions. But your brain totally depends on your body. When you're sleepy 🛏️, hungry 🍴 or need to visit a toilet 🚽, your brain gets disturbed. Then it can hardly make any well-balanced judgements. Don't force yourself to finish your task first, unless you want to make some bad decision. When feeling strange or anxious, just pause, take care of yourself and get back to your work. You’ll finish your task better when calmed down.**

The great book “Self-Reg” (by Stuart Shanker) explained to me the implication: neglecting physiological needs cause higher susceptibility to stress.

## Self-regulation 

### Read the signals from your body
- tapping your fingers nervously
- shaking your leg
- feeling a headache
- ruminating past mistakes or thinking about things which can go wrong
- getting easily frustrated by small problems
- …

### Identify your stressors
Ask yourself: “Why now?”
- did you have enough sleep today? Wanna yawn?
- are you hungry? Is it now your usual time for a meal?
- are you thirsty?
- do you need to visit a toilet?
- do you need more movement?
- are you tired of noise?
- is anyone or anything else stressing you?
- …

### Reduce your stressors
When you know what your body needs, satisfy it. “Turn down the volume” of your stressor. 🔇
If you cannot switch it off completely, take a break and use your best tricks that calm you down. 
- eat 🥪
- drink 🥤 
- take a walk 🚶‍♂️
- listen to relaxing music 🎧
- make your coffee ☕️
- take a short power nap 🛏
- …

## “Our highest priority is to protect our ability to set priorities”
(Essentialism - Greg McKeown)

When you’re stressed out, your perception doesn’t adapt quickly to changing circumstances. You focus easily on irrelevant details and loose the big picture. You invest time in perfectionism for things that don’t deserve it. 

To make optimal decisions you often need to rely on your intuition. It’s a general body’s feeling of comfort or discomfort when evaluating some idea. But any neglected physiological need can disrupt your gut feeling.

If you don’t reduce your stressor for too long, the tension escalates and you totally loose the essence. Your attention can hardly get away from what you’ve been working on for long time. That can be a vicious circle which may disrupt both your health and the health of the project’s architecture.

### Summary
In every work day you face challenges which require from you setting priorities and making judgements. So you need your brain to stay efficient. But it totally depends on your body, so you should take care of it. Read it's signals, identify stressors and reduce them. It's for the sake of your health and the health of your project which depend on your optimal decisions. 😉
How to Target Specific Browsers With CSS
Tags: css, codenewbie, beginners, tutorial
Published: 2021-04-23 21:40:53

Web browsers are built with different rendering engines, and this causes small differences in the way your website appears between browsers. The sizing may be a little different, the colors aren't consistent, and many more things of that nature. 

To counter this, we can use the following CSS to target and style specific browsers. 



### Chrome & Safari (Webkit)
```css
@media screen and (-webkit-min-device-pixel-ratio:0) { 
    property: value;
}
```

### Firefox
```css
@-moz-document url-prefix() {
    .class {
        property: value;
    }
}
```

### Microsoft Edge
```css
@supports (-ms-ime-align:auto) {
    .selector {
        property: value;
    }
}
```

### IE11 and up
```css
_:-ms-fullscreen, :root .ie11up { 
property: value; 
}
```
Bearers of the bad news
Tags: testing, 5days5blogposts
Published: 2021-04-23 21:40:19

**Testing is often seen as a destructive activity.** Spotting and reporting failures may be regarded as criticism against the product and against the author. I, as a software tester, am the bearer of the _bad news_. **We are the messengers of undesired revelations about issues.**

Testing is important. It considerably contributes to assuring that the application does everything that it was designed for. **Looking for defects requires curiosity, attention to detail and professional pessimism.** You probably want to know as soon as possible that something is wrong with your product. Defects found during testing will save time and money later. Win-win!
Why brainstorming is important
Tags: brainstorming, collaboration, plan, mindmapping
Published: 2021-04-23 21:28:29

Recently we were assigned a project in a group composed of the backend, frontend, and mobile app developers. Before diving into the code we had to divide the tasks, identify different ways to solve these tasks and choose the best solution to use.

Our project requires a user to login by using his/her social media account. This could be easily done on the backend (technology that handles the behind-the-scenes functionality of the web applications). However, this method could not work on the mobile development side. This led to the issue of asking ourselves how we can handle this in a way that could work for both mobile and web apps.

This is the time we came up with a good idea to express our ideas in a free flow manner, brainstorming.

Brainstorming is a group creativity technique used to find a solution to a specific problem. Brainstorming is done by gathering and recording the new ideas from team members in a free flow manner. 

In help with this technique, we managed to express a lot of ideas in a short time as the technique insisted on its rule of quantity over quality.

The backend developers identified many different ways to handle the issue via the backend, and the frontend guy came up with his ideas and the mobile app developer did the same. As all team members were together solving the same problem and had many different ideas, we got an idea to improve one way of handling authentication on the client-side and send the token to the backend.

In summary, the main advantages of brainstorming are its ability to express members' ideas of creativity via collaboration. It’s the perfect technique for a team to generate new ideas that can take a project or business to the next level.

Thank you for reading!
DOM 3D view | Edge devTools
Tags: edge, debug, console, microsoft
Published: 2021-04-23 21:24:27

I discovered this functionality a couple of days ago and wanted to share it here

To test it, enter a page or the same page that you are reading with Microsoft Edge, then open the console with F12, go to the three points > More tools > 3D view

You can view the position of a particular element, or the entire DOM

![dom3D](https://docs.microsoft.com/en-us/microsoft-edge/devtools-guide-chromium/media/3d-view-z-index-view-box.msft.png)

It can also be accessed by clicking the icon next to the `z-index` property in the styles section of devTools

![zIndex](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/km3b8fl6e6l2fbfakiod.png)

Let you the official docs:

[Microsoft docs](https://docs.microsoft.com/en-us/microsoft-edge/devtools-guide-chromium/3d-view)
Would you use a webapp to search linux commands
Tags: discuss, devops, webdev
Published: 2021-04-23 21:16:17

How do you remember the options and flags supported by a specific linux command, do you use search engine every time to look for the supported options and flags.

You might have some commands with lots of options which might take too long to type. Do you store such commands for reusing them? where do you store them? maybe in notes app or some text documents?

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

Would you use a free web application to store the commands for you privately. Try a free webapp I've developed to give back to community which has gave me so much.

https://commandhunt.com

It's completely free, allows copying a command with a single click, generate the commands using nicely designed user interface (by selecting required flags and filling necessary values for required options).

your valued feedback is much appreciated.
First html/css project
Tags: html, css
Published: 2021-04-23 21:10:29

☕Recently started to learn about html/css.☕ And made this -> https://github.com/AdyPolyCode/first-basic-html-css-project

If you get your eyes stuck on something like I did something wrong in the code -> for ex: unnecessary code or something like that ... please give me a feedback here. I would like to understand more about html / css. Thank you in advance.
Simple way to transform any Google Sheet to JSON
Tags: 5days5blogposts, googlesheets, csharp, json
Published: 2021-04-23 20:53:02

Solution is really easy, but with one big drawback - the sheet needs to accessed publicly on the Internet. In my case this is not a permanent feature - I just have to move data from one source to another one, but I would not recommend this solution if you deal with sensitive data. 

# Prepare the sheet

Go to **File > Publish to the web** and select **Entire Document > Web Page**. That's all here, just close the window. 
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/y7n6dszibuh8j3osy76b.png)
 
Next, copy the sheet id from the URL in the browser.

# The saviour

[gsx2json](http://gsx2json.com) is a tool which does all the magic for us. Please go to the project website and buy a coffee to the author if it helped you. It saved me a ton of time!

# Get the data

I use C# but the code is quite simple. Just create the url with the sheet id and get the JSON.

```csharp
// using System.Net;
var sheetId = "1zpss4g850wpb9YltdzefCyvl2Vl4gDZ-Ip4Hk-dQjOk";
var uri = new Uri($"http://gsx2json.com/api?id={sheetId}");
string json; 

using (var wc = new WebClient())
{
    json = await wc.DownloadStringTaskAsync(uri);
}
```
Here's the [link](http://gsx2json.com/api?id=1zpss4g850wpb9YltdzefCyvl2Vl4gDZ-Ip4Hk-dQjOk) to the API if you'd like to review the JSON created by gsx2json.

# Transform the data

Now, when you got the data, do whatever it has to be done. Here is an example of extracting rows from the JSON response.

```csharp
// using Newtonsoft.Json.Linq;
var tmp = JObject.Parse(json)["rows"];
var players = tmp.ToObject<Player[]>();
```

# Cleaning up

Remember to unpublish the sheet from the Internet. And that's all!
Airtable API Component structure.
Tags: airtable, react, help, cms
Published: 2021-04-23 20:48:44

I have my Airtable in a “MainAPI.JS” file, it’s not in my APP.js, I don’t want the products on “every” page. Sooo does that mean I should have it on the “page” instead of the App.js? 

I have a MainAPI.js then I have FishAPI.js and CoralAPI.js for the “objects” to loop through. So, do I add the connection to the takes on the “page” that it’s for? 

Instead of the App.js?
Fixing the node-sass problem in Rails - node downgrade helps
Tags: 5days5blogposts, rails, node
Published: 2021-04-23 20:42:05

Today I've had one of those irritating problems with Rails that I know one day I will have again. So, future me when you google it, here is the fix, you're welcome :)

The problem shows like this during `rails new new_app`

```
node_modules/node-sass: Command failed.
```

and 

```
1 error generated.
make: *** [Release/obj.target/binding/src/binding.o] Error 1
gyp ERR! build error 
gyp ERR! stack Error: `make` failed with exit code: 2
gyp ERR! stack     at ChildProcess.onExit (/Users/andrzej/apps/stimulus_infinite_scroll/node_modules/node-gyp/lib/build.js:262:23)
gyp ERR! stack     at ChildProcess.emit (node:events:365:28)
gyp ERR! stack     at Process.ChildProcess._handle.onexit (node:internal/child_process:290:12)
gyp ERR! System Darwin 19.6.0
gyp ERR! command "/usr/local/Cellar/node/16.0.0/bin/node" "/Users/andrzej/apps/stimulus_infinite_scroll/node_modules/node-gyp/bin/node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="
gyp ERR! cwd /Users/andrzej/apps/stimulus_infinite_scroll/node_modules/node-sass
gyp ERR! node -v v16.0.0
gyp ERR! node-gyp -v v3.8.0
gyp ERR! not ok
```

As you can see, the node version used is `16.0.0`. At the moment of writing this post, it's a relatively new version and not everything works fine with this. 

The solution? Downgrade node.

In my case I did:

```
npm install -g n
sudo n 14
```

and that's it. 

A possible alternative:

```
brew remove node
brew install node@14
```

If this helped you, let me know in the comments, so that I believe in value of such posts even more ;)
Update Versions of Your Resume on Google Drive ! 🚀

Tags: hiring, resume, programming, beginners
Published: 2021-04-23 20:41:06

Hey there! so this a neat thing that I didn't know and it's really helpful so thought to just put it out here.

![tenor (1).gif](https://cdn.hashnode.com/res/hashnode/image/upload/v1619160410848/ihycOoksx.gif)

#### The Problem

As you must know if you are in tech and have a resume, it needs to get updated at least every 2 months or so, according to your new skills set and or to add some new project.

I keep learning and building stuff so sometimes when I needed to update the resume I just kept uploading the latest one on Google Drive and either deleted the previous one or let it be. And this led to many confusions some time and also it's not clean.

#### The Solution

So, I thought one day that there must be a solution for this and I googled it to find that Google Drive has a Version feature where one can just upload the updated version of the same file which replaces the old one and the old versions also remain there if sometime in future you want to do a - "My First Resume Review" Video after being a Unicorn Startup or a FAANG employee. 😄

![5abd4023386ea439d42a1a0754b2ef30.gif](https://cdn.hashnode.com/res/hashnode/image/upload/v1619160826107/JMF2bg1Xn.gif)

It's just some clicks away and this how you do it : 

#### 1. Imagine this is how your resume is in G-Drive : 

![1.PNG](https://cdn.hashnode.com/res/hashnode/image/upload/v1619158943104/xmL8yUAt4.png)

#### 2. Just right click on it  :

![20210423_115327.jpg](https://cdn.hashnode.com/res/hashnode/image/upload/v1619159175824/vuN3y-V6s.jpeg)

#### 3. Tap on Manage versions and you should see this : 

It will show you earlier versions that you had uploaded and you can just tap on the "Upload New Version" to upload the latest one !

![3.PNG](https://cdn.hashnode.com/res/hashnode/image/upload/v1619160026329/c8g6nU6aX.png)

There you go ! See that's pretty clean right. Just wanted to share that with you, let me know did you like it.

![0_lBJ7CZs0x3xDKccZ.gif](https://cdn.hashnode.com/res/hashnode/image/upload/v1619161499791/8_T-kXIrp.gif)

#### I also create videos on Youtube on my channel - [Future Driven](https://www.youtube.com/channel/UCx-HdHfKu1rXgNIfNaKMsAA) and also pretty active on [Twitter](https://twitter.com/saumya4real). Let's Connect, Stay safe & Have a great day!  🧡🚀
How to Build Python Packages for Pip
Tags: python, programming, pip, productivity
Published: 2021-04-23 20:15:37

{% youtube JkeNVaiUq_c %}

The most powerful feature of Python is its community. Almost every use-case out there has a package built specifically for it.

Need to send mobile/email alerts? pip install knockknock  -  Build ML apps? pip install streamlit  -  Bored of your terminal? pip install colorama  -  It's too easy!

I know this is obvious, but those libraries didn't magically appear. For each package, there is a person, or many persons - that actively developed and deployed that package.

Every single one.

All 300K+ of them.

That is why Python is Python, the level of support is phenomenal - mindblowing.

In this video, we will learn how to build our own packages. And add them to the Python Package Index (PyPI). Afterward, we will be able to install our packages using pip install!
# Finally! I Created my First Portfolio! 📂🎉
Tags: webdev, reactjsdeveloper
Published: 2021-04-23 19:59:10


For the last few months, I've been working on a personal portfolio. I've always believed that a separate portfolio is important for any dev since it connects you to future opportunities and it helps you to grow your network.

Today I deployed it on - [shubh.dev](https://nifty-bell-e34c2f.netlify.app/) .There's still some stuff to improve, like testing browser compatibility, tweaking some UX, etc, so it's still a WIP, for sure. But hey, everyone has to start somewhere, right?

I tried to document everything during the process and thought it would be useful to share the planning phases, technical execution, and the major takeaways from the project.