teleren/devto huggingface dataset:
Passing an Object or Array to Stencil through markup
Tags: stenciljs, typescript, webcomponents
Published: 2019-09-19 16:40:22

## Common Code

```typescript
export interface SomeValue {
  name: string;
  value: string;
}
```

## Passing an Object

```tsx
import { Component, h, Prop, Watch } from '@stencil/core';
import { SomeValue } from './some-value.interface';
@Component({
  tag: 'object-sample',
  styleUrl: '...',
  shadow: true
})
export class ObjectSample {
  private _objectData: SomeValue;
  @Prop() objectData: SomeValue | string;
  
  @Watch('objectData')
  objectDataWatcher(newValue: SomeValue | string) {
    if (typeof newValue === 'string') {
      this._objectData = JSON.parse(newValue);
    }
    else {
      this._objectData = newValue;
    }
  }

  componentWillLoad() {
    this.objectDataWatcher(this.objectData);
  }

  render() {
    return (
      <div class='object-data'>
        <span>{this._objectData.name}</span>
        <span>{this._objectData.value}</span>
      </div>
    );
  }
}
```
```html
<object-sample 
   object-data='{"name": "Bird", "value": "Chirp"}'>
</object-sample>
```

## Passing an Array

```tsx
import { Component, h, Prop, Watch } from '@stencil/core';
import { SomeValue } from './some-value.interface';
@Component({
  tag: 'array-sample',
  styleUrl: '...',
  shadow: true
})
export class ArraySample {
  
  private _arrayData: SomeValue[];
  @Prop() arrayData: SomeValue[] | string;
  
  @Watch('arrayData')
  arrayDataWatcher(newValue: SomeValue[] | string) {
    if (typeof newValue === 'string') {
       this._arrayData = JSON.parse(newValue);
    }
    else {
      this._arrayData = newValue;
    }
  }
  
  componentWillLoad() {
    this.arrayDataWatcher(this.arrayData);
  }

  render() {
    return [
      <div class='array-size'>{ this._arrayData.length }</div>,
      this._arrayData.map(x =>
        <div class='row'>
          <span>{x.name}</span>
          <span>{x.value}</span>
        </div>
      )
    ];
  }
}
```
```html
<array-sample 
   array-data='[{"name": "Cat", "value": "Meow"}, {"name": "Dog", "value": "Woof"}]'>
</array-sample>
```

## Key Concepts
* The `@Prop()` datatype must contain string if a type is defined
* Use a `@Watch()` function to parse the json string value
* Call the `@Watch()` function in the `componentWillLoad()` function for the first parse of the json data
  * The `@Watch()` function does not fire on the first load of the component
* The value passed to the `@Prop()` must follow strict json syntax

## Version Consideration
These examples are Stencil One. If you are using pre @stencil/core@one Check out the Breaking changes document to see what updates are needed to get this sample to work for you in the beta
Code Story E7: Jonathan Campos on the Impact of Firing Someone
Tags: podcast, codestory, techtalks
Published: 2019-09-19 16:30:22

{% youtube 2nlBokNHGhA %}

After getting his masters, Jonathan Campos found himself working with clients, listening to their pain points, and creating software to meet those needs. He worked his way through a handful of startups and agencies, before landing at Bottle Rocket as the chief architect, growing their web and backend practice. Not too long after, a former boss reached out about an opportunity to up-level the ride-sharing experience, focusing on simple billing, safety, and control over the experience. This opportunity was to become the CTO of Alto.

In the clip above, Jonathan Campos discusses what it's like to fire someone and the impact it has on the team. If you like what you hear, check out the full episode below.

