teleren/devto huggingface dataset:
TIL: How to pass data to child component on a hybrid Angular project
Tags: angular, todayilearned
Published: 2020-10-22 13:25:59

I have been working on a project that is in the process of transitioning from AngularJS to Angular. We are using the hybrid approach of having both versions on the same project and slowly migrating components to the new Angular version. 

#### The Problem
Parent component is an AngularJS component - `messageListingComponent` and the child component is an Angular component - `postMessageComponent` . I need to pass an `id` from the parent to the child component. 

##### AngularJS way of using the binding to pass the data
######message-listing-component.html
```html
<post-message post-id="$ctrl.id"></post-activity>
```
The `postMessageComponent` is an AngularJS component

####Solution
With few google searchs and going through stackoverflow I found a way to do this:

##### Angular way of using the binding to pass the data
######message-listing-component.html
```html
<post-message [post-id]="$ctrl.id"></post-activity>
```
The `postMessageComponent` is an Angular component. Notice the `[]`? Even on an Angular template, we use the `[]` to wrap the input.

My postMessageComponent looks like this:
######post-message.component.html
```typescript
@Component({
	selector: 'post-message',
	templateUrl: './post-message.component.html'	
})
export class PostMessageComponent implements OnInit, OnDestroy {
	@Input() postId: number;

	// Rest of the code
}
```
It takes `postId` as input which is why we have `[post-id]` on the template.

As this is a hybrid project, in order for AngularJS to understand the `postMessageComponent` we need to downgrade our component. I don't want to go into details about downgrading the component but you have to add this line for your AngularJS app module 

```javascript
.directive("postMessage", downgradeComponent({ component: PostMessageComponent, inputs: ['postId'] } ))
```
The key here is to define the inputs that are used on the `PostMessageComponent`. If the component has `Outputs()` then that goes in there too.
 
And that's it. Hope that helps.
Finding Web Components
Tags: webcomponents
Published: 2020-10-22 13:18:43

