teleren/devto huggingface dataset:
The Dice Game
Tags: replit, javascript
Published: 2020-05-09 08:18:23

Four friends are playing a simple dice game (players are denoted p1, p2, p3, and p4). In each round, all players roll a 
// pair of six-sided dice. The player with the lowest total score is removed. If the lowest score is shared by two or more players, the player in that group with the lowest score from their first die is removed. If the lowest score is still shared (i.e. two or more players have the same rolls in the same order), then all players roll again. This process continues until one player remains. Given an array of scores only (given in player order for each round), return the winning player.

{% replit @sabhishek78/The-Dice-Game %}
Building your first Deno module
Tags: deno, typescript
Published: 2020-05-09 08:17:19

---
title: Building your first Deno module
published: true
description: How to build and "publish" your first Deno module
tags: Deno,Typescript
---

First let's understand how modules are loaded in Deno.

```typescript
import aModule from 'https://some.com/thing/mod.ts'
```

We can understand a couple of things from this line
1) The modules are loaded in by URLs, so we need to host our modules somewhere?
2) The modules are loaded in directly from their Typescript code, so we don't need any complication step.

# So where do we host our modules?
There are a couple of options,
 - You can either host them yourself, like push them to S3 or something like that.
 - You can raise a PR for them to be added to the Deno standard library.
 - If you are using Github to host your code then you can use their `raw.githubusercontent.com` service to access the raw code.

I think I prefer the third option of using Github and I'll get onto the reason why later down.

# So how do we build a module?
I'm not going to go into a lot of detail of testing and all that stuff all I want to do is demonstrate how to build a basic module.

### Step 1: Create a mod.ts
```typescript
// inside mod.ts
const hello = (name: string = 'world') => `Hello ${name}`;
export default hello
```

### Step 2: Create a repo on Github
### Step 3: Push the changes to the repo

# How do we use the module?

Well I called my repo https://github.com/jakelacey2012/deno-hello-world, so I'd import it something like this.

```typescript
import hello from 'https://raw.githubusercontent.com/jakelacey2012/deno-hello-world/master/mod.ts'

hello('you');
```

Thats it you're ready to use the package :woop: :woop:

# So why do I prefer this option?
- I don't see a package like this needing to be part of the standard library.
- I can easily control the version of the package by swapping out master to a release or another branch.


### Thanks for reading
If you're having any issues with this, I'd suggest reading up on Deno. That being said feel free to ask questions in this repo https://github.com/jakelacey2012/deno-hello-world
Using git and github together via Command Line
Tags: github, cloning, ssh, git
Published: 2020-05-09 08:11:47

Github link: https://github.com/
Useful link to turn a local git into a global git on github: https://docs.github.com/en/github/importing-your-projects-to-github/adding-an-existing-project-to-github-using-the-command-line

Set up your computer so that it is allowed to access your Github account. To do this follow the steps in the following link:
https://help.github.com/en/github/authenticating-to-github/adding-a-new-ssh-key-to-your-github-account

Or you can use Github Desktop, which avoids manually setting up the SSH. But the SSH method above is required for Unix command line environments where the Github Desktop GUI is not available.

"git clone" can be used to clone an online repository you have created on github. This can also be useful if you have just forked someone elses repository or you are using a different computer than normal. Link for more info: https://help.github.com/en/github/creating-cloning-and-archiving-repositories/cloning-a-repository

Once cloned and you have made some changes to the directory:

Stage all commits:
git add -A 

Commit the changes with a comment:
git commit -m "comment"

Push the committed files to the repository on Github:
git push 

Now if you look at your Github repository online the changes will be visible.
[REMINDER-4] For-of loop
Tags: javascript, vue
Published: 2020-05-09 07:59:37

## For-of loop

The nice to know about this is that for-of get the conscience of forEach. And give you the possibility to break it.

```js
for (const v of ['a', 'b', 'c']) {
  console.log(v);
}
```

