teleren/devto huggingface dataset:
Beginners guide to Promises in Javascript
Tags: javascript, beginners, tutorial
Published: 2021-04-13 16:45:58

A Promise in JavaScript is an object which holds the completion status of an asynchronous operation. The completion status can be *Resolved, Rejected, Pending*.

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

#### States of Promises

**Resolved:** A promise is resolved state when there are no errors returned during the execution of the promise.

**Rejected:** A promise is rejected state when errors occur during the execution of the promise.

**Pending:** A promise is pending state when the result is not
ready. 

Promises are used to carry out asynchronous tasks like network requests. Using Promises we can write clean and understandable code. Promises were meant to avoid the nesting of callbacks.

Let's look at an example that will help us understand Promises in a better way.

```
const promise = new Promise((resolve, reject) => {
 let allWell = true;
  if(allWell) {
    resolve('Promise Resolved!');
  } else {
    reject('Promise Rejected');
  }
});
promise.then((result)=>{
    console.log(result) 
}).catch((result) => {
    console.log(result)
});
//Output:  "Promise Resolved!"
```

In the above example, the `promise` variable holds the response of the completion status rejected, resolved, pending. As the value is `allWell` is true the promise is resolved and the message `Promise Resolved!` is returned. 

Promises are really great when something is going to take a long time in the background like fetching information from a database table we can resolve and carry on with execution and handle if something goes wrong by returning an error message.

Let's look at another example

```
const promise1 = new Promise((resolve, reject) => {
    resolve('Promise1  Resolved!');
});

const promise2 = new Promise((resolve, reject) => {
    resolve('Promise2  Resolved!');
});

const promise3 = new Promise((resolve, reject) => {
    resolve('Promise3  Resolved!');
});


Promise.all([promise1,promise2,promise3]).then((result)=>{
console.log(result);
})

//Output:  ["Promise1  Resolved!", "Promise2  Resolved!", "Promise3  Resolved!"]
```

In the above example, we have 3 simple promises which are always resolved and they all return a single message.
By Using `Promise.all` we can run all promises in parallel, As soon as all the promises are executed `.then` method is called. `.then` will return an array of all the successful messages.

Thank you for your time. That's All folks
Softinstigate’s RESTHeart API for MongoDB simplifies development
and frees you to focus on
delivering great user experiences
Tags: mongodb, api, rest, java
Published: 2021-04-13 16:10:22

RESTHeart is a stateless REST API microservice for MongoDB, written in Java and embedding the Undertow HTTP server, that lets users access the full power of MongoDB using HTTP calls. No server-side coding frees developers to focus on developing innovative, value-adding apps.

Read the full article here: https://www.mongodb.com/customers/softinstigate
Hello World
Tags: inthirtyseconds
Published: 2021-04-13 16:05:57

Today, I found out about dev. to. 

A great place for tech enthusiasts. It has a great community of developers from different backgrounds. Many articles to read for new developers like myself and for experienced developers to share their knowledge. 

I will share with you my journey in coming from a non-tech background into tech. I think many of you here are in the same shoes as I am. 

Join me in my journey as I share my experiences. hope you like my articles. would love to hear your thoughts and experiences.❤️
json output from k6 on docker
Published: 2021-04-13 16:03:44