If you've been following along with this series of baby steps, you have already tried [using a custom element](https://dev.to/nikkimk/using-a-custom-element-2mda). So far you've only used the web components that we have documented at [webcomponents.psu.edu](http://webcomponents.psu.edu).

This post will get you to find other web components.

##Finding Web Component Design Systems
If you're interested in finding a design system, the open-wc keeps a list of [web component libraries](https://open-wc.org/guide/component-libraries.html). 

![open-wc's list of  Web Component Libraries](https://dev-to-uploads.s3.amazonaws.com/i/0mu5xek3bjtclqfwr1jn.png)

1. From open-wc's list of web component libraries, click on the link for Adobe's [Spectrum Web Components](https://opensource.adobe.com/spectrum-web-components/).
2. Use the left menu to find the [card component](https://opensource.adobe.com/spectrum-web-components/components/card). 
3. Check out the documentation and demo for the card (sp-card).
4. Use the left menu to look at the rest of this library.
5. Go back to open-wc's list of web component libraries and explore more.

![sp-card on Adobe's Spectrum Web Components library](https://dev-to-uploads.s3.amazonaws.com/i/mfnmdvqgaoe131251zdo.png)

Browse some the list and try some of the demos.

###Searching by Component
If you're searching for a component to solve a specific problem, try searching [webcomponents.org](https://www.webcomponents.org). 

![paper-slider page on webcomponents.org](https://dev-to-uploads.s3.amazonaws.com/i/7a4bdm43qb16cr2cjhx2.png)

1. From webcomponents.org, use the search to find a slider.
2. From the search results, select [paper-slider](https://www.webcomponents.org/element/@polymer/paper-slider). You will be taken to a page describing the paper-slider element.
3. From the paper-slider page, you can click the [Demo](https://www.webcomponents.org/element/@polymer/paper-slider/demo/demo/index.html) link to see the slider demo and its HTML. 
4. Search for webcomponents.org for other web component UI elements that you might want to use.

Once you've found the web components you want to use, you'll need to make your own "magic script" to dynamically import the Javascript files for your collection. Learn how in my next post.
Managing dependencies with Volta
Tags: node, productivity, webdev, javascript
Published: 2020-10-22 12:52:02

---
title: Managing dependencies with Volta
published: true
description: Why did I stop using NVM to start using Volta?
tags: node, productivity, webdev, javascript
//cover_image: https://direct_url_to_image.jpg
---

In this post I will talk about [Volta](https://volta.sh/) and why I stopped using [NVM](http://nvm.sh/).

# What is Volta?
Volta is a command-line tool that allows you to install and execute any JavaScript tool perfectly. It ensures everyone in the project has the same tools, whit same versions.

To install you just need to run a command:
```bash
# install Volta
curl https://get.volta.sh | bash
```

Then, we can install any tool and use it normally:
```bash
# install Node
volta install node

# start using Node
node
```

You can pin versions in your projects as well:
```bash
volta pin node yarn
```

This command will add the versions in an object in `package.json`.
```json
"volta": {
  "node": "12.19.0",
  "yarn": "1.22.10"
}
```

If you don't have this versions, Volta will download them on the fly for you.

# Why did I stop using NVM?

When I heard about Volta for the first time, I thought: I don't need that, I've already using NVM.

Even so, I decided to take a look at Volta and realised that I was wrong. With NVM I was able to managing versions of Node, with Volta I can do this for any tool.

Furthermore, NVM has some points that bothered me:

* I always needed to change the versions manually. To automate this it was necessary to add some settings to the shell, as well as add a `.nvmrc` file to the project.

* There is a delay to change versions. With Volta this change is really faster and no-additional settings is required, it does it automatically.

# Conclusion

This post was a brief introduction to Volta and some pros that I see compared to NVM, if you saw another pros or cons tell me in the comments.
Completed Hacktoberfest 2020
Tags: hacktoberfest
Published: 2020-10-22 08:17:34

## Introduction

Hi! My name is Aldhan, and I'm Indonesian. During this pandemic, I try to do something new, something that I never do and something that Improved my skill or get a new skill

## My Hacktoberfest Story

Starting on 5th October 2020, I was on GitHub explore page and I saw hacktoberfest card then I clicked the card then it brings me to hacktoberfest's website, I thought this is a contest after I saw the video and read the hacktoberfest's website I realize this is not a contest but this is event, because there is a prize namely a T-shirt so I interested to join this event.

The first repository that I contributed at is [terminalcheatsheet repository](https://github.com/devadvance/terminalcheatsheet), I contributed as Indonesian translation!

The resources that I found, to find repositories that labeled as hacktoberfest is [Good First Issues](https://goodfirstissues.com/). It's cool website to find Github Repository's Issues!

## What I Learned From This Event

I have learned a lot about the version control system. My git skill was improved! I know exactly how to Pull Request, fetch command, pull command, etc. And I learn to not to be shy to communicate with other people. And my English a little bit improved :) .

btw, do you an Indonesian and Joined this event?
Let me know in the comment!

Thank you for reading, and Thanks to Hacktoberfest and Digital Ocean!
Explain product ownership to me like I'm five
Tags: explainlikeimfive, scrum
Published: 2020-10-22 12:41:10

I have only worked in 3 different companies so far, but everyone seems to have a different meaning for what a Product Owner is and what it does.

At my current job, the PO just creates JIRA tasks and asks us (devs) what description to add to each of them. On top of that, he does some basic QA and is paid significantly more than a developer.

While I doubt my company is doing it right, I'd like to hear from someone with more experience what this role actually means and what's supposed to do.
Deployed Variable SmartContract on XinFin Network
Tags: blockchain, xinfin, xdc, smartcontracts
Published: 2020-10-22 12:37:34

Thinking of gas fees while deploying #smartcontracts made me go away from using @solidity_lang and working on live environment. Now due to low gas fee, I have deployed a smartcontract to call variable and will deploy more in coming days. Tx Link: https://explorer.xinfin.network/tx/0xb4dcb5ffec028ea5bc07b72493c3a16908b3fff62b8ed0f1e2be8d203bb2597f
#ETH #XDC #blockchain
New git-version released! 🎉 
Tags: git
Published: 2020-10-22 12:24:20


Git 2.29 is released: [https://github.blog/2020-10-19-git-2-29-released/](https://github.blog/2020-10-19-git-2-29-released/)

One thing that I learned reading through the release was that git has `shortlog` command. It is similar to `git log`, but will group the commits to authors. 

**Example:**


```
$> git shortlog
Aaron Lipman (12):
      t6030: modernize "git bisect run" tests
      rev-list: allow bisect and first-parent flags
      cmd_bisect__helper: defer parsing no-checkout flag
      [...]

Adrian Moennich (1):
      ci: fix inconsistent indentation

Alban Gruin (1):
      t6300: fix issues related to %(contents:size)

[...]
```

**Upgrading git on mac**

[https://ajahne.github.io/blog/tools/2018/06/11/how-to-upgrade-git-mac.html](https://ajahne.github.io/blog/tools/2018/06/11/how-to-upgrade-git-mac.html)
Nix
Tags: devops, nix, nixos, packagemanager
Published: 2020-10-22 08:15:11

---
title: Nix
published: true
description: Nix is a package management language that has a massive ecosystem about solving DevOps problems.
tags: devops, nix, nixos, packagemanager
//cover_image: https://direct_url_to_image.jpg
---

# Nix 

Nix is a package management language that has a massive ecosystem about solving DevOps problems.

Nix, is a functional and domain-specific programming language. Nix also is a package manager for Linux and Unix based systems like aptitude and brew.
<!--more-->
But, not just for a single system. It's an independent package manager. So you can use Nix to manage system packages or your language packages. You can install Nginx with Nix, and you can install `is_array` npm package, or you can install `HTTPBundle` for Symfony, or you can manage your Python packages. Also, you can install different versions of the same package to the same environment. 

There is a ton of usage area of Nix. Also, Nix has a great ecosystem for developers. You can use NixOS if you want to manage your whole system via Nix, and you can use NixOps if you are going to build your applications to a network.

Today I will show you a simple introduction about Nix. I planned a Nixops introduction and "[how you can deploy a real Symfony application via Nixops]()" titled article. I'll share it soon.


As I said, you can manage your system packages with Nix. Just install Nix your Linux or macOS; (You have to root access for install the nix.)

```
curl -L https://nixos.org/nix/install | sh
```

That command installs the `nix-env` tool to your system. You can use nix like `brew` or `apt` with that command. 

You can get an installable packages list with `nix-env -qa` command; also, you can check an [online tool](https://nixos.org/nixos/packages.html) for searching packages.

You can install packages with `nix-env -i hello`  command. `-i` argument for `install`

Check your package installed directory via `which hello` command. It will produce a result like that on Linux: `/home/delirehberi/.nix-profile/bin/hello`

You'll get a `Hello, World!` respond when you run `hello` command. You can also install firefox with `nix-env -i firefox` command.

Nix is a purely functional programming language. So you have only pure functions. And all your functions just gave a single argument. There is an example Nix function; `x: x*2` is a function that gets an integer and returns the product with 2.  I will not give a language lesson. You can read [nix-pills](https://nixos.org/nixos/nix-pills/basics-of-language.html) for it.

You can write your build script with Nix language. Nix repository contains a lot of derivations for a ton of packages. Every time you want to install a package, a derivation will work and build that application in your system with precisely valid dependencies. You will not see dependency related errors. If an application needs the` curl` library, it will install as independently. 

You can read about Nix in the [official](https://nixos.org/) web site. Also, I'll write different Nix and Nixops documents for the PHP ecosystem in this blog.

Keep yourself healthy!
Daily Developer Jokes - Thursday, Oct 22, 2020
Tags: jokes, dailydeveloperjokes
Published: 2020-10-22 12:00:07

---
title: "Daily Developer Jokes - Thursday, Oct 22, 2020"
description: "Check out today's daily developer joke! (a project by Fred Adams at xtrp.io)"
series: "Daily Developer Jokes"
cover_image: "https://private.xtrp.io/projects/DailyDeveloperJokes/thumbnail_generator/?date=Thursday%2C%20Oct%2022%2C%202020"
published: true
tags: #jokes, #dailydeveloperjokes
---

Generated by Daily Developer Jokes, a project by [Fred Adams](https://xtrp.io/) ([@xtrp](https://dev.to/xtrp) on DEV)

___Read about Daily Developer Jokes on [this blog post](https://xtrp.io/blog/2020/01/12/daily-jokes-bot-release/), and check out the [Daily Developer Jokes Website](https://dailydeveloperjokes.github.io/).___
### Today's Joke is...
![Joke Image](https://private.xtrp.io/projects/DailyDeveloperJokes/public_image_server/images/5e12598ab1885.png)

---
*Have a joke idea for a future post? Email ___[xtrp@xtrp.io](mailto:xtrp@xtrp.io)___ with your suggestions!*

*This joke comes from [Dad-Jokes GitHub Repo by Wes Bos](https://github.com/wesbos/dad-jokes) (thank you!), whose owner has given me permission to use this joke with credit.*

<!-- 
Joke text:
___Q:___ How do you stop a web developer stealing your stuff?

___A:___ Write 403 on it.
 -->
S1E14: How to bridge ecosystems, partnerships and technology
Published: 2020-11-18 00:39:40

---
title: S1E14: How to bridge ecosystems, partnerships and technology
published: true
date: 2020-10-22 12:00:00 UTC
tags: 
canonical_url: https://anchor.fm/xrseapod/episodes/S1E14-How-to-bridge-ecosystems--partnerships-and-technology-elc09m
---

There are so many opportunities in #XR, it can be daunting. How do you bridge the ecosystem, partnerships and technologies? [Amy Peck](https://www.linkedin.com/in/amympeck/), CEO of [EndeavorVR](http://www.endeavorvr.com/) tells us how. Amy has held various leadership roles in XR and continues to be a global ambassador, bridging the how and why of XR around the world. Join Kirby, Vinay and Nirav as they dig in to uncover Amy's secret to success. Listen and Subscribe!

--- Send in a voice message: https://anchor.fm/xrseapod/message
Completing "Hacktoberfest 2020"
Tags: hacktoberfest
Published: 2020-10-22 11:33:05

## What I Learned From Hacktoberfest

<!-- What did you learn that can help others contribute to the project you worked on? What did you learn that can help the users of that project?! -->
I have worked on several algorithms and solved some problems using java, python,c++ and this was my first open-source contribution in my life. I did not know first how to start but the community arranged a lot of seminars every day and I learned from them and started off from one of the seminars. I completed almost 15 pull requests and 12 of them were accepted. The journey was really a big push to my open-source career. That was my experience. Eager to hear from you too

## Got some goodies

![152938165_183896949841270_955703023331764814_n](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/68nnew5kzwe5xwx8stwa.jpg)
Intro to Machine Learning - The Titanic Dataset
Tags: machinelearning, datascience, twitch, python
Published: 2020-10-22 11:35:58

[https://cinnamon.video/watch?v=428675699415450900](A 1080p version of this video is available on Cinnamon)

This is a live coding session on Twitch in which we will be doing a basic intro to machine learning using the Titanic Dataset

In this session you will learn:

- Some basic concepts of machine learning
- How to use scikit-learn to predict outcomes
- How to pre-process data

This is a video taken from my weekly show "ML for Everyone" that broadcasts live on Twitch every [Tuesday at 2pm UK time](https://www.twitch.tv/ibmdeveloper/schedule).
Best Features to add In Weather Apps Development In 2020 
Tags: mobileappsdevelopment, mobileapps
Published: 2020-10-22 11:31:23

How important is weather forecasting for you? Well, it might vary from person to person but it’s specifically important for those who travel regularly. Most of our decisions in daily life are based upon weather forecasting like choosing our outfit, attending open-air events, ticket-bookings, and so on.

Moreover, the importance of weather forecasting in the agricultural sector can not be ignored. There are certain apps that are specifically designed for agriculturists to make advanced decisions regarding the cultivation and harvesting of their crops. 
https://sites.google.com/view/weather-app-development/home
What's your experience on monetizing DEV posts?
Tags: meta, webmonetization, writing
Published: 2020-10-22 11:29:44

---
title: What's your experience on monetizing DEV posts?
published: true
description: 
tags: meta, webmonetization, writing
cover_image: https://www.blogforweb.com/wp-content/uploads/2013/06/website-monetization-1.png
---
If you are an avid writer, monetizing your posts is awesome. You get paid for your passion. Some time ago DEV decided to support their content creators by implementing this great feature, too.

{% link https://dev.to/devteam/dev-is-now-web-monetized-21db %}

It's been like 4 months since the announcement, so I thought it would be nice to hear your experiences.

Have you set up the feature on DEV?
Or maybe you have some experience on monetizing your posts on different platforms?
Experience of 1st Hacktoberfest
Tags: hacktoberfest
Published: 2020-10-22 11:15:50

I'm Tulika Panjal, a student of B.Tech (Bachelor of Technology) in Computer Science and Engineering. I knew about this Hacktoberfest on the month of December of the last year from a senior student of my college in a coding contest. He wore the Hacktoberfest 2019 Tee Shirt. I knew about the Hacktoberfest from him and then I got such encourage about coding and wanted to participate the Hacktoberfest 2020 eagerly but I never thought that I also can get this Tee Shirt for own. It is my 1st time to participate in Hacktoberfest and in that particular time the rules has changed from 7 days to 14 days. Then I loose some hope that this year is not for me because something happened different. So I did more PRs to increase the chances to own the Swags. And atlast I got it. Thanks all for this. It gives me lot of encouragement and self-confidence about coding amd I think I can help such people by open source contribution in this Hacktoberfest. I made 8 pull requests and 7 accepted. I'm proper beginner in this open source contribution and all. I never think that I also can finish it successfully. I'm very thankful to Hacktoberfest for this experience and to them also whose repos are edited by me. 
#hacktoberfest
@DigitalOcean.
First experience
Tags: hacktoberfest, java
Published: 2020-10-22 11:10:08

## What I Learned From Hacktoberfest

Well, it was my first experience in Hacktoberfest. Quite fun to track down your PRs. I was working on Java/Spring pet-project that included CRUD-application with MVC design pattern. Also you can checkout my profile on github @dubrovai
Where do you write your DEV drafts?
Tags: meta, productivity, writing, beginners
Published: 2020-10-22 11:09:01

---
title: Where do you write your DEV drafts?
published: true
description: 
tags: meta, productivity, writing, beginners
cover_image: https://cdn.architecturelab.net/wp-content/uploads/2019/12/Best-Mechanical-Pencils-For-Writing-3-525x350.jpg
---
Delivering quality articles might take days or even weeks of work, meaning you gonna deal with lots of work in your Drafts.

Where do you write your DEV drafts?

1. Do you save them directly here on DEV dashboard?
2. Do you prefer to use cloud based apps like [Notion](https://www.notion.so/) and [Evernote](https://evernote.com/) for better access and organization?
3. Maybe you use some standalone apps, for example, markdown editors like [Typora](https://typora.io/) or [Caret](https://caret.io/) and the organize your drafts locally?
4. Do you prefer to write markdown directly in your [VS Code](https://code.visualstudio.com/) and then use the power of [Git extensions](https://marketplace.visualstudio.com/search?term=git&target=VSCode&category=All%20categories&sortBy=Relevance) to push them to [Github](https://github.com/)? 
5. Or maybe you are type of person who likes to keep pen and notebook around you all day, so you can take sketches with no limits?
Hactoberfest 2020
Tags: hacktoberfest
Published: 2020-10-22 10:51:24

Never won anything on the Internet except Lenskart credits. Had never participated in any Open source program, but decided to give it a shot. Completed the Hacktoberfest challenge 2020 officially. Hacktoberfest is really a great headstart to your Open-source journey. 

Keep contributing. Peace!!!