teleren/devto huggingface dataset:
Registering Global Components with Vue 3
Tags: vue, vue3, components
Published: 2020-04-22 13:49:42

---
title: Registering Global Components with Vue 3
published: true
description: Vue 3 changes the way we work with customizing our Vue instances, so we need to make some changes to how we globally register components.
tags: vue, vue 3, components
---

Vue 3 is now in beta [(learn more)](https://vueschool.io/articles/news/vue-3-beta-is-released/) so I decided to test it out (using [vue-next](https://github.com/vuejs/vue-next)), and one of the things I had to tweak in my current application is how I was registering my "global" components.

I'll talk about _why_ these changes are necessary below, but if you're just here for the meat of the post, the examples really speak for themselves so here are the actual code changes:

### Before
```js
import Vue from 'vue'
import Header from './components/Button.vue'
import App from './App.vue'

// Register Button component globally
Vue.component('Button', Button)

// Create and mount Vue instance
new Vue({
  render: h => h(App)
}).$mount('#app')
```

### After
```js
import { createApp } from 'vue'
import Header from './components/Button.vue'
import App from './App.vue'

// Create Vue instance
const app = createApp(App)

// Register Button component globally
app.component('Button', Button)

// Mount Vue instance
app.mount('#app')
```


### Why are these changes necessary?

Hey, you ask great questions!! Vue 3 changed the way "instances" of Vue work so that they could make the Vue prototype immutable. So now you customize an "instance" of Vue (created with `createApp`) instead of directly changing the Vue prototype. I'm not sure exactly why this change was made, but that's how things work in Vue 3.

This also means if you're running an app that has _multiple_ Vue instances that share configuration, you'll now need to either 1) duplicate some code or 2) create your own abstraction to share configuration. I'll write more about this soon!


### Wrapping up

If you have any questions about this, or any Vue 3 changes, drop me a comment or find me on Twitter @jakedohm. I plan on writing more about Vue 3, so let me know what you'd like me to cover!
April 22 — Daily CodeNewbie Check-in Thread
Tags: codenewbie, checkin, beginners, discuss
Published: 2020-04-22 13:48:07

---
title: April 22 — Daily CodeNewbie Check-in Thread
published: true
description: A daily thread to ask questions, share progress, and stay accountable!
tags: codenewbie, checkin, beginners, discuss
series: Daily Checkin
---

You are encouraged to use this daily thread to:
- Ask for help (all questions encouraged)
- Explore topics you’re curious about
- Share something you’ve written or read
- Celebrate your wins
- Stay accountable to your goals
- Support your fellow programmers

Happy Coding!

---

