teleren/devto huggingface dataset:
Announcing stdio - A community for human engineers
Tags: discuss
Published: 2019-03-23 02:20:04

Hey friends! It's been a little over a week since I've posted and I feel like I am loosing some of my drive. To get it kickstarted back up, I'd love to announce a new side project I am working on! So without further ado, check out **stdio**.

# What is it?

[stdio](https://stdio.app) (standard io) is a community/name under which a few projects are being released, all centered around helping everyone become more human engineers. 

The first project is up - it's a discord server for engineers of all skill levels to come hang out, get help with programming problems, connect with other engineers and learn new things. We'll be having weekly community nights every Tuesday at 6:15PM PST (subject to change by popular demand) where we will just hang out, discuss engineering things, and (hopefully) have some special guests!

More projects are in the works, but I really want this to be a collaborative, community-driven group. I have lots of ideas where this could go, but I want to know what the community wants!

Come join us in Discord, accept the Code of Conduct and join us _this_ Tuesday at 6:15PM EST! We'll be hanging out, chatting, and getting to know everyone!
Creational Patterns – Thumb Rules
Tags: blog, concepts, designpattern, designpatterns
Published: 2019-03-30 12:07:42

---
title: Creational Patterns – Thumb Rules
published: true
tags: blog,concepts,Design Pattern,Design Patterns
canonical_url: https://itscoderslife.wordpress.com/2019/03/23/creational-design-patterns-thumb-rules/
---

##### _This post is directly copied from [sourcemaking](https://sourcemaking.com/design_patterns/creational_patterns), just to make it easy for readers to access this piece of knowledge._

**Rules for how and when to apply** :

1. Sometimes creational patterns are competitors: there are cases when either  **Prototype**  or  **Abstract Factory**  could be used profitably. At other times they are complementary:  **Abstract Factory**  might store a set of Prototypes from which to clone and return product objects,  **Builder**  can use one of the other patterns to implement which components get built.  **Abstract Factory, Builder,** and  **Prototype**  can use  **Singleton**  in their implementation.
2. **Abstract Factory, Builder,** and ** Prototype**  define a factory object that’s responsible for knowing and creating the class of product objects, and make it a parameter of the system. **Abstract Factory**  has the factory object producing objects of several classes.  **Builder**  has the factory object building a complex product incrementally using a correspondingly complex protocol.  **Prototype**  has the factory object (aka prototype) building a product by copying a prototype object.
3. **Abstract Factory**  classes are often implemented with Factory Methods, but they can also be implemented using  **Prototype**.
4. **Abstract Factory**  can be used as an alternative to  **Facade**  to hide platform-specific classes.
5. **Builder**  focuses on constructing a complex object step by step.  **Abstract Factory**  emphasizes a family of product objects (either simple or complex).  **Builder**  returns the product as a final step, but as far as the  **Abstract Factory**  is concerned, the product gets returned immediately.
6. **Builder**  is to creation as  **Strategy**  is to algorithm.
7. **Builder**  often builds a  **Composite**.
8. **Factory Methods** are usually called within Template methods.
9. **Factory Method** : creation through inheritance.  **Prototype** : creation through delegation.
10. Often, designs start out using  **Factory Method**  (less complicated, more customizable, subclasses proliferate) and evolve toward  **Abstract Factory, Prototype, or Builder**  (more flexible, more complex) as the designer discovers where more flexibility is needed.
11. **Prototype**  doesn’t require subclassing, but it does require an Initialize operation.  **Factory Method**  requires subclassing, but doesn’t require Initialize.
12. Designs that make heavy use of the  **Composite**  and  **Decorator**  patterns often can benefit from  **Prototype**  as well.
The Var() css function
Tags: css, var, cssvariable
Published: 2019-03-23 00:14:06

---
title: The Var() css function
published: True
description: How var() css function works. It can help to create themes.
tags: css, var(), css Variable, 
---

The var() CSS function can be used to insert the value of a custom property (sometimes called a "CSS variable") instead of any part of a value of another property.

<blockquote>
    var(--header-color, grey);
</blockquote>

#syntax

<blockquote>
    var( custom-property-name , declaration-value)
</blockquote>

The first argument to the function is the name of the custom property to be substituted, An optional second argument to the function serves as a fallback value. if the custom property referenced by the first argument is invalid, the function uses the second value.

custom-property-name: represented by an identifier that starts with two dashes. custom property solely uses by authors and users.

declaration-value: the custom property's fallback value. which is used in case the custom property is invalid in the user context.

#Take a look at codepen example
{% codepen https://codepen.io/vishangsoni/pen/aMPPjE %}

###Browser Compatibility
![browser compatibility](https://thepracticaldev.s3.amazonaws.com/i/ny1rbibe131m11x4222s.png)
Blogging with Hugo and GitLab (1): Quick Start
Tags: webdev, tutorial
Published: 2019-04-08 06:02:17

---
title: Blogging with Hugo and GitLab (1): Quick Start
published: true
tags: ["webdev", "tutorial"]
canonical_url: https://loadbalancing.xyz/post/blogging-with-hugo-and-gitlab-quick-start/
---

Building your own blog website is easy today. With only a few steps, you will be able to create your own blog website which can be visited at *https://<span></span>username.gitlab.io*.

<!--more-->

## Why Hugo?

If your goal is to build a static website (which is good enough for personal blogs), there are several solutions today to help make such process easy and automatic. Basically what you need to do is to write some <a href="https://en.wikipedia.org/wiki/Markdown" target="_blank"> Markdown</a> docs and they will help you convert them into static HTML files. Among those options, <a href="https://gohugo.io" target="_blank"> Hugo</a> is known to be the fastest one in terms of static page building, since it's written in Go with compilation while the others are based on interpretation.

## Why GitLab?

GitLab offers free service of <a href="https://about.gitlab.com/product/pages/" target="_blank"> GitLab Pages</a> for hosting static websites. The GitLab Pages service also provides native support for Hugo, which makes it extremely easy and convenient to build and deploy your webiste without replying on any other third-party supports.

If you are convinced, the first step is to create an account in GitLab. Note that your username in GitLab will be the sub-domain name of your website's URL such as *https://<span></span>username.gitlab.io*.

## Create your website repository

Since our goal is Hugo+GitLab, the easiest way is to fork the official Hugo repository in GitLab.

1. Go to <a href="https://gitlab.com/pages/hugo" target="_blank"> Hugo's repository on GitLab</a>
2. Login with your GitLab account.
3. Fork this repository.

Some further configuration:

1. Remove the forking relationship, which won't be necessary unless you want to contribute back to the upstream project.
"Settings" > "General" > "Advanced" > click "Expand"
Click "Remove fork relationship".

2. Rename the repository, so it will be linked to your website's URL *https://<span></span>username.gitlab.io*.
"Settings" > "General" > "Advanced" > click "Expand" > "Rename repository"
"Project name": *username.gitlab.io*
"Path": *username.gitlab.io*
Click "Rename project".

3. Mark your repository as private--if you only want people to visit your website through the URL, but not be able to view your repository.
"Settings" > "General" > "Visibility, project features, permissions" > click
"Expand"
"Project visibility": Private
click "Save changes".

4. Update the base URL in `config.toml`.
```
diff --git a/config.toml b/config.toml
--- a/config.toml
+++ b/config.toml
@@ -1,4 +1,4 @@
-baseurl = "https://pages.gitlab.io/hugo/"
+baseurl = "https://username.gitlab.io"
```

After a couple of minutes, you will be able to visit your website at *https://<span></span>username.gitlab.io*.
What's your personal merge/deploy policy?
Tags: discuss
Published: 2019-03-22 22:19:36

---
title: What's your personal merge/deploy policy?
published: true
description: What's your personal merge/deploy policy?
tags: discuss
cover_image: https://thepracticaldev.s3.amazonaws.com/i/oqg9vv4u2c5orc3y2n6n.png
---

The other day I was touching up a PR that had been approved and was about to merge and deploy it when, out of habit, I checked the clock. It was 3:45pm, which for me, was past my "merge before" time of 3:30pm. I decided to hold off and wait until the next morning. 

The whole process got me thinking. Does anyone else have their own personal merge or deploy policies? Is there a time before or after when you say, not today? Is there a day of the week you don't like to merge stuff. A lot of people joke about read-only Fridays, but I have to admit, I kinda follow that rule. Anything remotely high risk I wait until Monday to merge. 

What's your personal merge/deploy policy?
Do you use the Dvorak Keyboard?
Tags: discuss
Published: 2019-03-22 21:29:41

---
title: Do you use the Dvorak Keyboard?
published: true
tags: discuss 
---

Doing some research on Dvorak vs Qwerty keyboard.  Does anyone have any experience with both?  
I'm interested in gaining insight into the learning curve of Dvorak and its effectiveness with programming.
[composant] Champs personnalisés égal bon appétit
Tags: webdev, joomla, customfields
Published: 2019-12-14 21:46:40

---
title: [composant] Champs personnalisés égal bon appétit
published: true
date: 2019-03-22 21:08:07 UTC
tags: webdev, joomla, customfields
canonical_url: 
---

Salut les Joomlers de l’extrême!

Je sais, je sais. Vous allez me dire mais qu'est ce que c'est que ce titre barbare et tordu? Ne vous en faite pas. Tout va s'éclaircir au fur et à mesure. Dès Joomla! 3.7, nous avons droit dans les fichiers du coeur de Joomla! aux champs personnalisés grâce au formidable travail de Allon Moritz (@laoneo). Il faut savoir que le composant com\_content (articles) ainsi que quelques autres dispose du support natif des champs personnalisés. Mais qu'en est t-il des extensions tierces que nous aussi développeurs et développeuses veulent réaliser? Nous souhaiterions avoir le même support des champs personnalisés, voir plus, avec un peu plus d'efforts.

[Lire la suite...](/champs-personnalises-egal-bon-appetit)
[composant] Exemple de composant utilisant les champs personnalisés multi-contexte
Tags: component, joomla, multicontext, customfields
Published: 2019-07-28 22:12:00

---
title: [composant] Exemple de composant utilisant les champs personnalisés multi-contexte
published: true
tags: component,joomla,multi-context,custom-fields
canonical_url: 
---

Ami(e)s Joomlers,

Je sais, je sais. Vous allez me dire mais qu'est ce que c'est que ce titre barbare et tordu?

Ne vous en faite pas. Tout va s'éclaircir au fur et à mesure.

Dès Joomla! 3.7, nous avons droit dans les fichiers du coeur de Joomla! aux champs personnalisés grâce au formidable travail de Allon Moritz (@laoneo).

Il faut savoir que le composant com\_content (articles) ainsi que quelques autres dispose du support natif des champs personnalisés. Mais qu'en est t-il des extensions tierces que nous aussi développeurs et développeuses veulent réaliser? Nous souhaiterions avoir le même support des champs personnalisés, voir plus, avec un peu plus d'efforts.

Ce composant d'exemple com\_example mets le contenu de base des champs personnalisés, plus le support de ce que l'on appelle le multi-contexte (Pensez plusieurs types de "elements" qui peuvent avoir eux aussi leurs champs personnalisés et leurs groupes de champs personnalisés.

Ex: Un hotêl veut gérer les activités de ces clients durant les 4 saisons de l'année.

"contexte 1" : Printemps

- Groupe de champs personnalisés: "Activités printannières"

- Champ personnalisé: Natation

"contexte 2" : Eté

- Groupe de champs personnalisés: "Activités estivales"
- Champ personnalisé: Volley Ball

etc...

Dans le cadre multi-contexte, chaque saison est listée dans un menu déroulant dans le filtre de champs personnalisés ainsi que dans le filtre groupe de champs personnalisés

[Voici le code source du composant d'exemple com\_example](https://github.com/application2000/com_example.git "Voici le code source du composant champs personnalisés multi-contexte")

Voilà, c'est tout pour aujourd'hui. A bientôt les Joomlers de l'extrême!
Developer "Mid-Level" Crisis
Tags: midlevel, developer, life, crisis
Published: 2019-03-22 21:03:48

---
title: Developer "Mid-Level" Crisis
published: true
description: Hurdles and adventure of a mid-level developer
tags: midlevel,developer,life,crisis
---

Hello ghyz, in every developer's life..there are many stages and phases just like any other process, and many a-times, people don't really like to pay attention to mid-level devs, i mean there are tons and tons of articles and publications addressing many of the challenges beginners face, which to me is a bit unfair..

_A Little Role-Play_

My name is *Kim* 👷‍♂️ i recently got interested in software development, like every other human, i do my little research and see alot of cool technologies to learn and actualise my dream, and yea in 2019 i probably pick JS, few months later i am a bit comfortable, with help from the community i continue to learn and grow, 2-3 years down the line i begin to get comfortable being able to write applications..and happy AF....then boom! the crisis begin

*1.* I begin to apply for better gigs, and the interviewer keeps asking me wether i can write systems that scale...distributed systems, design patterns and stuff...and i am like WTF man?...i know arrays, varibales and loops isn't that  enough?... Then it hits you knowing how to code is the least of your problem 😢

*2.* I begin to see all these _celebrity devs_ 😅speaking at conferences, also writing blog posts and im like omg, i'm also supposed to have public speaking and writing skills?...damn!!

*3.* Open source this, open source that...well apple is a $1 Trillion dollar company and they dont do so much open-source...so wtf should i contribute?🤷‍♂️

*4.* I finally apply for a gig that they want to concentrate on my coding skill..and then boom... they pull up the white-board interview card... _are you shitting me right now?_ 🌚

*5.* Then the rejection emails start pouring in...This is usually the hardest part, can almost put a person into depression.

*6.* I finally get a good gig, and see all these awesome co-workers doing crazy things with code...writing maad code, and i am wondering wether i can ever match up 😭

Tbvh, this stage of your career can be difficult, having to learn and unlearn, encourage yourself and all.. it can get scary real fast.

But if it is any consolation, it would get better, might not completely go away, but trust me things would get better...You just have to be fluid, be *teachable*..Try and network more, if possible get a mentor or someone to just guide and boost your morale ...
Javascript: An introduction to Object constructor.
Published: 2019-03-22 20:46:49

---
title: Javascript: An introduction to Object constructor.
published: true
description: Some useful methods of object constructor in javascript
tags: 
---
<h1>Overview</h1>
<p>In Javascript, we can use the built-in Object constructor creates an object wrapper. There are a bunch of methods that work with this constructor, such as Object.assign(). This is a short introduction about the Object constructor. Let's walkthrough some of the common methods in detail.</p>

<h3>Object.assign()</h3>
Object.assign() copies other objects values to a new target object.
```
let obj1 = {a: 1, b: 2, c: 3};
let obj2 = {d: 4, e: 4, c: 6};
let newObj = Object.assign({}, obj1, obj2);
console.log(newObj);
{ a: 1, b: 2, c: 6, d: 4, e: 5 }
```
Notice that the c: 3 from obj1 did not copy to newObj, that because obj2 has the same key c: 6 and is overwritten the value on obj1. Also without the empty curly bracket, the first argument will be altered and merge with obj2.(known as destructive)
```
let obj1 = {a: 1, b: 2, c: 3};
let obj2 = {d: 4, e: 4, c: 6};
let newObj = Object.assign(obj1, obj2);
console.log(newObj);
{ a: 1, b: 2, c: 6, d: 4, e: 5 }
console.log(Obj1);
{ a: 1, b: 2, c: 6, d: 4, e: 5 }
console.log(Obj2);
{d: 4, e: 4, c: 6}
```
<h3>Object.values()</h3>
The Object.values() will return an array contains all the values from the object that is being parsed.
```
let testObj = {name: 'Vegas', age: 25, hairColor: 'dark'};
Object.values(testObj);
console.log(valueObj);
Array ["Vegas", 25, "dark"]
```
<h3>Object.keys()</h3>
Similar to Object.values, Object.keys will return an array containing all keys attributes, like so:
```
let testObj = {name: 'Vegas', age: 25, hairColor: 'dark'};
Object.keys(testObj);
console.log(valueObj);
Array ["name", "age", "hairColor"]
```
<h3>Object.entries() </h3>
Object.entries returns both key and values like so:
```
let testObj = {name: 'Vegas', age: 25, hairColor: 'dark'};
valueObj = Object.entries(testObj);
console.log(valueObj);
Array [Array ["name", "Vegas"], Array ["age", 25], Array ["hairColor", "dark"]]
```
<h3>Conclusion</h3>
Object constructor and its methods are very helpful when we work on datasets such as json format data. 
To learn more, all other Object constructor methods can be found here:<br>
<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object" target="_blank">Mozilla.org</a>
Expressing Business Flows using an F# DSL
Tags: fsharp, workflows, systems
Published: 2019-03-22 19:24:43

---
title: Expressing Business Flows using an F# DSL
published: true
description: How to represent business logic in F# using a custom Domain Specific Language (DSL).
tags: fsharp, workflows, systems

---

Over two years, the Order Management Team built and migrated to a new Workflow System, motivated by some reasons which I explain in an earlier post:
Microservices to Workflows: The Evolution of Jet.com Order Management System

TLDR: Expressing business domains as workflows simplifies development and improves the overall maintainability. Read the previous post for more details :).
This post goes into the details about how we use F# to model our workflows as a DSL.

To Read More: 
https://medium.com/jettech/microservices-to-workflows-expressing-business-flows-using-an-f-dsl-d2e74e6d6d5e
What was your win this week?
Tags: discuss, weeklyretro
Published: 2019-03-22 19:15:32

---
title: What was your win this week?
published: true
description: Got to all your meetings on time? Started a new project? Fixed a tricky bug?
tags: discuss, weeklyretro
cover_image: https://cl.ly/188e843c2985/download/Image%202019-02-15%20at%202.36.37%20PM.png
---

Happy Friday, everyone!!

Looking back at your week, what was something you're proud of?

All wins count -- big or small!

Examples of 'wins' include:

- Giving someone constructive feedback!
- Contributing to OSS
- Fixing a trickster bug
- Watering your plants...or whatever else that may spark joy 😄 🎉
Loop through Arrays with MAP() in React
Tags: react, javascript, map
Published: 2019-03-22 19:09:30

---
title: Loop through Arrays with MAP() in React
published: true
description: this article with help to understand how map is working in react to loop through an array.
tags: react, javascript, map
cover_image: 

---

The map() method creates a new array with the results of calling a provided function on every element in the calling array.

The React docs strongly encourage the use of the map function. not just for its simplicity, but because it creates a new array from the data, rather than trying to mutate/overwriting existing data. With your react application there will be more likely chances where you have to gather the data from API in the form of JSON and grab data according to your requirements. Map() is the best way to iterate through those data and fetch what you need.

#Let's take an example

<pre><code>
let cart = [
{id: 1, itemName: 'cap',price:10 },
{id: 2, itemName: 'socks',price:20 },
{id: 3, itemName: 'hoodie',price:30 }
]
</code></pre>

inside of our App class constructor, we will create this.cartItems and assign it to this.state.cart (this is where we store items that get added to the cart). we then use the ES2015 map function to loop through each item in this.state.cart.

We pass two arguments with it.
1. item: single `item` inside out this.state.cart
2. key: React uses to help its renderer keep a track of each individual item.

<pre><code>
this.cartItems = this.cart.map((item, key) => 
    <li key={item.id}>{item.itemName}</li>
)
</code></pre>
and we want to use to show cartItems in our code we simply call it via

<per><code>
<ul>{this.cartItems}</ul>
</code></pre>

Instead of calling it from constructor we can call it in our render method

<pre><code>
render() {
    const cartItems = this.state.cart.map((item,key) => 
        <li key={item.id}>{item.itemName}</li>
    )

</code></pre>
and we can just call it like 
<pre><code>
<ul>{cartItems}</ul>
</code></pre>

As we all know that calling like this in the render() method is not a good idea but with the fairly simple application, it should be okay to do that. 

{% codesandbox v0m1rm2mk7 %}
Memphis Smart City Hackathon
Tags: hackathon, javascript, ethereum, blockchain
Published: 2019-07-29 20:38:23

---
title: Memphis Smart City Hackathon
published: true
tags: hackathons,javascript,ethereum,blockchain
canonical_url: 
---

![](https://cdn-images-1.medium.com/max/1024/1*JKAmbX_zcMCuA7Fbt5_DuQ.jpeg)

### Attending a Hackathon

I participated in my first Hackathon last weekend! It was Memphis’ “Smart City” Hackathon. I coded with a group of blockchain developers from web3devs on project we called “BlockSaver.” Here is the [Github](https://github.com/edezekiel/blocksaver) link.

The Hackathon theme was transportation and mobility, with a special focus on pedestrian safety. There are dozens of pedestrian deaths each year in Memphis.

I was blown away by what the groups came up with. One team designed a video surveillance system so that buses can “see” and record potholes in the road. Another group developed a system to to light up crosswalks automatically whenever a person walks by.

### BlockSaver

My team created a web app called BlockSaver, which lets users geotag and report pedestrian safety issues like broken sidewalks. I built a substantial part of the frontend using React and basic CSS. That’s right, we did not use a CSS framework for the app. I thought this would be a great opportunity to improve some of my basic CSS skills. I wound up using Flexbox a lot and I really enjoyed the experience.

### BlockChain

As I mentioned above, I worked on the project with a group of blockchain developers. So, of course our app had some awesome blockchain integration. They created an ERC20 smart contract on the Ethereum network that is tied to our app. Whenever someone submits a pedestrian safety report, the smart contract creates a transaction on the blockchain system, and gives the user a token.