teleren/devto huggingface dataset:
[Dicas do VIM] Abrindo o VIM / NeoVIM
Tags: vim, neovim, braziliandevs
Published: 2021-05-20 13:54:18

Para abrir o VIM ou NeoVIM, basta digitar no terminal:

```
$ vim
```

- **$** indica que você deve usar o usuário comum para fazer essa operação.

O que aparecerá é algo semelhante a imagem abaixo.

![abrindo vim sem nome](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sprow0zqh440etzk4zg8.png)

Também é possível abrir o VIM ao mesmo tempo em que se cria um arquivo.

```
$ vim <novo arquivo>
```

- digite o nome do arquivo que deseja criar sem os sinais **< e >**.

Exemplo:

![abrindo e criando documento](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1ujzijl9o4hvqc46qg6k.png)

![novo arquivo no vim](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xckoeoolfy2yi7uhh2be.png)

Apesar do arquivo ter sido criado, ele ainda não foi salvo. Ou seja, ele existe nos arquivos temporários e se você fechar o editor provavelmente não terá mais acesso a ele.

Outro modo é abrindo um arquivo já existente:

```
$ vim <arquivo>
```

Exemplo:

![abrindo arquivo existente com o vim](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/aq4l7reuc7b89pfm3v2o.png)

![arquivo aberto no vim](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4bxz5dczldeoa25p3p8t.png)

Marcado em vermelho, na imagem, temos o nome do arquivo e sua extensão, o número de linhas e o número de colunas do texto.
Firefox Addon: Add options menu to browser action icon
Published: 2021-05-20 13:49:06

Especially during development it’s annoying to reach the option page of a Firefox addon:

1. Hamburger
2. Addons and Themes
3. ...
4. Options

There should be a faster way. At least for your own Add-ons you can quite easily add an “Options” menu item to the browser action:
```javascript
browser.contextMenus.create({
    title: 'Options',
    contexts: ['browser_action'],
    onclick: () => {
      browser.runtime.openOptionsPage();
    },
  });
```
Additionally to have to add a new permission to the manifest.json file:
```json
"permissions": ["contextMenus"],
```
![menu](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ggd5rpx8mvwj6ydw5fln.png)

That was easy!
Loan Calculator using chart.js
Tags: codepen, javascript, webdev, css
Published: 2021-05-20 13:39:52