_Interested in joining the twice-weekly live [#CodeNewbie Twitter chats](https://twitter.com/search?q=codenewbie)?  You can find us [on Twitter](https://twitter.com/search?q=codenewbie) each Wednesday at 9pm ET (1am GMT on Thursday) and Sunday at 2pm ET (6pm GMT)!_
My first approch with Django Framework
Tags: django, python
Published: 2020-04-22 12:43:39

# Django framework
Hi all,
in this hard period for the whole world, since I'm working from home I also have more time for myself, since I don't spend time for working travel to go in office and during the weekend I have a lot of time, the must now is to stay at home for all day every day, and I agree on this. How to invest better my time? I decided to start a Udemy course I bought some months ago. I said now it is the good moment to start that course: development of web application using Django Framework.
It is fantastic. The Django Framework allows you to quickly develop a web application, it has a lot of ready-to-use features and with few code lines you can go online.
It is extensible: there are a lot package already achieving a lot of functionalities.
It already include the CRUD of the models, the group and user permissions, an administration panel, it is easy to design templates, it has a well structured of the project.
I'm enthusiastic about finding this framework.

Have you had real experiences on using this framework?
Have you discovered Django's limitations and advantages?

Bye, have a nice day
Passing information from form to different components
Published: 2020-04-22 13:47:52

Hi,i am building an e-commerce site (comic shop) and I need to pass information of a form to various components depending on the information submitted. Currently I am able to send the information to one component (back issues), however, I need to be able to have a working option on the form that allows the user to select other areas (trades, new comics) on the site that the information can go too. 

My production action for this this far is:

export function getProductsToShop(skip, limit, filters  = []){
    const data ={limit, skip, filters}
    const request = axios.post(`${PRODUCT_SERVER}/Shop/back_issues`, data)
        .then(response => {
                return {
                size: response.data.size,
                articles: response.data.articles
            }
        });

    return {
        type: GET_PRODUCTS_TO_SHOP,
        payload: request
    }

}

Any help would be really appreciated.
Magento Optimization Tips & Fixes
Published: 2020-04-22 13:45:50

Magento is a resource-heavy ecommerce platform that requires the right set of resources and configurations for optimum performance. Even if you have a sound infrastructure, there is a chance that your Magento powered store might be slow.
Click to read about the <a href="https://www.cloudways.com/blog/magento-optimization/">best Magento 2 speed optimization tips</a> for improving the performance of your Magento store.
Apache Airflow Installation - mysql+celery
Tags: python, apacheairflow, dataengineering
Published: 2020-04-22 13:36:08

pre requisites: python 3.7 or greater

**Execute the below ones one after another**

pip install apache-airflow==1.10.6
pip install 'apache-airflow[celery]'
pip install 'apache-airflow[mysql]'
brew install rabbitmq

**start the rabbitmq-server in the background**
rabbitmq-server -detached

**make the mysql config changes**
sudo chown -R _mysql:mysql /usr/local/var/mysql

**start the mysql server**
sudo mysql.server start

**mysql setup**

mysql -uroot

__set the password for the root user with the below__

mysql>ALTER USER 'root'@'localhost' IDENTIFIED BY 'new password';

__create the DB, the user and grant the required privileges__

mysql>CREATE DATABASE airflow CHARACTER SET utf8 COLLATE utf8_unicode_ci;
mysql>create user ‘airflow’@’localhost’ identified by ‘airflow’;
mysql>grant all privileges on * . * to 'airflow'@'localhost';
mysql>flush privileges;
mysql>quit

**airflow initialization**

airflow initdb

**airflow config file update**

Update the airflow.cfg file (should be available in `~/airflow/` directory.

__sql connection as:__
sql_alchemy_conn = mysql://root:airflow@localhost/airflow
there should be a sql alchemy connection string and you can comment it and add the above

__executor as:__
CeleryExecutor

Save the file and exit.

**run the below on their separate windows**

airflow webserver
airflow scheduler
airflow worker

airflow webserver window will show you the url for airflow UI. 

note: airflow initialization (airflow initdb) should load the example dags. You can turn them off in your airflow.cfg file, if you don't want to. command: load_examples = False
Upvote Reactive Resume on Product Hunt!
Tags: help
Published: 2020-04-22 13:30:20

I've never wanted anything more than to be on the front page of Product Hunt. I'd really love it if I could make that dream a reality, and I did whatever I could to make a good product, but I don't have the rockstar fan following to make it happen.

If you have an account on Product Hunt, please help by upvoting, it would just take a second but it would mean a whole lot to me :)

https://www.producthunt.com/posts/reactive-resume
Exploring inches of react.
Tags: react, webdev, codenewbie, programming
Published: 2020-04-22 13:30:18

I'm an intermediate React developer and have knowledge about how components,state works in react. Now i want to explore more, get new issue and practically implement the things. Can u guys suggest me something after working on which i can come across many new concepts and things and where it will be fun.

#react #developer #feedbackAppreciated #advise #Frontend #mentor
Welcome Thread - v70
Tags: welcome
Published: 2020-04-22 13:22:57

---
title: Welcome Thread - v70
published: true
description: Welcome to DEV! A thread of hellos and intros.
tags: welcome
---

![hello world computer](https://media.giphy.com/media/fedryX7dMGMe6lgqDm/giphy.gif)

### Welcome to DEV!

1. Leave a comment below to introduce yourself! You can talk about what brought you here, what you're learning, or just a fun fact about yourself.

2. Reply to someone's comment, either with a question or just a hello. 👋 

**Great to have you in the community!**
Tutorial: Schedule SQL Queries on your Database
Tags: tutorial, sql, beginners
Published: 2020-04-22 13:10:45

*We're building a rapid development platform for developers called WayScript. Thank you to all of the community members who have tried it out. Today's tutorial can also be viewed as a video [here] (https://youtu.be/V83pDqulQSE). Of course, you can also find this completed script [here](https://wayscript.com/user/derricks/Hw_3bkmr) as everything you build can be shared publicly or privately.*

##Introduction
Automation makes our lives easier. Here at WayScript, we want to provide tools to developers that take away the pain points to implement this automation. Database work can be tricky, let's see how we can automate daily SQL queries on our database using WayScript.

##Prerequisites
No prerequisites but some content you might find helpful:
[Working with databases](https://docs.wayscript.com/library/modules/sql)
[Working with CRON](https://docs.wayscript.com/library/triggers/time-trigger)

##Activating a Script Routinely
To activate any script on WayScript at set intervals, on certain days, or at certain time, we offer the use of the time trigger:

![Time Trigger](https://cdn.wayscript.com/blog_img/74/1.png)

We're able to do anything fancy that you might want to using full CRON syntax to denote when we want to activate our script.

For the purposes of simplicity, let's make our's run everyday at 7AM.

![Run everyday](https://cdn.wayscript.com/blog_img/74/2.png)

Once we have this, anything contained in this tree will be executed, everyday, at 7AM.

##Connecting our Database
To connect our database, we'll need to drag it into our workflow below our time trigger.

![connect to db](https://cdn.wayscript.com/blog_img/74/3.png)

Once here, we'll need to provide some information for WayScript to be able to read/write your database. If you need help with setting up your database, our documentation has a full video and text walkthrough. As with anything else, if you get stuck feel free to reach out to us on our discord as well.

##Executing your Database Action
Now that we have the database in the workflow, we're able to write SQL statements and execute those against our tables just like how we would locally. Click edit code to the left:

![edit code](https://cdn.wayscript.com/blog_img/74/4.png)

This will give us access to the text editor, in which we can write our own custom code. Let's just put something simple in:
<pre>
SELECT * FROM table_name
</pre>
This will give us access to all of the information in our table. We can then use this data throughout our script to trigger other actions. Such as sending emails with this data, alerting us if a value exists, and plenty more.

##Questions, Concerns?
If there's any questions feel free to comment below or message us on discord after you sign up. We're happy to help! If you want to see this full script template, you can find it [here](https://wayscript.com/user/derricks/Hw_3bkmr).
INDEX(PYTHON3)
Tags: python, codenewbie, productivity
Published: 2020-04-22 13:09:25

I am working on an archive of things I am learning on the way and a quick and simple resource, This is not my first time learning to code but it was short lived, why? Because I was intimidated by all of the information. 


index() is an inbuilt function in Python, which searches for given element from start of the list and returns the lowest index where the element appears. Parameters : element - The element whose lowest index will be returned. start (Optional) - The position from where the search begins.  

#---------------------------------------------------->
letters = ['A','B','C','D','E']
print(letters.index('C'))
print(letters.index('A'))
print(letters.index('E'))
print(letters.index('D'))

2
0
4
3




geeksforgeeks.org
SOLOLEARN
FRANCNSTEIN © 2020 | Created 𝗐𝗂𝗍𝗁 ❤
Create a Phone Number
Tags: javascript, codenewbie, beginners
Published: 2020-04-22 13:03:18

With the intense pacing and curriculum of bootcamp over, it's time to tackle daily coding challenges to stay fresh.

[Codewars](https://www.codewars.com/) it is!

The first challenge:

```
Write a function that accepts an array of 10 integers (between 0 and 9),
that returns a string of those numbers in the form of a phone number.

Example:

createPhoneNumber([1, 2, 3, 4, 5, 6, 7, 8, 9, 0]) // => returns "(123) 456-7890"
```

My deer-in-headlights expression (I haven't `join`ed and `slice`d in a few weeks) faded as soon as I started pseudo coding and breaking this up into small pieces.

First. This is an array of numbers, all separated by commas, and it needs to look like a phone number. Which means, we need to `slice` as a way of selecting and then grouping certain numbers together.

Big thanks to [w3schools](https://www.w3schools.com/jsref/jsref_slice_array.asp) for refreshing my memory!

The `slice()` method returns the selected elements in an array, as a new array object.

It selects the elements starting at the given start argument, and ends at, but does not include, the given end argument. Syntax looking like so:

`array.slice(start, end)`

In this case:

`numbers.slice(0, 3)` 
`numbers.slice(3, 6)`
`numbers.slice(6)` 

To accompany `slice()`, `join()` method returns the array as a string - which we need in order to return the phone number as a string.

Because our array of numbers is separated by a specified separator (fancy speak for a comma), we need to `join` the numbers into the beginnings of a phone number.

This also means we need to use `.slice` AND `.join` methods to take out the values we need from the array, between the specified indexes, and group them together:

`numbers.slice(0, 3).join('')`
`numbers.slice(3, 6).join('')`
`numbers.slice(6).join('')`

Three more things.

We can use [string template literals](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals) to clean up our code. But we'll also need to add parentheses around the first `slice`/`join` statement, and a dash before the final four numbers:

````
function createPhoneNumber(numbers) {
    return `(${numbers.slice(0, 3).join('')}) ${numbers.slice(3, 6).join('')}-${numbers.slice(6).join('')}`;
}
```

And this will return our (xxx) xxx-xxxx phone number!

After reading through the alternate solutions from other Codewar users, I was astounded at the variety that exists. Code can be so versatile (lovely!) but this can make being a newbie intimidating (feelin' that!). 

Always learning and looking forward to the next challenge. 

In case you made it all the way here and you have your own solution, I'd love to see it!
What is YOUR MVP
Tags: datascience, python, discuss
Published: 2020-04-22 12:57:56

---
title: What is YOUR MVP
tags: datascience, python, discuss
cover_image: https://res.cloudinary.com/practicaldev/image/fetch/s--S-DhAhjE--/c_imagga_scale,f_auto,fl_progressive,h_420,q_auto,w_1000/https://dev-to-uploads.s3.amazonaws.com/i/i3jadf4zkaq46rysaul9.png
series: career questions for data folks
---

# **M**inimum **V**iable **P**roduct

What does an **mvp** look like for you.  

Is it a csv file?

Does it need a Model? 

Does it have a dashboard? 

Some screenshots thrown into powerpoint?

Is it a full blown application?
Scrum Of Scrums
Published: 2020-04-22 12:36:18

 
     




Have you heard of the notion Scrum of Scrums? I bet you have if you work in a large organization. If not - it's time to consider this agile methodology which can be used even in large companies. 
     The thing is, a Scrum team should have 5-9 members on average to be a success. One might think that this Scrum team method can only be used by small startups. But it's not true. Even a large organization can have Scrum teams on board.
Read all you need to know about Scrum of Scrums and eve about Scrum of Scrum of Scrums, however strange it sounds. https://www.erudicat.com/pmp-blog/scrum-of-scrums-sos
FAQs on Data Lineage
Tags: database, datagovernance, lineage
Published: 2020-04-22 12:35:16

## What is meant by data lineage ?

In Biology, lineage is a sequence of species each of which is considered to have evolved from its predecessor.

Similarly, Data Lineage is a sequence of transformations through intermediary systems to a final data set. Each data set
is considered to have been created from its predecessor through a specific transformation. A transformation maybe a
SQL query or a program in a language such as Python or Scala. Data Lineage can be at any granular level - schema, table
or column.

## Why is data lineage important ?

Data Lineage is important because it enables important data governance functions such as:
- Business Rules Verification
- Change Impact Analysis
- Data Quality Verification

## What is a data lineage tool ?

A Data Lineage Tool captures metadata of all data transformations, organizes the metadata in a graph and provides access
 to the graph through visual interfaces and programmable APIs.

In general data lineage tools use two techniques:
- Push: ETL platforms push metadata to a data lineage tool during transformations.
- Pull: Data Lineage tools scan logs and query history from databases and data lakes and generate lineage after the event.

Some data lineage tools use both techniques.

## Are there open source data catalog tools ?

1. [Amundsen by Lyft](https://eng.lyft.com/amundsen-lyfts-data-discovery-metadata-engine-62d27254fbb9)
2. [Metacat by Netflix](https://netflixtechblog.com/metacat-making-big-data-discoverable-and-meaningful-at-netflix-56fb36a53520)
3. [Data Lineage](https://tokern.io/data-lineage/) by Tokern.

## How do you build data lineage solution for databases ?

* Choose one of the open source data catalog projects such as [Amundsen](https://eng.lyft.com/amundsen-lyfts-data-discovery-metadata-engine-62d27254fbb9), [Apache Atlas] (https://atlas.apache.org/) or [Data Lineage](https://tokern.io/data-lineage/).
* Follow installation instructions of the project. Some require a Hadoop cluster.
* Integrate ETL tools, databases and data engines with the data lineage tool.
* Integrate ETL tools, databases and data engines with the data lineage tool.
Build a Flush Message Middleware with Node.js from Scratch
Tags: javascript, node
Published: 2020-04-28 15:25:54

---
title: Build a Flush Message Middleware with Node.js from Scratch
published: true
date: 2020-04-22 12:20:02 UTC
tags: #javascript,#node
canonical_url: 
---

Learn how to build a flush messages middleware system with node.js and express.js from scratch

![](https://miro.medium.com/max/1400/0*U-cesLrLj4Rbc30o)<figcaption>Photo by <a href="https://miro.medium.com/max/1400/0*U-cesLrLj4Rbc30o">Photo by Octavian Rosca</a> on <a href="https://miro.medium.com/max/1400/0*U-cesLrLj4Rbc30o">Unsplash</a></figcaption>

### 1.Introduction

In this story, we’ll learn how to build a flush message middleware from scratch with node.js and express.js.

But what is flush messages?

> Flush messages are small messages with information that inform the user-client about various cases, such as unsuccessful login, invalid input on a form field etc …

[Continue reading on JavaScript in Plain English »](https://medium.com/javascript-in-plain-english/build-a-flush-message-middleware-with-node-js-from-scratch-843f6e9823ba)
Covid-19 India Dashboard
Tags: javascript, d3
Published: 2020-04-22 12:19:21

---
title: Covid-19 India Dashboard
published: true
description: D3js Charts on India data
tags: javascript, d3
---

I have created some D3 charts on Covid-19 data and updating them regularly. See them here [https://alephthoughts.com/covid-19/](https://alephthoughts.com/covid-19/)
![](https://dev-to-uploads.s3.amazonaws.com/i/qo67cmuqpyun39r4ooom.png)
How Are You Staying Healthy During Lockdown?
Tags: watercooler, discuss
Published: 2020-04-22 12:07:47

How is everyone handling staying healthy and happy during your lockdown? any tips/tricks? What's working for you and what's not?

It's made me take running up again, and I'm starting to actually enjoy it! After work, if I've not been on a run, I've been going on a pretty big walk - try and make up for sitting in all day.

Been really conscious of what I'm eating too and keeping a good record of my weight too (I actually have a dataset which is kinda weird) since I'm generally being less active

How's everyone else coping?
3D Icon Carousel Menu But #StayHome
Tags: codepen, vue, css, showdev
Published: 2020-04-22 12:02:58

<p>3D Icon carousel menu.</p>

<p>3D Icons and animation made entirely by CSS</p>

<p>The action to move from link to other link, was made by VueJS</p>

<p>When you swipe on the icons, you can go to other menu. But because we should stay home, all of the links are just at Home.</p>

<p>I added events for touch and mouse, so, I think it would work both mobile and PC browsers.</p>

{% codepen https://codepen.io/takaneichinose/pen/PoPqOzp %}
Managing your self-learning
Tags: productivity, learning, tips, devnotes
Published: 2020-04-22 10:25:18

It feels like there is endless content for a developer to learn. It can sometimes feel a bit overwhelming. 

I find it is important to have some sort of system in place to help manage and reduce the cognitive overload of remembering what you want to learn. 

I personally like to use Notion and the board feature. Its very similar to Trello.

![Notion Board with lots of tasks](https://dev-to-uploads.s3.amazonaws.com/i/n457o47v0s7ytarjq975.PNG)

It's great way to see the big picture of everything you're doing and track your progress. Also its nice to look back on it at the end of the year and see all the things you have completed.

I'd like to share some things I have learnt which have helped make using this board  more effective for myself to keep on track of my goals.

# 1) Prioritise
It's so easy to be seduced by the next new shiny framework and you know what, that's ok! I put it on the list and make sure I prioritise it. For example, want to learn React? Well you best make sure you have your JavaScript fundamentals in place first! Make sure your "learn JS fundmentals" card is above your "Learn React" card. 

# 2) Break down the task

I've got some quite broad tasks on my board such as "Learn TypeScript Fundamentals". To help stay focused on completing the card. I've broken down what the fundamentals are so I can clearly see what I need to cover.

![Notion task opened](https://dev-to-uploads.s3.amazonaws.com/i/35l20qcbiyw09pqjzfph.PNG)

# 3) Be specific

This leads me on to my next point. Be specific with that you want to learn. I find I struggle if my card is too broad. For example if I had a card like "Learn CSS", there is just too much to cover. Try to hone in on something specific like "Learn the basics of CSS animation".  Then follow step 2 and break it down further.

My system is not perfect and I'm trying to always evolve it. I'm curious how others manage their self learning. Do you do something similar?