teleren/devto huggingface dataset:
Bizarro - A Library for Messenger Platform
Published: 2019-12-17 08:53:39

I have written four/five chatbots in the last couple of years. All of them were for Facebook's Messenger platform. Although these chatbots are pretty rudimentary, other than asking basic YES/NO questions, they pretty much can't do anything, I have taken great pleasure in building them from the ground up. After writing my third chatbots for my current employer, I have figured it's pretty difficult to write every functionality every time. Quick Reply, Postback, Typing on/off, Marked seen, different types of buttons, they all took a lot of time in the development process. I ended up spending a lot of time in between writing utility tools of these bots. And, since there was three/four months gap in between the development, I usually forgot what I was working on. So, I decided to build a library containing some of the common functionalities. I am not bragging (okay, probably a little bit!), it really made my life easier. I have developed and published it in PyPI a long time ago (six months I think, since the last major update). I was (still am) too scared to write anything about it. However, since the bot did not crash in last couple of months, I think it suffices to say, it has passed its beta period.

Github Link: https://github.com/p1r-a-t3/FB_Bot
PyPI: https://pypi.org/project/bizarro/

Bizarro supports the following features:

<ol>
<li>
Echo Back (Simple text reply)
</li>
<li>
Quick Reply
</li>
<li>
Typing On
</li>
<li>
Marked Seen
</li>
<li>
Button
<ul>
Postback Button
</ul>
<ul>
Url Button
</ul>
<ul>
Call Button
</ul>
</li>

<li>
Template
<ul>
Button Template
</ul>
<ul>
Generic Template
</ul>
<ul>
List Template
</ul>
</li>

</ol>

I haven't got time to work on the attachment reply on any of the functionalities. However, I think without them, they pretty much serve the good deeds. Feel free to test it out if you have got any time. Let me know if there's any bug/features you need. Looking forward to hearing from you.
Automated Testing - is it really worth it?
Tags: testing, javascript, beginners
Published: 2019-12-17 08:45:14

'one of the challenges of being a software engineer is proving that your code works'

-Unknown

Well I buy into this, many times I find myself in a situation where I believe I just created a masterpiece, where everything functions properly (or at least makes me think it does) only for me to run into some serious logic errors. So what's the solution to this dilemma? Automated Testing?

Automated testing is writing a bunch of test suites to assert whether your piece of code is functioning as desired. A very popular testing framework I also work with is Mocha, which allows your import assertions styles whether BDD or TDD, it's so convenient because the syntax is near natural language, a popular assertion library to use hands in hand with Mocha is Chai which gives you the flexibilty of using multiple assertion styles. 

Consider the following


So you want to create a function that accepts a card number and returns a the name of the card ie
detectNetwork('12365478635') should return either mastercard or visa depending on the first 3 characters or the length

detectNetwork = function (cardNumber) {
if(cardNumber.startaWith('31') && cardNumber.length == 16)
 return 'Visa' 
} 

Creating this function is relatively easy, but how do you test it? Manually console log the function with the card number argument? Good idea, but what happens when you have numbers going into thousands? Console log them too? Probably not. That's where automated testing comes in

Simply write your test suites using for loops for larger numbers and voila, life is easy again, some thing as simple as

//TDD
const expect = chai.expect