<h1>This is a loan calculator made using HTML, CSS, JS and chart.js library </h1>
[Link to chart.js Library](https://www.chartjs.org/)
<p>Check Out the complete pen below:</p>
{% codepen https://codepen.io/thecoderelite/pen/WNpwEXx %}
Shape Your Narrative
Tags: growth, motivation, personal, conversation
Published: 2021-07-06 05:45:11

---
title: Shape Your Narrative
published: true
date: 2021-05-20 13:18:09 UTC
tags: growth,motivation,personal,conversation
canonical_url: https://x-team.com/blog/shape-your-narrative/
---
When someone asks what you do for a living, what do you say? Do you dread the question? Do you rush through your answer? Do you make it sound as if what you do doesn't really matter?

If so, it's time to take control of your narrative. The words you use to describe what you do are important. Consider these two examples:

- “I'm a software developer. I write code for a company with a few other developers. But it's all remote, so we mostly work by ourselves. It's a good job though. The stuff we build does quite well and the company is happy with it, so I can't complain.”
- “I write software applications for start-ups. Currently, I'm part of a team of developers working on [Bramble](https://x-team.com/blog/artery/), a product that transforms how people communicate through video. It's quite a new product, but we have thousands of people on our waitlist already, so it seems there's genuine demand for what we're building. It's exciting work and I'm grateful to be a part of it.”

The first example is what happens when you don't have a personal pitch. I might look okay on the surface, but it's ultimately a stream-of-thought answer that sounds unconfident. The second example is more specific, more exciting, and it sets you apart without sounding too salesy.

The “What do you do?” question is a chance to present yourself in a good light. Grab it with both hands. It doesn't take much time to write and memorize a good personal pitch. Sound confident. Be proud of what you do. Shape your narrative.
The Productivity Tip That Changed My Life
Published: 2021-05-17 17:34:49

There is this weird chasm between thought and action where many dreams have died a sad death. I would, for years, get confused about handling tasks. If I have a list of tasks, I could either start without a plan and get some of them done haphazardly or sit down and come up with an idea and organize everything before I jumped into action. Both of these approaches had issues.

With the first method, I would get random stuff done, but they never added up to anything profound and valuable, and I would miss opportunities that I would have seen if I had taken time out to plan.

With the second way, I would freeze and would never get started and would soon begin procrastinating and would keep planning forever.

The 2-minute rule
This tip by David Allen, the author of getting things done, changed all that.

He argues that if I can do something in less than 2 minutes, I don’t have to put it into a planning system like even a to-do list. The effort takes to put into a system and process. It is offset by the fact that I can do it not and finish it off. It never has to appear on paper anywhere.

Like just a while ago, I remembered that I had not paid my mobile phone provider bill. Instead of writing it down somewhere, I know that I could pay using the ISP’s app in under a minute. So I just went ahead and did that.

It turns out that many projects have a ton of “tasks” that take 2 minutes or less. Instead of making a “big deal” about them and putting them on a to-do list, you can do them when writing down the to-do list. So the act of writing the to-do list could be a trigger to finish a lot of 2-minute tasks.

It’s funny how many of my “Big projects” are held up because of this 2-minute task not done.

It happens especially when you start and also when you finish a project. These rules enabled me to code and launch my SAAS product, Proxies API in under a month. I teach this rule to every new hire I make in the company. It’s fun to get an instant boost in everyone’s productivity by showing them this. After all, it only takes 2 mins to teach them this.

The author is the founder of Proxies API, a proxy rotation API service.
Enable OpenShift login on ArgoCD from GitOps Operator
Tags: gitops, openshift, argocd, authentication
Published: 2021-05-20 12:48:47

Since few weeks now, the operator Red Hat OpenShift GitOps became GA and embbed tools like Tekton and ArgoCD.

When the operator is deployed, it provisions a vanilla ArgoCD which miss the OpenShift integrated login. In this post, we are going to review the steps to enable it.

# Deploy and fine tune the Red Hat OpenShift GitOps
1. Follow the [official documentation](https://docs.openshift.com/container-platform/4.7/cicd/gitops/installing-openshift-gitops.html) on the installation of the operator
2. Once the operator is deployed, go to the menu **Operators**>**Installed Operators** and click on the freshly deployed **Red Hat OpenShift GitOps**
3. Using the dropdown **Actions** on top right of the page, choose **Edit Subscription**
4. On the YAML code, under the **spec** level, enable the DEX feature to enable external authentication and click **Save**
```yaml
...
spec:
  config:
    env:
      - name: DISABLE_DEX
        value: 'false'
...
```
or
```bash
oc patch subscription openshift-gitops-operator -n openshift-operators --type=merge -p='{"spec":{"config":{"env":[{"name":"DISABLE_DEX","Value":"false"}]}}}'
```
# Configure ArgoCD to allow OpenShift authentication
1. Change the project to **openshift-gitops**
2. Go to the menu **Operators**>**Installed Operators** and click on **Red Hat OpenShift GitOps**, select tab **Argo CD**
3. On the ArgoCD instance list, click on the three dots at the very left of the **openshift-gitops** and select **Edit ArgoCD**
4. On the YAML code, under the **spec** level, update the DEX and RBAC section to match the following
```yaml
...
spec:
  dex:
    openShiftOAuth: true
  rbac:
    defaultPolicy: 'role:readonly'
    policy: |
      g, system:cluster-admins, role:admin
    scopes: '[groups]'
...
```
or
```bash
oc patch argocd openshift-gitops -n openshift-gitops --type=merge -p='{"spec":{"dex":{"openShiftOAuth":true},"rbac":{"defaultPolicy":"role:readonly","policy":"g, system:cluster-admins, role:admin","scopes":"[groups]"}}}'
```
5. Monitor the pods being restared to apply the configuration and test your login
What is Graftini?
Tags: startup, webdev, design, devops
Published: 2021-05-20 12:40:30

As developers, if we have to do a task, we try to do it in the most efficient way that we know of. Sometimes that means to do it manually. And, if we need to do it again, we oblige. But if we have to do the same repeatedly, the process soon becomes inefficient. And when that time comes, we find a way to automate it.

In our experience, working with clients and having to develop web apps for their specific problems has allowed us to explore new ways of solving them. Even in seemingly unique problems, we began to find repetition in the kind of solution we provided with regards to *how we design, review, iterate and write them into code*.

That is when it struck us that we need to automate the process. **Imagine if we had a thing that lets us design a website using a visual editor, implement behavior without having to write a single line of code, and deploy it to production with a single tap of a button.**

We began to scour the internet to find such a thing. We found tools that are tackling similar problems. But they were not able to express our use-cases fully.

> Hence we created Graftini. A nocode designer that deploys your designs to full-fledged web apps.

Graftini is where there is no difference between designing and coding, where reviews are only limited to the actual design, and where devops is obsolete. The only task that a developer is responsible for is the design of a solution.

[Request for early access](https://graftini.com/) to get an early taste when it's available. We are eagerly excited to see the kind of apps you will build with it.
Auto Migration in .NET Core
Published: 2021-05-20 12:38:45

This is a really straightforward activity. 
Using EF Core code-first approach in .NET Core applications we always tend add migrations as our application entities change.

Do we really need to always run the `update-database` command. I think not.

put this code snippet anywhere you find comfortable in ur project

`private async Task RunMigration<T>(T db) where T : DbContext
        {
            List<string> pendingMigrations = db.Database.GetPendingMigrations().ToList();
            if (pendingMigrations.Any())
            {
                IMigrator migrator = db.Database.GetService<IMigrator>();
                foreach (string targetMigration in pendingMigrations)
                {
                    migrator.Migrate(targetMigration);
                }
            }
            await Task.CompletedTask;
        }`
 
Also, say you have multiple contexts, notice how the snippet above uses generic type to handle any context that inherits DbContext.

The last step will be to add `RunMigration(yourDbContext)` to your `Startup.Configure` method.

Have fun!!
OOP CAN BE EASY
Tags: php, oop, programming, oopphp
Published: 2021-05-20 12:27:15

###Abstraction and interface 
interface it is a blueprint for the class, it is just like the contract we put some condition we can follow in the class.
Some Tips about interface : 
all methods are abstract as nobody content for function.
All methods declared in an interface must be public;
We cannot define property in the interface;
this is simply the nature of an interface. Here is the example :

```<?php
interface Logger
{
    public function execute();
}
```

how can I use interface ?

we use interface by "implements" keyword as Example 

```<?PHP
class LogToFile implements Logger 
{
    public function execute($message) 
    {
        var_dump('log the message to a file :'.$message);
    }
}
```

Abstract:
An abstract class is a class that contains at least one abstract method, which is a method without any actual code in it, just the name and the parameters, and that has been marked as "abstract".

The purpose of this is to provide a kind of template to inherit from and to force the inheriting class to implement the abstract methods.

An abstract class thus is something between a regular class and a pure interface. Also interfaces are a special case of abstract classes where ALL methods are abstract
as example 
```<?php
abstract class AbstractClass
{
    // Force Extending class to define this method
    abstract protected function getValue();
    
    public function printOut() 
    {
        print $this->getValue() . "\n";
    }
}
```
we can conclusion the abstract in these points

should have at least one abstract function 
have a regular function with implement 
we can define properties

how can I use abstract? 

we use abstract by "extends" keywork

Polymorphism Using Abstract Classes and Interfaces

```<?PHP 
abstract class Template
{
    public function make()
    {
        return $this
            ->addHotWater()
            ->addSugar()
            ->addPrimaryToppings()
            ->addMilk();
    }
    
    protected  function  addHotWater()
    {
        var_dump('Pour Hot water into cup');
        return $this;
    }
    
    protected  function addSugar()
    {
        var_dump('Add proper amount of sugar');
        return $this;
    }
    
    protected function addMilk()
    {
        var_dump('Add proper amount of Milk');
        return $this;
    }
    
    protected abstract function addPrimaryToppings();
}
```

```<?PHP 
class Tea extends Template
{
    public function addPrimaryToppings()
    {
        var_dump('Add proper amount of tea');
        return $this;
    }
}

$tea = new Tea();
$tea->make();

class Coffee extends Template
{
    public function addPrimaryToppings()
    {
        var_dump('Add proper amount of Coffee');
        return $this;
    }
}

$coffee = new Coffee();
$coffee->make();
```

we implement polymorphism as this way we make one template and implement many types and reduce duplicated code .
Top Git Interview Questions And Answers
Tags: github, interviewquestions, onlinetraining
Published: 2021-05-20 12:27:03

If you're looking for Git Interview Questions and Answers 2021 for Freshers and Experienced, then you are in the right place. There are a lot of job opportunities from many reputed companies in the world.

According to research, Git has a market share of about 68% in version control management. So, You still have the opportunity to move ahead in your career.

Here Mindmajix offers advanced Git Interview Questions and Answers 2021 that helps you in cracking your job interview.

If you want to enrich your career and become a professional in Git, then visit Mindmajix - a global online training platform: <a href="https://mindmajix.com/git-training">"Git Online Training"</a>This course will help you to achieve excellence in this domain.

<b>Q1. What is GIT and What are its advantages?</b>

Ans: Git is a free and open-source distributed version control system designed to handle everything from small to very large projects with speed and efficiency.

<b>Q2. What is the relationship between GIT and SCM tools?</b>

Ans: SCM tools like Subversion, CVS, Perforce, and ClearCase with features like cheap local branching, convenient staging areas, and multiple workflows.

<b>Q3. Can you explain about Branching and Merging in GIT?</b>

Ans: The Git feature that really makes it stand apart from nearly every other SCM out there is its branching model.

Git allows and encourages you to have multiple local branches that can be entirely independent of each other. The creation, merging, and deletion of those lines of development takes seconds.

<b>Q4. How do you rate GIT in terms of speed?</b>

Ans: Git is fast. Speed and performance have been a primary design goal of Git from the start. With Git, nearly all operations are performed locally, giving it a huge speed advantage on centralized systems that constantly have to communicate with a server somewhere.

Git was built to work on the Linux kernel, meaning that it has had to effectively handle large repositories from day one. Git is written in C, reducing the overhead of runtimes associated with higher-level languages.

<b>Q5. What is a pull-in git?</b>

Ans: git-pull - Fetch from and integrate with another repository or a local branch

SYNOPSIS: git pull [options] [ […?]]

In its default mode, git pull is shorthand for git fetches followed by git merge FETCH_HEAD. More precisely, git pull runs git fetch with the given parameters and calls git merge to merge the retrieved branch heads into the current branch. should be the name of a remote repository as passed to git-fetch

Do you want to read more? visit here: <a href="https://mindmajix.com/git-interview-questions-answers
">"Git Interview Questions"</a>
10 Google Chrome Extensions you should use as a developer
Tags: webdev, beginners, javascript, html
Published: 2021-05-20 12:05:23

_If you found value in this thread you will most likely enjoy my tweets too so make sure you follow me on [Twitter](https://twitter.com/VladPasca5)  for more information about web development and how to improve as a developer. This article was first published on my [Blog](https://vladpasca.hashnode.dev/)_

### 1.  [Eye Dropper](https://chrome.google.com/webstore/detail/eye-dropper/hmdcmlfkchdmnmnmheododdhjedfccka?hl=en) 

Pick color from any web page or from advanced color picker.

### 2.  [Awesome Screenshot & Screen Recorder](https://chrome.google.com/webstore/detail/awesome-screenshot-screen/nlipoenfbbikpbjkfpfillcgkoblgpmj?hl=en) 

Full page screen capture and screen recorder - 2 in 1.

### 3.  [Daily .dev](https://chrome.google.com/webstore/detail/dailydev-all-in-one-codin/jlmpjdjjbgclbocgajdjefcidcncaied) 

The easiest way to stay updated on the latest programming news.

### 4.  [JSONView](https://chrome.google.com/webstore/detail/jsonview/chklaanhfefbnpoihckbnefhakgolnmc?hl=en) 

Validate and view JSON documents.

### 5.  [Responsive Viewer](https://chrome.google.com/webstore/detail/responsive-viewer/inmopeiepgfljkpkidclfgbgbmfcennb?hl=en) 

Show multiple screens once, Responsive design tester.

### 6.  [CSS Scan](https://chrome.google.com/webstore/detail/css-scan/gieabiemggnpnminflinemaickipbebg?hl=en) 

The fastest and easiest way to check, copy and edit CSS.

### 7.  [Wappalyzer](https://chrome.google.com/webstore/detail/wappalyzer/gppongmhjkpfnbhagpmjfkannfbllamg?hl=en) 

Find out what CMS a website is using, as well as any framework, ecommerce platform, JavaScript libraries and many more.

### 8.  [Stylebot](https://chrome.google.com/webstore/detail/stylebot/oiaejidbmkiecgbjeifoejpgmdaleoha?hl=en) 

Change the appearance of the web instantly.

### 9.  [UX Check](https://chrome.google.com/webstore/detail/ux-check/giekhiebdpmljgchjojblnekkcgpdobp) 

Run a heuristic evaluation on your website.

### 10.  [Pesticide](https://chrome.google.com/webstore/detail/pesticide-for-chrome-with/neonnmencpneifkhlmhmfhfiklgjmloi) 

This extension inserts the Pesticide CSS into the current page, outlining each element to better see placement on the page.

### The end

_I hope found this useful and if you did please let me know. If you have any question feel free to DM me on  [Twitter](https://twitter.com/VladPasca5) ._
Day 1/30 : Create Glowing Neon Buttons using HTML and CSS
Tags: html, css, webdev, tutorial
Published: 2021-05-20 12:02:37

Welcome to Day 1 of this [Challenge](https://dev.to/somanathgoudar/30dayschallenge-30-days-extreme-html-css-challenge-50k1). This is what I created today. 

**➜ Here is the Demo :**
![Glowing Neon Buttons](https://1.bp.blogspot.com/-zWEh_YCWhFw/YKOU1XDFqeI/AAAAAAAAAAk/41YgaD0eUK8ZrhGHYBqPBQ0pXxP-LZNIwCLcBGAsYHQ/s16000/p1.gif)

**➜ Video Tutorial :**

{% youtube TGVncD5dtcI %}
**➜ Source Code :**
https://www.futurecodersweb.com/2021/05/glowing-neon-buttons-using-html-and-css.html


**➜ Instagram Post and Reel for Day 1 :**
[See Post and Reel](https://www.instagram.com/future_coderss/)

------------------------------------------------------------------

Hey, If You don't know what is happening here. Don't Worry, I am doing a crazy challenge 😅. Read More about it from the post below.

{% link https://dev.to/somanathgoudar/30dayschallenge-30-days-extreme-html-css-challenge-50k1 %}

**Support Me :**
👉 Buy me a Coffee: https://www.buymeacoffee.com/somanathgoudar
👉 [Follow Me on Instagram](https://www.instagram.com/somanath_goudar/)
👉 [Follow Future Coders on Instagram](https://www.instagram.com/future_coderss/)
👉 [Subscribe to My Main Channel](https://www.youtube.com/channel/UC_nTrhTr5fnBGjOxnkPUmmA)
👉 [Subscribe to Channel Created for this Challenge](https://www.youtube.com/channel/UCzGSyMOf2jPt1MkNBB3SJ3g)

------------------------------------------------------------------
4 amazing web tools for prototyping.
Tags: webdev, css, html, javascript
Published: 2021-05-20 12:00:32

Today I'm going to show you 4 amazing tools to save you time when you prototyping.

# 1. [Placeholder.com](https://placeholder.com)

![Placeholder.com](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6n41pzjqtlq4psdgtm6s.png)

This is amazing placeholder tool for images. You can generate what size you want, color, format and text content🤳🏼.

Example:

![Placeholder.com example](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7kqwzjwxf9ghj8b1rukk.png)

If you visit this URL [https://via.placeholder.com/728x90.png/0000FF/FFFFFF?text=Hello,+How+are+you?](https://via.placeholder.com/728x90.png/0000FF/FFFFFF?text=Hello,+How+are+you?), you receive exactly the same image.

Please go to the [Placeholder.com](Placeholder.com) and look at the documentation.

---
# 2. [iHateRegex](https://ihateregex.io/)

![iHateRegex](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gzzfzko7oj3rivw0ld0x.png)

There are two types of people, who are familiar with Regex and who aren't.

99% of programmers aren't familiar in 100%, for me this page is really helpful on daily programming.

---
# 3. [{JSON} Placeholder](http://jsonplaceholder.typicode.com/)

![{JSON} Placeholder](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rwlpi9ddsrjrlpliqdiz.png)

This a great tool when you don't have API, and you want to test some part of code, or you are just learning and you don't want to write your own backend.

Example:

```ts

fetch('https://jsonplaceholder.typicode.com/todos/1')
  .then(response => response.json())
  .then(json => console.log(json))

```

Output:

```json

{
  "userId": 1,
  "id": 1,
  "title": "delectus aut autem",
  "completed": false
}

```
---
# 4. [ngrok](https://ngrok.com/docs)

![ngrok](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/imbzfkwor7bhguu1p8gl.png)

Another great tool is ngrok, where using one command you can preview your work.

Example of usage:

```bash
ngrok http 80
```
---
Cover photo by <a href="https://unsplash.com/@jannerboy62?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Nick Fewings</a> on <a href="https://unsplash.com/s/photos/four-tools?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>