teleren/devto huggingface dataset:
OverVue v2, a prototyping tool for the Vue-lover or Vue-curious
Tags: webdev, vue, javascript, showdev
Published: 2020-06-18 13:12:38

![OverVue Logo](https://dev-to-uploads.s3.amazonaws.com/i/wqgimt9rnmm7xfzpdeyj.png)

Are you…
+ an established developer thinking about crafting another Vue-based app? 
+ experienced in React or Angular and want to see what Vue is all about? 
+ a new developer, ready to create your first Vue app, but don’t know where to start?

<space>
Cue… **OverVue**! 
<space>
OverVue is a desktop application that aims to help developers quickly begin building their Vue web applications. It made an impressive appearance during its initial release, with its sleek UI and user-friendly navigation, and our team is thrilled to announce some major updates!

If you haven’t used OverVue, continue on for a high-level look at its capabilities. If you’re already familiar with OverVue, you’ll be excited to see we’ve added a number of neat new features that will make designing your application an even more seamless experience.

#### Core Features:
+ Prototype your application according to the design specs
*\*NEW FEATURE\** Create a different layout for each route
![Create a new mockup image for each route](https://dev-to-uploads.s3.amazonaws.com/i/sbi46rami3o487a8gs9k.gif)


+ Architect your application by creating routes, components, and HTML elements right over your design
*\*NEW FEATURE\** Now allows nested HTML elements and components
![Create Routes, Components, and HTML elements](https://dev-to-uploads.s3.amazonaws.com/i/t69nsem94bfp2k2lsjx2.gif)


+ Specify parent-child hierarchy, accompanied by real-time visual changes on the project tree
![Specify hierarchy and view live changes](https://dev-to-uploads.s3.amazonaws.com/i/vlw7ebwuz6q5txcr1lho.gif)


+ As you create components and add HTML elements with the left-hand side buttons, live code snippets are generated
![Live code snippets](https://dev-to-uploads.s3.amazonaws.com/i/ott71t8em1xhh4au2xsv.gif)

+ Save your current work in a JSON file and revisit prototyping in OverVue another day

+ ...Or export your project and get started on building out the rest of your application!

#### Additional new features:
+ Travel back and forward in time with the undo/redo feature. Use CTRL+Z/CTRL+Y or toggle buttons on the header to make these changes. 
+ Now fully compatible with Windows!

<center>...</center>

For a more thorough tutorial and additional descriptions of the changes with version 2.0, check out the [OverVue GitHub repository](https://github.com/open-source-labs/OverVue).

**You can also download the Mac/Windows program and access the app playground on [OverVue.io](OverVue.io).**

This is an open source application and we welcome all testers and contributors. Let us know what you think down below or on our GitHub.

*Many thanks to the team Dean Chung, Dean Ohashi, Drew Nguyen, Joseph Eisele, Alexander Havas, Keriann Lin, Allison Pratt, and Joju Olaode for making this tool the most vuetiful thus far!*
Daily Developer Jokes - Thursday, Jun 18, 2020
Tags: jokes, dailydeveloperjokes
Published: 2020-06-18 13:10:43

---
title: "Daily Developer Jokes - Thursday, Jun 18, 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%20Jun%2018%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/5e1258f50f7c0.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:___ Why did the developer go broke?

___A:___ Because they used up all their cache
 -->
Como agregar un corazón verde 💚 al prompt de tu Terminal
Published: 2020-06-18 13:07:30

---
title: Como agregar un corazón verde 💚 al prompt de tu Terminal
published: true
description: 
tags: 
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/ia6cfluclprnoenkwm9f.png
---

En este pequeño artículo les quiero mostrar como customizar el prompt de su terminal para que muestre un corazón verde 💚.

Primero dependiendo del sistema en que trabajemos (Mac, Ubuntu, etc.), vamos a tener que editar ya sea el archivo `.bashrc`, o `.bashprofile`.

Allí vamos a editar la variable `PS1` que es la que controla como luce el prompt. Como puede haber varias de ellas, vamos a identificar cuál es la que afecta nuestro setup.

![.bashrc PS1](https://dev-to-uploads.s3.amazonaws.com/i/i88vp9g99xj1um5ekt7g.png)

Para ello en la terminal, podemos ejecutar el siguiente comando `echo $PS1` que nos va a mostrar el contenido de la variable:

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/qdky51ug1uuydzhw72rt.png)

Luego vamos al archivo de configuración y allí modificamos nuestra vairable `PS1`, agregando el corazón verde 💚 donde más nos guste:

![.bashrc corazón verde PS1](https://dev-to-uploads.s3.amazonaws.com/i/l1j7vkif8diaod5il0gp.png)

Y luego si abrimos una nueva terminal va a lucir de este modo:

![Será Ley](https://dev-to-uploads.s3.amazonaws.com/i/712iwloyor79mf8qdu4x.png)
Road to Genius: smart #21
Tags: javascript, beginners, computerscience
Published: 2020-06-18 12:59:24

Each day I solve several coding challenges and puzzles from Codr's ranked mode. The goal is to reach genius rank, along the way I explain how I solve them. You do not need any programming background to get started, and you will learn a ton of new and interesting things as you go.

![coding challenge](https://dev-to-uploads.s3.amazonaws.com/i/bx8vi77z79vlfkf9f16y.png)

Here's an interesting challenge, this time it's related to geometry, but don't be scared. We only need to fix two bugs 💎 and 💰. The code starts off with a function `calculateCentroid` that takes four parameters. Both bugs appear on the same line:
`nc[i] = (s1 * c1[💰] + 💎 * c2[i]) / ns;`
As you may know, symmetry is a very important characteristic in mathematics, a lot of formulas, especially in geometry have symmetric properties. If you analyze this buggy line of code, you start noticing a pattern (or symmetry), and the variable names are a good hint. The buggy line is most likely going to be:
`nc[i] = (s1 * c1[i] + s2 * c2[i]) / ns;`

![coding challenge answer](https://dev-to-uploads.s3.amazonaws.com/i/upecbt1bz501shajbwgu.png)

---

Join me on the Road to Genius and upgrade your programming skills, at https://nevolin.be/codr/
Twilio Push Notification
Tags: ios, twiliohackathon, android, javascript
Published: 2020-06-18 12:34:46

Twilio is used for chat,sms,voice calling,video,notifications & fax.
Here, we are talking about Push notification.
Let’s Start

Apple push credentials configured with Twilio Notifications which you can then use to receive notifications in your iOS app.

Steps to be followed for Push Notification:-

    Setup an App ID
    Create a Certificate
    Create a Credential SID for Twilio

STEP : — 1 Setup an App ID

    Login to your apple development account.
    Click on App IDs under identifiers sections.
    Two Options : Existing App ID & New App ID

OPTION : — 1 Existing App ID

    Click on your App IS.
    Click on the edit button of app services popup.
    Check the “Push Notification” option.
    Click on done button.

OPTION : — 2 New App ID

    Click on “+” symbol to add a new App ID.
    Give your app description.
    Give it an App ID that matches to bundle identifier.
    Check “Push Notification” option.
    Click Continue.
    Click submit to create App ID.

STEP : — 2 Create a Certificate

    Xcode -> your application -> Target -> General pane

    Signing section :- check “Automatically manage signing”

If you are receiving provisioning error message, you need to change Bundle ID to Unique ID.

   Let's get to know here in detail: https://medium.com/@rlogicaltech/twilio-push-notification-what-is-push-notification-50dc60430d7e
Awesome aliases make everything better
Tags: tutorial
Published: 2020-06-12 20:04:05

I bloody love using aliases within my terminal. It does make everything better, as I have grown more confident using the terminal. I have continued to add more and more aliases, solely to make my workflow quicker.

Below I have put all my aliases that are currently in my `.zshconfig` file. I am sure more will be added over time. I have various ones for Python, Django, Gatsby and Git. The Python ones have made my workflow so much easier, especially when running virtual environments. Just a couple are:

#### Running a Python script

Before: 
```
$ python <python-file>
```

After
```bash
$ p <python-file>
```


#### Installing Python packages

Before:
```bash
$ pipenv install <python-package>
```

After:
```bash
$ pi <python-package>
```


#### Switching Git branches

Before:
```bash
$ git switch <branch-name>
```

After:
```bash
$ gbs <branch-name>
```


The above are only small changes, but they will make a tonne of difference especially if you're having to frequently type the same commands. Take a look at the list before hopefully, you can get some inspiration from them.

If you're using [ohmyzsh](https://ohmyz.sh) you can check out their aliases [here](https://github.com/ohmyzsh/ohmyzsh/wiki/Cheatsheet).

```bash
alias zshconfig="code ~/.zshrc"
alias ohmyzsh="code ~/.oh-my-zsh"

alias ..="cd .."
alias ...="cd ../.."
alias ....="cd ../../.."
alias .....="cd ../../../.."

# Shortcuts
alias dt="cd ~/Desktop" 
alias dev="cd ~/Developer"
alias dl="cd ~/Downloads"

# Git Shortcuts
alias gs="git status"
alias gp="git pull"
alias gb="git branch $1"
alias gbs="git switch $1"
alias ga="git add ."
alias gc="git commit -m $1"
alias gca="git commit -a -m $1"
alias gpo="git push origin $1"

# Python Shortcuts
alias python="/usr/local/bin/python3"
alias pip="pip3"
alias p="python $1" # saves typing python every time.
alias pi="pipenv install $1" # allows you to just type the package
alias ps="pipenv shell" # start a env with just "ps"

# Flask Shortcuts
alias fr="flask run" # start a flask app

# Django Shortcuts
alias rs="python manage.py runserver" # starts django server
alias dmm="python manage.py makemigrations" # makes db migrations in django
alias dm="python manage.py migrate" # migrates db in django

# Gatsby Shortcuts
alias gd="gatsby develop"
alias gbd="gatsby build"

# opens VSC from the cmd line:
code () { VSCODE_CWD="$PWD" open -n -b "com.microsoft.VSCode" --args $* ;}
```
Forbes: It's The End Of Infrastructure-As-A-Service As We Know It: Here's What's Next
Tags: discuss, news, linux, devops
Published: 2020-06-18 12:22:24

> Hello, friends. I am sharing an article published on forbes.com by [Mr Tolga Tarhan,Forbes Councils Member](https://www.forbes.com/sites/forbestechcouncil/people/tolgatarhan/#5f1d855b503c). I am quoting an excerpt from this article and you can read further by clicking link at end of this article.

A decade ago, running virtual machines (VMs) in the cloud was state-of-the-art. It made cloud migration relatively simple: Companies could just shift the VMs they were already running on their on-premises servers to the servers of an infrastructure-as-a-service (IaaS) vendor. Freed from the burden of physical server maintenance, companies gained flexibility and cut costs.

But today, no one is building new applications based on VMs. Instead, they're turning to two models that are more cost-effective, low-maintenance and scalable than VMs can ever hope to be: containerization and serverless computing. These two models, not VMs, represent the future of compute.

Read more here...  [Forbes](https://www.forbes.com/sites/forbestechcouncil/2020/06/15/its-the-end-of-infrastructure-as-a-service-as-we-know-it-heres-whats-next/#4b78da9f1612)

Remember Cloud Brother Story? ( Part -1,Part-2 , Part -3 
So, What is your opinion.

######**Must Read:** Please refer to my previous posts regarding creating your cloud service like the digital ocean or google cloud. [Part 1](https://dev.to/manishfoodtechs/creating-your-cloud-infrastructure-like-google-cloud-and-digital-ocean-from-scratch-part-1-3gnm) and  [Part-2](https://dev.to/manishfoodtechs/creating-your-cloud-infrastructure-like-google-cloud-and-digital-ocean-from-scratch-part-2-5f7f) and [Part-3](https://dev.to/manishfoodtechs/creating-your-cloud-infrastructure-like-google-cloud-and-digital-ocean-from-scratch-part-3-coding-stuff-20eo)
Make Your Computer Child Friendly
Tags: codenewbie, challenge
Published: 2020-06-18 12:21:06

The internet is a huge danger for your kids. Parents all over the world you must be really carefull and protect the kids by making  your computers safe.

1. Spend time reviewing the websites your child has viewed and 
   set security measures and controls.
2. Set as home page something they like.
3. Put all their web pages into favourites tab.
4. Speak to them about online chatting.

* TIP: WRITE DOWN SOME RULES THAT THE KID MUST FOLLOW AND STICK IT NEAR THE COMPUTER SCREEN.
Firebase Trigger Functions Testing with JEST and Emulators
Tags: jest, firebase, javascript, serverless
Published: 2020-06-18 12:15:36

In this 2 part video series, I will be sharing with you an approach through which you will be able to write tests using JEST and to assert results of side effects executed by Firebase cloud trigger functions locally on your machine without having to deploy to the cloud and/or to test online. We will be using JEST as a testing library and utilizing the Firebase emulators to serve an instance of our project on our machine.

[Part 1: Setup]
In this part we will be setting up our dev environment.
{% youtube 2X7DPxI6E_I %}

[Part 2: Writing Tests]
In this part we will be using the local Firebase Functions and Firestore emulators. Using Jest, we will execute a test routine which writes a document to the database and asserts the results of a trigger function copying that document to another collection.
{% youtube 8IoCPZJ-zwA %}

You can download the project source code from Github:
https://github.com/ssagga/firebase-emulators-testing-with-jest
Metro 4 is not only tiles!
Tags: html, design, javascript, css
Published: 2020-06-18 12:08:34

When you talk about [Metro 4](https://metroui.org.ua) (Metro UI CSS), people immediately associate that this is something related to tiles and that's it. In fact, this is not so. The [Metro 4](https://metroui.org.ua) library (Metro UI CSS) allows you to create full-fledged sites, even without javascript knowledge. 

One example is a site that I developed by order - [cryptoscamalert.com](cryptoscamalert.com). The site contains information about identified fraudsters in the world of cryptocurrency. 

Many features are available right out of the box and are configured declaratively, through `data- *` attributes for HTML elements. Example: form validator. 

**Almost ALL Metro 4 components can be declaratively configured via data- * attributes!**

[Metro 4](https://metroui.org.ua) was originally designed so that people of different specializations could use it for rapid prototyping of work sites, for example, SEO specialists.

The use of Metro 4 is quite diverse, another example is the leading Ukrainian hosting provider [Mirohost.net](https://mirohost.net) uses Metro 4 to implement its administrative panel.

Of course, you can implement using Metro 4 and the tiled interface. Special elements - tiles are part of Metro 4. Real example - [Start screen](https://metroui.org.ua/examples/tiles/start.html).

#### CryproScamAlert.com
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/j2ro0ilm2d34t0kdatok.png)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/s05i6ahvh1tfhbrvczsl.png)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/dloh9dtn7m9lqk9om0je.png)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/0r3arntog2ckftnmmnfh.png)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/47ze79grlvip44rw4vza.png)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/p7kkmkkrhkpk25rf5rna.png)

#### Mirohost.net
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/y787n4rrn7fcu1974upj.png)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/x8trjt1uiashuofncw6x.png)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/9zfp054nr8i0xzlgznda.png)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/jmg60jln89s2ob48aa6m.png)
When HTTP 200 OK from API endpoint returns "error"
Published: 2020-06-18 12:05:27

So this happened a while ago but I will post it here also:

I was posting data to some remote API endpoint and it kept returning HTTP response with code 200 OK. This is normally a good sign, but this was it’s content:

`
{"error": "not present"}
`

What is your first guess when you see this response content?

OK, so I thought maybe the API always returns 200 and errors in it’s content. This is not the best practice but I’ve seen it a lot in many APIs. Maybe this was an error description of a case when object is not found in a database, but they could return 404 for example.

However, this was not the case here because I asked them what this "error" meant and why are they returning it with 200 OK.

The answer:

"This is normal behavior and it actually means that no errors are present."

Was your guess correct?
I made an extension to paste images into dev.to
Tags: devto, extensions, chrome, articles
Published: 2020-06-18 11:46:52

The extension is available here
https://github.com/mikedg1/dev.to.paste

At some point in the near future, I plan on going through the official publishing process. But it's out in source for now.
There's a few things in there that I'd like to fix before letting it completely loose too. Things like too much logging and relying on setInterval because I could not get any DOM changes to register when the url for the image upload updates.


One of the things that keeps me from writing articles is getting the non-textual content into the article easily.

Most editors let you paste them directly in, not dev.to :( You need to have a file and upload it.

We can fix that, and every image in the article was pasted via this extension.

### My Process
I searched for the id of the file input element and wound up discovering this. 
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/rn5d72dm007p4jxr80k6.png)
The important part is the onChange. We will need to trigger that so the rest of the website does it's thing.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/9qapt6238a9bvfmxkjfp.png)
This block waits for a paste, grabs the files if you have an image, then moves through the upload process programatically.

After the image is uploaded, we get a url that needs to be automatically inserted. Unfortunately, I ran into issues watching the DOM for value changes, so we wound up with using setInterval to check every second.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/2rvwhqe7glxwhsfeen1n.png)

Not being a web developer, I just grabbed insertAtCursor from some wonderful Stack Overflow post.
My game is now at the summer festival Steam
Tags: indiedev, dev, game, gamedev
Published: 2020-06-18 11:45:57

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/7w0m8bzxwsxnhaor0n5h.png)

PAPER TANKS participates in the Steam Summer Festival. You can download a free demo version and take part in a chat with developers at 8 PM 06/19/2020

store.steampowered.com/app/1213020/PAPER_TANKS
https://discord.gg/3wx8A7k
Simplify no-code web app development with UI Bakery Academy
Tags: webdev, nocode, lowcode, appdevelopment
Published: 2020-06-18 11:35:04

Hey guys!

Cheers from the UI Bakery, a low-code platform, team. 
Besides improving our platform, we’re constantly working on making our knowledge base better. 
It’s recently been finally updated 🔥
New how-to articles, guides, video tutorials, webinar playbacks, updated FAQ section, and more. 
Check our new Academy & enjoy no-code development in UI Bakery.

https://hubs.ly/H0rFy9Z0
Work in progress blog
Tags: react, blog, node, redux
Published: 2020-06-18 11:08:16


hi gang im creating a blogging site for devs, how does it look
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/71iph588qpt0bj5s1trx.png)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/9vq6qptxmkix2yxsazei.png)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/klwsfr0bszsg1j1tk86b.png)
 ![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/2fcxw0w5btmwq1q2h29x.png)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/kicszaygsss85k5xj91u.png)
What I'm Up To Lately
Tags: womenintech, codenewbie, devjournal
Published: 2020-06-18 11:04:39

_This post was originally published on June 18, 2020 on [my blog] (https://alexlsalt.github.io/blog)._

Cloudyish, cool Thursday. Just sitting down to write at a little after noon here. I think I'll give a little list of the things I'm up to lately. Lots of cool stuff swirling around in this here brain!

TOP OF MIND:

- On the cusp of launching a cool podcast and community for creative coding ladies (more info to come, yeeee!)

- Preparing my CodeLand talk - taking place on July 23 [(and you're invited!] (https://codelandconf.com/)

- Nursing my strained neck back to health with yoga and nice walks instead of HIIT workouts

- Wrapping up some hourly client work and invoicing, etc.

- General life admin

THINGS I'M PONDERING:

- Deciding whether or not to share more behind-the-scenes stuff on Instagram

- A new project adapted from my [Wellbean project] (https://alexlsalt.github.io/wellbean/) that helps keep track of when a certain household chore was last done

- Transferring my [So You Think You Can France website] (https://soyouthinkyoucanfrance.com) from being hosted on Squarespace to being built up again with React and hosted on GitHub pages

- Continuing on with my JavaScript course, APIs, and all that fun stuff

Cool! Thanks for coming to my spur-of-the-moment brain inventory [Now let's be friends over on Twitter >>] (https://twitter.com/alexlsaltt)

P.S. I'd love to know what you're up to these days re: creative coding projects or just life admin in general! What's on your proverbial plate?