{% podcast https://dev.to/codestorypodcast/e7-jonathan-campos-alto %}
Custom bookmark icons in VSCode
Tags: vscode, extensions
Published: 2019-09-19 16:14:37

# Background
I recently started learning web development on [FreeCodeCamp](https://www.freecodecamp.org/). I found out about [VScode](https://code.visualstudio.com/) and don't know how I survived without it! Anyone who is familiar with VScode knows how to add an extension, but sometimes the customization options aren't as well known.

I particularly like the bookmark feature in Visual Studio and wanted to have that functionality in VScode so I installed the Bookmarks extension. However, I didn't like the look of the default skinny blue bookmark on my dark background. I found out that there is a setting available so you can use a custom 16x16 pixel icon as your bookmark image!

This post is about how to add the bookmark extension and customize it, but I also created a [github repo](https://github.com/techCarpenter/custom_bookmarks)* of different colored bookmarks so you don't have to create your own if you don't want to.

**Note:* The bookmark icons in the repo are modeled after the bookmark icon in Visual Studio 2017. 

# Customize the bookmark icon in VScode

1. You'll need to install the [bookmarks extension](https://marketplace.visualstudio.com/items?itemName=alefragnani.Bookmarks) for VScode.
2. Find a 16x16 pixel icon you want to use as a bookmark in VScode (or go ahead and clone/download the [premade icons](https://github.com/techCarpenter/custom_bookmarks) on my github) and put that image file in a local folder.
3. Add this setting to the settings.json file in VScode:
    ```json
    "bookmark.gutterIconPath": "c:\\path_to_icon\\icon.png"
    ```
4. **(Optional)** Update the keybinding for *'Bookmark Toggle'* to *'Ctrl+K Ctrl+K'* (to mimic the Visual Studio IDE shortcut)
5. Enjoy your customized bookmarks!

I hope you have as much fun customizing VScode to fit your style as I do! If you have any questions for me or just want to connect, comment below or message me on twitter! I enjoy talking with new people :smiley:

Until next time, happy coding!
Which companies are using Erlang, and why? #MyTopdogStatus
Tags: erlang, progamminglanguages, beamvm, elixir
Published: 2019-09-19 15:39:12

---
title: Which companies are using Erlang, and why? #MyTopdogStatus
published: true
description: 
tags: erlang, progamming languages, BEAM VM, Elixir
---
![Erlang Top Dog](https://i.imgur.com/MaT6p4F.jpg)

Did you know 90% of all internet traffic goes through one niche technology? And, it's the same technology that has maintained an unheard of 99.999% uptime for the English National Health Service (NHS). In fact, it is the reason WhatsApp was able to manage 54 billion messages a day with an engineering team of just 32 people?

That niche technology is Erlang, and if you look into any major industry, the big names will be using it. In gaming, there's Nintendo. In banking, there's Vocallink, a Mastercard company. In Telecoms, there's Ericsson and Motorolla, In finance? Goldman Sachs, And if you've ever secured a date on Grindr, you've used Erlang.

Francesco Cesarini is the Founder and Technical Director of Erlang Solutions. He has worked with the Erlang Ecosystem for 25 years. He says:
"The Erlang ecosystem is not just a programming language. It is a family of programming languages, a virtual machine as powerful as an operating system and a set of middleware libraries which abstracts many of the recurring (and tricky) problems you have to deal with when working with scale and resilience."

For our latest campaign, we want to spread the word that Erlang is the top dog in any tech stack. The message is too important to do alone, so we've engaged the help of dogs!

In the first blog of the campaign, Francesco Cesarini shares a comprehensive high-level summary of the language, its middleware and its virtual machine. The blog is filled with real-world examples of household brands achieving amazing results with Erlang, and of course, dogs. Read it now at [https://www2.erlang-solutions.com/whyerlangdev](https://www2.erlang-solutions.com/whyerlangdev)
What are the essential non-dev skills every developer should have?
Tags: discuss, career, productivity
Published: 2019-09-19 16:03:57

---
title: What are the essential non-dev skills every developer should have?
published: true
description: Let me know what are, in your opinion, the essential non-dev skills every developer should have?
tags: #discuss, #career, #productivity
---

Hello everyone, this week I've asked myself what non-dev skills should every dev have and I would like to know your thoughts on the subject.

Most of the skills that I've thought of are part of the **soft skills** term.
 
> Soft skills include adaptability, attitude, communication, creative thinking, work ethic, teamwork, networking, decision making, positivity, time management, motivation, flexibility, problem-solving, critical thinking, and conflict resolution.
- [The Balance Careers](https://www.thebalancecareers.com/what-are-soft-skills-2060852)

Another skill that I would like to add is **Stress Management** skill. It's important to keep your head cool and clear mind in order to be most effective while under increased stress.

Let me know what are, in your opinion, the essential non-dev skills every developer should have?
BigCommerce API v3 Support in dotConnect and SSIS Data Flow Components
Tags: api, dotconnect, bigcommerce
Published: 2019-09-19 15:39:17

---
title: BigCommerce API v3 Support in dotConnect and SSIS Data Flow Components
published: true
description: Devart released the new versions of ADO.NET Provider for BigCommerce and SSIS Data Flow Components for BigCommerce which now support BigCommerce API v3.
tags: API, dotConnect, BigCommerce
---
*Devart released the new versions of ADO.NET Provider for BigCommerce and SSIS Data Flow Components for BigCommerce which now support BigCommerce API v3.*

Devart, a recognized vendor of professional database management software for developers and DBAs, announced the support of BigCommerce API v3 in its dedicated products: [dotConnect for BigCommerce 1.9](https://www.devart.com/dotconnect/bigcommerce/) and [SSIS Data Flow Components for BigCommerce](https://www.devart.com/ssis/bigcommerce.html).

For better compatibility, Devart products will allow creating and using both BigCommerce API v2 and API v3 connections.

The new BigCommerce API was introduced to simplify product management, reduce the number of API calls used, and improve API performance. However, it is not fully complete and does not cover all BigCommerce features yet. Therefore, in API v3 connections, objects supported in API v3, are accessed via API v3, while other objects are accessed via API v2.

Get more information about the recent release at the [official webpage](https://blog.devart.com/bigcommerce-api-v3-support-in-dotconnect-for-bigcommerce-1-9-and-ssis-data-flow-components-for-bigcommerce.html).

**About Devart**

Devart is one of the leading developers of database tools and administration software, ALM solutions, data providers for various database servers, data integration and backup solutions. The company also implements Web and Mobile development projects.

For additional information about Devart, visit [https://www.devart.com/](https://www.devart.com/)
How NOT to learn JavaScript
Tags: javascript
Published: 2019-09-17 11:16:33

---
title: How NOT to learn JavaScript
published: true
description: Some mistakes I made while learning JS.
tags: JavaScript
series: How to learn JavaScript
canonical_url: https://maciek.cloud/how-not-to-learn-javascript/
---

A few years ago when I was starting my journey as a programmer I asked my friend(an unnamed hero, who is an awesome programmer) a question:

- How can I learn JavaScript?

He answered:

- You don't want to learn JavaScript, you want to learn how to program.

I didn't understand it then. I wanted to learn JS. I wanted to learn React, and Node, and WebGL.

And then I made lots of mistakes trying to. I've hit a roadblock after a roadblock when I was struggling to understand some basic concepts. 

I remember a specific point in time when my Unnamed Friend was trying to teach me about data structures. When we got into hash maps I was so frustrated that I saved the file with the exercise as "some stupid 💩.js"
Why would somebody even need this!!??

I was in the pit of despair...

![pit of despair](https://thepracticaldev.s3.amazonaws.com/i/4j6byh0mxhvzn0j0r1kt.PNG)

I got here by following some advice found on the internet that was not suited for me.
I wouldn't say it was wasted time because all experience is valuable. But I've could use this time more efficiently.

Here is my opinion what NOT to do:

* Don't do [Advent Of Code](https://adventofcode.com/). Instead of learning some good practices you will try to finish the task at all cost. This can produce really ugly code with lots of if statements. 
* Don't read [Eloquent JavaScript](https://eloquentjavascript.net/) Don't get me wrong, this is a good book, IMHO not good for beginners without a CS degree. It tries to teach you JS by solving complex problems with lots of abstractions. 
* Don't read [You Don't Know JS](https://github.com/getify/You-Dont-Know-JS/tree/1st-ed). Again, great books but too complex for start. Get back here in a year or soo.
* Don't learn frameworks. React, Vue, Angular. You need to know what problems these frameworks solve in the first place. 
* Don't jump from tutorial to tutorial without practicing what you learn. You can easily fall into watching an endless stream of YouTube videos. Probably you will not remember most of it the next day.

In the next post, I will present a way that helped me get out of the pit.
I just launched my first real side project!
Tags: sideprojects, showdev, webdev
Published: 2019-09-19 15:27:45

First of all, hi dev.to community!

This is my first post, I've been here a little longer but actually just spent the most of the time lurking.

As I mentioned above I just "finished" my side project called "[deliciously.cooking](https://www.deliciously.cooking)". It's a mix between a traditional recipe site and Tinder.

I know that sometimes finding something that you actually want to cook can be a big struggle if you get a big overview of all recipes. That's why designed & developed this site. You just a random selection of cards and if you see what you like you can get further information about it.

## What's under the hood?
The site runs on Drupal and Vue. The explore page gets the recipes via an API using Vue to fetch and display them. 

Users are able to register and upload own recipes over a simple form. They're also able to save other recipes to their account.

## Is this project done?
No, it's far away from being finished, at least in my opinion! I still have a lot of ideas which I want to add. (Also some bugs to fix)

I also need to promote and get users to the platform. Maybe you have interest in it and have a look?

[deliciously.cooking](https://www.deliciously.cooking)
Reuse Your Talks
Tags: techtalks, career
Published: 2019-09-19 15:19:52

I got this tip from a friend at work last year—she and I both had talk proposals accepted. She said that one thing she wanted to get better at was preparing the talk once and then giving it at multiple places. 

After this conversation, I started to notice that people do this. So, just in case you were like me (and didn't think about reusing a talk), I wanted to pass it on. 

So this year, I got a talk accepted at SwiftFest, which I did a ton of work for and gave in July. Then, I looked up some iOS/Swift meetups in places I'd be and wrote the organizers.  I have given the talk three more times, and I have gotten much more comfortable with it.

Each time, I think the audience got a better version. I had learned what worked, what didn't, and I'm just delivering it more confidently. And, even though there are twitch streams out there of me giving it, I'm sure no one has ever heard of me or seen them.

Now that I'm basically done giving it live, I'll do one as a video and share it here on DEV.
Real-Time and Hands-On Robotic Process Automation
Tags: rpa, roboticprocess
Published: 2019-09-19 15:14:30

In this Robotics Process Automation Training from Activmaxis, aspirants will acquire knowledge to help the organizations to achieve process consistency across the team by automating and managing workflows in an efficient way. This Training helps the audience to gain skills to automate in virtual manner to solve complex IT business problems. It also offers a clear understanding about the RPA industry and benefits, understanding the limits and constraints of automation.

This course is dealt by a distinguished industry expert trainer in RPA, Mr. Akash. Our training’s objectives comprise installation, orientation, structure, control flow, error handling, automation of common apps and processes, and debugging. The sessions also include guidelines on selecting the appropriate processes for automation, as well as strategies for successful RPA implementations. This course actually assists you in all aspects, and the trainer is exceptional, he explains all the topics in pretty basic manner with great deal of examples.

This training will prepare you for the certifications related to RPA and clear the exams easily. We also offer recorded sessions, make you work in projects so that you will be well-equipped with all the necessary skills to work in an RPA related organization. Activmaxis also offers the necessary softwares and real-time scenarios to provide hands-on RPA exercises to candidates.
Also Refer <a href='http://eazyonlinetraining.com/mulesoft.html'>Mulesoft Training</a>
attach a file in Capybara
Tags: rails
Published: 2019-09-19 14:50:18

---
title: attach a file in Capybara
tags: rails
published: true
---

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

## 🤔 Situation
You want to atach a file to the input tag.
```html
<label for='data-file'>Data File</label>
<input type="file" name="files" id="attach_files">
```

## 👍 Usual solution
[Capybara::Node::Actions#attach_file](https://www.rubydoc.info/github/jnicklas/capybara/Capybara/Node/Actions#attach_file-instance_method)

```ruby
attach_file('data-file', 'path/to/file.csv')
```

## 🦄 Workaround solution
```ruby
find('form input[type="file"]').set('path/to/file.csv')
```

📚 [Attach A File With Capybara - Today I Learned](https://til.hashrocket.com/posts/c790268652-attach-a-file-with-capybara)
Book Review: The Gamer's Guide To Coding
Tags: javascript, html, css, gamedev
Published: 2019-09-19 14:43:44

When I first set out learning to code I wanted to do it for a couple of reasons:

1.I was really tired of downloading games for my son that claimed to be free only to find out 3/4 of the content was behind a paywall.

2.Also about two years ago I reinvigorated my love of video games as a way to tell stories. Horror/Thriller games have become my favorite. Those are always my go to movie genres so it figures that a good jump scare game would be my favorite as well.

So I did what anybody does when they’re looking to learn something new and what to my local nerd hub (Barnes and Noble) to scour the technology section. There right in front as if the place knew what I needed was The Gamer’s Guide To Coding by Gordon McComb.


The books takes a very beginners guide approach and starts you off with common HTML elements and what they are used for. Then moves you into basic Javascript. Before the first three chapters are over you learn how to build a random number game. It then moves you into CSS and working with graphics. I like the fact that it waits to teach you how to make things pretty until it teaches you how to make them function. Every time it teaches you something new it provides you with detailed code examples.

The book then progresses through teaching you animation techniques and how to manipulate the DOM. How to write code that thinks and responds to events. Every section builds on the content from the previous section teaching you all the concepts you need to be able to build a 2d Javascript game.

I thoroughly enjoyed reading this book and continue to use it as a reference in new projects. I hope this helps anybody looking to start game coding. I firmly believe it is an excellent place to start if you are new to coding. It is something that gives you instant feedback to let you know whether your code works and at the end you have a fully functional project to show future employers.
Yo dawg, I heard you like functional purity...
Tags: unison
Published: 2019-09-19 14:37:01

---
title: Yo dawg, I heard you like functional purity...
published: true
description: Short musings on the Unison language.
tags: unison
---

#### So we put functional purity in your programming so you can program functionally pure while you program functionally pure programs.

I just took a better look at [Unison](https://www.youtube.com/watch?v=gCWtkvDQ2ZI). It's an interesting functionally pure language that stores supercombinators (the "variables" of functional pure programming) as SHA3-512 hashes of their content. This essentially means that functions cannot change. You might say that any possible function already exists, and functions are merely known or unknown. I'm assuming there are no hash conflicts, but the odds of one happening with 512-bit SHA3 hashes are rather low.

Unison makes the act of programming more-or-less functionally pure (there is no state to change and we don't produce output that might be non-deterministic). Their claim is that this is useful when dealing with renames, serialization, version conflicts in dependencies and concurrency with multiple nodes (non-shared MIMD).

The language has a lot of potential, but I wouldn't be me if I didn't criticize a definite improvement over the status quo. In particular, I see issues arise with side-effects, which will be necessary at some point.

Let's look at dependency version conflicts first. Under functional purity, versions don't matter one bit; just give each tool their own version of a dependency. Hashes-as-identifiers is not really necessary, any way to specify a version would work. On the other hand, if we do have side-effects, different versions of the same dependency might conflict with each other in unexpected ways.

Then there's non-shared MIMD. The proposed system would allow for easy live updates, but there's a catch. The concurrency presented here is one where one nodes passes an expression for evaluation to another node. This is a known possibility under functional purity. It may be useful for number-crunching computation, but data-flow languages and DSLs seem better suited to that problem. In regular business applications, I doubt this form of concurrency is going to yield great results. When we send an expression for evaluation to a different node, we want the expected cost of computation to be higher than the cost of communication, or there would not be any point to it. I don't encounter many such computations, *unless they are statefull*, as with database lookups, but that would make this form of concurrency unsafe. I'd be happy to be proven wrong though.

The improvements in renames and serialization look solid to me, but they don't seem like big issues compared to the cost of switching language.

All in all, Unison definitely looks interesting, but I am not yet convinced it's going to be the "next big thing" in FP land, or that it's going to get imperative programmers to learn FP.
Accepted to Lambda School's iOS Development Course!
Tags: ios, coding, vetswhocode
Published: 2019-09-19 14:36:46

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

Very excited to announce that I was accepted into Lambda School’s iOS Development Course. So excited to be accepted into a top-tier software engineering program!

I chose the start date of October 28th for the Part-Time program and I’m very excited about this new journey. Working 40+ hours a week and participating in the iOS course part-time is going to be challenge - but the sacrifice is worth it!

For anyone who is in Lambda or is an alumni, please, feel free to follow and send encouraging words.

I'll be documenting my journey - stay tuned!

[Follow along on Twitter](https://www.twitter.com/joshuarutkowski)