teleren/devto huggingface dataset:
The kitties shall rise
Tags: blockchain, cryptokitties, dapp, cryptocurrency
Published: 2020-06-11 13:07:08


Gone are the days when people used to collect Beanie Babies and Pokemon cards. Today a new player has reached the market. They are 'the crypto kitties'.  At first glance, it looks like an ordinary cute and adorable kitties. Yet people are spending a ridiculous amount of actual cash on these collectibles. For instance, the most expensive crypto kitties cost around $170,000. 

So what exactly are these crypto kitties? CryptoKitties is a blockchain game that allows players to buy, adopt, trade and even breed these virtual cats. For a second let us ignore the damn cuteness of these kitties and ponder on the question of why would someone spend 1,000 dollars or more on these kitties?

The reason behind this is "digital scarcity". Before the internet age, if you had a thing, then only you could possess it, unless and until you decide to share it. With the advent of the internet age, this scarcity was gone. Every time, you share something on the net, you create a copy. When we share a music file or a word document with your friend, you actually send out a copy and thus you and your friend have an individual copy. Torrenting made digital assets infinite, and once an asset can be replicated and shared easily for free, its value plummets. But crypto kitties are challenging this scenario by experimenting with the new idea of making a digital good rare. The amount of these CryptoKitties is limited and each of these kitties can be owned by only one person. Thus a CryptoKitty represents a new kind of digital asset that cannot be replicated.

CryptoKitties are many things to many people. For some it is just a simple cartoon, for others, it is a piece of art, and for the rest, it is a complex piece of engineering. These cute kitties have captured the imagination of the many and it is revolutionizing the world we live in one kitty at a time
Frontend developer, Twilio hackathon winner, ecommerce developer turned React developer... Ask Me Anything!
Tags: ama, discuss, webdev, watercooler
Published: 2020-06-11 15:12:11

---
title: Frontend developer, Twilio hackathon winner, ecommerce developer turned React developer... Ask Me Anything!
published: true
tags: ama, discuss, webdev, watercooler
cover_image: https://res.cloudinary.com/practicaldev/image/fetch/s--vZtxG9Sp--/c_imagga_scale,f_auto,fl_progressive,h_420,q_auto,w_1000/https://dev-to-uploads.s3.amazonaws.com/i/g97h88hzva5gg88n6f0p.png
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/ifj9wmy2uty123l19441.jpg
---

I'm a frontend developer with 5 years of experience. I've started out working as an certified Magento 1 and Magento 2 ecommerce developer and made the switch to React one year ago.

I've also contributed code to Adobe Magento PWA project and I'm also a winner of Twilio hackathon.

