teleren/devto huggingface dataset:
Guide to Developing Chrome Context-Menu Applications
Tags: javascript, chrome
Published: 2017-10-04 14:47:09

---
published: true
description: 
title: Guide to Developing Chrome Context-Menu Applications
tags: 
- javascript
- chrome
---

## Introduction

I recently shipped the [amaJSON Chrome extension][amaJSON] and I believe I've come up with an improved process for understanding how to build similar applications.

This tutorial will help you create a practical "context-menu" Event Page extension.

<img src="http://stevengharms.com/images/2017/09/amajson_in_work.png" alt="amaJSON Chrome Extension" />

With Extensions, Google has delivered (yet) another astounding technical platform with superior reference documentation. Nevertheless this documentation leaves delivery practices beyond a trivial proof of concept hard to determine or worse leaves the guidance to &mdash; "look at these examples." This guide fills in any gaps and attempts to move step-by-step.

For beginners to programming there's also a meta-lesson in this post: how to approach programming to someone else's API. I'll describe my research methods and approach throughout the technical tutorial.

## Background

**JavaScript** The reader is assumed to have proficiency with JavaScript and to have facility with core features / issues associated with the language particularly closures, callbacks, enclosed variables, and functions as first-class data. This tutorial will provide you opportunities to "put it on pause" and go learn about these concepts as well. So for those learning them, it provides practical applications.

**Reading `diff` Output; `git` familiarity**

Throughout this tutorial I'll post code as `diff`s or make passing reference to core `git` ideas ("branching" or "commits"). The ability to read a `diff` is quite important so you can see what was removed and added. Knowledge of `git`, while not strictly necessary to benefitting from this post will help contextualize the "steps" and, hopefully, cast light on good developer practice (or, at the very least, _my_ practice!).

Code created in this tutorial can be found in the [GitHub repository][gh].

Please report [bugs / issues / "didn't work for me" there][issues].

## Posts

