teleren/devto huggingface dataset:
What does CSS property pointer-events mean
Tags: css
Published: 2019-12-25 07:27:38

---
title: What does CSS property pointer-events mean
published: true
description:
tags: CSS
---

The CSS property `pointer-events` means weather a element should react to Pointer events.

{% link https://dev.to/baooab/what-is-pointer-events-in-javascript-17jh %}

If you use `pointer-events: none`, you'll find __the element does't react to any Mouse and Touch events__.A bit like it doesn't exist in the document.

{% codepen https://codepen.io/zhangbao/pen/QWwgdgz %}

Read More:

- [pointer-events](https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events), from MDN
Advent of Code 2019 Solution Megathread - Day 25: Cryostasis
Tags: adventofcode, challenge, adventofcode2019, spoilers
Published: 2019-12-25 07:03:12

---
title: Advent of Code 2019 Solution Megathread - Day 25: Cryostasis
published: True
description: Baby it's cold inside (this space ship).
tags: adventofcode,challenge, adventofcode2019, spoilers
series: Advent of Code 2019 Solutions
cover_image: https://i.imgur.com/Q2jqbTA.png
---

Merry Christmas!

### [Day 25 - The Problem](https://adventofcode.com/2019/day/25)

We made it to Santa's location! Woo! 

Hmm, maybe my celebratory dance was a little premature. Everything is too quiet. 

Also really cold.

Since it's too dangerous, let's boot up our IntCode computer one last time as a live droid control interface and inspect the conditions of Santa's ship. 

That's right, Part 1 (if you're not cheating, which is its own reward) is using our IntCode computers to play a Zork clone to navigate the ship, collect items, and bypass the weight checking security checkpoint.

Once we get the password to get on board, Santa greets us and requests 49 stars to re-calibrate the ship. Part 2 only requires that you complete all the other days with 2 stars.

### Ongoing Meta

#### Dev.to List of Leaderboards

* `120635-5c140b9a` - provided by [Linda Thompson](https://dev.to/lindakatcodes) 

 If you were part of [Ryan Palo](https://dev.to/rpalo)'s leaderboard last year, you're still a member of that! 

If you want me to add your leaderboard code to this page, reply to one of these posts and/or send me a DM containing your  code and any theming or notes you’d like me to add. (You can find your private leaderboard code on your "[Private Leaderboard](https://adventofcode.com/2019/leaderboard/private)" page.)

I'll edit in any leaderboards that people want to post, along with any description for the kinds of people you want to have on it. (My leaderboard is being used as my office's leaderboard.) And if I get something wrong, please call me out or message me and I’ll fix it ASAP.

There's no limit to the number of leaderboards you can join, so there's no problem belonging to a "Beginner" *and* a language specific one if you want.
Java Questions - Top 10 Most Viewed Questions on Stack Overflow
Tags: java, beginners, webdev, tutorial
Published: 2019-12-25 06:49:46

In this course we are going to examine the top 10 most viewed Java question on Stack Overflow since creation of this platform (*state October 2019)

Stack Overflow itself has according to wikipedia over 10 million registered users and has exceeded over 16 million questions.

This is why I believe that every software developer should get in touch with them. They are covering the essential parts of the programming language and because of that we all should know about them.

I will explain everything what you will need to first understand the questions and then be able to answer them on your own.

What topics can you expect within this course?

* I will explain to you what references on objects are and how Java saves them internally. We take a closer look to the so called null reference that often results in NullPointerExceptions.

* We get to know several data structures, such as Maps, HashMaps, Sets and many more.

* How do I compare two strings, or more general two objects with each other? And what has Java's String pool to do with it?

* We become acquainted with syntactical abbreviations like the for-each-loop or try-with-resource statement.

* We answer the eternal question if Java is a call by reference or call by value language or maybe both?

* How can I create random numbers in general or within specific range? And what do I have to take account of, if I am developing multi-threaded applications?

* We learn what FileOutputStreams and PrintWriters are for and how to use them to create files and fill them with datas.

* And many more

What you'll learn
* 🚀 References on objects, how Java handles them internally, NullPointerException
* 🚀 Comparison of objects via == and equals.
* 🚀 How to create and fill files with the help of streams
* 🚀 What does call by value and call by reference mean? And what does Java use?
* 🚀 Syntactical sugar like the for-each-loop
* 🚀 and many more

{% youtube C9nR9Oxbg0A %}
Cryptoknowmics' Daily Dose of Crypto Updates | 24 Dec
Tags: cryptoworld, ethereumnews
Published: 2019-12-25 06:46:36

Cryptoknowmics brings to you the latest updates regarding every development of the crypto world. 
Today's latest Updates are 
1. 7000 crypto mining machines seized by Chinese authorities 

 https://www.cryptoknowmics.com/videos/cryptoknowmics-daily-dose-of-crypto-updates-24-dec
Nested X Sessions with Xephyr
Tags: x11
Published: 2023-01-06 01:47:53

---
title: Nested X Sessions with Xephyr
published: true
date: 2019-12-25 05:52:02 UTC
tags: X11
canonical_url: https://brandonrozek.com/blog/xephyr/
---

The X Window System was designed at a time when applications that ran on your computer were assumed to be trusted. Therefore there are minimal restrictions in place to prevent applications from grabbing images of whats on another applications screens. This feature as you might imagine is quite useful for screen clipper applications.

Now I know that we’re slowly moving towards Wayland on the Linux desktop, but X11 is still a reality even in my KDE Neon version that’s based on Ubuntu 18.04.

So in the meantime, we can put our untrusted applications into a nested X server using `Xephyr`.

First, we need to find an empty display variable. Chances are this would be `:1` for you. Though if you have multiple of these nested X-sessions running, then this script will be handy.

```
for ((DNum=1 ; DNum <= 100 ; DNum++)) ; do
  [-e /tmp/.X11-unix/X$DNum] || break
done

```

At the end, `DNum` will be set to an empty display variable.

Then to start your nested X session,

```
Xephyr :$DNum \
        -extension MIT-SHM \
        -extension XTEST \
        -nolisten tcp \
        -screen 1920x1080 \
        -resizeable &

```

If we’re going to be using this nested X server for one application, then I recommend using the `ratpoison` window manager as it will make the application full screen and supports the resizing of the Xephyr window.

```
ratpoison -d :$DNum &

```

Finally, you should set your display variable so that any future GUI applications you execute from the terminal will show up in your new Xephyr window.

```
DISPLAY=:$DNum

```

Now if you want to run multiple applications, you’re likely better off using your native window manager.

```
# Set the display before starting the window manager
DISPLAY=:$DNum
x-window-manager &

```

Of course you can replace ratpoison and your native x-window manager with any other window manager of your choice. It actually makes it a great way to test different environments.
Is making 100k USD a big deal from India?
Tags: discuss, career
Published: 2019-12-25 04:51:39

---
title: Is making 100k USD a big deal from India?
published: true
description: Just a feasibility check on whether it's doable
tags: discuss, career
---


I have been thinking of picking a remote job by working from Bangalore, India over the next year (2020). There are two aspects that are making remote jobs lucrative to me.

One is I can work in a peaceful environment. I don't like the noises that are present in the open offices. Given that my domain(Ruby on Rails) is mostly startupy, I have worked only in open offices till now and I think the situation will be the same for the next 5 or so years Until I become a Director or so and can negotiate for an office for myself.


Second is the money aspect, making 100k per year would change life for me in terms of finances. Currently, I get paid about a little less than 20 k USD in India, and it's decent. I just get by paying bills, mortgage etc. I don't get to have much savings with this amount. But 100 k would change the quality of living dramatically and I get to save a considerable amount for the future.

So why 100k? I should be paid as per my location right?

Not really, I would say. I have compared my work with some world-class startups and I would say my work is either comparable if not better. I have built systems that handle millions of requests. I think 100k is not what I would accept if I am in the US. I would be looking at 150 - 200 k which my friends in the US are already making, whom I talk to on a regular basis. So 100k is just a magic number for me, which would make comfortable living in India at this point.

I have worked remotely in the past like 2 years back, but at that time I did not have significant experience under my belt. And I was a junior. Due to timezone constraints (mostly) and some communication gaps on the expectations end. It did not work out. But this time, I am fully independent, and I won't be needing much help/guidance in taking a feature to production.


So anyone from India has done this already? How did you go about it? I know India is a huge country and I am pretty sure many people have done it. I just need some help/advice on which companies pay remote employees good wages and how to approach them. I promise I will pay it forward! Any pointers would be great

Help me, universe!

Edit:
19th Feb 2020: I reached out to a company that has a remote opening from NewYork. They said timezone is the major constraint even though I seemed like a great fit. Salary was 95k USD. So looks like 100 K USD is doable, it's just that I need to find some company which has a fully async remote culture
AngularでWeb Bundlesを試す
Tags: angular, webpackaging, japanese
Published: 2019-12-25 04:48:53

[Angularアドベントカレンダー #2](https://qiita.com/advent-calendar/2019/angular-2)の24日目代打記事です。


[Web Bundles](https://web.dev/web-bundles/)とは、現在標準化が検討されている新しいWebの仕様です。Webページとそれに紐づくサブリソースをひとつのバンドルとしてパッケージ化することができます。

この記事ではWeb Bundlesを手元のAngularアプリケーションで試してみたい人向けの手順を紹介します。


## CLI Builderのインストール

[lacolaco/ngx\-web\-bundles](https://github.com/lacolaco/ngx-web-bundles)というパッケージで、Angular CLI向けのBuilderを作っています。
次のコマンドを実行するだけで、Web Bundleをビルドする準備が整います。

```
$ ng add @lacolaco/ngx-web-bundle
```

インストールできたら、 任意のプロジェクトで`gen-bundle`コマンドを実行します。

```
$ ng run <project name>:gen-bundle
```


ビルドが終わると`index.html`が出力されるdistディレクトリと同じ階層に `out.wbn` というファイルが生成されているはずです。このファイルをGoogle ChromeのCanary版で Web Bundlesを有効にしてから開くと、バンドルを展開できるはずです。


## How it works

ngx-web-bundleがやっているのは２つのことです。

1. `ng add` されたときに `angular.json` を更新し、 `gen-bundle`コマンドを定義する
2. `gen-bundle`コマンドが実行されたときに処理する

### ng-add時の動き

ng-add時に動くのは次の`ngAdd`関数です。

https://github.com/lacolaco/ngx-web-bundles/blob/master/schematics/ng-add/index.ts#L15

やっていることは次の2つです。

1. 対象とするプロジェクトを特定する
2. プロジェクトの `architects` に `gen-bundle`を追加する

### `gen-bundle`時の動き

`gen-bundle`コマンドで動くのは次の`build`関数です。

https://github.com/lacolaco/ngx-web-bundles/blob/master/index.ts#L51

やっていることは次の3つです。

1. `executeBrowserBuilder` を使って、アプリケーションのビルドをおこなう（`ng build`と同じ処理を実行する）
2. ビルド後の生成物を `wbn` パッケージを使ってバンドル化する
3. アプリケーションの生成物を同じ場所にバンドルを出力する

バンドル化の処理は次の関数に記述されています。特別に配慮が必要なのはindex.htmlだけで、それ以外はファイルごとに同じ処理をしています。

https://github.com/lacolaco/ngx-web-bundles/blob/master/index.ts#L24

ひとつひとつのやっていることはシンプルです。それらを組み合わせてルールに従って配置すれば簡単にAngular CLI経由で動かせるスクリプトを作成できます。

## Takeaways

- AngularでWeb Bundlesを試すなら `@lacolaco/ngx-web-bundle` をどうぞ
- 自作のスクリプトを`ng add`や`ng run`に対応させるのは意外に簡単です
  - デバッグはちょっと面倒です
- Web Bundlesについては web.dev/web-bundles/ を参照してください
What is Pointer Events in JavaScript
Tags: javascript
Published: 2019-12-25 04:14:52

---
title: What is Pointer Events in JavaScript
published: true
description: daily learning
tags: javascript
---

Roughly, You can think Pointer Events as a combination of Mouse and Touch events.

```javascript
document.addEventListener('mousedown', () => {
  // do something on mousedown
});

document.addEventListener('touchstart', () => {
  // do something on touchstart
});
```

same as below

```javascript
document.addEventListener('pointerdown', () => {
  // do something on mousedown or touchstart
});
```

Reference: 

- [Consistent access to browser events with Pointer Events API][1]

Read more:

- [The HTML5 Pointer Events API: Combining touch, mouse, and pen][2]

[1]: https://dev.to/pfacklam/consistent-access-to-browser-events-with-pointer-events-api-5gh4
[2]: https://mobiforge.com/design-development/html5-pointer-events-api-combining-touch-mouse-and-pen
5 Git Commands Everyone Should Know
Tags: git, github, productivity
Published: 2019-12-25 03:24:30

Git is an amazing tool for version-control and open-source collaboration (though many companies are now using it too!). I think that most people should be able to use Git, especially if it's a requirement for them at work or school. Below are 5 Git commands everyone should know.

* `git reset --hard [commit hash]` — This is *fantastic* as a last resort for when you've really screwed up. Generally, I've only used this when I've tried out a dumb idea (thinking it was good), merged it into my main branch, and then realized that it was, in fact, a dumb idea in the first place. [You might want to read more about this](https://git-scm.com/docs/git-reset).
* `git checkout -- [filename]` — If you're ever in a situation where you've made so many changes to a file that you think it's just better to scrap them all, this is the command. `git checkout -- [filename]` will undo any uncommitted changes to a file (or a set of files). [You might want to read more about this](https://www.atlassian.com/git/tutorials/resetting-checking-out-and-reverting).
* `git rm [filename]` — This command gets git to stop tracking a file or a set of files. It's pretty useful for removing a file from the working directory *and* removing it from git's tracking. [You might want to read more about this](https://git-scm.com/docs/git-rm).
* `git config --global alias.[aliasname] [command]` — This is **very** helpful if you hate typing a lot. `git alias` allows you to create short-hands for common git commands. For example, `git config --global alias.nbr "checkout -b"` allows you to do `git nbr my-branch` to create a new branch called `my-branch` instead of `git checkout -b my-branch`(I made this exact alias myself). [You might want to read more about this](https://git-scm.com/book/en/v2/Git-Basics-Git-Aliases).
* `git revert` — OK, so I'll admit, I've never used this once, but I think the command is pretty useful. Given a set of commits, it'll undo those changes and record that revert in a commit. Again, I've never used it, but I can think of many cases where development can go so awry that it's necessary. [You might want to read more about this](https://git-scm.com/docs/git-revert).

Opinions? Thoughts? Praises? What are some useful git commands for you? Leave a comment below! 😀
DEV 是什么鬼呀 👻
Tags: dev学习
Published: 2019-12-25 03:04:24

---
title: DEV 是什么鬼呀 👻
published: true
description: 摸索下DEV是什么神奇的网站
tags: DEV 学习
---

DEV是一个开发者社区吗

它和Medium有什么区别呢
Working with local images in ReactJS
Tags: react, javascript, tutorial
Published: 2019-12-25 01:04:30

Frameworks like React were created to make web design and development easy, the downside for frameworks, however, is that things don’t naturally flow the way they ought to like building from scratch. One of the problems I have encountered while picking up React is working images on my PC and it’s quite surprising that I couldn’t find a solution online(even StackOverflow) so I had to figure things on my own. In this short article, I will walk you through how you can work with local images in React (I assume you already know the basics of react so I will skip some things to save time :) )

(1) Create a new react app or use an existing one

```
npx create-react-app working-with-images
```
(2) Navigate to where the image(s) is/are on your PC and copy it

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/miqjj51134gs985kquwo.PNG)

(3) Navigate to the react app you created in step 1 and open the public folder

![Alt Text](https://miro.medium.com/max/790/1*LJkUrGOhEmjn9VFSb_PVdQ.png)

(4) Create a new folder say **images**

![Alt Text](https://miro.medium.com/max/891/1*697KyGTov8zTRSH6Qh-w_Q.png)

(5) Paste your image(s) in this new folder

![Alt Text](https://miro.medium.com/max/889/1*YrhQboH99foatW0QKj9Cww.png)

(6) Open up App.js in your desired text editor or IDE and clear the content in the header

![Alt Text](https://miro.medium.com/max/909/1*FOvQVlZyGlSS-jIji3yMIA.png)

(7) Create an **img tag**, in the src attribute, enter the directory **images** in **curly braces** followed by a **forward slash** and the name of the image as shown below

```
<img src={'images/1.jpg'} alt="A text describing the image" width="500px" />
```

(8) Start your server (npm start), your image will show up correctly as shown below

```
npm start
```
![Alt Text](https://miro.medium.com/max/1018/1*j6Cu9JJgP1Z--iz0Y54-_g.png)

**VERY IMPORTANT:** Your images must be in the public folder
Tips for new Angular developer
Tags: angular, productivity, webdev, javascript
Published: 2019-12-25 00:58:25

When working with Angular know that isn't always the somethings make how you think. After along time you learning tips that can help you going the work more productive.

##Use environments for the control you build
In Angular can be not so explicit but you can have more of two environments, for example, if you need an environment-specific for docker-machine, just you create a new file _environment.docker.ts_, you than need change _angular.json_ for add the new file in the configuration build and serve.

```json
"docker": {
 "fileReplacements": [
   {
     "replace": "src/environments/environment.ts",
     "with": "src/environments/environment.docker.ts"
   }
  ]
 }

```

If you need to use ng-serve, add line forward:
```json
"docker": {
   "browserTarget": "app:build:docker"
}
```


##Pipes are the power of Angular
The big think about Angular into your organization and big possibles, of course, is the Pipes. They can be a superpower to process anything you need showing for your user.

## Components are your friend
Another think of the power of framework Angular is the components, they can be re-used so this opens a large opportunity for your application.

## Create services, primarily to connect APIs
Angular has a good structure for dividing your application, this is awesome because of stay easy for support in the future, services are special to connect with APIs and consume data.

It is just this, a hope that tips can help you in your code work.
I'm a professional React developer, and here's how I set up Node.js/GraphQL Microservices with Docker and React. #4
Tags: react, node, webdev, javascript
Published: 2019-12-25 00:57:55

**Update:** [Part 5 is out!](https://dev.to/bettercodingacademy/i-m-a-professional-node-js-developer-and-here-s-how-i-create-graphql-microservices-using-node-js-and-mysql-5-13e7)

**About Me:** I've been a professional web developer for just over 10 years now. I'm currently the lead web development instructor at [Better Coding Academy](https://codebetter.com.au), and as part of what I do, I post videos on our YouTube channel at [https://www.youtube.com/c/BetterCodingAcademy](https://www.youtube.com/c/BetterCodingAcademy).

_(Subscribe for awesome web development content!)_

This is part 4 in a full tutorial on how to set up a React/Node.js app with a microservices architecture. ([Here's part 3!](https://dev.to/bettercodingacademy/i-m-a-professional-node-js-developer-and-here-s-how-i-create-graphql-powered-microservices-using-node-js-and-sequelize-1a5n))

In this video, I hook up the Listings and Users microservices to the GraphQL-powered API gateway, in preparation for use within the React app.

I hope you enjoy!

{% youtube t5L1uf387q8 %}

Happy coding!

Full source code: [https://github.com/parkroolucas/microservices-demo](https://github.com/parkroolucas/microservices-demo)
Using a Lodash Module Function in a Vue Template
Tags: vue, lodash
Published: 2019-12-25 00:47:09

---
title: Using a Lodash Module Function in a Vue Template
published: true
description: 
tags: Vue, Lodash
---

Today when first doing something in an un-Vue like manner, I discovered a neat little trick.  In a template I was trying to display something such as:

    {% raw %}
    {{foo.bar.baz}}
    {% endraw %}

The above caused an error due to bar and baz being undefined, and in the end I solved this using `v-if="bar && baz"`.  For some reason though to begin with I instead reached for lodash's `_.get` method (https://lodash.com/docs/#get), something still very useful despite much of lodash's functionality being obsolete today, in my opinion, due to advances in vanilla Javascript.

We already had lodash available to our project so in my component I added:

    import _get from 'lodash.get';

Note that from this StackOverflow answer (https://stackoverflow.com/a/43479515/34806) when you import one lodash method you do not access it via the lodash/_ object (i.e. `_.get`), but rather you can reference it simply as `get`, though actually I prefer to import it as `_get` as some indication that it originates with lodash.  So I now tried the following in my template:

    {% raw %}
    {{_get(foo, 'bar.baz', ''}}
    {% endraw %}

But I got an error that `_get` was not available when rendering, which makes sense, I merely imported it, but it wasn't actually a method within my component.  So I did the following at the top of `methods`:

    methods: {
        _get,
        // etc.

Tada!  Now my usage of the imported method in my template worked.  Of course I instantly realized this was a job for `v-if` but still I think this technique, particularly how to add an imported module method to a Vue component's methods, might be useful.