{%link https://dev.to/adrianbdesigns/homebound-my-submission-to-the-twilio-x-dev-hackathon-4a22 %}

{%link https://dev.to/devteam/announcing-the-twilio-hackathon-winners-1lp4 %}

You can also check my [personal website](https://codeadrian.github.io) to learn more about me.

I love collecting music CDs (rock and metal genre, bands from 70s and 80s), playing electric guitar, reading Sci-fi (Dune is my favorite), reading Calvin & Hobbes comics, etc.

And recently I've started making my own closed terrariums.

![Terrarium](https://dev-to-uploads.s3.amazonaws.com/i/aed24hqrdmcd7sxal2yb.jpg)

Feel free to ask me anything about frontend development, React, my projects, the hackathon, music, Dune, etc.

Sci-fi books recommendations are welcome, too!

Thank you!
[WIP] Click in your app and jump to the relevant code
Tags: showdev
Published: 2020-06-11 15:28:42

Hi everyone! We're working on a new platform that lets you edit your React app visually. We're looking for beta testers - check us out at styledpage.com 😊

This was recently added and I thought it made sense to post about it here. If you have questions/comments let me know!
Feeling a little discouraged 
Published: 2020-06-11 15:39:52

Today I’m feeling a little discouraged because it seems like choosing around this time to get into tech wasn’t a wise decision . With the massive layoffs and recession , it seems like there are far fewer jobs available. Also for the ones that are , there’s a large pool of experienced developers that are available. Finally , with everything being remote , seems much less likely that a company hires someone who they would need to train . I’m not giving up , wanted to get this off my chest .
Implementing bits of Todos App with my own online IDE
Tags: showdev, javascript
Published: 2020-06-11 16:34:45

Here are a few loom videos I recorded today:

- [Download your app as zipped maintainable code](https://www.loom.com/share/915014a336204d79b5a4a95c5e7d19c0)
- [Register DOM events on HTML elements](https://www.loom.com/share/0eae4ac5daae464abb7fd5d9d628caae)
- [Displaying HTML pieces under given app condition](https://www.loom.com/share/c43669622eeb4009b6848630f7313429)
- [Getting notified when an app action needs to be implemented to support your HTML](https://www.loom.com/share/33077e1b5daa495ab9ef8012b668cd66)

Check out this [demo](http://gluecodes-demo.s3-website.eu-west-2.amazonaws.com/ide.html?appId=1&edit=page&id=index).

Enjoy the videos and playing around but most importantly let me know what you think about the project? :wink:
Publishing react components as NPM package.
Tags: typescript, react, gulp, npm
Published: 2020-06-11 16:46:33

<h2> React + TS + SCSS + Gulp = NPM. </h2>
<p>We all have a shared components folder in our project. Always 
   wondered how to use it across projects.
   So, after trying multiple methods and failing, following is the simplest
way worked out for me to publish React components as
NPM package.</p>
<hr />
<h2>Create react app with create-react-app command from terminal</h2>
<code>npx create-react-app react-automazers --template typescript</code>
<hr />
<h2>Edit package.json to include</h2>
{% gist https://gist.github.com/itsmephani/7402b563417c8d5c0c697d15d724489e %}
<hr />
<h2>Add tsconfig.json to your project root</h2>
{% gist https://gist.github.com/itsmephani/0f30bc4d7dd2d8ac065f9e00082867a3 %}
<hr />
<h2>Add gulpfile.js to your project root</h2>
{% gist https://gist.github.com/itsmephani/4a8cbe22775883b678240acc17280770 %}
<hr />
<h2>Signup with <a href="https://www.npmjs.com/" target="_blank">https://www.npmjs.com/</a> if you don’t have account already.</h2>
<hr />
<h2>Final steps for publishing NPM package</h2>
<p>NPM will run prepare task given in package.json before publishing
the module. So let us put together all the steps we have done in prepare script.</p>

<code>"prepare": "gulp",</code>

<p>Prepare task will just run the gulp command.
Here are the steps that will happen with this gulp command
<br/>Gulp will check for the default task in gulpfile.js
<br/>We are running series of tasks in the default task
<br/>. clean — Will remove existing output directory — core in our case.
<br/>. compile — will compile all typescript to javascript.
<br/>. sass — will compile all scss to css files
<br/>. copy-css — will copy all the css files generated to output directory
</p>
<hr />
<h2>Let’s Publish</h2>
<p>Run “npm login” from terminal to login into your npm.</p>
<p>Finally run “npm publish” to publish to the world.</p>
<hr />
<h2>Congrats you have successfully published you npm package 🥳 🎉</h2>
<hr />
<h2>Note: As we are not updating typescript files manually to use .css files. Include .css files in your tsx files instead of .scss extension.</h2>
<p>
gulp sass will automatically generate .css file from .scss file.
<br/>run gulp sass:watch for automatically generating css from scss on update of file while development.
Complete code can be found @ <a href="https://github.com/automazers/react-automazers" target="_blank">https://github.com/automazers/react-automazers</a> </p>

{% github https://github.com/automazers/react-automazers %}
Firefox Shortcuts That I Use Daily
Tags: firefox, tricks, shortcuts
Published: 2020-06-12 02:26:09

Through all the years of using Firefox as my primary browser, I have gathered an intuition to do most of my operations through keyboard shortcuts. Some of these might apply to Chrome as well. I have roughly sorted this list based on the frequency of my usage. 

```
1. CTRL + R
```
Reload. 

```
2. CTRL + (click on link)
```
Opens the corresponding link in a new tab. I hate going back on a webpage. I always use this feature when I feel the need.

```
3. ALT + num_key (1,2,3...)
```
Switch Tabs.
Changes the active tab to the nth tab in the series. If you press a key that exceeds the count of the currently opened tab, it automatically sets the last tab as the active tab. I like to press some random num_key such as num_7 when I want to move to the last active tab.

```
4. CTRL + ENTER
```
While typing the URL of your favorite site, you can skip the .com part by pressing CTRL+ENTER while your cursor is inside the address field.

```
5. CTRL + SHIFT + DEL
```
Clean Up.
I usually clean up my firefox sessions when I am about to go off for a break. This is 

```
5. Ctrl + Shift + P
```
Private Mode.
Really handy.

```
6. ESC
```
Stops Loading.
You wait for the vital parts of the site to load, but then decide to hit refresh as you see no hope and bam that is when it But you already hit refresh. Happened to you? Just hit ESC. 

```
7. ALT + LEFT_ARROW
```
Go back.

```
8. CTRL + H
```
View History.

```
9. CTRL + O
```
Open File.
I like to open certain files in firefox itself, maybe a PDF or an image, firefox can handle them really well. This shortcut allows you to choose a file from the file picker.

```
10. CTRL + D
```
Bookmark current page.

```
11. CTRL + SHIFT + T
```
Undo closed tab.

# BONUS COMBO!
```
Duplicate Tab
CTRL + L - Select current URL in address bar
CTRL + C - Copy it.
CTRL + T - Open new tab.
CTRL + V - Paste.
ENTER - Go!
```

Did I miss something cool?! What's your favorite keyboard shortcuts?

| Cover Image by <a href="https://pixabay.com/users/200degrees-2051452/?utm_source=link-attribution&amp;utm_medium=referral&amp;utm_campaign=image&amp;utm_content=1666995">200 Degrees</a> from <a href="https://pixabay.com/?utm_source=link-attribution&amp;utm_medium=referral&amp;utm_campaign=image&amp;utm_content=1666995">Pixabay</a>
Slack notifications with NodeJS in <2 minutes
Tags: showdev, node, javascript
Published: 2020-06-12 03:23:14

When you’re working on a project, it can be useful to set up a simple notification system for a number of reasons:

- You want to be notified whenever a new user signs up 🚀
- You want to be alerted when a user encounters an unexpected error 🤔
- You want to be reminded every morning to fill out your TODO list

If you’re part of a team, Slack is a great place to notify so that everyone is on the same page!

## Getting started

We’re going to use [Taro](https://www.gettaro.com/) to handle setting up this integration. Taro is a tool we’ve been working on, designed to make developer’s lives easier when it comes to this kind of thing.


To start, create your free account at https://www.gettaro.com/ by clicking the “**Get started**” button and signing up. 

{% youtube 8Vxu8aLNu_8 %}

## Connecting to Slack

Once you’re in the dashboard, click on the “**Integrations**” button in the upper-right corner of the page. You should see something like this:

![Taro Integrations Page](https://dev-to-uploads.s3.amazonaws.com/i/j5vgaaj5bnpkhryint8s.png)

At the bottom of the page, click on “**Connect with Slack**”, and complete that flow with the Slack channel you’d like to notify.

Once that’s done, grab your API key by clicking “**Show**” next to the API key input above. You’ll need that in a minute!

## Creating a Slack notification in NodeJS

Now that you’ve set up a link to your Slack channel and gotten your API key, you can either set up a new Node project, or use an existing one. For the sake of this guide, let’s create a quick new one.

In a new project directory, run `npm init`, and keep pressing enter until your `package.json` file is set up with all the default values. It should look something like this (mine happened to be in a directory called “sandbox”):

![New NodeJS project](https://dev-to-uploads.s3.amazonaws.com/i/z8rr1tli2a06kqqw94h1.png)

Then, create an `index.js` file, and paste in the code below — **remember to replace `__YOUR_API_KEY__` with your API key from above** 🤓

## Run the code

In your terminal, run `node index.js` — you should receive a notification in Slack! 🎉

![Slack notification](https://dev-to-uploads.s3.amazonaws.com/i/5pjuc2t3837buu7npzgu.png)

That’s it!

*By the way — if you’re having trouble with any of these steps, don’t hesitate to leave a comment or reach out at reichertjalex@gmail.com.*
Stuck in choosing the right color for your website?
Tags: css, beginners, webdev, colors
Published: 2020-06-12 06:42:03

Choosing the right colors for your website can sometimes become exhausting,but with the help of certain tools the whole process can be simplified....
Here are some of the tools i use:

<a href="https://colorsinspo.com/">COLORSinspo</a>
<a href="https://colorsinspo.com/"><img src='https://res.cloudinary.com/tinegadev/image/upload/v1591942347/dev.to/Screenshot_43_xtrahd.png' alt='colorsinspo home'></a>
A simple and easy interface,just click on an image and paste the code to your css.Includes hundreds of color palettes and gradient colors.

<a href="https://www.color-hex.com/">color-hex</a>
<a href="https://www.color-hex.com/"><img src='https://res.cloudinary.com/tinegadev/image/upload/v1591942828/dev.to/Screenshot_44_pbeli1.png' alt='color-hex 
home'></a>
Color-hex gives information about colors including color models (RGB,HSL,HSV and CMYK), Triadic colors, monochromatic colors and analogous colors calculated in color page.

<a href="https://chrome.google.com/webstore/detail/colorpick-eyedropper/ohcpnigalekghcmgcdcenkpelffpdolg?hl=en/">ColorPick Eyedropper</a>
This is a chrome extension,color chooser that allows you to select colors from webpages.

<h2>In conclusion..</h2>
I hope you found this information useful.This is just a small list,feel free to share others in the comments below.
Linear Search Algorithm Using Python
Tags: python, datastructure, tutorial, interviewtopics
Published: 2020-06-12 08:09:37



What is a Linear Search?

A linear search is the most basic kind of search that is performed. So how is it performed? A linear or sequential search, as the name suggests, is done when you inspect each item in a list one by one from one end to the other to find a match for what you are searching for. You often do this in your daily life, say when you are looking through your shopping list to cross out an item you have picked up.

Benefits and Drawbacks
The benefit is that it is a very simple search and easy to program. In the best-case scenario, the item you are searching for may be at the start of the list in which case you get it on the very first try.

Its drawback is that if your list is large, it may take a while to go through the list. In the worst-case scenario, the item you are searching for may not be in the list, or it may be at the opposite end of the list.

Coding a Linear Search
Let's first develop an algorithm for performing a linear search. We will then convert this into a Python script.

Let's start with a list of numbers, say 10 of them
First, we will ask for a number we think may be in the list. We will call this variable ''searchItem''
Also, we will set a flag variable called ''found'' to false
Now loop thru the entire list from start to end
Compare the item at the current position in the list with ''searchItem''
If it matches then set ''found'' to true and exit the loop, else move on to the next position
Otherwise, if we have searched the entire list, ''searchItem'' was not found, so ''found'' remains false

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/umousda2r2utitklyvly.png)


{% youtube SrwxWuqhM90 %}
Generate markdown files with ease - deno-markdown 🦕
Tags: deno, typescript, javascript, showdev
Published: 2020-06-12 11:00:04

## Why Deno?

Like the rest of the Node community I've been jumping on the Deno band wagon and for good reason!

I could create a fairly large list of why I like Deno however I'd recommend everyone read [The Deno Handbook](https://flaviocopes.com/deno/) by Flavio Copes and see for yourself.

## So what is deno-markdown?

deno-markdown is a module that allows a developer to quickly create markdown content and files using TS function chaining.

### Examples

Create a Markdown file with a 2 headings, a paragraph, and a bullet point list of items.

```typescript

import { Markdown, ListTypes } from 'https://deno.land/x/deno_markdown/mod.ts';

let markdown = new Markdown();

await markdown
    .header("Hello Dev community!", 1) // This will generate # Hello Dev community!
    .paragraph("Here is an example of some text under the heading")
    .header("Another heading!", 2) // This will generate ## Another heading!
    .list(["Item 1", "Item 2"], ListTypes.UnOrdered, "*") // Character can be set to *, -, or + 
    .write("./folder/", "fileName"); // This will write the content out to ./folder/fileName.md 
  
```

Output:

```

# Hello Dev community!

Here is an example of some text under the heading

## Another heading!

* Item 1
* Item 2
  
```

Create markdown tables

```typescript

import { Markdown } from "https://deno.land/x/deno_markdown/mod.ts";

let markdown = new Markdown();

await markdown
  .table([
    ["Branch", "Commit"],
    ["master", "0123456789abcdef"],
    ["staging", "fedcba9876543210"],
  ])
  .write("./examples/", "table");
  
```

Output:

```

| Branch  | Commit           |
| ------- | ---------------- |
| master  | 0123456789abcdef |
| staging | fedcba9876543210 |
  
```

You can also use the built in string extensions to enhance your markdown files

```typescript

import { Markdown, bold, italics } from 'https://deno.land/x/deno_markdown/mod.ts';

let markdown = new Markdown();

await markdown
  .header("Hello Dev community!", 1)
  .paragraph(`You can inline extensions like ${bold('bold')} or ${italics('italics')}`)
  .write("./examples/", "fileName");
  
```

Output:

```

# Hello Dev community!

You can inline extensions like **bold** or _italics_
  
```

[Further Examples](https://github.com/JasonHughes94/deno-markdown/tree/master/examples)

## What's next?

I will be looking to improve the code quality overall and remove the dependency on [markdown-table](https://github.com/wooorm/markdown-table).

No doubt as my knowledge of Deno improves I will be making tweaks and changes as I go along.

If anyone would like to contribute to the project please take a look at the ReadMe.md

And yes I did generate this entire blog post with the module 😁

[Source](https://github.com/JasonHughes94/deno-markdown/blob/master/examples/dev_blogPost.ts)

**Thanks for reading!**
Friday Blast #86
Tags: fridayblast, links, post
Published: 2020-06-27 19:42:40

---
title: Friday Blast #86
published: true
date: 2020-06-21 07:00:00 UTC
tags: fridayblast,links,post
canonical_url: https://horia141.com/friday-blast-86.html
series: "Friday Blast"
---

It’s been quite some time since one of these. It’s more like a monthly blast for a while. I’ll try to do betterin the future.

[What does technical excellence look like (2016)](https://www.youtube.com/watch?v=Avs70dZ3Vlk) - Martin Fowlertakes stock of what _technical excellence_ means. To summarise it is short cycle times for building features,low time to fixes (and the CD these imply), small and autonomous and business driven teams, and teams wherethere is a high degree of psychological safety.

[From “Hello World” to VP Eng (2017)](https://blog.devcolor.org/career-journey-part-1-3bdddf1f87a) - the firstpart of Nick Caldwell’s story, Reddit’s VP of engineering.

[Scaling SQLIte to 4M QPS on a single server (EC2 vs Bare Metal) (2018)](https://blog.expensify.com/2018/01/08/scaling-sqlite-to-4m-qps-on-a-single-server/) - in caseyou doubted just how powerful modern machines are, and how much of a beast SQLite is. It’s of course a somewhatartificial benchmark, but not completely so. For my [jupiter](https://dev.to/horia141/announcing-jupiter-release-0-3-0-1on2) work I’ll soon be transitioning to a SQLite backend for local data storage.

[DDD and hexagonal architecture (2020)](https://vaadin.com/learn/tutorials/ddd/ddd_and_hexagonal) - I’ve recentlystarted reading a bit more about software engineering, and software architecture in particular, and domain driven design(DDD) caught my eye as a powerful way of thinking about architecture. It’s kind of hard to grok however at theimplementation level and this article from [Vaadin](vaadin.com) does a very thorough job of this.

[Tactical domain-driven design (2020)](https://vaadin.com/learn/tutorials/ddd/tactical_domain_driven_design) - linkedwith the previous article is this one, which goes into the details of the “domain” aspect of DDD (the part which isusually not tied into any framework or library), and which covered the _tactical_ patterns employed in DDD.
DEFINTELY off topic. Polite discussion.
Published: 2020-06-12 14:23:06

---
title: DEFINTELY off topic. Polite discussion.
published: true
description: 
tags: 
//cover_image: https://direct_url_to_image.jpg
---

Hey kids!
I guess that is offensive IMO. But I have a funny, hopefully interesting story for you.
.
As a feminist, sometime in the late 80's we began to refer to the girls (which were clearly women) as guys (which were clearly men).
.
That's seems odd doesn't it?
Was that not denying both their womanhood, uniqueness and visibility?
.
It's hard to understand. You see the girls (which were clearly women) clearly knew that we guys (which were men) clearly knew that they were not guys or girls but were in fact women. Clearly. 
.
You see, this was our way of including them and acknowledging that they were our equals in every respect, only better in many respects, which my spidey senses tell me should best be avoided, but they knew that anyways if you might or might not. 
.
But that's not the good part. The on topic part. The may have been funny part. Where I posted a comment on the internet in the 21st century. On a development site, which is at least tangentially on topic. 
.
What's funny is that one day I commented on a new feature on the Coral Talk website saying "one of the guys could code that in a week". 
.
Which wasn't meant to be funny but merely factual. And it turns out that nobody found that the least bit funny. 
.
You could say that folks got a bit excited about it while completely forgetting the basic point. It was the "guys" thing you see... the women (which were not girls) got quite upset. 
.
Which when you consider where the whole guys thing (which was now everyone) about the girls (which were women) started, if you don't find that funny you should at least find that ironic. 
.
All of which might only be true, funny or ironic if you are an old white guy that frequently gets tossed off of web sites. But not that one, which I put on the back shelf, you could say, while they cool off a bit.
.
However I believe it does instruct us that there have been some positive changes in the industry if not in gender relations. 

FOOTNOTES (edits)
There are certain habits of speach that become deeply embedded. People learn to change them in situ or novel environments.
They seldom forget. But when they get REALLY excited (ie angry) they sure do.
You see this in ESL where folks fall back into their native toungue. The two appear to be closely related.