---
title: json output from k6 on docker
published: true
description: 
tags: 
---
You need to add `--user $UID` with docker run.
```
docker run \
  -i \
  -v $(pwd):/ci/ \
  --user $UID \
  loadimpact/k6:latest \
  run \
  --out json=/ci/performance/full.json \
  --summary-export=/ci/performance/summary.json \
  /ci/packages/faas-penguin-local/performance-test.js
```
And this is actual example:
[faas-penguin/config.yml at c31ab0c47feb9c26ed8b3297468568dfbf6f25cd · sanemat/faas-penguin](https://github.com/sanemat/faas-penguin/blob/c31ab0c47feb9c26ed8b3297468568dfbf6f25cd/.circleci/config.yml)

refs:
[Permission denied on k6 docker json output - k6 support - k6 community forum](https://community.k6.io/t/permission-denied-on-k6-docker-json-output/1581/3)
Patterns in Usage Equal Happy Users
Tags: webdev, analytics, serverless, api
Published: 2021-04-13 16:00:30

Throughout my career I've built various web-apps. These include short life projects (e.g. online brand campaigns) and long life projects (e.g. websites, various SAAS products etc.). Through it all I've noticed one thing...

A happy user is a regular user, and a regular user often exhibits patterns in their usage of a product.

If you can spot patterns in your users' usage then you can often spot your happy users! 

Now "why would I want to know which of my users is happy with my product?" I hear you ask!

Well, imagine this, you have a happy user exhibiting a pattern, but suddenly the pattern stops, the user disappears and you're one user down on your user base.

What if you could, spot the patterns, and when they stop? Then you could encourage the user to continue back into their pattern.

But why sit trawling through usage data when you can get AI to spot the patterns for you!

I've built a little service to help people do just that...

[https://binarystripes.io](https://binarystripes.io)

(...oh, and it's serverless!)

Let's consider an example!

## The Company
A coffee chain is interested in seeing whether there are patterns in their customers purchasing habits so that they can autonomously trigger incentives to encourage them to carry on as a regular customer.

## The Customer
Their first customer being analysed is Charlie...

We can represent Charlie’s daily coffee buying habits in binary, one being a day they bought a coffee, zero being a day they did not.

Here's the last 4 weeks of data:

`1,0,1,0,0,0,0,1,0,1,0,0,0,0,1,0,1,0,0,0,0,1,0,0,0,0,0,0`

## The Analysis
We want to discover if Charlie has a weekly habit of coffee buying...

Charlie buys a coffee on a Monday and a Wednesday every week as we can see from the binary.

We can discover this by asking the algorithm to calculate patterns with intervals of 7.

We send Charlie’s data up to the API with the instructions to interval at 7...

The resulting JSON is returned...

`[{
    start: 0, // The index the pattern starts
    end: 21, // The index the pattern ends
    pattern: [1, 0, 1, 0, 0, 0, 0], // The pattern
    trailingPattern: [1, 0, 0, 0, 0, 0, 0], // Binary found when the pattern ceased
    count: 3, // The length of the pattern
}]`

We can clearly see that there is one pattern in Charlie’s weekly coffee buying!

## The Reaction
But oh no! It looks like Charlie's coffee buying habit changed after 3 weeks.

The algorithm has told us when it changed and we can see from the trailing pattern that Charlie did not return on Wednesday for their second coffee of the week.

In Charlie's case we can now send them an email or show them a subtle advert saying "We missed you last Wednesday! Have 20% off your coffee next Wednesday!"

Powerful stuff eh?

So you don't run a coffee chain? Why not apply this technique to your web app, or mobile app. Instead of buying a coffee maybe they're logging in, or using a specific part of your service or website!

The possibilities are endless!
Assignment Help Online

Tags: bestonlineassignmenthelp, assignmentwritinghelp, financeassignmenthelp, assignmentuniversityonline
Published: 2021-04-13 15:53:23

Assignment Help Online
An Assignment is an academic work for students to submit for grades, it makes them prepare not only this it gives them understanding regarding subjects and make them able to get good grades in their results. We help students for getting their expected results, they can join us with the given link below:
https://www.bestassignmentexperts.com/all-assignment-help
TIL: starting my own UI-library using Vue, Storybook & Sass
Tags: todayilearned, webdev, frontend, javascript
Published: 2021-04-13 15:42:28

---
title: TIL: starting my own UI-library using Vue, Storybook & Sass
published: true
description: 
tags: todayilearned, webdev, frontend, javascript
//cover_image: https://direct_url_to_image.jpg
---

I wanted to start my own Vue UI-library 🎨, to be used in different projects. 

## Scaffolding
I was trying around with [vue-sfc-rollup](https://github.com/team-innovation/vue-sfc-rollup), which is a tool to 
> "scaffold a minimal setup for compiling a Vue Single File Component (SFC) - or library of multiple SFCs - into a form ready to share via npm". 

Following [their setup docu](https://www.npmjs.com/package/vue-sfc-rollup#user-content-tldr), it worked without a problem, so I went with it. 
Having the Vue CLI dev server in place, I could add some first basic components, and view them with that in the browser.

I wanted my vue components to use `lang="scss"` in the style block, which worked out of the box. 

## Using Storybook

My next step was to install Storybook to my project, because I did want to use that, instead of the Vue CLI dev server, suggested by vue-sfc-roll.

I followed the [guide to install it to a Vue project](https://storybook.js.org/docs/vue/get-started/install) and also found the helpful guide to [extend the webpack configuration](https://storybook.js.org/docs/vue/configure/webpack#extending-storybooks-webpack-config), to add the sass and style loaders.

Now running Storybook's server, the components themselves did appear in their stories, but completely _without_ any styles applied just bare-naked browser defaults. 😿
Only when using no `lang`-attribute at all, they would appear styled.

I realized, that Storybook must be misconfigured somehow.

## Webpack's shaking trees to hard 

At one point (and dozens of Github/SO searches later 😅) I found a hint in Webpack's docu: [Marking as side-effect-free](https://webpack.js.org/guides/tree-shaking/#mark-the-file-as-side-effect-free). 

As I didn't setup anything like that myself, I was quite surprised to find, that seemingly vue-sfc-rollup had set `"sideEffects": false` in the package.json. 

Removing that property, or even better using: 
```
"sideEffects": ["*.vue"],
```
would solve my problem! 🥳 The components were styled even in Storybook.

So apparently Storybook's webpack had pruned the Sass inside my `.vue` files, where the Vue CLI service dev server did not do that.

And yes, a quick search in Vue CLI's documentation would reveal [this page, where they even have a yellow warning](https://cli.vuejs.org/guide/build-targets.html#library):

> If you are developing a library or in a monorepo, please be aware that CSS imports are side effects. Make sure to remove "sideEffects": false in the package.json, otherwise CSS chunks will be dropped by webpack in production builds. 

Great, now I am able to continue developing my very first Vue UI-library!
UI Dev Newsletter #52
Tags: webdev, html, css, javascript
Published: 2021-04-13 15:20:22

- [My current HTML boilerplate](https://bit.ly/3wRCLwD)
Manuel Matuzović shares every element he uses for the basic structure of an HTML document with explanations why.


- [CSS Is, In Fact, Awesome](https://bit.ly/3g1bq59)
Jim Nielsen describes how familiarizing ourselves with CSS underlying rules and mechanisms allows us to recognize its awesomeness fully.


- [Modern CSS Upgrades To Improve Accessibility](https://bit.ly/3g1RLlN)
Stephanie Eckles covers a range of topics from focus visibility to respecting color and contrast settings.


- [Inspect Element As A Way To Feed Your Curiosity](https://bit.ly/3uHFeI5)
Ahmad Shadeed highlights some of the exciting and valuable things he learned while being curious about others’ work.


- [Cheat sheet for moving from jQuery to vanilla JavaScript](https://bit.ly/2RsjRMO)
Tobias Ahlin compiles a practical reference guide with some of the most common jQuery patterns and their JavaScript equivalents.


- [Time for Next-Gen Codecs to Dethrone JPEG](https://bit.ly/3dZptFI)
Jon Sneyers introduces JPEG XL, the next-generation image compression codec.


- [JavaScript Tips](https://bit.ly/3wLauIa)
Marko Denic shares JavaScript tips you won’t find in most tutorials.


- [Cumulative Layout Shift Debugger](https://bit.ly/3dTZ3Fn)
Visualize the cumulative layout shifts of any webpage, so it becomes easier to identify what needs improving on mobile and/or desktop in the initial load of a website.



Happy coding!

[Subscribe to the newsletter here!](https://bit.ly/34155z3)
Branches in Git
Tags: git, branch, commits, master
Published: 2021-04-13 14:58:43

Branches are no doubt, one the BEST features of Git. The Master Branch being the default of the repository is automatically created whenever you fork a new repo.
So usually when making commits, we've being committing only to the master branch.
This master branch is the **stable version** of your code and something you will release that's the reason why we don't really want to try out new code or features on this stable version (master branch) just in case it messes the whole code of your repo. 
So we create an _isolated space_ to experiment new code and features. If all goes good and they seem to work well, **you can merge this isolated space (i.e branch) into the master branch** thus eliminating the risk of messing up with the stable version of your repo. 

This is why branches are a massive feature. Saving you right?

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

##Working on a branch
Here's how you can work on branches:

1) Make a new branch 
`git checkout -b <branch name>`

  If you want to switch to an existing branch use
  `git checkout <branch name>`

2) Open the editor of your choice and make changes

3) Add the files
`git add . `

4) Commit the changes and add a commit message
`git commit -m "commit message"`

5) Finally, push these changes to the origin 
`git push origin`

If error occurs, it's probably because you've not set your remote properly . Try using 
`git remote set-url origin SSH of your repo` 
OR
`git push --set-upstream origin <branch name>`

Congrats! You've merged your branch into the master!

##Renaming a branch

Rename a branch while currently not on the branch:
`git branch -m oldName newName`

Rename the current branch:
`git branch -m newName`


##Deleting a branch

`git branch -d <branch name>`

Also delete branch from origin using

`git push origin --delete <branch name>`
Old enough to code, too young for the next step?
Tags: discuss, watercooler, webdev, beginners
Published: 2021-04-13 14:50:58

> Photo by <a href="https://unsplash.com/@lukeporter?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Luke Porter</a> on <a href="https://unsplash.com/s/photos/teenagers?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>
  

#### disclaimer: this is based on my opinion

Over the last couple of years, I've been seeing a lot of young YouTubers (-20 y/o) creating videos about how they made thousands of dollars online. Now that I joined [dev.to](http://dev.to) I'm seeing that there are a lot of young (13, 14, 15 y/o's) web developers that are emerging and asking about freelancing and making money. 

I have no issue with kids learning to code, I actually encourage it. But my main concern is that they are way too young to be worrying about the financial aspect of the field. Most of them only know the basics of web development but are trying to make a fortune by freelancing. When I was 12 y/o my concerns were about winning games and my grades, nowadays their concerns are about making money as fast as possible.

Now, I am no expert in psychology, but I'm seeing on every social media platform that there are a bunch of young people that have some sort of mental illness, either depression or whatever. And I'm starting to think that there is a connection between their priorities to act like grown-ups before their age and their mental wellness. Kids should enjoy the simple things in life and learn, not worrying about making a fortune and be financially independent at the age of 15.

My questions to us adults (+18): 

- What do you think about this new trend of kids trying to make money from an early age, and worrying about all sorts of problems they cannot solve as youngsters?
- What advice do you have for the upcoming generation?

My questions to the young devs (-18): 

- What is your motivation to dive into the tech world and what is your ultimate goal?

I really want to hear your thoughts on this topic, it's something that has been bothering me for a while now. Let's have a healthy discussion about it.

<img src="https://media4.giphy.com/media/xUOrwg6wv8Ew6lRFPq/giphy.gif"/>
Data-Oriented สายเกมส์
Tags: dod, data, design, programming
Published: 2021-04-13 14:44:54

---
title: Data-Oriented สายเกมส์
published: true
description: 
tags: dod,data,design,programming
//cover_image: https://direct_url_to_image.jpg
---

สายเกมส์เขามีข้อจำกัดที่ไม่เหมือนสาย web backend ทำนองว่าถ้าเกมส์ frame rate ต่ำเกินไป ซื้อ PS5 มาเพิ่มอีกแปดสิบเครื่องก็ช่วยอะไรไม่ได้ แต่ถ้าเป็นงาน web backend ก็อาจจะพอช่วยได้ ก่อนหน้านี้ผมได้ยิน Data Driven Programming มากจากทางชุมชน Clojure ที่ [Yehonathan Sharvit บอก](https://www.youtube.com/watch?v=wp93e0-xPvI)ว่าพยายามแก้ปัญหาความซับซ้อนของระบบและสรุปหลักการมา 3 ข้อว่า 

1. แยกระหว่าง code กับ data
2. ใช้ data structure ที่มัน generic ไปเลย
3. ไม่ mutate data

นอกจากนั้น [Clojure History](https://download.clojure.org/papers/clojure-hopl-iv-final.pdf) ก็ว่าถึงเรื่อง Concurrency ด้วย 

ซึ่งจากทั้งสองแหล่งไม่ได้เน้นเรื่องว่าโปรแกรมจะรันเร็ว

ส่วน [Data-Oriented Design ของสายเกมส์](https://gamesfromwithin.com/data-oriented-design) ส่วนต่างที่ผมเห็นก็คือเรื่องความเร็วในการรัน ใน[วิดีโอนี้](https://www.youtube.com/watch?v=yy8jQgmhbAU)เขา claim ว่าโปรแกรมเขารันเร็วขึ้นหกเท่า ด้วยการไปจัดการเรื่อง Cache utiliztion ส่วนหลักการอื่น ๆ ผมมองว่าก็คล้าย ๆ Data Driven Programming ล่ะกระทั่งเรื่อง Parallelization ก็เป็นหลักการแบบที่คล้าย ๆ กัน

Cache utilization มันสำคัญกับเกมส์เดี๋ยวนี้มากเพราะว่าคนส่วนมากก็ไม่ค่อยได้เขียนเกมส์ขายบน Commodore 64 ที่ใช้ MOS Technology 6510 อีกต่อไปแล้ว ส่วนมากน่าจะใช้ AMD Ryzen ไม่ก็ Qualcomm Snapdragon ซึ่งทำงานเร็วกว่า RAM มาก ๆ ทำให้ต้องมี cache memory ขึ้นมาซึ่งเร็วมากแต่มีน้อย ดังนั้นถ้าเราเอา data ที่ไม่จำเป็นมาอยู่ใน cache เยอะ ๆ ก็จะทำให้ต้องโหลดข้อมูลขึ้น cache ใหม่บ่อย ๆ ใน [วิดีโอนี้](https://www.youtube.com/watch?v=rX0ItVEVjHc) Mike Acton ยกตัวอย่าง struct ของ key value เวลาเราค้นหาข้อมูลส่วนมากเราก็วิ่งไล่ค้นตาม key ส่วน value ก็นาน ๆ จะได้ใช้ที แต่การที่เอามาใส่ struct เดียวกันก็หลายเป็นว่า value โดนโหลดใส่ cache ไปด้วย อีกกรณีหนึ่งจาก [วิดีโอนี้](https://www.youtube.com/watch?v=yy8jQgmhbAU) โดย Stoyan Nikolov พวก status flag ใน object ที่ถูก if บ่อย ๆ อันนี้ก็อาจจะทำให้ต้องโหลด object ขึ้น cache แล้วแค่ไปตรวจ flag แล้วก็ไปโหลดอีก object นึงมาก็ใช้ได้ ซึ่งแก้ได้โดยการแยก object ให้ไปอยู่ใน vector คนละตัวกันไปเลย

ส่วนต่างอีกอย่างหนึ่งที่ปรากฎใน code คือทาง Clojure มักจะใช้ Persistent map มาเก็บข้อมูลส่วนทางสายเกมส์ที่ใช้ C++ มักจะใช้ struct เวลาที่ต้องการให้ immutable ก็คือ copy struct นั้นเอาเลย

ส่วนที่เหมือนกันของทั้งค่าย Data-Driven Programming กับ Data-Oriented Design คือมองว่า code เป็นตัว transform (xform) data จากตัวหนึ่งไปอีกตัวหนึ่ง ผมก็นึกขึ้นมาเลยว่าแบบนี้ก็เข้าทาง Rust ที่โปรแกรมประกอบขึ้นมาจาก Expression ที่ทุกอย่าง return ค่าออกมาหมดเลยหนิ แล้วก็เจอจริง ๆ game engine ที่เขียนด้วย Rust แบบ data driven มีสองตัวเลยคือ [Bevy](https://github.com/bevyengine/bevy) และ [Amethyst](https://github.com/amethyst/amethyst) สังเกตว่าใช้ทั้ง Data-Driven และ Data-Oriented เลยครับ ก็เลยไม่แน่ใจว่าเป็นคำที่ใช้แทนกันได้เลยหรือเปล่า
Kotlin onEach() vs forEach() example
Tags: kotlin, oneach, foreach
Published: 2021-04-13 14:37:48

https://grokonez.com/kotlin/kotlin-oneach-vs-foreach-example

Kotlin onEach() vs forEach() example

In the tutorial, <a href="https://grokonez.com">JavaSampleApproach</a> will show the difference between Kotlin <code>onEach()</code> vs <code>forEach()</code>.

<!--more-->
<h2>I. Kotlin onEach vs forEach</h2>
Kotlin provides 2 methods to perform the given [<strong>action</strong>] on each element: <code>onEach</code> and <code>forEach</code>. Method signature:
- <code>forEach</code>

<pre><code class="language-java">
// for Collection
public inline fun <K, V> Map<out K, V>.forEach(action: (Map.Entry<K, V>) -> Unit): Unit 

// for Map
public inline fun <T> Iterable<T>.forEach(action: (T) -> Unit): Unit
</code></pre>

- <code>onEach</code>

<pre><code class="language-java">
// for Collection
public inline fun <T, C : Iterable<T>> C.onEach(action: (T) -> Unit): C

// for Map
public inline fun <K, V, M : Map<out K, V>> M.onEach(action: (Map.Entry<K, V>) -> Unit): M
</code></pre>

What is the main difference between <code>forEach()</code> vs <code>onEach()</code>?
-> <code>forEach()</code> method just performs the given [<strong>action</strong>] on each element. While <code>onEach()</code> method performs the given [<strong>action</strong>] on each element and returns the collection itself afterwards.
<h3>1. with Kotlin Collection</h3>

More at:

https://grokonez.com/kotlin/kotlin-oneach-vs-foreach-example
Advice and experiences on Non-Compete Agreements?
Tags: career, legal, interview, codenewbie
Published: 2021-04-13 14:36:20

Hello, fellow Devies!

I am making a career jump into searching for my first developer position, but have come across developers talking about these non-compete agreements that prohibit developers from programming particular languages they use for work. What are your experiences in dealing with this, or do you have any advice on how someone can navigate through these legalities? 

Thank you in advance. 

If you are curious, I have an example reference linked below.
[Tech Non- Compete Agreement](https://thenoncompeteblog.com/tag/technology-non-compete-agreements/)