teleren/devto huggingface dataset:
Journey to Blockchain developer with 0 coding experience
Tags: blockchain, javascript, java, python
Published: 2019-07-28 15:19:39

Hi All,

I’m interested in a career switch to Crypto/Blockchain as it’s been my hobby for a few years and need some help from you guys. At the moment my understanding of Crypto currencies is purely from a financial/big picture perspective.

I want to understand what languages and courses I should learn in order to up-skill me to build dApps on the Ethereum network. 

I’m currently a project manager and have no previous developer experience so am wondering where the best starting point is for a newbie & what material is an absolute must. Obviously I will need to learn solidity but as I know 0 coding am I best learning Javascript and Python first?

Is anyone else crazy like me and done something similar?

Interested to get some of your feedback.

Thanks,
KubeRider :: Building with TravisCI
Published: 2019-11-24 12:47:28

---
title: KubeRider :: Building with TravisCI
published: true
date: 2019-07-28 15:04:15 UTC
tags: 
canonical_url: https://deskriders.dev/kuberider-building-with-travisci/
---

 ![](https://deskriders.dev/media/posts/3/travis_ci_build_finished.png)

Here is what .travis.yml file looks like in KubeRider

```
language: python
os: linux
dist: trusty
sudo: required
python: '3.6'
git:
 depth: 1
branches:
 only:
 - master
env:
 global:
 - BUILD\_VERSION="0.0.1"
script:
 - git config --local user.name "namuan"
 - git remote set-url origin https://namuan:${GITHUB\_TOKEN}@github.com/namuan/kube-rider.git
 - git push origin :refs/tags/${BUILD\_VERSION}
 - git tag -f -am v${BUILD\_VERSION} ${BUILD\_VERSION}
 - git push origin ${BUILD\_VERSION}
notifications:
 email: false
```

Once added to the project, next step is to add the project to TravisCI. 

![](https://deskriders.dev/media/posts/3/travis_ci_select_repo.png)

 After few seconds and if the setup is correct, you'll be taken to the following page where you can manually trigger the build

![](https://deskriders.dev/media/posts/3/travis_ci_trigger_build.png)

 

This is only to see if the build if working otherwise usually it'll auto trigger the build as soon it detects a commit in Github.

![](https://deskriders.dev/media/posts/3/travis_ci_running_build.png)

Once the build is successful, it'll [tag the build](https://github.com/namuan/kube-rider/tags) in Github with the current version

![](https://deskriders.dev/media/posts/3/travis_ci_tag_build.png)
📦 Human-readable file-sizes
Tags: replit, python, functorflow
Published: 2019-07-28 14:57:48

---
title: 📦 Human-readable file-sizes
published: true
tags: replit, python, functorflow
---

```python
from functorflow import f

r = f('pretty-bytes', 4587)
print(r) # '4.59 kB'
```
> Stop wasting time installing and configuring Python libraries. Use them right away. [📦FunctorFlow](https://functorflow.org) instantly auto-install and auto-config them for you.


{% replit @functorflow/pretty-bytes %}
Convert a string to a valid filename
Tags: replit, python, functorflow
Published: 2019-07-28 14:54:13

---
title: Convert a string to a valid filename
published: true
tags: replit, python, functorflow
---

Convert a string to a valid safe filename for both unix-like and windows systems

```python
from functorflow import f

r = f('safe-name', '<foo/bar>')
print(r)
```


{% replit @functorflow/safe-name %}

> Stop wasting time installing and configuring Python libraries. Use them right away. [FunctorFlow](https://functorflow.org) instantly auto-install and auto-config them for you.
Has anyone tried pixel art with their GH profile?
Tags: watercooler, randomthoughts
Published: 2019-07-28 14:52:01

---
title: Has anyone tried pixel art with their GH profile?
published: true
description: 
tags: water-cooler, random thoughts
cover: https://thepracticaldev.s3.amazonaws.com/i/o6drtl28j5ba99xmu7z7.png
---

If you think of it, the infamous GitHub show-off activity-viewer is just a small canvas of roughly 52*7 pixels... 

It should be possible to make a mono-chrome of something with it. 


![chrome's dev tool is practical](https://thepracticaldev.s3.amazonaws.com/i/tv58kjzb8f5ms0olhylw.png)
styled-components and treat 
Tags: react, typescript, javascript, css
Published: 2019-07-28 14:36:00

---
title: styled-components and treat 
published: true
description: styled-components implemented treat, themeable, statically extracted CSS‑in‑JS with near‑zero runtime.
tags: [react, typescript, js, css]
cover_image: https://thepracticaldev.s3.amazonaws.com/i/xg3lkrpjztmx27xhamru.png
---

One can say that copying is a higher form of appreciation. And here I am implementing styled-components "pattern" for the third time:

1. [css-modules-components](https://github.com/stereobooster/css-modules-components)
2. [unstyled-components](https://github.com/stereobooster/unstyled-components)
3. [react-treat-styled](https://github.com/stereobooster/treat/tree/react-treat-styled/packages/react-treat-styled)

This time I implemented styled-components (more like proof of concept, not a final version) for [treat](https://seek-oss.github.io/treat/). Treat is themeable, statically extracted CSS‑in‑JS with near‑zero runtime. There other statically extracted CSS‑in‑JS solutions, like [astroturf](https://github.com/4Catalyzer/astroturf) and [linaria](https://github.com/callstack/linaria). The main problem with those solutions they don't work with CRA out of the box. treat doesn't work with CRA yet as well, but [there is a hope](https://github.com/seek-oss/treat/issues/42#issuecomment-515667046).

## Code example

Here is [example repo](https://github.com/stereobooster/react-treat-demo/tree/react-treat-styled), which shows how to use it.

You declare styles like this:

```tsx
import { style } from "treat";

export const base = style({
  outline: "none",
  padding: "0.325rem 0.625rem"
});

export const themed = style(({ primary }) => ({
  background: primary
}));

export default [base, themed];
```

- It has TypeScript support, so it will complain about illegal CSS.
- It has the same benefits as CSS modules
- It supports theming

Component itself looks like this:

```tsx
import { styled } from "@stereobooster/react-treat-styled";
import styles from "./button.treat";

const Button = styled.button(styles);

const App = () => <Button onClick={() => alert("test") }></Button>
```

[Here are tradeoffs](https://seek-oss.github.io/treat/background#tradeoffs) of using treat. I haven't tried it for real-life projects yet, but let's see.

**What do you think about treat**?
A URI encoder compliant with RFC 3986
Tags: replit, python, functorflow
Published: 2019-07-28 14:16:14

---
title: A URI encoder compliant with RFC 3986
published: true
tags: replit, python, functorflow
---

About: https://tools.ietf.org/html/rfc3986

```python
from functorflow import f

# A URI encoder compliant with RFC 3986

r = f('uri-encode', 'you!and*me')
print(r) # you%21and%2Ame
```

> Stop wasting time installing and configuring Python libraries. Use them right away. [FunctorFlow](https://functorflow.org) instantly auto-install and auto-config them for you.


{% replit @functorflow/uri-encode %}
what steps should i take to become a programmer.
Published: 2019-07-28 14:15:48

Hey guys!

i
I am new to this community and github even also coding.
I started my coding with cpp for about a month and am new to this.
but i am started myself as a programmer.
what step should i take to become a program develepor as such i dont want to take detours.
And should i put my time first on algorithm(discreet mathematicts) or should i dive directly into cpp deeper.

thanks for your precious time
📦 RDATA field encoder/decoder  in multicast DNS TXT records
Tags: replit, python, functorflow
Published: 2019-07-28 14:12:44

---
title: 📦 RDATA field encoder/decoder  in multicast DNS TXT records
published: true
tags: replit, python, functorflow
---

```python
from functorflow import ff

data = {'zero': 0, 'one': 1}
r = ff('dns-txt').encode(data)
print(r)
# {'type': 'Buffer', 'data': [6, 122,..]}

r = ff('dns-txt').decode(r)
print(r) # {'zero': '0', 'one': '1'}
```

{% replit @functorflow/dns-txt %}
📦 Encode HTML character references and character entities
Tags: replit, python, functorflow
Published: 2019-07-28 14:10:18

---
title: 📦 Encode HTML character references and character entities
published: true
tags: replit, python, functorflow
---

```python
from functorflow import f

val = 'alpha © bravo ≠ charlie 𝌆 delta'
r = f('encode-html', val)
print(r) # 'alpha &copy; bravo &ne; charlie &#x1D306; delta'
```

{% replit @functorflow/encode-html %}
📦 HTML sanitizer 
Tags: replit, python, functorflow
Published: 2019-07-28 13:57:20

---
title: 📦 HTML sanitizer 
published: true
tags: replit, python, functorflow
---

```python
from functorflow import f

dirty = '<script>alert("xss");</script><p>hello'
clean_html = f('sanitize-html', dirty)
print(clean_html) # '<p>hello</p>'
```


{% replit @functorflow/sanitize-html %}

> Stop wasting time installing and configuring Python libraries. Use them right away. [FunctorFlow](https://functorflow.org) instantly auto-install and auto-config them for you.
Using View Models in Blazor
Tags: blazor, viewmodel, dependencyinjection
Published: 2019-07-28 13:50:22

---
title: Using View Models in Blazor
published: true
description: Using View Models in Blazor
tags: Blazor, ViewModel, Dependency Injection
---

<link rel="canonical" href="https://www.pmichaels.net/2019/07/07/using-view-models-in-blazor/" />

Being new to Blazor (and Razor), the first thing that tripped me up was that the view seemed divorced from the rest of the application.  In fact, this is actually quite a nice design, as it forces the use of DI.  

For example, say you wanted to create a View Model for your view, you could register that ViewModel in the Startup:

    public void ConfigureServices(IServiceCollection services)
    {
        services.AddTransient<MyViewModel, MyViewModel>();
    }

Note here that you don't <em>need</em> an interface.  If you're only creating an interface for the purpose of this then that abstraction provides no benefit.  That isn't to say there may not be a reason for having an interface, but if you have one and this is the only place it's used, you probably should reconsider.

The views in Razor / Blazor (at the time of writing) are *.razor files.  In order to resolve the dependency inside the view, you would use the following syntax:

    @page "/"
    @inject ViewModels.MyViewModel MyViewModel

(Note that @page "/" is only in this snippet to orientate the code.)

You can call initialisation in the view model using something like:

    @code {

        protected override async Task OnInitAsync()
        {
            await MyViewModel.Init();
        }    
    }

And, within your HTML, you can reference the view model like this:

    <div>@MyViewModel.MyData</div>

Magic.  Hopefully more to come on Blazor soon.


<h1>References</h1>

The original version of this post can be found <a href="https://www.pmichaels.net/2019/07/07/using-view-models-in-blazor/">here</a>.
Frontend 360
Tags: frontend, overview, mindmap
Published: 2019-07-28 13:42:59

---
title: Frontend 360
published: true
description: Mindmap for Frontend areas
tags: frontend, overview, mindmap
canonical_url: https://oles.dev/posts/frontend-360
---

*Originally posted at https://oles.dev/posts/frontend-360*

I needed to organize my thoughts on Frontend so I've ended up with a mindmap that I've ambitiously named as Frontend 360.
The system can help you to evaluate the state of the projects and point to the strengths and weaknesses.

Mindmap can be categorized into 3 subcategories - Peers, Self and Users

## Peers

![Peers](https://i.imgur.com/bVGauNK.png)
<figcaption>Areas of Frontend Peers</figcaption>

Frontend cannot live in the vacuum itself. As a touchpoint with the customers, it has interdependencies with other domains.
The Peers category relates to the domains relative to the Frontend - **Testing, DevOps, Backend, Design, Content, Marketing**

* How fast the project builds and how easy are deploys?
* Does the application has enough test coverage to prevent bugs?
* Is the bad API decisions leak into Frontend?
* Is the UI/UX you have in the application is consistent?
* Are the translation/content mechanisms pleasure to work with?
* Are the user tracking reports error-free?

## Self

![Self](https://i.imgur.com/LqoYd3h.png)
<figcaption>Areas of Frontend itself</figcaption>

The second section relates to ourselves, Frontend code maintainers with covering following domains - **Code, Documentation, Monitoring**

* Does codebase has decent documentation?
* Are there any JS errors on production?
* How do you react on performance regressions?
* How big is the technical debt?
* Are all our dependencies up-to-date?

### Users
The last, but not least - Frontend from user's perspective - **Accessibility, Performance, Security**

* Is the service you provide is inclusive?
* Is the speed in your app is a UX bottleneck?
* Is our users' data and your application secure?

![Peer](https://i.imgur.com/b5R3jPJ.png)
<figcaption>Areas of users</figcaption>


### All together

These questions and sections can build a good picture of the state of Frontend

![Frontend 360](https://i.imgur.com/UWCuhtt.png)

All these aspects are important to keep a healthy project that will bring the joy to work with for you, your peers and your users.
React Tips: 2 - Binding an Event Handler
Tags: binding, react, eventhandler, tips
Published: 2019-07-28 13:42:11

---
title: React Tips: 2 - Binding an Event Handler
published: true
description: Binding an Event Handler in React
tags: Binding, React, Event Handler, tips
---

<link rel="canonical" href="https://www.pmichaels.net/2019/07/27/react-tips-2-binding-an-event-handler/" />

Example code <a href="https://github.com/pcmichaels/react-demos/tree/Tip_2_Binding">here</a>.

When dealing with any flavour of Javascript, sooner or later, you're going to come across the <em>this</em> problem.  The issue being that, what <em>this</em> means, depends on where you are.  This can be a particularly prevalent issue with React; imagine the following code:

    onMouseUp={this.onMouseUp}

In onMouseUp, you might want to affect the state in some way:

    private onMouseUp(e) {
        this.setState({
            dragging: false
        });


If you run this, you'll likely get the following error:

<blockquote>
TypeError: this is undefined
</blockquote>

I think you'll agree, a clearer message couldn't be had.

<h1>Binding</h1>

The answer to the problem that I've so eloquently posed here, is binding.  Essentially, you simply tell your local function to <em>know</em> about <em>this</em>:

    onMouseUp={this.onMouseUp.bind(this)}

This does fix the problem; now the method will execute without error.  However, what we are actually doing here is <a href="https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/jsx-no-bind.md">creating a new function every time the page is rendered</a>.  To circumvent this you can leave the original code as it was:

    onMouseUp={this.onMouseUp}

But then bind the method in the constructor:


    constructor(props) {
        super(props);

	this.onMouseUp = this.onMouseUp.bind(this);


As an aside, if you happen to see the following error:

<blockquote>
Argument of type 'this' is not assignable to parameter of type 'MouseEvent<Element>'.
</blockquote>

You've likely missed the .bind; for example:

    this.onMouseUp = this.onMouseUp(this);

Ask me how I know!

<h1>Class Properties</h1>

Another, newer (and IMHO much cleaner), way around this is the following syntax:

    onMouseDown = (e) => {
        console.log('onMouseDown');
        this.setState({
            dragging: true
        });
    }

This doesn't require any binding.

<h1>References</h1>

<a href="https://reactjs.org/docs/faq-functions.html">https://reactjs.org/docs/faq-functions.html</a>

The original post for this is <a href="https://www.pmichaels.net/2019/07/27/react-tips-2-binding-an-event-handler/">here</a>
📦Base64-URL de-encode/code, escape and unescape.
Tags: replit, python, functorflow
Published: 2019-07-28 13:13:03

---
title: 📦Base64-URL de-encode/code, escape and unescape.
published: true
tags: replit, python, functorflow
---

```python
from functorflow import ff

r = ff('base64-url').encode('FunctorFlow is cool')
print(r) # 'RnVuY3RvckZsb3cgaXMgY29vbA'

r = ff('base64-url').decode('RnVuY3RvckZsb3cgaXMgY29vbA')
print(r) # 'FunctorFlow is cool'

r = ff('base64-url').escape('This+is/goingto+escape==')
print(r) # 'This-is_goingto-escape'

r = ff('base64-url').unescape('This-is_goingto-escape')
print(r) #'This+is/goingto+escape=='
```

{% replit @functorflow/base64-url %}
What you prefer svelte or react?
Tags: discuss, beginners, react, svelte
Published: 2019-07-28 13:37:53

Svelte is getting popular nowadays, as it provides a small bundle size. But svelte is not popular as compare to react as the jobs posting favor mostly react. Moreover, Gatsby and Next.js are built over React.

It is hard to pick between these two, what is your thought on that? Is it good for a personal project?
A small concrete implementation repository for data structure
Tags: showdev, beginners, contributorswanted
Published: 2019-07-28 13:25:33

Hey everyone ! :wave:

Some weeks ago, I was wondering what data structure to use in one of my projects. It happens that I found it very harsh to look for each structure, one by one, then on each of the associated complexity (most of the time not even on the same page).  

That's why I decided to do [a small repository](https://github.com/pBouillon/data_structures) to gather various implementations of each data structure in several languages. Of course, coming along with it, a small readme to have an overview of the data structure and the complexity of its operations.

So far I didn't had enough time to work on it but I managed to provide some small samples and it would be awesome if you could help me to keep the code base growing ! It would provide a great extra small documentation or even extra small examples for beginners.

Speaking of which, this project could be perfect for beginners too, if you're new to GitHub or opensource, go for it, everybody can get in !

Happy coding!
📦 Returns 'x-www-form-urlencoded' string data
Tags: replit, python, functorflow
Published: 2019-07-28 13:08:23

---
title: 📦 Returns 'x-www-form-urlencoded' string data
published: true
tags: replit, python, functorflow
---

```python
from functorflow import f

data = {
  'str' : 'val',
  'num' : 0,
  'arr' : [3, {'prop' : False}, 1, None, 6],
}

r = f('form-urlencoded', data)
print(r)# str=val&num=0&arr%5B0%5D=3&arr%5B1%5D%5Bprop%5D=false&arr%5B2%5D=1&arr%5B3%5D=null&arr%5B4%5D=6
```

{% replit @functorflow/form-urlencoded %}
Bech32 encoding/decoding plugin
Tags: replit, python, functorflow
Published: 2019-07-28 13:03:43

---
title: Bech32 encoding/decoding plugin
published: true
tags: replit, python, functorflow
---

BIP173 compliant Bech32 encoding/decoding plugin.

```python
from functorflow import ff

s = 'abcdef1qpzry9x8gf2tvdw0s3jn54khce6mua7lmqqqxw'
r = ff('bech32').decode(s)

print(r) # { 'prefix': 'abcdef', 'words': [0,1,2,3,4,5,6,7,8,9,...] }


r = ff('bech32').encode(prefix='foo', words='foobar')

print(r) # 'foo1vehk7cnpwgry9h96'
```

{% replit @functorflow/bech32 %}
Create Awesome Animation with offset-path | Only Using CSS & HTML
Tags: offsetpath, css, html, codepen
Published: 2019-07-28 12:39:37


---
title: Create Awesome Animation with offset-path | Only Using CSS & HTML
published: true
description: 
tags: offset-path, css, html5, codepen
---

<p>Hello Guys! I have brought to you awesome example of creating <strong>offset path </strong>animation using only html & css.</p>
{% codepen https://codepen.io/ahmadbassamemran/pen/bXByBv %}
<hr/>
[Do Not Forget To Like & Subscribe In The Channel:](https://www.youtube.com/AhmadEmran?sub_confirmation=1)
<hr/>
{% youtube lF5f0WRO7QM%}
PlantUML encoder to create PlantUML diagrams
Tags: replit, python, functorflow
Published: 2019-07-28 12:29:05

---
title: PlantUML encoder to create PlantUML diagrams
published: true
tags: replit, python, functorflow
---


```python
from functorflow import f

r = f('plantuml', 'A -> B: Hello')
# print(r) # SrJGjLDmibBmICt9oGS0

img = 'http://www.plantuml.com/plantuml/img/{}'.format(r)

print(img)
```

PlantUML is a component that allows to quickly write :

-    Sequence diagram
-    Usecase diagram
-    Class diagram
-    Activity diagram (here is the legacy syntax)
-    Component diagram
-    State diagram
-    Object diagram
-    Deployment diagram 
-    Timing diagram 

The following non-UML diagrams are also supported:

-    Wireframe graphical interface
-    Archimate diagram
-    Specification and Description Language (SDL)
-    Ditaa diagram
-    Gantt diagram 
-    MindMap diagram 
-    Work Breakdown Structure diagram 
-    Mathematic with AsciiMath or JLaTeXMath notation
-    Entity Relationship diagram

More: http://plantuml.com/

{% replit @functorflow/plantuml %}

> Stop wasting time installing and configuring Python libraries. Use them right away. [FunctorFlow](https://functorflow.org) instantly auto-install and auto-config them for you.
Descobrindo a versão do backup de SQL Server
Tags: sql
Published: 2019-07-28 12:08:26

Eu estava outro dia com um backup de SQL Server para restaurar e não sabia a versão de SQL Server em que aquele arquivo foi gerado.

Vasculhando a Internet encontrei o comando abaixo e para minha surpresa funcionou sem problemas:

```sql
RESTORE HEADERONLY
FROM DISK = N'D:\data\SQLAuthority.bak'
```

Ele retorna o DatabaseVersion que no meu caso foi 706. Basta procurar esse número na tabela abaixo para descobrir a versão do SQL Server.

https://sqlserverbuilds.blogspot.com/2014/01/sql-server-internal-database-versions.html