teleren/devto huggingface dataset:
Meet Creepyface, my little side project
Tags: javascript, image, face, mouse
Published: 2019-05-06 20:51:48

---
title: Meet Creepyface, my little side project
published: true
description: A Javascript library that makes your face look at the pointer. Ideal for resumes or team sites.
tags: JavaScript,Image,Face,Mouse
---

Hi all,

I want to introduce [Creepyface](https://creepyface.io), my side project. Creepyface is [a small JavaScript library](https://github.com/4lejandrito/creepyface) I made to make my face follow the mouse pointer on my online resumé. I decided to share it with everyone and here it is:

{% github 4lejandrito/creepyface %}

I tried to design Creepyface to be as easy to use as possible. This is all you need to make your face become alive:

```html
<script src="https://creepyface.io/creepyface.js"></script>

<img 
  data-creepyface
  src="https://creepyface.io/img/0"
  data-src-hover="https://creepyface.io/img/0/hover"
  data-src-look-0="https://creepyface.io/img/0/0"
  data-src-look-45="https://creepyface.io/img/0/45"
  data-src-look-90="https://creepyface.io/img/0/90"
  data-src-look-135="https://creepyface.io/img/0/135"
  data-src-look-180="https://creepyface.io/img/0/180"
  data-src-look-225="https://creepyface.io/img/0/225"
  data-src-look-270="https://creepyface.io/img/0/270"
  data-src-look-315="https://creepyface.io/img/0/315" 
/>
```

You can use [Creepyface's wizard](https://creepyface.io/create) to take your own pictures looking at each direction.

For more information visit [Creepyface's GitHub](https://github.com/4lejandrito/creepyface).

Please let me know if you find Creepyface useful. Any feedback is welcome.

Thanks!
Simplify repetitive Jest test cases with test.each
Tags: testing, javascript, jest
Published: 2019-05-06 20:02:47

### Problem

From time to time, I run into a situation, where most of my test cases follow a similar sequence of steps. This scenario most often happens while unit testing helpers/utility functions. Given certain arguments, check if the actual result is equal to the expected result. Over and over again. As the number of cases grows, the test suite can get bloated. 

Contrived example ahead:

```js
const add = (a, b) => a + b;

describe("'add' utility", () => {
  it("given 2 and 2 as arguments, returns 4", () => {
    const result = add(2, 2);
    expect(result).toEqual(4);
  });
  it("given -2 and -2 as arguments, returns -4", () => {
    const result = add(-2, -2);
    expect(result).toEqual(-4);
  });
  it("given 2 and -2 as arguments, returns 0", () => {
    const result = add(2, -2);
    expect(result).toEqual(0);
  });
});

```

### Solution

I thought about an abstraction to avoid this kind of boilerplate, and after a few google searches, I found the [test.each](https://jestjs.io/docs/en/api#testeachtable-name-fn-timeout) Jest utility. 

This helper encourages you to create the array of `cases`, where you store arguments and expected results, and then iterate through the entire array to run the tested function and assert the results.

Example with `test.each`:

```js
const add = (a, b) => a + b;

const cases = [[2, 2, 4], [-2, -2, -4], [2, -2, 0]];

describe("'add' utility", () => {
  test.each(cases)(
    "given %p and %p as arguments, returns %p",
    (firstArg, secondArg, expectedResult) => {
      const result = add(firstArg, secondArg);
      expect(result).toEqual(expectedResult);
    }
  );
});

```

### Notes

**Benefits**:
- easier to add new tests cases
- less boilerplate

**Possible drawback**:
- more abstractions, some people may find it unnecessary

I find it worthwhile to write a comment about the items of the `cases` array to increase readability and reduce mental effort.


```js
  // first argument, second argument, expected result
  const cases = [[2, 2, 4], [-2, -2, -4], [2, -2, 0]];
```
What are your go-to Dev/SaaS/Business podcasts?
Tags: discuss, podcast, showdev
Published: 2019-05-06 20:01:44

---
title: What are your go-to Dev/SaaS/Business podcasts?
published: true
description: Looking for more podcasts to add to my collection, what are your go-to podcasts?
tags: discuss,podcasts,showdev
---

I'll start with the ones I listen to on a regular basis:

* The Art of Product
* Build Your SaaS - Bootstrapping in 2019
* Full Stack Radio
* Syntax
* The Undefined Podcast
* The Laracasts Snippet
* The Laravel Snippet
* SaaS Reality Podcast
* React Podcast
* The Diff: A Podcast From Facebook Open Source
Invite - Formal Verification Discussion with Certik & Kadena - Covering Blockchain FV
Tags: formalverification, certik, kadena
Published: 2019-05-06 20:00:31

---
title: Invite - Formal Verification Discussion with Certik & Kadena - Covering Blockchain FV
published: true
description: Formal Verification AMA
tags: formal verification, certik, kadena
---


![](https://cdn-images-1.medium.com/max/1000/1*TZSbJbjlYe4Mc37varqWbg.jpeg)

Kadena is hosting another AMA, an interesting topic that looks into…

<h3>FORMAL VERIFICATION: WHAT, WHERE, AND WHY</h3>

As the discussion is on ‘’Formal Verification’’, this is the latest series as part of Kedana AMA’s arsenal. From the general public, to the hardcore techies out there. Everyone is open to ask any questions in the areas of Formal Verification and its application and use within the Blockchain space.

In this technical AMA, you’re going to witness two serial tech entrepreneurs scale a very interesting discussion, venturing into how blockchain projects audit their code to meet specific standards.


The term Formal verification in this context expands on the mathematics focused on reducing the instances of bugs and vulnerabilities of smart contracts. A critical requirement if enterprises will ever be comfortable with deployment on top of enterprise blockchain platforms. This AMA is a must-attend session as it is being covered by Certik, one of the, if not, leading security auditing and penetration testing formal verification platforms in blockchain.

Join the AMA at discord.io/kadena May 7th, 2019

<h3>Kadena</h3>
An Enterprise-focused & high-throughput scalable Blockchain. With only a handful of consensus mechanisms, Kadena is the first to introduce BFT-consensus protocol and Chainweb, a new Proof-of-Work consensus mechanism. Both founding partners, Will Martino and Stuart Popejoy who’ve met while working at JP Morgan, have developed a new private blockchain from the ground up that meet’s enterprise standards

In the past, Kadena held a similar townhall AMA featuring Kyle Samani, co-founder and managing partner at Multicoin Capital — a Crypto-focused Investment Hedge Fund. The topic of discussion was on Proof-of-Work vs Proof-of-Stake, for a quick recap read this

For more information, head over to official EventBrite listing. Those partaking in the AMA can drop their questions in the #ask-kadena channel or tweet with the tag #FormalVerficationAMA.

The AMA is scheduled to go live on May 7th, 2019, don’t forget to tune in to Kadena’s Discord group where questions will be addressed Live by both Will Martino and Ronghui Gu.

Join the discussion @ discord.io/kadena
Node.js
Tags: node, api, rest
Published: 2019-05-06 19:21:34

---
title: Node.js
published: true
description: 
tags: node, api, rest
---
I'm hooked on learning node.js. 80% to completion on my movie-rentals-api for getting familiar with it, implemented transactions on NoSql which was Woah coz i've only used it on RDBMS. Would love any node.js project ideas.
Micronaut PetClinic
Tags: micronautfw, graalvm, java
Published: 2019-05-06 18:14:22

---
title: Micronaut PetClinic
published: true
description: 
tags: #micronautfw #graalvm #java
cover_image: https://thepracticaldev.s3.amazonaws.com/i/wtqucs1gzdghjbsyymya.png
---

I tried implementing [Spring PetClinic](https://github.com/spring-projects/spring-petclinic) with [Micronaut](https://docs.micronaut.io) instead of using Spring.

https://github.com/bufferings/micronaut-petclinic

The application uses Thymeleaf, JPA(Hibernate) and DI. But it starts in a few hundreds of millis with [GraalVM](https://www.graalvm.org/) native image. It's so fast!

In this picture, it started in 324ms:

![Screen Capture](https://thepracticaldev.s3.amazonaws.com/i/wtqucs1gzdghjbsyymya.png)

I haven't yet implemented all the features and it's still very dirty, but basic features work.

## How to try (not native image)

### 1. Clone the Project

```sh
git clone https://github.com/bufferings/micronaut-petclinic.git
cd micronaut-petclinic
```

### 2. Start PostgreSQL

This Petclinic uses PostgreSQL. You could start PostgreSQL with docker:

```sh
docker-compose up
```

### 3. Run Application

```sh
./mvnw compile exec:exec
```

### 3-2. Or you can run it from JAR

```
./mvnw package
java -jar target/micronaut-*.jar
```

### 4. Access PetClinic

You can then access petclinic here: http://localhost:8080/

With JAR file, it takes around 5s to start the app on my laptop.

## How to try native image

Micronaut supports GraalVM native image. So I made this PetClinic run as native image.

```
./mvnw package && docker build -t micronaut-petclinic .
```

I usually have ☕ (around 10 mins on my laptop) to wait for the build finishes.

```
# Docker for Mac or Windows
export HOST_NAME=host.docker.internal
# Linux
export HOST_NAME=172.17.0.1

docker run --rm -p 8080:8080 -e JDBC_URL=jdbc:postgresql://${HOST_NAME}:5432/petclinic micronaut-petclinic
```

Then it takes around 300ms to start. (๑•̀ㅂ•́)و✧
Build 100kB Docker Images from Scratch
Tags: devops, tutorial, docker
Published: 2019-05-06 17:48:19

---
title: Build 100kB Docker Images from Scratch
published: true
description: Building the smallest and simplest Docker images using Scratch. A hello world in C.  multi stage docker images.
tags: devops, tutorial, docker
---
📓 [The Gist](https://gist.github.com/tonymet/646f1125f30e826e4734780c74a3fa44)

You may think your 100mB Alpine images are small--but how about 100kB? Smaller images ship more quickly, and contain fewer attack vectors. Moreover, by optimizing images, you discover and isolate exactly what is needed for your app to run. 

## Let's Optimize.


There are two key characteristics of scratch-based docker images:
1. The Dockerfile has two build stages:
  * a builder--which contains all of the build dependencies including source, libraries and tools and..
  * a final image, containing the binary and any run-time dependencies (config files, certificates and dynamically linked libraries)
2. The final image is `FROM scratch` -- the empty docker image

With this approach, your run-time image will contain exactly what is needed for your app to run -- no additional config files, daemons or libraries that could be misconfigured or exploited.

Let's go over a basic static Hello World scratch image. We'll use C since it requires the fewest dependencies and produces tiny ELF object binaries.


## Create Hello World
`hello.c`

```
#include <stdio.h>
int main(void){
	puts("Hello World\n");
}
```

`Makefile`

```
hello: hello.c
	gcc -o $@  $< -static 

```


## The Dockerfile
`.dockerignore`

```
# this prevents our host binary from sneaking into the build
hello
```

`Dockerfile`

```
FROM alpine:latest as builder
WORKDIR /build
RUN apk update && \
    apk add gcc make libc-dev
COPY .  ./
RUN make

FROM scratch
WORKDIR /
COPY --from=builder /build/hello .
CMD ["/hello"]
```

Notice that we have two `FROM`s, one called `builder`. The final image will be our runner.  Using `COPY --from` we can select which files go into the scratch image. With a static ELF binary we only need `/build/hello`

## Build and Run

```
$ docker build . -t hello-scratch|tail -n 1
Successfully tagged hello-scratch:latest
```

```
$ docker run hello-scratch                 
Hello World
```

## Our Final Image is 82.7kB

```
$ docker images |grep hello-scratch | egrep -o '[^ ]+$'
82.7kB
```


## What's Inside? 

Using `docker save` you can inspect the image and see that `layer.tar` only contains a single file: `hello`

```

$ mkdir hello-scratch && cd hello-scratch 
$ docker save hello-scratch |tar -x
$ ls
3e69d91b5842be72dcd4175adcf218a03f78826504be6a46ed41c099e97520e8.json  e599e214ce17b356493f9524fa57f7ef816d21dd78020019196020c770a39954  manifest.json  repositories
$ ✗ tar -tf e599e214ce17b356493f9524fa57f7ef816d21dd78020019196020c770a39954/layer.tar 
hello

```


## Next Steps

In upcoming posts I'll show some more sophisticated examples. This process is easiest with statically-compiled apps like C, C++, golang & rust.  But with the proper tooling, any image can be built assuming you collect all runtime dependencies into the final `scratch` image.
Looking for contributors, Air Data Systems!
Published: 2019-05-06 17:03:16

---
title: Looking for contributors, Air Data Systems!
published: true
series: collabs

---

![Amaranth ADC](https://www.basicairdata.eu/wp-content/uploads/photo-gallery/imported_from_media_libray/IMGP5088.jpg)

[Basic Air Data](https://www.basicairdata.eu) is a collection of software, hardware, and knowledge for essential air data measurements. The project is ten years old and we're always looking for contributors!

Most used programming languages are C/C++, Java EE, Java, LaTex, and Android. We're using Arduino and Teensy microcontrollers. You can contribute to publishing, sysadmin, engineering, translation, and documentation. Checkout out [website](https://www.basicairdata.eu/about/) and [GitHub repos](https://github.com/BasicAirData).
How I use Axios with nodeJS and expressjs? I get "undefined" back. What I make wrong?
Tags: node, express, axios
Published: 2019-05-06 16:57:09

---
title: How I use Axios with nodeJS and expressjs? I get "undefined" back. What I make wrong?
published: true
description: I only want to receive a JSON response via GET. Unfortunately I just get an "undefined" when I execute the code.  The URL is correct. If I call the URL directly with the web browser I get a JSON back.
tags: nodejs, expressjs, axios
---

I only want to receive a JSON response via GET. Unfortunately I just get an "undefined" when I execute the code.  The URL is correct. If I call the URL directly with the web browser I get a JSON back. 

What I do wrong?

Here my Code:
{% gist https://gist.github.com/sm-a/e1ef04296645998f2321a7b2e8671734.js %}
Question about Facebook apps
Tags: facebook, question, api
Published: 2019-05-06 16:53:32

---
title: Question about Facebook apps
published: true
description: Cannot create visible posts on facebook through the app
tags: facebook,question,api
---
Hello.

Long story short.

I made an app that creates posts on a Facebook page of mine. After inviting everybody that I cared about, I discovered that because the app wasn't toggled for live all posts are visibile only to me. Even though the post visibility was set to everybody, I am the only one that can see the posts. I tried toggling it to live but it requires a hell lot of bureaucracy from Facebook, permission approval and a real site with a privacy policy.

My question is,
What is the cheapest and easiest way to programmatically and visiblity post to a Facebook page that I own?
I don't need to login any user apart from me.

Thanks and I hope that I am not breaking any posting guideline here.
I am the head of platform and standards at one of the UK's largest children's charities, Ask Me Anything!
Tags: ama, charity
Published: 2019-05-06 16:51:03

---
title: I am the head of platform and standards at one of the UK's largest children's charities, Ask Me Anything!
published: true
tags: 
 - ama
 - charity
---

I lead a dev team there and head up a team seeking to unify our technical assets under a common set of best practice standards.
The Best Deep Work Soundtrack
Tags: productivity, music
Published: 2019-05-06 16:36:52

Without a doubt, when I need to get a lot of deep work done, usually writing and shipping code, my favorite playlist is the sound track from the movie _The Social Network_.

# **[👉 See it on Spotify](https://open.spotify.com/album/1ijkFiMeHopKkHyvQCWxUa?si=vKJvJukCQZul8dcncenrrw)**

# **[👉 About it on WikiPedia](https://en.wikipedia.org/wiki/The_Social_Network_(soundtrack))**

This soundtrack was just so perfectly designed to tell a tale of _getting things done_. I don't have the musical vocabulary to do it a lot of justice, but it is just such a mood setter.

If you're looking for a productivity soundtrack, I urge you to check it out.

## Related Posts:

{% link https://dev.to/ericbonfadini/finding-my-new-favorite-song-on-spotify-4lgc %}

{% link https://dev.to/perigk/the-definite-guide-to-pick-the-correct-music-while-working-2e7n %}

{% link https://dev.to/sathish/why-do-some-developers-listen-to-music-while-they-code-44oc %}

{% link https://dev.to/jezrielbajan/any-spotify-playlist-you-can-recommend-to-boost-coding-concentration-thank-you-e1l %}
Markdown mod, Flip form, Dark timeline | Module Monday 38
Tags: showdev, opensource, webdev, javascript
Published: 2019-05-06 15:53:30

---
title: Markdown mod, Flip form, Dark timeline | Module Monday 38
published: true
description: Module Monday 38
tags: showdev, opensource, webdev, javascript
cover_image: https://res.cloudinary.com/component/image/upload/b_rgb:ffffff,c_lpad,h_350,w_800/v1557074673/flip-form_orqymr.gif
canonical_url: https://guide.anymod.com/module-monday/38.html
---

## Ready-to-use modules

This week's mods let you write markdown anywhere, flip for contact, and present events in a timeline.

Click a mod to see it in action along with its source code.

## Markdown mod
Now you can write in markdown and have it auto-compiled to HTML.
<a class="btn btn-sm" href="https://anymod.com/mod/markdown-mod-nkankl?h1=100&h2=100">View mod</a>
<a href="https://anymod.com/mod/markdown-mod-nkankl?h1=100&h2=100">
  <img src="https://res.cloudinary.com/component/image/upload/v1557074672/markdown_nfdcfo.png"/>
</a>

## Flip contact form
Flip to submit the form, flips again once submitted.
<a class="btn btn-sm" href="https://anymod.com/mod/flip-contact-form-mlnmnr?v=20">View mod</a>
<a href="https://anymod.com/mod/flip-contact-form-mlnmnr?v=20">
  <img src="https://res.cloudinary.com/component/image/upload/v1557074673/flip-form_orqymr.gif"/>
</a>

## Dark timeline
Add dates and events to showcase your history.
<a class="btn btn-sm" href="https://anymod.com/mod/linear-timeline-dark-kdlada?v=20">View mod</a>
<a href="https://anymod.com/mod/linear-timeline-dark-kdlada?v=20">
  <img src="https://res.cloudinary.com/component/image/upload/v1557074672/timeline_cqflh3.png"/>
</a>

## Lightweight accordion
A simple accordion for showing your content or FAQs.
<a class="btn btn-sm" href="https://anymod.com/mod/lightweight-accordion-nkanal?v=20">View mod</a>
<a href="https://anymod.com/mod/lightweight-accordion-nkanal?v=20">
  <img src="https://res.cloudinary.com/component/image/upload/v1557074674/accordion_a5lq8w.gif"/>
</a>

## Card section
Pre-styled content section that looks great anywhere you want it.
<a class="btn btn-sm" href="https://anymod.com/mod/card-section-left-lldalr?v=20">View mod</a>
<a href="https://anymod.com/mod/card-section-left-lldalr?v=20">
  <img src="https://res.cloudinary.com/component/image/upload/v1557074674/card-section_ojgu6g.png"/>
</a>

<hr>

I post new modules [here](https://dev.to/tyrw) every (Module) Monday -- I hope you find them useful!

Happy coding ✌️
Build 10x Faster
Tags: startup
Published: 2019-05-06 15:17:37

---
title: Build 10x Faster
published: true
description: Want to build 10x Faster, and sell 10x faster?
tags: startups
---
Imagine a collective of people just like the ones in this community, focused on solving the same problem?

We could build it 10x faster

We could sell it 10x faster

Interested in exploring this concept with me?

You can comment here or join the slack channel. Look forward to some feedback

https://join.slack.com/t/noco-co-op/shared_invite/enQtNjI5MjEwOTE5ODE1LTdjMDE1ZmY3MzU2ZmQ2Zjg0MGMyM2E1ZjdkNjhmNjg4YjNhYzgyNzI5YzlmZDcyNDQ5MjkxOTQ2ODBkYTUzMGY

also slightly more info in a nice wrapper at https://noco.io
Google Login with Firebase and Nuxt
Tags: vue, nuxt, firebase
Published: 2019-05-06 15:05:04

---
title: Google Login with Firebase and Nuxt
published: true
description: Login page with nuxt and firebase
tags: vue, nuxt, firebase
cover_image: https://cdn-images-1.medium.com/max/962/1*kOiW507cv685oBynO0DqHw.png
---
Wanna add a 'Log in with Google' button in your app in minutes ?
Here is how I did it !

# Environement
- Node @11.0.0
- Vue @3.0.4
- Npm @6.9.0
- Nuxt @2.6.3
- Vuetify @1.3.3

## Docs
Nuxt : https://nuxtjs.org/
Firebase : https://firebase.google.com/docs/

# Firebase installation
To install firebase to you Nuxt project simply run the command
```bash
npm install firebase --save
```

and create a file like `firebase.js` into your `pulgins` directory.

Go to your Firebase console and create a new project. after registering your project you will be able to find your firebase config object.

here how to find it : http://support.google.com/firebase/answer/7015592
(our app type is `web app`)

now that you have your firebase config object let's register it into your nuxt plugin !

```javascript
// /plugins/firebase.js
import firebase from 'firebase'

let firebaseConfig = {
  apiKey: "api-key",
  authDomain: "project-id.firebaseapp.com",
  databaseURL: "https://project-id.firebaseio.com",
  projectId: "project-id",
  storageBucket: "project-id.appspot.com",
  messagingSenderId: "sender-id",
  appID: "app-id",
}

let app = null
if (!firebase.apps.length) {
  app = firebase.initializeApp(config)
}

export const db = app.database()
```


don't forget to add `'~/plugins/firebase.js'` to your `nuxt.config.js` in the `plugins` section.

And you will be ready to go !
> at this time you will still need to `import firebase from 'firebase'` into the pages.

# Sign in with popup
I will be using the `signInWithPopup()` method provided by firebase in this exemple

##Button
```html
<v-btn outline fab @click="googleSignIn" color="#4285F4"><v-icon>fab fa-google</v-icon></v-btn>
```

## Method
```javascript
      googleSignIn () {
        this.provider = new firebase.auth.GoogleAuthProvider()
        firebase.auth().signInWithPopup(this.provider).then(result => {
          // store the user ore wathever
          this.$router.push('/home')
        }).catch(e => {
          this.$snotify.error(e.message)
          console.log(e)
        })
      }
```

> the user informations are stored into `result.user`. up to you to store theme where you want !

## Well done ! 👋
that's it ! if your firebase app is correctly registered, you should be able to fetch your Google accounts informations !

let me know if you had difficulties with firebase ore if i made any mistake, i'm still learning !
Artificial Artificial Intelligence Meat🥩API and How We Are Eating It Up
Tags: machinelearning, ai, joke
Published: 2019-05-06 14:45:19

---
title: Artificial Artificial Intelligence Meat🥩API and How We Are Eating It Up
published: true
description: 
tags: machine learning, AI, joke
---

Having co-founded a machine learning company, I’ve seen some AMAZING things, but not necessarily high-tech. 

Advancements in machine learning (ML) and artificial intelligence (AI) are happening at a faster rate than ever, but not fast enough. Data is still a limiting factor and that's where humans 🙋‍♂️🙋‍♀️ come into play. Even more impressive than ML and AI, we have Artificial Artificial Intelligence (AAI), AKA Meat🥩APIs. 

The Meat API uses humans as "artificial intelligence" as they collect the necessary amount of data to actually train an ML model. An extreme case of fake it till you make it 🤷‍♂️. I've commonly seen "AI" companies bootstrap their company with the Meat API. Take an AI assistant service that can help reply to emails and schedule meetings. To the end user, everything seems to be done with human quality and even has human-like grammatical issues. Little did the user know, the emails were in fact written by humans 😂. We are totally eating up the meat.


I hope you enjoyed my satirical take on "Artificial Artificial Intelligence". But really -- people just want to believe. Companies that do machine learning still rely heavily on human intervention to label and edit data that ML models train on and we are still far from being in West World.

For more content like this follow me on Twitter <a href="https://twitter.com/itspanw" target="_blank">@itspanw</a>.