teleren/devto huggingface dataset:
Fixing Typos while Writing -- Two Ideas
Tags: touchtyping, vim, emacs
Published: 2018-09-23 09:31:57

---
title: Fixing Typos while Writing -- Two Ideas
published: true
tags: touch typing, vim, emacs
---

Here are some thoughts on text editing. No matter what kind of text you write -- source code, articles, to-do lists, books -- there's always a chance you get a single letter wrong at one point. Depending on your touch typing skills, this might not happen very often. But *when* it happens, **what do you do?**

- Do you press and hold the backspace key until you get back to the typo?
- Do you jump back to the bad letter, fix it like a surgeon[^1] and continue writing?

## My experience
Personally, I used to (rather unconsciously) adhere to the second approach. One day, however, I found out that even the Vim editor has support for [deleting the last word before the cursor](http://vimhelp.appspot.com/insert.txt.html) while typing in *insert* mode. This is not typical though. Usually, there are two steps involved: first, you use movement commands to get to the desired text position and then enter *insert* mode.

Although I'm a big fan of Vim's fantastic movement commands, this made me change my view to another perspective. What kind of habit would you develop if every typo was really **easy to fix?** Your brain may think something like: "It's not critical to get it right the first time -- it's not a big deal anyway". So there's **no motivation** for typing words correctly on the first attempt.

## Better use the first approach?
To me, deleting the entire last word sounds a bit drastic at first. You did put some effort into writing it in the first place, did you? Nevertheless, I think the training effect might be worth it. So I will try it for some time and see whether there's a positive effect on my typing.

What do you think? Are there any scientific studies about this? I would love to know your opinion and personal experience.

To be complete: the Vim editor is by far not the only one to implement the *delete last word* feature.
You can use `Ctrl-w` on the terminal and inside Emacs. Many GUI applications support `Ctrl-Backspace` for doing the same.

[^1]: Example for Vim: Let's say you wrote 'house' instead of 'horse', you can do '<ESC>Furr' to fix that.


This post has originally been published on [steffen.ronalter.de](http://steffen.ronalter.de)
Sell courses on Android app in Google Play
Tags: android, mobile
Published: 2018-09-23 08:28:21

---
title: Sell courses on Android app in Google Play
published: true
description: Does anyone has experience with integrating payments in apps?
tags: #android #mobile
---

So I am creating app which will allow you to purchase some nutrition based courses. Unfortunately I am unable to find clear description on how to integrate payments.

Not from technical point of view. Can I choose some payment gateway like PayPal, Stripe or whatever or do I need to choose In-App purchases from google play?

**Edit**

Found this article -> https://medium.com/@jessesahli3/ios-renewable-subscriptions-overview-stripe-vs-in-app-purchases-4fdb02bec0da

Actually Spotify was the one which was giving me doubts and they are mentioned. That on iPhone you cannot buy premium within the app, but can sign in on browser, pay there and then come back to app.
How I hacked 747 game|Built Cheat Bot using Deep Learning
Tags: deeplearning, hacking, python, android
Published: 2018-09-23 03:11:54

---
title:  How I hacked 747 game|Built Cheat Bot using Deep Learning
published: true
description: Read how I hacked a game and built cheat for using deep learning.
tags: #deeplearning #hacking #python #android
---
[How I hacked 747 game 😎 | Built Cheat Bot using Deep Learning](https://medium.com/howcatcancode/how-i-hacked-747-game-7ecffdc74718)
Does your website really need to be larger than Windows 95?
Tags: discuss, coding, technology
Published: 2018-09-23 03:02:24

---
title: Does your website really need to be larger than Windows 95?
published: true
description: The efficiency problem of modern development is one that can be fought by you.
tags: discuss,coding,technology
---

A few days ago, an [important blog article](http://tonsky.me/blog/disenchantment/) was published:

> Look around: our portable computers are thousands of times more powerful than the ones that brought man to the moon. Yet every other webpage struggles to maintain a smooth 60fps scroll on the latest top-of-the-line MacBook Pro. I can comfortably play games, watch 4K videos but not scroll web pages? How is it ok?

This is another claim made by me in various comments on DEV: We have hardware which becomes faster every few months - but the software we use (and, sometimes, develop) with it is slower with every new release. When has efficiency quit its job, why have we fired it?

How can a [complete web forum](https://board.asm32.info/!categories) load faster than most of our personal websites which only show text and (usually) minimal graphics? Why does your text editor exceed the size of Windows 95 and why does it even take longer to start? Is "Everyone has fast hardware now anyway" always a good reason to not consider the runtime efficiency? The computer used to help the Apollo 11 team back to Earth had 4 kilobytes of RAM. Would your application fit into that?

It is never too late to make the first step into a better future. Let us leave the inefficiency spiral - let us embrace efficiency again.

Just a thought for the night.
How much did you know when you got your first freelance Web Dev project?
Tags: help, webdev, freelancing, career
Published: 2018-09-22 22:06:03

---
title: How much did you know when you got your first freelance Web Dev project?
published: true
description: 
tags: #help, #webdev, #freelancing, #career
---

I'm considering going into freelance web development, and I'm trying to determine at what point I should start offering my services to people. I am an experienced programmer, just not very experienced at building websites. 

If you are, or have been, a freelance web developer, I have a couple of questions for you:

1. Were you able to create dynamic websites when you first started offering your services, or did you just do static starting out?

2. Were there specific types of websites you were willing to build starting out (ecommerce, blogs, generic business sites...) or did you just take whatever projects you could get and learn as you went?

3. Any advice for someone starting out in this role is welcome.
Three neat CSS features
Tags: css, devtips
Published: 2018-09-22 19:29:43

---
title: Three neat CSS features
published: true
description: 
tags: #css #devtips
---


Here are three random CSS features that I didn't know about and was happy to learn that they exist.

# 1. caret-color

You can change the color of the blinking bar in input fields by simply using the `caret-color` property.

{% codepen https://codepen.io/mornir0/pen/BOMQNz %}

⚠ Support for the `caret-color` property is not so great:
![caret-color support](https://thepracticaldev.s3.amazonaws.com/i/28slcokwufurqu4va68o.PNG)



# 2. nth-child(odd) & nth-child(even)

Those values are pretty well-known, but I only found out recently about them. They can come in handy, e.g. for alternating background colors in lists:


{% codepen https://codepen.io/mornir0/pen/wENord %}



# 3. Gaps in Flexbox!

This is a truly awesome feature. In CSS grid, we can use the gap property to specify the gaps (gutters) between rows and columns. "Now" we get the same power with Flexbox!

However this feature is only supported by Firefox 63, which at the time of this writing hasn't been released to the wider public. I hope that the other vendors will implement it soon.


{% codepen https://codepen.io/mornir0/pen/qMwqLv %}

_If you only see a big green block in the second example in the codepen above, it means that your browser does not support it._
React EdiText - Inline Editable Text Component
Tags: javascript, react, opensource
Published: 2018-09-22 19:13:02

---
title: React EdiText - Inline Editable Text Component
published: true
description: I just published my first open source library for React.
tags: javascript, react, open source
---
I just published my first open source library for React. EdiText is a React component provides inline editing for texts. 

You can see examples and usage on the Github page. Any kind of feedback is welcome. Here its Github Page:

[https://alioguzhan.github.io/react-editext/](https://alioguzhan.github.io/react-editext/)
breaking my yotube bubble
Tags: discuss
Published: 2018-09-22 18:35:33

---
title: breaking my yotube bubble
published: true
description: i use YouTube for learning every day but i notice that my timeline only have mens channels, so i wonder where is the women in tech tutorials 
tags: devdiscuss, discuss
---

i use YouTube for learning every day but i notice that my timeline only have mens channels, so i wonder where is the women in tech tutorials 

Every social app creates a bubble around us preferences and that is ok somtimes but after some time you are missing a lot of content

Today i look at my YouTube home timeline and didnt see any woman 

I follow channels like fun fun function, devtips, kyle simpson talks, Coding train....
Maybe YouTube in some point think uhmm let show mens talking about tech to think user.

So id like to break this bubble whit women in tech channels.

Can you recomend me some channels?
Thanks!!!!
ps aux output in cronjobs
Tags: bash, beginners, linux, devops
Published: 2018-09-22 16:05:05

---
title: ps aux output in cronjobs
published: true
description: ps aux output in cronjobs
tags: bash, beginner, linux, devops
---
Hello there,

Going trough an ad-hoc cronjob for checking an existing process I've hit a weird case that the command itself was working well when ran from the terminal, but failed miserabely when the cronjob ran it.

The command was something along the lines of:
```sh
ps aux | grep 'php artisan a_specific_command --with-some-long-parameters-that were generated' | grep -v grep
```

The thing that I've completely forgotten is that by default `ps`'s output is limited by the number of `$COLUMNS`. As a standard that's set to 80 chars ([that of course you can easily change](https://askubuntu.com/questions/219547/how-do-i-get-more-than-80-columns-in-command-line-mode)).

Because of that, the output line itself was truncated when ran trough the cron command (and worked well on my full hd screen that has aproximately 171 columns, you can test yourself by using `echo $COLUMNS`).

The easiest solution for fixing this is using the [_Wide output_ mode](http://man7.org/linux/man-pages/man1/ps.1.html) twice for unlimited width

```sh
ps auxww | grep 'php artisan a_specific_command --with-some-long-parameters-that were generated' | grep -v grep
```
Best youtube channels to Devs and Designers
Tags: developer, designer, youtube, career
Published: 2018-09-22 15:38:29

---
title: Best youtube channels to Devs and Designers
published: true
description: 
tags: #developer #designer #youtube #career
---

It's been a while since I've followed youtube channels about the day to day developers and designers, it's very interesting to see what these people's routine is like in their professional lives.
I came to share some of the ones I accompany, and to know which ones you like :D

## Developers

[Mayuko](https://www.youtube.com/user/hellomayuko)

[MPJ - Fun fun function](https://www.youtube.com/channel/UCO1cgjhGzsSYb1rsB4bFe4Q)

[Dev Tips](https://www.youtube.com/user/DevTipsForDesigners)

[Wes Bos](https://www.youtube.com/user/wesbos)

[Life of Luba](https://www.youtube.com/channel/UCgzKCeDYLRzPhQ64R6AKyBQ)

## Designers

[Charlie Marie](https://www.youtube.com/user/charlimarieTV)

[Hello, I`m Alexa](https://www.youtube.com/channel/UCmypYv02UGldiA8g7j2mCyw)
React Native Simple FlatList Component Android Example
Tags: react, reactnative, android, mobile
Published: 2018-09-22 15:10:56

---
title: React Native Simple FlatList Component Android Example
published: true
description: React Native Simple FlatList Component Android Example
tags: #react #reactnative #android #mobile
---

Post Link : <a href="https://www.skptricks.com/2018/09/react-native-simple-flatlist-component-example-android.html" > React Native Simple FlatList Component Android Example </a>


This tutorial explains how to use FlatList component in react native application and apply set onPress event on FlatList  to get value from selected list item. FlatList provides easy way to make an efficient scrolling list of data. FlatList - More performant compared to ListView. ListView rendering can get slow once the number of items grows larger. FlatList significantly improves memory usage and efficiency (especially for large or complex lists).

<a href="https://www.skptricks.com/2018/09/react-native-simple-flatlist-component-example-android.html" > React Native Simple FlatList Component Android Example </a>
<img src="https://1.bp.blogspot.com/-ngOj_l6e9wI/W6ZUrIjXJ2I/AAAAAAAAB6E/t0s7PTm16sQb_Lb1d2SbLscsXL44Dd9uwCLcBGAs/s640/fl.png" />

FlatList Features :
Flatlist is packed with new components full of features to handle the majority of use cases out of the box:
Scroll loading (onEndReached).
Pull to refresh (onRefresh / refreshing).
Horizontal mode (horizontal).
Fully cross-platform.
Configurable viewability callbacks.
Intelligent item and section separators.
Multi-column support (numColumns)
Footer support.
Separator support.
scrollToEnd, scrollToIndex, and scrollToItem support
Better Flow typing.

<a href="https://www.skptricks.com/2018/09/react-native-simple-flatlist-component-example-android.html" > Read More... </a>
How to start contributing to open source as a junior or newbie?
Tags: discuss, beginners
Published: 2018-09-22 14:44:49

---
title: How to start contributing to open source as a junior or newbie?
published: true
description: just wondering...
tags: discuss, beginner
---

What are some open source projects juniors can contribute to?

Please share some projects you know of that are open to junior contributions/pull requests. And maybe I’m just being too self conscious. If Wikipedia and Stack Overflow are any measure of open source experience, it’s given me a feeling that if someone can do it better or asked a question already, you should let them do it. Then there’s my previous work experience which has shown me writing new code is for seniors, and maintaining or fixing code is for juniors lol. In reality maybe these hierarchies shouldn’t exist and aren’t enforceable on GitHub, but I don’t have a sense of how much room there is to mess up.

I would like to begin to contribute to projects on github outside my own and get feedback. I’m not worried about looking stupid or being told I’m wrong, but more so getting a community annoyed because someone keeps submitting poor code and wasting their time in having to correct it. Sometimes existing code in repos are too complicated to understand or add to. 

Maybe providing example code and doc for libraries is a start?

Let me know about how you started and what you did to feel more comfortable adding to external projects!
Angular 7 beta 4 - Setting up
Tags: angular7, angular, angular2, angularcli
Published: 2018-09-22 14:32:17

---
title: Angular 7 beta 4 - Setting up
published: true
description: Set up Angular 7 beta 4 on your machine
tags: angular7, angular, angular2, angularcli
---

{% youtube 1dzt4cBzT0U %}
Nuxt.jsのプロジェクトをNuxt.js2にバージョンアップしてみた
Tags: nuxt, vue
Published: 2018-09-22 13:53:39

---
title: Nuxt.jsのプロジェクトをNuxt.js2にバージョンアップしてみた
published: true
description: 
tags: nuxt,vue
canonical_url: https://crieit.net/posts/Nuxt-js-Nuxt-js2
---

昨日ついにNuxt2がリリースされたため、早速既存のプロジェクトを2にアップグレードしてみました。今回はnuxt-edgeからのアップグレードではなく、単純にNuxt1からのアップグレードになります。

プロジェクトのベース部分は下記の記事で構築したものになります。ExpressとTypeScriptが混ざっています。

[Nuxt.js+ExpressのプロジェクトをTypeScript化する](https://crieit.net/posts/Nuxt-js-Express-TypeScript)

## Nuxt.jsを2にバージョンアップする

package.jsonを調整し、バージョン２を入れます。

```json
    "nuxt": "^2.0.0",
```

あと合わせてts-loaderも3から4に変えておきます。

```json
    "ts-loader": "4.5.0",
```

あとはインストールします。

```sh
yarn
```

特に他に何も入れてなければこれで完了で、もう動くのではないかと思います。依存関係の問題が出て厄介な場合は、下記の記事で紹介されているように一旦Nuxtと@nuxtjs系のパッケージを削除して入れ直す方がわかりやすいと思います。

[【実録】Nuxt.jsの既存プロジェクトを一足早くNuxt v2( nuxt-edge )へとアップグレードする方法](https://qiita.com/potato4d/items/7b3119c88869d7622a7d)

僕の場合他にTypeScriptが入っているのでそのあたりも見ていきます。

## TypeScriptを入れているときのための対応

### vue-property-decoratorを使わないようにする

なぜか僕のプログラムではnuxt-property-decoratorとvue-property-decoratorが混在していました。どうもNuxtのv2にアップグレードするとvue-property-decoratorが見つからないとなぜかエラーが出るようになったので統一しました。

```typescript
import { Component, Vue } from "nuxt-property-decorator";
import { Prop } from "vue-property-decorator";
```

```typescript
import { Component, Vue, Prop } from "nuxt-property-decorator";
```

### typescript.jsの修正

modules/typescript.jsがエラーになるため修正します。（どこから得た対処方法かは忘れました）

```javascript
    const tsLoader = {
      loader: "ts-loader",
      options: {
        appendTsSuffixTo: [/\.vue$/]
      }
    };
```

元々上記のような箇所があるのですが、これを下記に修正します。

```javascript
    const tsLoader = {
      loader: "ts-loader",
      options: {
        appendTsSuffixTo: [/\.vue$/],
        transpileOnly: true
      },
      exclude: [/vendor/, /\.nuxt/]
    };

```

あとは

```javascript
        rule.options.loaders.ts = tsLoader;
```

こういった記述がある箇所もエラーになるので、下記のように修正します。

```javascript
        rule.options.loaders = rule.options.loaders || {};
        rule.options.loaders.ts = tsLoader;
```

## まとめ

とりあえず僕がアプリケーションをdev, build, startできたところまでをまとめてみました。プロジェクトによっては他にもいろいろエラーが出てくると思いますので、適宜エラーを見て修正していく必要があると思います。

まだやってみたばかりで不備などあるかもしれませんので参考程度として見ていただければと思います。（ただほとんどnuxt-edgeに移行した時と同じなのでおおよそは問題ないのではないかと思います）
Do I really need to create classes in two places?
Tags: help
Published: 2018-09-22 13:29:11

---
title: Do I really need to create classes in two places?
published: true
tags: help
---

I have a website for which I've written an API using mongoose models and nodejs. 
Now, I am creating an app which will use the same API. Whether I create it in Xcode (just iOS) and Android Studio (just Android) or use a combined framework (like Flutter), I find myself creating classes that duplicate the Mongoose models. For example, I have a mongoose model for User, and **I have now, in a separate location, a class for User**. 

My concern here is maintainability. If I update the API or make a change to the underlying models, I have to do this in two places. While I don't have a big application, I still feel as though I am doing this wrong.

Advice requested. :) 

Okay, y'all. I think I just need to get my head around it. For the website, I have written an API that relies on the mongoose models, so I don't end up recreating them in that instance (for the front end). Unfortunately, I set up the API such that it returns the front end pages. That means that I cannot use it for mobile. I think that I can write a separate API for my mobile apps that lives on the same server and then will not have the redirects (and potentially then go back and have one pretty unified API that knows if it is serving a mobile app or the website).
I can create dart classes for Flutter (or do it uniquely for iOS and Android), so I can also have local cache of data.
I took SPA too seriously and made a short-intro-website for myself.
Tags: angular, javascript, css, webdev
Published: 2018-09-22 13:26:11

---
title: I took SPA too seriously and made a short-intro-website for myself.
published: true
description: 
tags: Angular, JavaScript, css, webdev  
---

As a developer, it is natural that all of us would come to a stage where *'I should probably be having a website/portfolio of mine in the web by now'*. I decided to build mine on **Angular**, but I was very adamant that I would do all styling part on my own without any help from BootStrap or Angular Material. So yeah! every pretty thing you see on the site is *coded by me*. As the title suggests, the site contains only a short intro about me and I am also thinking of converting it into a portfolio soon.

Here is the link to the [site](https://hariharan-dev.herokuapp.com/). Do Check it out and share your thoughts!
You don't need Array.reduce()
Tags: javascript, arrayreduce
Published: 2018-09-22 12:49:43

---
title: You don't need Array.reduce()
published: true
description: 
tags: #javascript #array.reduce
---

I was reading another dev.to post, [Demystifying `Array.reduce()`](https://dev.to/nickyhajal/demystifying-arrayreduce-how-to-understand-it-and-when-to-use-it-in-your-code-5b96), but I didn't feel convinced about using `Array.reduce()`.

Maybe I too am not using `Array.reduce()` the right way, but every time I do, I end up disliking it and switching to a simple `for..of` loop.

Up ahead are the three examples from that article, converted to use `for..of` and in my opinion easier to read and cleaner.

Take for example the sum example:

```js
const array = [1, 2, 3, 4];
const sum = array.reduce((accumulator, currentItem) => {
    return accumulator + currentItem;
}, 0);

// sum = 10
```

It can be written as

```js
const array = [1, 2, 3, 4]
let sum = 0
for (const n of array) sum += n

// sum = 10
```

That's simpler!

The next example,

```js
const trips = [{type: 'car', dist: 42}, {type: 'foot', dist: 3}, {type:'flight', dist: 212}, {type: 'car', dist: 90}, {type: 'foot', dist: 7}] 

const distanceByType = trip.reduce((out, curr) => {
    const { type, dist } = curr;
    if (out[type]) {
        out[type] += dist;
    } else {
        out[type] = dist;
    }
    return out;
}, {});

// distanceByType = {car: 132, foot: 10, flight: 212};
```

can be rewritten as

```js
const trips = [{type: 'car', dist: 42}, {type: 'foot', dist: 3}, {type:'flight', dist: 212}, {type: 'car', dist: 90}, {type: 'foot', dist: 7}] 
const distanceByType = {}

for (const trip of trips) {
  const { type, dist } = trip
  if (distanceByType[type]) {
    distanceByType[type] += dist
  } else {
    distanceByType[type] = dist
  }
}

// distanceByType = {car: 132, foot: 10, flight: 212}
```

Simple!

Finally, the example from the comments about piping functions,

```js
const pipeOnce = (fn1, fn2) => (args) => (fn2(fn1(args)));
const pipe = (...ops) => ops.reduce(pipeOnce);

const addTwo = a => a + 2;
const mulTwo = a => a * 2;

const addTwoMulTwo = pipe(addTwo, mulTwo);
console.log(addTwoMulTwo(1));  // (1 + 2) * 2 => 6
console.log(addTwoMulTwo(2));  // (2 + 2) * 2 => 8
console.log(addTwoMulTwo(3));  // (3 + 2) * 2 => 10
```

is a better of example of reduce, but it can be written as

```js
const addTwo = a => a + 2;
const mulTwo = a => a * 2;
const addTwoMulTwo = n => mulTwo(addTwo(n))

console.log(addTwoMulTwo(1));  // (1 + 2) * 2 => 6
console.log(addTwoMulTwo(2));  // (2 + 2) * 2 => 8
console.log(addTwoMulTwo(3));  // (3 + 2) * 2 => 10
```

If we want to pipe an arbitrary number of functions, we can do it with `for..of` too:

```js
const pipe = (...fns) => arg => {
  for (const fn of fns) arg = fn(arg)
  return arg
}

const addTwoMulTwo = pipe(addTwo, mulTwo)
```

This one isn't as short, but it is easier to understand.

What are some use cases where `Array.reduce()` *really* shines over alternatives like `for..of`?

Please share if you know!
Share Blogging Experience
Tags: blogging
Published: 2018-09-22 12:13:42

---
title: Share Blogging Experience
published: true
description: Share Blogging Experience
tags: Blogging
---

Hello to all, Today I am going to share my Blogging Experience and I also wanted to all of yours.

Blogging is very interesting thing if we are fully passionate about it.
I am also running blog https://therichpost.com/ and I share most of programing post there.

Blogging is not an easy thing to maintain. We need to lot of patience if we want success blog. 

I also faced so many ups and down in my blogging career.  

But I ready enjoy my blog and share new new programing things there.

You can also visit on my blog and tell me about it.

Thank you

Therichpost.com