teleren/devto huggingface dataset:
Are you a tweeter or a retweeter?
Tags: showdev, glitch, twitter, node
Published: 2018-04-26 20:22:07

---
title: Are you a tweeter or a retweeter?
published: true
description: Analyzes your twitter posts and lets you know if you're a tweeter or retweeter.
tags: #showdev, #glitch #twitter #node
---

Hi everyone! A while ago I made a small app on [glitch](https://glitch.com) that tells you, based on posts from your user profile, if you are a tweeter or retweeter and generates a downloadable graphic based on that!

![Twit Original](https://thepracticaldev.s3.amazonaws.com/i/iuqr6mxwroub3p29izvs.png)

# Why?

I kept seeing people talk about being super creative and original with their tweets. I wanted a way to actually quantify that in a fun way. 

![Kanye West is a Tweeter](https://thepracticaldev.s3.amazonaws.com/i/ng7m3k1rby1zavsqrnfn.png)

# Possible future plans

- Making sharing easier: be able to draft a tweet with the generated graphic directly from the site.

- Comparing results: a database of the results and have an (opt-in) collection of all the generated graphics.

- Non-binary scale: Instead of retweeter or tweeter have maybe super retweeter > retweeter > perfect balance > tweeter > super tweeter to make the results more specific.

You can check it out [here](https://twit-original.glitch.me)!

{% glitch twit-original %}

And you can [remix](https://glitch.com/edit/#!/twit-original)! (remix on glitch is essentially making a fork and putting your spin on the project)
Fill the Bucket
Tags: game, unity3d, ios, android
Published: 2018-04-26 17:21:45

---
title: Fill the Bucket
published: true
description: Simple physics puzzle game
cover_image: https://thepracticaldev.s3.amazonaws.com/i/ut263sissy8nggxe93fh.png
tags: game, unity, ios, android
---
My first Unity game. The goal of the game is to get the balls into a bucket. It uses physics and you can place objects on the map to change the path of the balls. I tried to keep it simple and release it soon, because we all know that you can spend any amount of time on a simple game. 

I released it for iOS and Android.

[Download Fill the Bucket](https://pecumo.com/fill-the-bucket.php)

![Startscreen](https://thepracticaldev.s3.amazonaws.com/i/ut263sissy8nggxe93fh.png)

![Gameplay](https://thepracticaldev.s3.amazonaws.com/i/we33c96uwof0uw7azlb6.png)
New Features for Developing AngularJS Applications - Part 2: Build An App
Tags: angular, javascript, webdev
Published: 2018-04-26 17:08:59

---
title: New Features for Developing AngularJS Applications - Part 2: Build An App
published: true
description: Learn how to develop applications in AngularJS using a component-based architecture.
tags: #angularjs #angular #javascript #webdev
canonical_url: https://auth0.com/blog/developing-angularjs-apps-part-2/
---

Learn how to develop applications in AngularJS using a component-based architecture.

[Read on 🅰️🚀](https://auth0.com/blog/developing-angularjs-apps-part-2/?utm_source=dev&utm_medium=sc&utm_campaign=new_features_angularjs)

![New Features for Developing AngularJS Applications - Part 2: Build An App](https://thepracticaldev.s3.amazonaws.com/i/kwuizpiskoplsvy9ox58.png)
Trace marks in Emacs like Vim's Ctrl-o
Tags: vim, emacs, editor
Published: 2018-04-26 16:49:44

---
title: Trace marks in Emacs like Vim's Ctrl-o
published: true
description: 
tags: vim, emacs, editor
---

In Vim, we can trace marks by hitting `C-o` repeatedly, which is edit history of current Vim session. In Emacs, we can go back to the latest mark by hitting `C-x C-x`, but I wanted to go back further marks.

I carefully read Emacs manual and found the solution.

https://www.gnu.org/software/emacs/manual/html_node/emacs/Mark-Ring.html

We can trace marks by hitting `C-u C-SPC` repeatedly in Emacs.

# How it works

Emacs has memory for marks called `Mark-Ring` which store up to sixteen positions of marks. Unlike Vim's `C-o`, Emacs' `C-u C-SPC` does not jump to other buffers. This means Emacs do not jump to other files. I prefer this behavior, because when we use Emacs we would open a lot of files in it. Remembering "doing everything with Emacs".

# Furthermore

With one line configure of Emacs, we can go back to marks continuously like `C-u C-SPC C-SPC C-SPC`.

```elisp
(setq set-mark-command-repeat-pop t)
```

And if you are using Helm, you would favorite `helm-ring`.

![helm](https://thepracticaldev.s3.amazonaws.com/i/g98u6jkkbtis1b094oda.gif)

https://github.com/emacs-helm/helm/blob/master/helm-ring.el

It enables to find marked lines with Helm interface.

# Refs

- http://emacs.rubikitch.com/set-mark-command-repeat-pop/
- https://tuhdo.github.io/helm-intro.html
Production-only bugs
Tags: discuss, workflow, productivity
Published: 2018-04-26 12:24:05

---
title: Production-only bugs
published: true
description: What to do when your app has bugs on production that can't/won't be caught in other environments?
tags: discuss, workflow, productivity
---

Hello everyone, this is a discussion to know what you do when there are bugs that only appear on production and can't be reproduced in other environments either by the lack of data, or by the configuration that simply doesn't allow it to be caught outside production.
Conditional statements in Builders in Kotlin
Tags: kotlin, android, designpatterns
Published: 2018-04-26 11:01:16

---
title: Conditional statements in Builders in Kotlin
published: true
description: An adventure in high-order functions
tags: kotlin, android, design patterns
---

At Blockchain, we recently updated our Android app to use more robust push notifications via [FCM](https://firebase.google.com/docs/cloud-messaging/), notifying users of BTC received to their wallets. 

As you might expect, we added a custom vibration pattern to our notifications, but this presented a slight problem. As it turns out, devices where Android ≤4.3 will throw an errant `SecurityException: Requires VIBRATE permission`. This is easily fixed, but how do we do this in an idiomatic way?

One suggestion was to try/catch firing the notification — this is obviously quite nasty and is a raw deal for users on old devices. The simple way would be to this would be to turn the builder into a local `val` and then simply amend the builder separately:

{% gist https://gist.github.com/ditn/fcb2fb29fcdee6d4a6a698dadd24ac34 %}

This is absolutely fine but it breaks up the Builder pattern and we can do better. What if we could put this logic in-line?

Using extension functions, we can extend `NotificationCompat.Builder` and create a new function that accepts a predicate, and calls either one function or another depending on the outcome. Taking advantage of function literals with receivers (ie, `A.() -> A`), we can ensure that the functions to be triggered are both existing public methods of `NotificationCompat.Builder` and return the `NotificationCompat.Builder` object itself.

{% gist https://gist.github.com/ditn/f0b7a385fe749174efb9d007f7b2586f %}

This allows us to do this:

{% gist https://gist.github.com/ditn/0290f7d3dae1bc75f42a7464d6b3fec2 %}

Much cleaner, and doesn’t break the Builder flow. This ternary function seems pretty useful, can we generify it for use with any Builder class? Of course:

{% gist https://gist.github.com/ditn/364e40d982cb0b713941008129e43351 %}

So this worked great and I felt pretty good about it for about 15 minutes, and then I realised that infact, Kotlin already had me covered:

{% gist https://gist.github.com/ditn/c9eb85f4d5e3664323a6f80b17420dbc %}

`apply` is in-fact what exactly I was looking for, as `this` is both it’s receiver and return type. Sheepishly, I corrected my fun-but-not-idiomatic code and pushed it to origin.

Still, this was a fun learning experience that I thought I’d share. Kotlin and it’s high-order functions, including those built-in, are incredibly powerful and I love finding new applications for them.
Every developers 'oh my god I get it' moment.
Tags: discuss, beginners, career, webdev
Published: 2018-04-26 10:03:56

---
title: Every developers 'oh my god I get it' moment.
published: true
description: Discussing every developers 'oh my god I get it' moment.
tags: discuss,beginners,career,webdev
---

So recently, I've been working on my personal project [cssgr.id](https://cssgr.id) using vanilla JS. The code uses a lot of different objects and arrays and I needed to use [Array.reduce()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce) for something.

For some reason, I've never quite understood how this method worked. Something inside my brain didn't quite grasp it, but...with a few (a lot of) console logs I finally got it working how I needed it to and moved on to my next task.

After coming back to the code the next day and reading through what I'd done previously, it just...clicked! I understood how reduce() worked! I finally grasped what it was doing with my data and why it returned the values it did. This is what I'm referring to in the title as the *'oh my god I get it'* moment.

I remember having a similar experience when first using GIT and working with branches. I even had it when first learning how to nest rules in SCSS!<hr>I'm really interested to know firstly, if anyone else has experienced these awesome moments during their work, and second, what it was for you that just 'clicked'!
Asynchronous JavaScript for Newbies
Tags: asynchronouscode, javascript, codenewbie, juniordevs
Published: 2018-04-26 09:57:17

---
title: Asynchronous JavaScript for Newbies
published: true
description: Asynchronous JavaScript for Newbies
tags: AsynchronousCode,JavaScript,CodeNewbies,JuniorDevs 
---



When writing JavaScript we frequently deal with Asynchronous  code which can be confusing for us as newbies. Before we jump into Asynchronous JavaScript lets talk a little about Synchronous Code.

## What is Synchronous Code?
  Synchronous Code runs on a single thread. 1 Action is completed before moving to the  next.

```javascript 
 thread -
          |
          V    
          Start|Line1<---------A--------->|Finish
          Start|Line2<---------B--------->|Finish
          Start|Line3<---------C--------->|Finish

 
```

## Asynchronous Code
Unlike Synchronous code, asynchronous code runs now and finishes later.
From the illustration below, as you can see, the fn2 line was not finished but was completed after fn6 has been executed.

```javascript 
 thread -                                                Separate thread outside you code.
          |                                             /
          V                                            /
          Start|fn1<--------A---------->|Finish       /
          Start|fn2<--------B-----------|-------------|
          Start|fn3<--------C---------->|Finish       |
          Start|fn4<--------D---------->|Finish       V 
          Start|fn5<--------E---------->|Finish       | 
          Start|fn6<--------F---------->|Finish       V  
      Callback |fn2<--------B---------->|<------------|                                               
 
```

Note that JavaScript is single-threaded, only to code you write but Requests made from your code are handed over to a separate thread. Let's say an Api call for example. Hold it, i know what you are thinking; What's a 'Callback'? Don't worry next we're going to discuss 'Callback'.

## What is a Callback?
A callback is a function passed into another function as an argument, which is then invoked inside the out function to complete some kind of action.

```javascript

function Callback(){
 alert("You called Me");
}

setTimeout(callback,300);

// You called Me


```
This is a Synchronous callback, next we're going to talk about 
##### -Asynchronous callback.
##### -Callback Hell.
##### -Ajax Requests.
##### -Promises.
##### -Generators.
New Gmail Is Pretty Dope! #DevThoughts
Tags: gmail, google
Published: 2018-04-26 09:08:40

---
title: New Gmail Is Pretty Dope! #DevThoughts
published: true
description: Google just announced major improvements to Gmail — calling it the new Gmail. There are lots of fun new features like confidential expiring emails, snooze button, super fast UI/UX, and integrated apps including Calendar, Keep, (new) Tasks, etc. I shared some thoughts and pictures about it. Take a look and try the new Gmail.
tags: Gmail, Google,
---

Google seems to have just announced the new Gmail. ICYMI I am an avid user. So, I went ahead and started trying out what's new. ![](https://dha4w82d62smt.cloudfront.net/items/202T150V3G1H1Z29123F/Screen%20Recording%202018-04-26%20at%2010.46%20AM.gif)

How to Get New Gmail? 📧
------------------------

Well, that's pretty simple. Log in to your Gmail account, and click that gear ⚙ icon at the top right corner. Then click the `Try New Gmail` link in there :) ![try new Gmail](https://ahmadawais.com/wp-content/uploads/2018/04/Screen-Recording-2018-04-26-at-01.59-PM.gif)

What's New and the New Gmail? 🔥
--------------------------------

That's the burning questions, isn't it? Well, I for one found many new things in there but here's a summary of a few new features you might wanna read about — and use of course.

> 🆕 **Fresh new UI** — now you do a lot more without clicking a hundred times.⏲ **Snooze feature** that used to be in the mobile app is here on the web.

![New Gmail](https://ahmadawais.com/wp-content/uploads/2018/04/Gmail_Convergence_Consumer_Image_1.gif)

> 🎫 **Expiring emails** Send an email that expires after a set date. _Confidential!_

![Gmail Confidential Mode](https://ahmadawais.com/wp-content/uploads/2018/04/Gmail_confidentialmode.gif)

> 👉 **Google's "Nudge"** will now "nudge" you to follow up and respond.

![Gmail Nudge to respond and followup](https://ahmadawais.com/wp-content/uploads/2018/04/Gmail_Convergence_Consumer_Image_2.max-1000x1000-2.png)

> 👌 **Smart Reply's **has saved me time on mobile now on the web now as well.

![Gmail Expiring Confidential Emails](https://ahmadawais.com/wp-content/uploads/2018/04/Gmail_Convergence_Consumer_Image_3.gif)

> 📨 **Only high-priority notification** will get through to you on mobile. _FTW!_

![Gmail only high-priority notification](https://ahmadawais.com/wp-content/uploads/2018/04/Gmail_Convergence_Consumer_Image_4.max-1000x1000.png)

> 🤖 Keep, Calendar, Tasks, and third party apps integrations are so much fun.

### After 24 Hours of Using New Gmail? 👌

It's been almost 24 hours since I have been trying out the new Gmail and I am pretty impressed. While the new UI is a bit clunky, unfinished, and odd — I know it'll take me some time to get used to it. But, I'm definitely enjoying the speed of it all. Also, I use Google Keep and Calendar. Having it integrated so deeply with Gmail is going to make my life so much easier. That's a welcomed change. 

In short, I'm all too excited. What about you?! 

Here're a couple of [images for the new Gmail](https://AhmadAwais.com/new-gmail).

Peace! ✌

Let's discuss it on Twitter 👇

{% twitter 989435827720806402 %}
Do you include Terraform as one of your DevOps tools?
Tags: discuss, terraform, devops
Published: 2018-04-26 08:17:43

---
title: Do you include Terraform as one of your DevOps tools?
published: true
tags: discuss, Terraform, DevOps
---


As we already know, the goal of DevOps is to perform software delivery more efficiently, and we need some tools to make this delivery quickly and efficiently, this is where the tools like Terraform help companies with infrastructure as code and automation.

Terraform is revolutionizing the DevOps world by transforming the way infrastructure is managed, and making it faster and more efficient to execute DevOps. 

You might have used technologies like Ansible, Chef, or Puppet to automate and provisioning of software, Terraform starts from the same law, infrastructure as code, but focuses on the automation of the infrastructure itself. Your whole Cloud infrastructure (instances, volumes, networking, IPs) can be easily defined in Terraform. 

What's your take on Terraform as a DevOps tool?
Remaining
Tags: javascript, tech, productivity, motivation
Published: 2018-04-26 07:57:31

---
title: Remaining
published: true
description: The coolest new tab extension which will let you know how much time is left in the year, month, week or day.
tags: javascript, tech, productivity, motivation
---

#### A Sleek and Clean New Tab Extension for Chrome

The coolest new tab extension which will let you know how much time is left in year, month, week or day.

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

View - https://www.producthunt.com/posts/remaining
Weekly UI Challenge Week 3 Day 4: Add sorting
Tags: ui, weeklyui, challenge, react
Published: 2018-04-26 06:13:52

---
cover_image: https://thepracticaldev.s3.amazonaws.com/i/cyolczubwx9dg2plzcuj.png
title: "Weekly UI Challenge Week 3 Day 4: Add sorting"
published: true
description: "Week 3 Day 4 of my Weekly UI challenge: Shuffling the deck "
tags: ui,weeklyui,challenge,react
---

Welcome to Week 3, Day 4 of my Weekly UI challenge! Week 3 will focus on a **results page** UI component; each day throughout this following week, I will pick one or two (usually related) subelements of the design to implement. For day four, our goal is to…

## Add sorting

The sorting of search results are an important part of a useful results page. Whether it is for an ecommerce platform– sorting by price or customer review, or a search engine– sorting by date or relevance, or some other type of app/site, proper sorting methods help users get the best of your search implementation.

Following the original design I created, this is what I've got for **Day 4**:

![A results page component in list view, with one result entry highlighted to indicate it is sponsored](https://thepracticaldev.s3.amazonaws.com/i/j8cjtbklxomue6imuy5i.png)

The design is a little different due to the fact that I am using the native HTML `select` element, but the functionality is all there. The design continues to emulate the results of a mock soccer blog, so the sorting methods reflect that of a blog, i.e. sorting by date. If you were using a more robust search platform and flexible API, you could also sort by relevance (like Google and Amazon do, for example) or by price or customer rating, as previously mentioned.

Here's an animation of the feature in action:

![A results page component switching between list and grid views, with certain sorting parameters in place](https://thepracticaldev.s3.amazonaws.com/i/aw87o75t8vbp4rnqdb71.gif)

You can check out my coded implementation [on my Github pages site for this project](https://geoffdavis92.github.io/weekly-ui/).

## Now it's your turn

I used [React.js](https://reactjs.org) and [Storybook](http://storybook.js.org) to develop my implementation, but you can use whatever technology stack you would like! (hint: if you use [Vue.js](https://vuejs.org/) or [Angular.js](https://angularjs.org), you can still use [Storybook for those libraries](https://storybook.js.org/basics/slow-start-guide/))

You don't even have to use a view library if you don't want to; HTML and CSS-only (and non-view JavaScript library) components are more than possible, especially for this step.

Also, please add your repos and/or images of your designs in the comments for inspiration! I would love to see what designs you all create.

Happy coding! 🎉

### Week 3 Calendar

1. (Sunday 4/22) Design component ✅
2. Result entry, sponsored/best seller indicators ✅
3. Grid/list view toggles ✅
4. Sorting 🎯
5. Pagination/load more
6. 100% a11y score
7. Tweaks, refactors, fixes
Can you explain to me what's going on in this code?
Tags: discuss, explainthiscode, javascript
Published: 2018-04-26 02:28:59

---
title: Can you explain to me what's going on in this code?
published: true
description: 
tags: discuss, explainthiscode, javascript
---

In trying to understand a Google snippet I had the thought that it might be an interesting type of discussion—explaining a code snippet.

This code is minimized for efficiency. Anyone care to read this to me?

```html
<style>.async-hide { opacity: 0 !important} </style>
<script>(function(a,s,y,n,c,h,i,d,e){s.className+=' '+y;h.start=1*new Date;
h.end=i=function(){s.className=s.className.replace(RegExp(' ?'+y),'')};
(a[n]=a[n]||[]).hide=h;setTimeout(function(){i();h.end=null},c);h.timeout=c;
})(window,document.documentElement,'async-hide','dataLayer',4000,
{'GTM-PNDQRRW':true});</script>
```
Non-Ember Things in Ember
Tags: ember
Published: 2018-04-26 00:00:00

---
title: Non-Ember Things in Ember
description: No `ember install`? No problem!
date: 2018/04/26
tags: Ember
canonical_url: https://wrotenwrites.com/embers-app-import/
published: true
---

The Ember community is great and [full of great ember-cli friendly addons](https://www.npmjs.com/search?q=ember) to add to your project. Using [Redux](https://github.com/reactjs/redux)? Check out [ember-redux](https://www.npmjs.com/package/ember-redux). Need [FastClick](https://github.com/ftlabs/fastclick)? Check out... well, actually your best bet is [ember-hammertime](https://www.npmjs.com/package/ember-hammertime) but you get the point.

But **sometimes you just _need_ to incorporate something that isn't Ember ready**. Today that's easier than ever!

## Show Me

In this example we'll be adding `url-polyfill` to our Ember app. _I know `ember-url` is out there but it lacks some of the functionality `url-polyfill` offers._

1. `yarn add url-polyfill` or `npm install --save url-polyfill`
2. In your `ember-cli-build.js` within the `module.exports = function() {` add the following...
```js
app.import('node_modules/url-polyfill/url-polyfill.js');
```

You're done!

For bonus points, you can even configure which import you use based on the environment...
```js
app.import({
  development: 'PATH/file.js',
  production: 'PATH/file.min.js',
});
```

This also works with css files to bring in your favorite CSS framework, animation library or other tool. If you're still using bower, simply point your import path to `bower_components/DEPENDENCY/FILE.EXT`.

### But, wait, I have some setup I need to do!

That's cool too! An initializer is likely what you'll want.
```bash
ember generate initializer myInitializer
```

Then within there you can run any initialization code your heart desires and it'll run at app load.

## Want to go further?

Make an ember-addon for your favorite tool and publish it on npm! The community would appreciate it and love the easy of an `ember install`.

Go make great things. Or... combine great things into an even greater thing!