describe('Visa', function() {

it('should return Visa for cardNumber with prefix 31 and length of 16', function() {
expect(detectNetwork('3143688426790').toEquals('Visa')
} 

}

//BDD
const should = chai.should(()

describe('Visa', function() {

it('should return Visa for cardNumber with prefix 31 and length of 16', function() {
(detectNetwork('3143688426790').should.equals('Visa')
} 

}

Another beat trick to get compiling your test cards is to store them in an array and call them with the test suite using a for loop.

You can get started with the Mocha and Chai with the links below

http://mochajs.com/

https://www.chaijs.com/
TIL that how to change terminal title
Tags: todayilearned, terminal
Published: 2019-12-17 08:12:04

---
title: TIL that how to change terminal title
published: true
tags: til,terminal
cover_image: https://thepracticaldev.s3.amazonaws.com/i/65phje39m81vksr6a62e.png
---

## What I Learned

Being a dev I mostly rely on terminal running react and multiple springboot jars and mongodb in side by side .  



**1) open `~./bashrc` file and  Add this at the end of the file**
```
termtitle() { PROMPT_COMMAND='echo -ne "\033]0; '$1' \007"'; }

```
**2) Applying changes**
```
source ~/.bashrc
```
**3) Change Terminal title**
```
termtitle "my title"

```
Deploy/Host a .Net Core App on a Low Cost Provider (InterServer)
Tags: dotnet, tutorial, hosting
Published: 2019-12-17 08:03:08

As I am progressing in my journey with .Net Core (Razor Pages), I wanted to showcase my apps and gain some experience with hosting/deployment. But which place to choose? I came across many cheap solutions, out of which I chose https://www.interserver.net/

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

It's important to note that I want to avoid Azure for this purpose, as it is more costly and I use it only for my job related project to host databases. Of course, I tried the free tier app hosting and deployment, but anyway I need to try a more serious cheap solution, that has way more apps/databases with a lower cost. That's how I came across the above mentioned ASP hosting provider.

Just as a quick note, a list of comparable cheap hosts is presented in this article:  https://dottutorials.net/best-fast-cheap-windows-hosting-asp-net-core/


I purchased the 5 USD/month tier, which contains, most importantly:
- 25 sites
- unlimited databases (MYSQL, MS SQL)
- unlimited storage.

Let's log in to their site, after paying the amount, and use Plesk to manage my sites.
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/4bs6y536p7letgey3qnl.jpg)
After entering PLESK,  let's see how we can deploy our asp.net core web app!
The following screen appears.
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/g3nw10zsmtcp2qvi1eo3.jpg)
1.  you can add subdomains. I added test3.zoltanhalasz.net (my domain being zoltanhalasz.net)
2. In a subdomain or web site, there will be a dashboard with many functionalities.
3. Download the file from web deploy publishing settings.
4. Go to Visual Studio.
5. Select the Web project (such as Razor pages), hit publish, we will choose web deploy
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/fjbha2irnpvzcy4s2swd.jpg)
6. Hit new
7. Import profile - here use the file downloaded at 3)
8. Use the settings from the screenshots below:
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/d553jw335b3zshds5j6s.jpg)
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/otaqbduwqvppyau1xyrk.jpg)
Hit Save, and then Publish.
After some minutes, the site should be opening in your browser.
The files (package) deployed will be visible under the File Manager, found in the Plesk dashboard.

**How to add a database?**

I created a DB, MS SQL Type. It is immediately visible from your local MS SQL Studio, and in 12-24 hours, also from your account in myLittleAdmin (dashboard app from PLESK).

Any database can be added to an app's connection string (Interserver hosted ones ones visible in Plesk, or even from Azure) and the applications will work.
More Go Design Talk
Published: 2019-12-16 21:27:24

---
title: More Go Design Talk
published: true
description: Go
tags: 
---

The following an unformatted brain dump:

re: everything in one package, Yes, that is what I was trying to say. In the MVC case, it’s possible you might import a model for use elsewhere, it is highly unlikely that you will import controllers and views anywhere else. Separating them into different packages adds only more complexity. Then again, views aren’t anything but marshaling JSON most of the time, and so this point doesn’t matter. If it isn’t being imported separately and elsewhere, then it probably doesn’t belong in a different package.

re: interfaces, IME it can’t be stressed enough. Large interfaces become a huge burden. Small interfaces are wonderful. The 1 method goal of io.Reader, io.Writer are good ones. It’s very easy to compose interfaces, hence, io.ReadWriter and the often re-implemented io.ReadWriteCloser.

My rule of thumb is around 4 or 5 methods. Around there or larger, I start questioning if this is the right way to do whatever I’m doing. So far I’ve had no exceptions. I’ve been able to keep things small. The dozen to two dozen method interfaces that are so common in Java and C# typically don’t exist in Go. If I see them, they are almost always created by code generation tools and aren’t actually intended to be reimplemented, but are instead an artifact of the design of the code generation system. Docker and Kubernetes, especially their client APIs, come to mind.

Interfaces in Go are weird. You can use them everywhere, but that doesn’t mean you should. The stdlib is the best guidance there is for when and where, and it really shows that it shouldn’t be used unless it must. e.g. net/http Request is not an interfaces. ResponseWriter is. Why is a good question to try and answer.
[Capybara] find('input').set will have not done!
Tags: capybara, rspec, rails
Published: 2019-12-17 07:54:03

---
title: [Capybara] find('input').set will have not done!
tags: capybara, rspec, rails
---