1. [Requirements and Project Definition](http://stevengharms.com/blog/2017/09/27/guide-to-developing-chrome-context-menu-applications-part-1/)
1. [Parsing the Google Documentation](http://stevengharms.com/blog/2017/09/27/guide-to-developing-chrome-context-menu-applications-part-2/)
1. [Basic Page Action &amp; Content Script](http://stevengharms.com/blog/2017/09/27/guide-to-developing-chrome-context-menu-applications-part-3/)
1. [Context Menu UI &amp; Passing Canned Responses](http://stevengharms.com/blog/2017/09/27/guide-to-developing-chrome-context-menu-applications-part-4/)
1. [Canned Responses in LinkedIn](http://stevengharms.com/blog/2017/09/27/guide-to-developing-chrome-context-menu-applications-part-5/)


[amaJson]: https://chrome.google.com/webstore/search/amajson?hl=en-US
[gh]: https://github.com/sgharms/canned_responses
[issues]: https://github.com/sgharms/canned_responses/issues
How are embed codes implemented?
Tags: embedcodes, integrationtools, javascript, beginners
Published: 2017-10-04 13:46:48

---
title: "How are embed codes implemented?"
published: true
description: 
tags: Embed Codes, Integration tools, Javascript, Beginners
---
There are many service providers like Google Analytics, ZenDesk and several others, who give a unique embed code to paste at the bottom of web page(s) and their services integrate with the system. Especially I would like to know about services like Zendesk, which provide live chat support integration, how are those implemented? How those widgets show up on any website with just a snippet of code, and use custom CSS to make the widget look native?
Please try to explain briefly.
A visual how to guide to Go variables
Tags: go, programming, tutorial
Published: 2017-10-04 13:19:23

---
title: A visual how to guide to Go variables
published: true
description: Easily understand Go variables with beautiful visual examples.
tags: go, programming, tutorial
---


[![](https://thepracticaldev.s3.amazonaws.com/i/cafe18brvd06700p6n83.png)](https://blog.learngoprogramming.com/learn-go-lang-variables-visual-tutorial-and-ebook-9a061d29babe)


Hi!

🔥 [I published a new post](https://blog.learngoprogramming.com/learn-go-lang-variables-visual-tutorial-and-ebook-9a061d29babe)!

**In the post I'm talking about:**

* Beauty of Go declaration syntax
* What is a Variable in Go?
* Why do we need variables?
* How to declare a Go variable?
* Zero-values
* Long Variable Declaration
* Short Variable Declaration
* Multiple variable declaration by grouping
* Multiple short variable declaration
* How to overwrite the data inside of a variable?
* How variables are stored?
* Accessing variables from other packages

Please also send me what do you think about the article.

→ [Click to read the article](https://blog.learngoprogramming.com/learn-go-lang-variables-visual-tutorial-and-ebook-9a061d29babe).
How to create gitignore file with predefined templates?
Tags: git, gitignore, gitignorer
Published: 2017-10-04 13:12:31

---
title: How to create gitignore file with predefined templates?
published: true
description: 
tags: git, gitignore, gitignorer
---
For people who create project frequently, one thing that is very annoying would be creating the gitignore file. The same set of files, but why write it again. Even copying from other directory is a waste of effort. This is why I have created [gitignorer](https://www.npmjs.com/package/gitignorer).

To install this program, simply run:
```
> npm i -g gitignorer
```

This program allow you to create the gitignore file with a predefined set of files. For example:

```
> gitignore init node
# created by gitignorer
# profile used: node
*.sw*
.DS_Store
node_modules
npm-debug.log*
```

Isn’t this great?

All the profiles are defined at `~/.gitignore.profiles.js`. The definition is simple and intuitive. Here is one of the examples:

```javascript
/*** ~/.gitignore.profiles.js ***/
var common = [
  '*.sw*',
  '.DS_Store'
];
 
var node = [
  'node_modules',
];
 
var java = [
  'url: https://raw.githubusercontent.com/github/gitignore/master/Java.gitignore',
  '.object2'
];

module.exports = {
  default: common,
  node: [...common, ...node],
  java: [...common, ...java],
  awesome: [...commone, ...node, ...java],
};
```
How to elegantly flatten a list
Tags: javascript, recursion, functional
Published: 2017-10-04 12:55:34

---
title: How to elegantly flatten a list
published: true
description: 
tags: javascript, recursion, functional
---

# The problem
Given any list `xs`, where `xs` could contain other lists or any non-list values, we wish to extract all the values in `xs`. For example:

1. `flatten([1, [3], [[6, 7], [[[]], 8]]]) => [1, 3, 6, 7, 8]`
2. `flatten([{a: 3}, 1, [[''], 2]]) => [{a: 3}, 1, '', 2]`

# Recursive solution
When we wish to derive a recursive solution, we must avoid thinking recursively. Never trace your code into the recursive calls! The correct approach is to assume that the function you want to define is already working on a smaller structure of the input, which in this case the smaller structure is obviously the tail of `xs`, i.e. `xs.slice(1)`. This assumption is called `the leap of faith`.

So now if `flatten(xs.slice(1))` will work correctly, how could we use this to construct the full correct answer of `flatten(xs)`? Now obviously we are missing `xs[0]`. `xs[0]` could either be a non-list element or another list.

If `xs[0]` is a non-list element, we simply add back `xs[0]` to the first place of `flatten(xs.slice(1))`, then we are done!

If `xs[0]` is another list, we take a `leap of faith` and recursively call `flatten(xs[0])`. Then we can concat `flatten(xs[0])` to `flatten(xs.slice(1))`.

```javascript
function flatten(xs){
  if(Array.isArray(xs[0])) return [...flatten(xs[0]), ...flatten(xs.slice(1))];
  else return [xs[0], ...flatten(xs.slice(1))];
}
```

Now what we miss is a base case. The smallest list that we can flatten must be `[]`, and the answer is obviously  `[]`.

So the final code is

```javascript
function flatten(xs){
  if(xs.length === 0) return [];

  if(Array.isArray(xs[0])) return [...flatten(xs[0]), ...flatten(xs.slice(1))];
  else return [xs[0], ...flatten(xs.slice(1))];
}
```
Microservices with Go
Tags: go, microservices, docker, grpc
Published: 2017-10-04 06:42:02

---
title: Microservices with Go
published: true
description: How to build Microservices using Go, Docker and gRPC
tags: go, microservices, docker, grpc
cover_image: http://pliutau.com/workshop1.jpg
---

![microservices](http://pliutau.com/workshop1.jpg)

What I like about Wizeline is that we have an amazing [Academy](https://www.facebook.com/WizelineAcademy/), both internal and public. Yesterday I was in Mexico, Guadalajara office of Wizeline and I was doing a workshop about Microservices with Go.

The idea was to tell people about SOA approach, gRPC, Protocol Buffers and code a fictional application based on these principles in Go.

I am happy with results, especially when I saw how talented people are, even with new language for them.

We committed our work into this [repository](https://github.com/wizelineacademy/GoWorkshop) and made a [live streaming](https://www.facebook.com/WizelineAcademy/videos/1726299830998775/). Check it out!

Now I am going back to Vietnam and we will start doing Academy there, stay tuned!
Learn faster with this trick from PokÃ©mon Go and Cognitive Science
Tags: beginners, webdev, tutorials, learning
Published: 2017-10-04 03:27:05

---
title: Learn faster with this trick from PokÃ©mon Go and Cognitive Science
published: true
description: Reduce the distance between milestones, and you'll go much farther.
tags: beginners, webdev, tutorials, learning
canonical_url: https://simplestepscode.com/learn-faster-with-pokemon-go-trick/
---





Reduce the distance between milestones, and you'll go much farther. That's what I learned from a seasonal update to PokÃ©mon Go's reward systems.

![Shorten your milestones and you'll go farther.](https://simplestepscode.com/img/short_milestones.png)

PokÃ©mon Go rewards you for hitting certain walking distance benchmarks. However, the distances were long for relatively small rewards.

Then a temporary update cut the benchmark distances in half.

Suddenly I found myself outside walking a lot more, and my friends had the same experience. Now that each milestone was more reachable, I was more motivated to move. I felt like each step mattered, so I was more willing to take steps.

The end result was that I traveled a much greater total distance than in the past.

This was a eureka moment.

I could apply this principle to other things, like learning certain coding skills (or really learning anything).

As an example, I had wanted to get good with HTML5 canvas for a while, but that sounded like a big goal so I let it sit. Eventually I tried shrinking the distance between milestones.

I told myself to code one circle. And I did. That was the momentum I needed. Soon I had built up to a glowing laser-pong game, gravity physics, an arrow flying through the air with an accurate trajectory, and more.

According to cognitive science, here are the main benefits of shorter milestones in learning:

- __Motivation:__ Small steps help you stay motivated because each step feels more acheivable and therefore is more likely to get done. [[Psychology Today](https://www.psychologytoday.com/blog/brain-wise/201310/use-small-steps-motivate)]

- __Retention:__ Small steps improve retention because it's easier to remember stuff when there's less of it at a time. [[Harvard guest lecture](http://hilt.harvard.edu/blog/principles-multimedia-learning-richard-e-mayer), [Lifehacker](http://lifehacker.com/study-less-study-smart-the-best-ways-to-retain-more-1683362205)]

Motivation and retention are common stumbling points for learners, so it's great to have a trick that can address both points.

If there's something you want to learn, try shortening your milestones. You might amaze yourself.

Now I'm curious to hear from you:
What's something you've been wanting to learn, and what steps have helped you make progress?

----

This article originally appeared on [Simple Steps Code](https://simplestepscode.com/learn-faster-with-pokemon-go-trick/), which helps people learn JavaScript and actually be able to use it. Feel free to check it out if you're curious to see more content like this.
(Oh My) ZSH Symfony Completion
Published: 2017-10-06 13:56:27

---
title: "(Oh My) ZSH Symfony Completion"
published: true
tags: 
canonical_url: http://jerguslejko.com/post/zsh-symfony-completion
---

I am presenting you with my own Oh My Zsh plugin that brings command line autocompletion to your favorite tools such as `laravel/artisan`, `laravel/valet`, `composer` or ANY other command line tool built on `symfony/console`!

Follow [the instructions](https://github.com/jerguslejko/zsh-symfony-completion#oh-my-zsh-symfony-console-completion) on Github and bring life to your command line!

# Backstory: How & Why

I am a huge fan of [Oh My Zsh](https://github.com/robbyrussell/oh-my-zsh) and a huge fan of Laravel. When I switched to Oh My Zsh, I have immediately fallen in love with “autocompletion plugins” for various tools such as `git` or `brew`. However, I was missing this functionality in tools I was using on daily basis: `artisan` and `composer`.

I have googled for suitable plugins but I was not totally satisfied with the ones I found. They were either outdated (new commands missing) or offered only fixed set of commands (it wouldn’t pick up your custom artisan commands). I decided to take a look at how are these plugins structured and come up with a new one that would cover all my needs.

My first goal was to create an “Artisan completion plugin” that would parse the output of `php artisan` and provide me with fully functional autocompletion. I managed to get the prototype working in a few hours and I was pretty happy with the result. Then is struck me! Laravel’s `artisan` is built on top of the `symfony/console` package. And so is `composer`!

I decided to generalize this plugin to support ANY tool built on `symfony/console`. That includes `laravel/installer` or even `laravel/valet`! To activate the autocompletion for your favorite tools, just specify the name of the tool in `.zshrc`. Take a look at [the Github repository](https://github.com/jerguslejko/zsh-symfony-completion#instalation) for further instructions.

So, here we are. Go ahead, try it and let me know what you think. Thanks.
ReactJS in 30 seconds
Tags: react, javascript, beginners, inthirtyseconds
Published: 2017-10-03 16:16:19

---
title: ReactJS in 30 seconds
published: true
description: 
tags: react, javascript, beginners, inthirtyseconds
---
React is a JavaScript library that aims to help us write user interface(UI) code. React’s fundamental building block is the `Component` which, in its simplest form, is a JavaScript function that generates UI code (usually HTML). The generated UI code is then rendered by the device. A Component represents a small portion of the UI. Many Components are used together, or _composed_, to create entire views or applications. React Components can receive data that is used to generate the UI code. Whenever a Component’s data changes, it will automatically regenerate the UI code.
What does Mercury retrograde mean?
Tags: mercuryretrograde, planets
Published: 2017-10-03 12:15:59

---
title: "What does Mercury retrograde mean?"
published: true
Description: Mercury Retrograde When Mercury retrogrades, then more notice is on the issues such as the areas of communication, in the way of our interaction with people, neighborhood and also surroundings. It may also be seen in the way we get around, in our interaction with our siblings and in our travel also. Mercury retrograde occurs at two levels. At one level, there is not much you can do with the actions of others, except to be more conscious and prepare for delays and errors by double checking.

tags: Mercury retrograde, Planets
---
Why Arch?
Tags: linux, arch, ubuntu
Published: 2017-10-03 08:52:38

---
title: Why Arch?
published: true
description: 
tags: linux, arch, ubuntu
---

![Arch Linux logo](https://www.archlinux.org/static/logos/archlinux-logo-dark-90dpi.ebdee92a15b3.png)

People have been having problems with Ubuntu recently so I proposed Arch Linux as a replacement, but it'll require some changes to your behavior to get a similar experience.

Arch Linux is a rolling-release distro, that means you'll only ever need to upgrade packages since there are no formal releases.

That means you'll always have the latest versions of the packages you have installed.

Most people think this means Arch is less stable, but this isn't true at all, Arch has always been more stable for me than Ubuntu, Fedora or even SuSE ever was.

At the time of writing this post (September '17), I have the 4.12.10 kernel, and GNOME 3.24.2 and I've had no freezes, bugs, or instability with anything so far.

Another one of the reasons why I use Arch is the package manager, Pacman.

Pacman runs circles around apt, dnf, zypper or any package manager I've used so far, and it has package signing so you'll always have trusted updates (unless you turn that off, of course).

Someone might ask: "Okay, but what if the software I want isn't in the official repos?"

Arch has the AUR (Arch User Repositories) to solve this problem, it's basically a community-maintained repo with recipes to build basically any software you can think of, they're even more comprehensive than Ubuntu's PPAs!

All this comes at a price though.

The price is that you'll have to maintain your own system as Arch gives you very little by default.

The default installer is CLI based, so if you don't know the shell like the back of your hand, there will be a learning curve involved.

This is where the Arch docs really shine, I learned almost everything I know about Linux from the Arch Wiki.

It has a detailed installation guide and a dedicated beginner's guide for people completely new to Arch.

And in case you can't find a solution for your problem anywhere in the Wiki, you'll find one in the Arch forums.

Most people usually stay away from learning stuff like system maintenance, but I think all Linux users should learn how their system works.

This knowledge will come in handy when you come across a problem with your system, I promise.

And in case you don't want to go through all this hassle to have a stable system, there are Arch-based distributions that give you basically the same experience but with a much lower learning curve, the most popular of those is Manjaro Linux.
Explain Serverless like I'm five
Tags: explainlikeimfive, discuss, cloud
Published: 2017-10-03 06:54:18

---
title: Explain Serverless like I'm five
published: true
description: What is Serverless? Explain it to a five-year-old.
tags: explainlikeimfive, discuss, cloud
---
Ok, my 5-year-old kid has trouble understanding how you can have websites without a server. Plz explain.
Need Some Great Blogs for DevOps 
Tags: devops, devopsblogs
Published: 2017-10-03 07:24:09

---
title: Need Some Great Blogs for DevOps 
published: True
description: If you are a DevOps professional looking to get more involved or further your learning, or just looking for some entertaining, insightful content, we wanted to put together a list of 5 great blogs for DevOps. And, we know we missed some, so feel free comment and share what other blogs should be on here!
tags: Devops, Devops Blogs
---

If you are a DevOps professional looking to get more involved or further your learning, or just looking for some entertaining, insightful content, we wanted to put together a list of 5 great blogs for DevOps. And, we know we missed some, so feel free comment and share what other blogs should be on here!


A few great blogs that we think you might find valuable:

ContinuousDelivery.com – Dave Farley and Jez Humble run this site. Jez is a principal consultant for Thoughtworks consulting firm that specialize in Agile and DevOps methodologies. Dave is an early adopter of agile/DevOps practices and has been tinkering with computers for 30 years. This blog has a lot of great information on continuous delivery and DevOps.

IT Revolution Press – Gene Kim is the author of The Phoenix Project: A Novel about IT, <a href="https://mindmajix.com/devops-training">DevOps</a>, and Helping Your Business Win and has a blog that focuses on case studies and reviews DevOps software. There is a wealth of information here for you to peruse.

DevOps Reactions – This Tumblr based site is the Dilbert of DevOps. If you need a laugh when you are knee deep in continuous deployment, this is the place to go. The site is a funny look at issues that you can certainly relate to if you are in a DevOps role.

DevOpsGuys – The DevOps Guys are Steve Thair and James Smith. James is the Dev guy and Steve is the Ops guy and together they are the DevOps Guys; this blog is great for learning about how development and operations come together to “deliver better software faster. The latest blog post talks about why the development process is broken and why companies will invest in DevOps and continuous delivery. This site has great info-graphics as well if you like to learn in this manner.

Dev2ops – Damon Edwards is co-founder of DTO solutions; he focuses on DevOps and the cloud. His blog has lots of videos if you like learning from videos as opposed to heavy reading.
Fuse: Using the `attract` function for animation
Tags: fuse, animation, video
Published: 2017-10-03 07:00:18

---
title: "Fuse: Using the `attract` function for animation"
published: true
description: Animations and a silly thermometer using the `attract` function
tags: fuse, animation, video
---

I create some simple animations, including a silly thermometer, using the `attract` function with JavaScript data bindings. 

{% youtube MA7Oxy129Vs %}

Watch my shows live on [Twitch](https://www.twitch.tv/mortoray)