Look at the const here. As the for of will create a new scope (Go to [REMINDER 1](https://dev.to/f3ltron/reminder-var-let-const-h4c) if you want to know more about scope).
Effectively it will be transpiled by 

```js
for (var _i = 0, _a = ["a", "b", "c"]; _i < _a.length; _i++) {
    var v = _a[_i];
    console.log(v);
}
```

With transpilation v will not be accessible even if real life here v will the last value of the array "c"
[REMINDER-3] Template Literals / destructuring
Tags: javascript, vue
Published: 2020-05-09 07:49:49

## TEMPLATE 

`Template Literals allow you to work with strings in a novel way compared to ES5 and below.`

- they offer a great syntax to define multiline strings
- they provide an easy way to interpolate variables and expressions in strings
- they allow you to create DSLs with template tags (DSL means domain specific language, and it’s for example used in React by Styled Components, to define CSS for a component)

example for last point:

```js
function styled(literals, ...expressions) {
  console.log("literals: ", literals);
  console.log("expressions: ", expressions);
}

const Button = styled`
  font-size: 1.5em;
  background-color: black;
  color: white;
  ${"bonjour"}
  ${"hello"}
`;
```
It will log literals fontsize etc and expressions are just arguments in js, so array of arguments. Important to know is that the literal array will be cut by where expression is inserted.

## DESTRUCTURING

- destructuring an object `{firstname: default, other} : myObject`
- destructuring an array `const a = [1,2,3]; const [firstIndex] = a`

ignore some index

```js
const a = [1, 2, 3, 4, 8];

const [one, two, , , five] = a;

console.log(five); // 8

```

That's it for me that's the most important parts to reminder if you want more go watch the article.

source: [es5 to esnext](https://www.freecodecamp.org/news/es5-to-esnext-heres-every-feature-added-to-javascript-since-2015-d0c255e13c6e/)
Laravel Full Course (6.5 hours) for free
Tags: laravel, php
Published: 2020-05-09 07:03:37

{% youtube BXiHvgrJfkg %}

Learn Laravel PHP framework from very basics to advanced using Laravel Livewire by creating advanced todo list project in this full course in 6.5 hours

You will get to know from scratch to creating an advanced Todo list app using Laravel livewire

Useful Links:
Docs: https://laravel.com/docs/7.x/releases
Source Code: https://github.com/bitfumes/laravel-7-for-beginner
Github: https://github.com/laravel/laravel
Mohammad Said Article: https://divinglaravel.com/authentication-and-laravel-airlock

Check out 15-20 hours of Laravel Content at
https://indepthlaravel.com

I appreciate any feedback, comments, suggestions Thank you.

Also, this is my first DEV post 🎉
Number #1 Problem for Developers - Solved!
Tags: webdev, javascript, node, react
Published: 2020-05-09 07:00:03

One of the most difficult things in programming is coming up with variable names. If the situation is even a bit more complex, I always end up either coming up with bad non-describing name or just taking way too much time thinking of the name.

Variable naming is hard. But one thing that is maybe even harder is thinking of dummy data I can input and test my application with. Lorem ipsum can only do so much. When I need to create for example dummy users, it is just difficult to make up a user name or email, not to mention other info that a user might have, say for example an address.

I have a feeling that I am not alone with this. That is why I wrote this post. Because to be honest I no longer have this issue, thanks to Faker.js.

## Faker.js
[Faker.js](https://github.com/marak/Faker.js/) is a fake data generator for JavaScript. We can use it to generate massive amounts of fake data in the browser and node.js. They have a long list of properties we can generate and I won't list all of them here (you can check it out [here](https://github.com/marak/Faker.js/#api-methods)) but to mention few, you can e.g. generate user names, avatars, emails, location, address, etc.

Usage and the API is very easy and straight forward to use. If we want to use Faker.js in the browser and generate a user name and email, we can do it as follows.
```html
<script src = "faker.js" type = "text/javascript"></script>
<script>
  var randomName = faker.name.findName(); // Caitlyn Kerluke
  var randomEmail = faker.internet.email(); // Rusty@arne.info
</script>
```
So first we include faker.js file and then generate the name using `faker.` and the respective method name (you can find all the available methods from the [documentation](https://github.com/marak/Faker.js/#api-methods)).

If we want to test Faker.js out, they have a demo site where we can poke around and get a better understanding of all the kind of data we can generate with it. The demo site is found [here](https://rawgit.com/Marak/faker.js/master/examples/browser/index.html).

I hope you found this post helpful and learned something new. I have a [YouTube channel](https://www.youtube.com/channel/UC34UXFLKqdW3cpk5CBu2Siw) where I consistently upload more videos and tutorials about web development. Go ahead and [subscribe](https://www.youtube.com/channel/UC34UXFLKqdW3cpk5CBu2Siw?sub_confirmation=1) to the channel to get posted on all the new uploads!

-----------
_Originally published at [codepulse.blog](https://codepulse.blog/number-1-problem-for-developers-solved/?utm_source=devto) on May 9, 2020._
[Reminder-2] Arrow Function
Tags: javascript, vue
Published: 2020-05-09 06:34:42

I am assuming you are using "use strict"

- Arrow function syntax is `() => {}`
- If you have one parameter you can delete parantheses.
- If you are doing one action, you can delete the curly braces. `() => console.log("hi")`
- It has an implicit return
- It create a new Scope as Normal function (watch my [last reminder](https://dev.to/f3ltron/reminder-var-let-const-h4c) if you want more).
- It doesn't bind context like classic function. That means 'this' will never be bind and will be undefined or window.
- It cannot act as a constructor like normal function
  
source: [es5 to esnext](https://www.freecodecamp.org/news/es5-to-esnext-heres-every-feature-added-to-javascript-since-2015-d0c255e13c6e/)
react-native-debug-tool
Tags: reactnative, android, ios
Published: 2020-05-09 05:53:45

# react-native-debug-tool （开发调试工具）


### 安装

npm install react-native-debug-tool --save 

or yarn add react-native-debug-tool


### 功能点

 * 支持显示设备信息：依赖于 react-native-device-info 基础库
 * 支持显示当前App的Http请求记录
 * 支持显示示当前App的WebView加载记录
 * 支持App连接服务器环境切换

### 用法

 初始化方法：
 
  ```
  DebugManager.initDeviceInfo(DeviceInfo)
  .initServerUrlMap(serverUrlMap, currentUrl, (baseUrl) => {
  
  });
  
  注：初始化方法为非必需方法，如果项目不需要支持【环境切换】与【设备信息查看】功能，可以不调用此方法
  
  // DeviceInfo => react-native-device-info 库的DeviceInfo对象
  
  // serverUrlMap => 连接服务器环境 key value Map集合
     如：new Map([['test001','https://domain-001.net'],['test002','https://domain-002.net']])
     
  // serverUrl => 默认连接的服务器环境 如：https://domain-001.net
  
  // baseUrl => 环境切换回调的当前的连接服务器环境
  
  ```
功能1：展示设备信息（只要在初始化的时候传入DeviceInfo对象即可）

功能2：展示当前App的Http请求记录 

```js

fetch(url, params).then((response) => {
   DebugManager.appendHttpLogs({url, ...params}, response)
})

```
功能3：展示当前App的WebView加载记录

```jsx

<WebView source={{uri: url}}
         onNavigationStateChange={params => {
             DebugManagerDebugManager.appendWebViewLogs(params.url);
         }}
/>

```

功能4：App连接服务器环境切换(在初始化的时候传入severUrlMap及serverUrl，在回调的时候存在本地供Http使用)


调出调试工具入口：
```js

import RootSibling from 'react-native-root-siblings';

DebugManager.showFloat(RootSibling) //在App内需要的地方调用些方法展示工具入口浮点

// only support react-native-root-siblings 3.x

```

详细使用方法请参考 [示例](https://github.com/chende008/react-native-easy-app-sample)
Making a wait widget using a pseudo-element and CSS Step Animation
Tags: codepen
Published: 2020-05-09 05:51:53

Here's my approach to making a wait widget:
- using a pseudo-element after,
- using keyframes for animation,
- using steps for changing states,
- using `infinite` to make a loop,
- using `content` to change the animation text.

Here's the code:

```CSS
.waiting {
  position: relative;
  
  &:after {
    content: "Waiting.";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(255,255,255,.75);
    color: Tomato;
    animation: waiting 3s steps(3, end) infinite;
  } 
}

@keyframes waiting {
  33% {
    content: "Waiting..";
  }
  66% {
    content: "Waiting...";
  }
}
```

{% codepen https://codepen.io/CiTA/pen/yLNdWLG %}
Shared Packer & Terraform Config
Tags: deployment
Published: 2023-01-06 01:24:14

---
title: Shared Packer & Terraform Config
published: true
date: 2020-05-09 02:59:30 UTC
tags: Deployment
canonical_url: https://brandonrozek.com/blog/sharedpackerterraformconfig/
---

You might have noticed from my last two posts on [Packer](/blog/snapshotswithpacker/) and [Terraform](/blog/autodeployterraform/) that the configuration files are highly similar. In fact, we can trick them into sharing a configuration file!

## Shared Configuration

First let’s create a file we’ll call `config` that contains all our assignments. Here is an example configuration:

```
base_system_image = "ubuntu-20-04-x64"
region = "nyc3"
size = "512mb"
domain = "example.com"
subdomain = "temp"

# Secrets
do_token = "DO-TOKEN-HERE"
key_name = "KEY-NAME-ON-DO"

```

Then we’ll create a file named `variables.hcl` that contains the type definitions

```
variable "do_token" {
  type = string
}

variable "base_system_image" {
  type = string
}

variable "domain" {
  type = string
}

variable "key_name" {
  type = string
}

variable "subdomain" {
  type = string
}

variable "region" {
  type = string
}

variable "size" {
  type = string
}

```

## Packer

Now to trick Packer into reading the configuration files we need to:

- map `variables.auto.pkrvars.hcl` to `config`
- map `variables.pkr.hcl` to `variables.hcl`

We can do this with symbolic links

```
ln -s config variables.auto.pkrvars.hcl
ln -s variables.hcl variables.pkr.hcl

```

## Terraform

To trick Terraform into reading the configuration files we need to:

- map `terraform.tfvars ` to `config`
- map `variables.tf` to `variables.hcl`

As before, we can do this with symbolic links

```
ln -s config terraform.tfvars
ln -s variables.hcl variables.tf

```
Learning Golang 102
Tags: beginners, go
Published: 2020-05-09 04:36:02

### Semicolons 
Like C, Go's formal grammar uses semicolons to terminate statements, but unlike in C, those semicolons do not appear in the source.
One consequence of the semicolon insertion rules is that you cannot put the opening brace of a control structure (if, for, switch, or select) on the next line.
```
if i < f() {
    g()
}
```
not like this
```
if i < f()  // wrong!
{           // wrong!
    g()
}
```

### Control structures
* No `do` or `while` loop. Only generalized `for`, `switch`, `if` and `select`. Both of them accept an optional initialization statement.
* `break` and `continue` statements take an optional label to identify what to break or continue;

#### If with an initialization statement.
```
if err := file.Chmod(0664); err != nil {
    log.Print(err)
    return err
}
```

#### For
There are three forms.
```
// Like a C for
for init; condition; post { }

// Like a C while
for condition { }

// Like a C for(;;)
for { }
```
`range` clause can manage the loop. For key and value data, like map, if you only need the first item (key), drop the second.

```
for key := range m {
    if key.expired() {
        delete(m, key)
    }
}
```
if you only need the second item (value), use the blank identifier
```
sum := 0
for _, value := range array {
    sum += value
}
```
* Go has no comma operator and ++ and -- are statements not expressions.
```
for i, j := 0, len(a)-1; i < j; i, j = i+1, j-1 {
    a[i], a[j] = a[j], a[i]
}
```

### switch
The expressions need not be constants or even integers, the cases are evaluated top to bottom until a match is found (default order doesn't matter seems. Need to check).
```
var t interface{}
t = functionOfSomeType()
switch t := t.(type) {
default:
    fmt.Printf("unexpected type %T\n", t)     // %T prints whatever type t has
case bool:
    fmt.Printf("boolean %t\n", t)             // t has type bool
case int:
    fmt.Printf("integer %d\n", t)             // t has type int
case *bool:
    fmt.Printf("pointer to boolean %t\n", *t) // t has type *bool
case *int:
    fmt.Printf("pointer to integer %d\n", *t) // t has type *int
}

```
Collaboration using Blender 3D
Tags: blender, 3d, modeling
Published: 2020-05-09 03:37:59

The Blender 3D is the best 3D modelling software on Linux. I use Linux for work, and I need to process the 3D models made by my colleagues. Hence I have to learn to use Blender.

# Scenario

There are 2 constraints in my situation, which are quite common I guess:

1. models are made in SolidWorks 2018
2. colleagues do not have any knowledge of Linux, open-source 3D model formats or any other thing that a non-IT worker is not assumed to know.

# Problems

In this section, I will record all the important issues solved during my work.

## Multi-language

The working environment of my colleagues is in Chinese. So inevitably they export files with non-English characters.

Blender's default setting disables the multi-language support. In order to display non-English characters on the UI, one has to check the box next to the *Translation* tab in the *Preferences>Interface* dialogue.

![chinese](https://dev-to-uploads.s3.amazonaws.com/i/w66vsrftf9ltlsl9we66.png)

## File Format

The biggest challenge is to move the models from SolidWorks to Blender. Thankfully they both support a wide range of file formats for import/export. Hence the quickest solution is to find a format to which SolidWorks can export, and from which Blender can import.

The best open source format in my mind is GLTF. Unfortunately, SolidWorks only began to support GLTF since ver. 2019.

After a quick search, 2 formats were found to suit my needs:

- STL
- WRL

WRL file exported from SolidWorks cannot be properly imported to Blender. Nothing on the canvas is shown after the import finishes. The scene collection does not show any change either.

So STL is the only choice left. The bad thing about it is that SolidWorks exports many different files, each responsible for one component. But this is not a major bug which prevents using it.

## View Clipping

This problem is not collaboration related but general for any usage of Blender.

If you know the basics of the camera parameters in 3D modelling, viewing frustum should not be too alienated. Basically in a virtual world composed of 3D models, you are only presented with a finite volume. This constraint is to prevent infinity. The farthest plane orthogonal to your viewing vector is one of the constraints. Anything beyond that plane is not rendered. This parameter defaults to a quite small value. I had to change it as the model imported is very large. Press "N" key to open the following dialogue and change the Clip Start and End value.

![clipping](https://dev-to-uploads.s3.amazonaws.com/i/zqoq82zjedecj7b4ywqp.png)
Keep DDD in mind when designing systems (ver1)
Tags: ddd, model, pm
Published: 2020-05-09 02:43:38

---
title: Keep DDD in mind when designing systems (ver1)
published: true
description: A mind map to track DDD modeling concepts
tags: ddd, model, pm
---

I created and will keep updating this mind map as I learn more.

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

Please let me know in the comments if there are any relations that are incorrect or missing.
Snapshot Creation with Packer
Published: 2023-01-06 01:25:01

---
title: Snapshot Creation with Packer
published: true
date: 2020-05-09 02:31:40 UTC
tags: 
canonical_url: https://brandonrozek.com/blog/snapshotswithpacker/
---

[Packer](https://www.packer.io/) is a tool to create automated machine images in both local virtual machine / container environments, as well as a variety of cloud platforms. My current cloud platform of choice is [Digital Ocean](https://www.digitalocean.com/), so this post will explain how to set up Packer with it. Though you can likely find your platform of choice on their [docs](https://www.packer.io/docs/builders/) page

In this post I am going to use the beta configuration language of HCL2. This requires a Packer version of at least 1.5.

## Variables

First let us set up a variables file which we will later reference. This makes it easy to keep your main Packer configuration files in Git, while not committing your API key.

Create a file called `variables.auto.pkrvars.hcl`. Here is some example variables and values that I put in mine.

```
base_system_image = "ubuntu-20-04-x64"
region = "nyc3"
size = "512mb"
do_token = "DOTOKENHERE" # Secret

```

Then we need to create `variables.pkr.hcl` that define the types of each of these variables

```
variable "do_token" {
  type = string
}

variable "base_system_image" {
  type = string
}

variable "region" {
  type = string
}

variable "size" {
  type = string
}

```

## Provisioning

Once the system is up and running we can use a [variety of tools](https://www.packer.io/docs/provisioners/) that setup the image.

- Ansible
- Chef
- Powershell
- etc.

I’ll use a simple bash script as an example

```
#!/bin/bash
apt update
apt upgrade -y

```

## Piecing it together

Finally let us create a `do.pkr.hcl` file that contains the following information

```
source "digitalocean" "web" {
  api_token = var.do_token
  image = var.base_system_image
  region = var.region
  size = var.size
  ssh_username = "root"
  snapshot_name = "packer-example"
}

build {
  sources = [
    "source.digitalocean.web",
  ]

  provisioner "shell" {
    scripts = ["setup.sh"]
  }
}

```

Assuming all the files we’ve just created are in the same directory, Packer will automatically recognize where the value for `var.do_token` lives. We can then run packer to build the image

```
packer build .

```

This sets up a snapshot called `packer-example` which we can later spin up and use! Keep in mind that it does a small amount of money to store images on DigitalOcean.
First stream experience
Tags: twitch, python, stream, math
Published: 2020-05-09 01:05:53

Decided to start learning the [manim](https://github.com/3b1b/manim) library for mathematical animations (used by the popular [3blue1brown](https://www.youtube.com/channel/UCYO_jab_esuFRV4b17AJtAw) videos) - [live on Twitch](https://www.twitch.tv/leotrs1)!
First Week
Published: 2020-05-09 00:40:24

So, first week at the new job. I am training virtually, of course. The first couple of days was mostly admin stuff and the rest of the week was learning their processes and the start of me learning WordPress, PHP, and setting up some of my connections. Overall, good fun! It looks like I may not actually touch code for another week, but that's fine. I don't want to mess anything up. Haha.

On the LaunchCode side, last day of Teaching Fellow Training was Wednesday and class starts Monday. This is virtual as well and through Zoom (which I've only started using 2 weeks ago). A few of us did a small meet up to learn how to do some of the things in Zoom that we didn't know. Now I feel more comfortable with it. Now to get more comfortable with explaining what's being learned...

Gonna have a restful weekend and be ready to tackle next weekend full force!