## 🔗 Parent Note
{% link https://dev.to/n350071/my-capybara-note-2gp3 %}


## 🤔 Situation
I have like this HTML and want to set a value into it.

```html
<div class="bootstrap-dialog-message">
  <input type="text" class="form-control">
</div>
```


## 😅 set finishes although it's not completed!
When capybara try to input the email,

```ruby
find('input').set('loooooooooooooooooong@email.com')
```

the results were like this. it's kind of random error.
```
1: loooo
2: loooooooooooooooooong@email.com
3: loooooooooooooooooong@e
.
.
```

## 👍 Fix it!
### Using Until
There is a method `until ~ end`. You can try again until the condition will succeed.


```ruby
until find('input') == 'loooooooooooooooooong@email.com'
  find('input').set('loooooooooooooooooong@email.com')
end
```

### Using 10.times
```ruby
10.times do
  find('input').set('loooooooooooooooooong@email.com')
  break if find('input') == 'loooooooooooooooooong@email.com'
end
```
First time with DigitalOcean
Tags: digitalocean, students
Published: 2019-12-17 07:16:28

Being a Computer Science Student, it has become a routine for me to host websites for every college project. And so far, I've used almost every cloud platform to get a VM instance and host a website. But, recently I used the Droplets on DigitalOcean and found them to be so convenient and easy to deploy. It has been the most convenient experience for me. I'd used my 50$ credit from Github Students Pack to get started with DigitalOcean.
Using Keybase GPG to sign git commits and tags
Tags: git, keybase, pgp
Published: 2020-01-09 06:03:29

---
title: Using Keybase GPG to sign git commits and tags
published: true
date: 2019-12-17 07:13:37 UTC
tags: #git #keybase #pgp
canonical_url: https://social.johanbove.info/2019/12/17/using-keybase-gpg-to-sign-git-commits-and-tags
---

With the [Keybase application](https://keybase.io/docs/command_line) installed on the "Windows Subsystem for Linux" command line, export the pgp Keybase key and import it into the local gpg keychain:

```
$ gpg --list-secret-keys --keyid-format LONG
$ keybase pgp pull johanbove
$ git config --global user.signingkey B6A8D5E8
$ keybase pgp export -q 4AAE11D0B6A8D5E8 | gpg --import
$ keybase pgp export -q 4AAE11D0B6A8D5E8 --secret | gpg --allow-secret-key-import --import
$ echo "test" | gpg --clearsign

```

I also had to add this code into the `~/.bashrc` file to [make the gpg passphrase prompt work in WSL](https://github.com/microsoft/WSL/issues/4029#issuecomment-491547314):

```
# enable passphrase prompt for gpg
export GPG_TTY=$(tty)

```

Setting the trust level of the imported key:

```
$ gpg --list-keys
$ gpg --edit-key E44E71105E920276ED1693294AAE11D0B6A8D5E8

```

Following the instructions in gpg.

Signing a git tag:

```
$ git tag -s v1.0.0 -m "Release v1.0.0 signed"

```

Verifying the git tag:

```
$ git tag -v v1.0.0
```

Sources:

- [https://<wbr></wbr>github.com/<wbr></wbr>pstadler/<wbr></wbr>keybase-gpg-github](https://github.com/pstadler/keybase-gpg-github)
- [https://<wbr></wbr>github.com/<wbr></wbr>microsoft/<wbr></wbr>WSL/<wbr></wbr>issues/<wbr></wbr>4029](https://github.com/microsoft/WSL/issues/4029)
- [https://<wbr></wbr>stackoverflow.com/<wbr></wbr>a/<wbr></wbr>55993078](https://stackoverflow.com/a/55993078)
What was your biggest achievement of year 2019
Tags: discuss, watercooler
Published: 2019-12-17 07:08:04

---
title: What was your biggest achievement of year 2019
published: true
description: 
tags: #discuss, #watercooler, 
---

What was your biggest achievement of year 2019 and list out best three or five items?

![Achievement of year 2019](https://thepracticaldev.s3.amazonaws.com/i/lzdg6mfxs96vmhxfo95z.jpg)
Why reactjs is my go to JavaScript Library for interactive ui
Tags: react, javascript
Published: 2019-12-17 07:07:32

This all started when Facebook had an issue in improvising the UX for news feed fad of their application “How would it be if the newest post gets added to the news feed without even refreshing the page , How could we make more reactive components for websites”. That’s where react comes into play which stacks up Javascript to build more reactive websites. Nowadays reactjs is most preferred JS lib for PAAS kind of services, Netflix loves it, Airbnb cherishes it, Even the proprietary of all things Apple.inc uses it ,As this library is so lightweight , so no boundaries for coding extensively as such of JS frameworks . The main reason why every PAAS apps use react is mainly optimised for performance it just takes 2-5 ms for loading and the browser parses the page with ease. This is mainly because updating the changes to the DOM using Javascipt is hectic for browser it just takes time to parse it after updation which leads to performance issues. Whereas react creates a virtual DOM where you can perform your CRUD operations on that and react will find the least possible effort to update the changes in the original HTML DOM. All it takes to learn react is to learn Vanilla Js with ECMASCRIPT-5 and ES6 feautures on Javascript. But it does has some disadvantages we need a separate react-router for routing , a separate server-side rendering such as Next.js and unit testing framework called JEST for testing JS which is not an issue for other frameworks such as Angular,Ember,etc.

Finally it is the most preferred JS library.(Better than JQuery Too:P). In order to check your website’s preformance go to https://www.web.dev to see you performance stats
Truc tiep bong da 11met LIVE
Published: 2019-12-17 05:57:15

Ngoai viec xem truc tiep bong da hom nay thi khi den voi 11met LIVE, cac ban cung duoc “tro ve qua khu”, hoi uc lai ky xua cua doi tuyen Viet Nam. Day deu la nhung ky niem khong the nao quen.
Tiger Cup 1998 la ki uc buon cua "the he vang" ngay ay. Chung ta thang Thai Lan den 3-0 trong tran ban ket. Niem hy vong dang tran, nhung sau do lai ngam ngui thua cay dang 0-1 tai Hang Day, dau chung ta ap dao ca tran truoc nguoi Sing, nhung lai khong the thang noi cai lung cua Sasi kumar.
O vong bang AFF Cup 2008, trong mot hoan canh ngat ngheo (phai thang moi nuoi hy vong vuot qua vong dau bang) ĐTVN duoi thoi HLV Calisto choi nhu khong con gi de mat. The nhung Malaysia cung kien cuong chang kem, go hoa trong ca 2 lan bi dan truoc. Va nhu mot dinh menh, Vu Phong da "sua chua sai lam" cua dan anh The Anh nam nao, cung dung mot pha chuyen dai hon 70m, bong dap dat va thu mon Malaysia cung mac mot loi tuong tu.
Tai Kallang Roar, DTVN den Dao quoc Su tu trong su lo lang cua nguoi ham mo sau khi da de hoa Singapore o luot di tran ban ket. Nhung rot cuc, Viet Nam da thang doi chu nha, dung nhu cai cach ma nguoi Sing da lay chiec cup o Hang Day nam nao. Quang Hai (1985) nhu tu duoi dat chui len, dem bong vao luoi trong sau no luc di bong tuyet voi cua "CV9". Viet Nam thang, va di mot mach den chiec cup vo dich nam 2008 cung tu mot mon no duoc lay lai nhu the.
Cap nhat link xem truc tiep bong da hom nay tai 11met LIVE.
----------- Thong tin lien he ------------------
Kenh ibongda LIVE - Suu tam nguon truc tiep bong da moi ngay de phuc vu nhom doc nhai yeu bong da ma ko so huu co hoi duoc xem vi ly do gi do, chung toi la nhom thanh vien hoat dong phi loi nhuan, dung cho niem say me cong trai bong.
Social: https://www.facebook.com/2bongdachamtv/
Dia chi: 79 Lang Ha, Dong Da, HN
Website: https://11met.live/
Email: ad.11met.tv@gmail.com
Preview replace results in Neovim
Tags: vim, neovim, replace, preview
Published: 2019-12-17 06:24:39

---
title: Preview replace results in Neovim
published: true
description: Configuring command live preview in neovim
cover_image: https://raw.github.com/gko/vimio/master/screenshot.png
tags: vim, neovim, replace, preview
---

There is an interesting option in Neovim called `inccommand`. It allows you see the live preview of your buffer after some command (i.e. replace).

To configure it add following to your `~/.config/nvim/init.vim`:

```vimscript
set inccommand=nosplit
```

Or if you're using `~/.vimrc` to configure both `vim` and `neovim`:

```vimscript
if has("nvim") 
  set inccommand=nosplit
endif
```

Now, as you type `%s/text/replace/`before you hit <kbd>Enter</kbd> you'll see the live result of your command so you can cancel it by hitting <kbd>Esc</kbd>. 

You can also set `inccommand` to `split`. In that case the result will be shown in a separate split pane.
Reading Snippets [13]
Tags: javascript, beginners
Published: 2019-12-17 05:52:18

Objects are values that hold other values at specific named locations called properties. 

Properties of objects can be accessed in the following ways:

- Using dot notation: obj.a 
- Using bracket notation: obj[ "property" ] 

Bracket notation is used where a programmer requires more flexibility in their use of property identifiers. With bracket notation, property identifiers only have to be strings which can have spaces and other characters. For example, obj["hello property"] may be used to access properties with an identifier that is a string with space.
Profunctors
Tags: haskell, types, functional
Published: 2019-12-17 05:15:07

I'm an F# developer reading a book called [A Type of Programming](https://atypeofprogramming.com/), which is about Haskell and type theory. One of the concepts discussed is [profunctors](https://typeclasses.com/profunctors). The definition of a profunctor looks kind of scary:

```haskell
class Profunctor f where
  dimap :: (a -> c) -> (b -> d) -> f c b -> f a d
```

What does that mean? It turns out that it's just an abstraction for preprocessing input before it reaches a function and then postprocessing the output of the function. `a -> c` is the preprocessor, `b -> d` is the postprocessor, `f c b` is the function between them, and `f a d` is the result of attaching the three pieces together in the right order.

One point of confusion is that `f c b` and `f a d` are technically profunctors instead of functions, but pretty much every profunctor is just a function at its core, so you can think of the signature as:

```haskell
-- profunctor instance for raw functions
dimap :: (a -> c) -> (b -> d) -> (c -> b) -> (a -> d)
```

This says that if you know how to map `a`'s to `c`'s, and `c`'s to `b`'s, and `b`'s to `d`'s, then obviously you can map `a`'s all the way to `d`'s in one fell swoop. That's all there is to profunctors.
Ant Design vs. Material UI
Tags: react
Published: 2019-12-17 04:13:36

So [Ant Design](https://ant.design/)(54,504 stars) has surpassed [Material UI](https://github.com/mui-org/material-ui)(53,012 stars) in github. 😎

Which do you use? If not these 2, how do you style your UI?

You can also vote in Twitter. Will post results here once polling is closed.
{% twitter 1206788400646221826 %} 

{% github https://github.com/ant-design/ant-design %}
{% github https://github.com/mui-org/material-ui %}
Day 18 - Digging Deeper into CSS - Responsive Design
Tags: selftaught, html, css, beginners
Published: 2019-12-17 03:07:35

Today has not been a good day. I still went through with my studying but did not complete everything that I wanted to. 

Anyways, I went over Responsive Design. 

As screen sizes vary and consumption of the web is through mobile phones increasingly, developers have to ensure that users are able to use their site seamlessly. This is where Responsive Design comes in. It allows us to meet the needs of the many screen sizes.

**Media Queries**

Media Queries are CSS rules designed specifically for a variety of screen sizes. They are conditional rules and only apply if the screen size meet the parameters set by the rule. There are 2 main ways to include them in your side.

1) <u>Link them via a separate stylesheet</u>

One of the benefits of this method is that the link will be ignored if the device width does not meet the parameters of the media query.

If it does meet the parameters, you would have to think about load time.

```html
 <link rel="stylesheet" type="text/css" media="screen and 
(max-device-width: 480px)" href="mobile.css"/> 
  ```

2) <u>Include then in the main stylesheet</ul>

This is my preferred method as all the rules are in one file.

```css
@media only screen and (min-width: 480px) {
   body:after {
      content: "480px to 768px";
      background-color: hsla(180,60%,40%,0.7);
   }
}

```

In most of the projects I have worked on and made responsive, I was making a clone and knew what changes to make for different screen sizes.

When I was working on the YouTube clone project, I used the Grid to create the main layout. Then I set it up so that when the screen reaches a certain width, the Grid will be displayed another way. 

A few things I had to think about when I was making it responsive.

1) <u>Fixed Units</ul>

There were section in my grid where I used pixels and when I made it responsive, that section stayed the same width. You may want to stick with % or fractional units with the Grid.

2) <u>Images</u>

Images were the worst to deal with. At first, I gave the image an inline width and as you can imagine, no matter the width the screen, the images were still 180px. The way I fixed it was by putting the image in a <code>div</code> and setting the width to 100%. 

That's it for today.

The streak continues ...
Docker-Compose＆typescript-react-sass-webpack-babel-boilerplate
Tags: docker, react, typescript, saas
Published: 2019-12-17 02:44:44

# GitHub
https://github.com/ProblemaResolt/DockerFrontendReact

# Docker
- Docker
- docker-compose

# typescript-react-sass-webpack-babel-boilerplate
This is a basic boilerplate for these technologies:
- TypeScript
- React
- SASS
- Webpack
- Babel

### Setup dev environment
- `docker-compose build`
- `docker-compose up -d`
- `docker-compose exec frontend ash`
- `yarn install`
- develop `yarn run webpack:dev`
- open `http://localhost:8000/`

# Production
- production `yarn run webpack:prod`

## Reference Material
- typescript-react-sass-webpack-babel-boilerplate

link:[https://github.com/maxbause/typescript-react-sass-webpack-babel-boilerplate]

Webpackの設定は変えていますが、ドイツの　max さんのやつ参考（ほぼ）にしましたありがとう！！！！

MaxBauseさんのサイト

https://maxbause.me