teleren/devto huggingface dataset:
Primeiros passos com Golang!
Published: 2022-02-12 14:24:50

[Como instalar golang no Linux Ubuntu](https://dev.to/williamkoller/como-instalar-golang-no-linux-ubuntu-20043-lts-k1f)

Iremos usar `docker` para rodar o `golang` na versão `1.12.0-alpine3.9`

Criando `Dockerfile` com imagem `golang:1.12.0-alpine3.9`

Criando a pasta

`mkdir first-steps-golang`

Acessando a pasta 

`cd first-steps-golang`

Criando `Dockerfile`

`touch Dockerfile`

```
FROM golang:1.12.0-alpine3.9 as builder

WORKDIR /build

COPY go.mod .

RUN go mod download

COPY . .

RUN go build -o main . 

FROM scratch

WORKDIR /build

COPY --from=builder /build .

CMD [ "./main" ]
```

Criando o arquivo `go.mod`

`touch go.mod`

Na raiz do projeto terá um arquivo `go.mod` com esse conteúdo:

```
module calc

go 1.12
```
Em seguida iremos criar a pasta calc

`mkdir calc`

E criaremos o arquivo de calc em go

`cd calc && touch calc.go`

Dentro do arquivo `cal.go`, criamos uma `func` de divisão.

package calc seria referente ao pacote de `calc`

```
package calc

func Division(a, b int) int {
	return a / b
}
```

Iremos criar o arquivo `main.go` para executar o cálculo

`touch main.go`

Dentro do arquivo `main.go`

`package main` seria referente ao pacote main

Iremos importar o `calc` e `fmt`

```
package main

import (
	"calc/calc"
	"fmt"
)

func main() {
	var num1 int = 4
	num2 := 2
	result := calc.Division(num1, num2)

	fmt.Println(result)
}

```

Em seguida iremos fazer o build da imagem em go, na raiz do projeto aonde o `Dockerfile` esta.

`docker build -t williamkoller/first-steps-golang . `

Rodaremos a imagem gerado com esse comando

`docker run -t williamkoller/first-steps-golang`

Resultado gerado
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hir6ovh35h6vnike6uv9.png)

**Agora iremos trabalhar com erros em Golang**

No arquivo `calc.go`

Iremos adicionar uma tratativa de erro

Podemos notar que importamos o `erros` do `golang` e no returno estamos usando o `nil` (como se fosse um ponteiro).

```
package calc

import "errors"

func Division(a, b int) (int, error) {
	if b == 0 {
		return 0, errors.New("denominator cannot be zero")
	}

	return (a / b), nil
}
```

No arquivo `main.go`

Passa a ser assim:

```
package main

import (
	"calc/calc"
	"fmt"
)

func main() {
	var num1 int = 4
	num2 := 0
	result, err := calc.Division(num1, num2)

	if err != nil {
		fmt.Println("Error:", err)
		return
	}
	fmt.Println(result)
}
```

Iremos fazer o build da imagem novamente para ter essa nova versão de código

`docker build -t williamkoller/first-steps-golang .`

Em seguida rodar a nova imagem

`docker run -t williamkoller/first-steps-golang`

Com esse resultado:


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/j7tka0gookzh5drwz7f0.png)

Esse é o resultado gerado com `docker` e `golang`

Espero ter ajudado!
Website for all web designers
Tags: javascript, webdev, beginners, programming
Published: 2022-02-12 14:21:17

Hello my dear friends.Today i created colormyweb it is the website for all web designers it is used to plan a prototype of a website.I think it is totally useful for you.It is available as open-source.In the coming days i update the website.Comment your feedback


Check colormyweb now:https://sripadhs.github.io/colormyweb
install GUI on ubuntu
Published: 2022-02-12 14:16:44

GUI Installation on Ubuntu Server 20.04

Update the apt package index and install tasksel.

## $ sudo apt update

## $ sudo apt install tasksel

List the GUI we have installed and we can install:

## $ sudo tasksel --list-tasks

Main available Graphical User Interfaces (GUI) installations using tasksel's tasks

Task	Description

kubuntu-desktop	Kubuntu desktop ( KDE Desktop )

lubuntu-desktop	Lubuntu Desktop ( LXQt desktop )

ubuntu-budgie-desktop	Ubuntu Budgie desktop

ubuntu-desktop	Ubuntu desktop ( default GNOME )

ubuntu-desktop-minimal	Ubuntu minimal desktop ( default GNOME )

ubuntu-mate-desktop	Ubuntu MATE desktop

ubuntustudio-desktop	Ubuntu Studio desktop ( Xfce-based desktop )

ubuntustudio-desktop-core	Ubuntu Studio minimal DE installation ( Xfce-based desktop )

xubuntu-desktop	Xubuntu desktop ( Xfce desktop )

Use tasksel command to install the selected GUI. For example to install the default Ubuntu GNOME desktop execute. This step will install all the files and take some time to finish.

## $ sudo tasksel install ubuntu-desktop

Run the following command to make sure our system boots into the graphical target after reboot

## $ sudo systemctl set-default graphical.target

Run command sudo reboot to reboot. At this point, the GUI should start. 

## $sudo reboot

Install GUI on Ubuntu 20.04 Quick Guide

[how to install gui on ubuntu server](https://www.howtouselinux.com/post/install-gui-on-ubuntu-20-04-quick-guide)
What is Function Statement/Declarations in JavaScript?
Published: 2022-02-12 14:07:04

### Saved for later use = Declared function
A declared function is “saved for later use”, and will be executed later, when it is invoked (called).

### What is a Function Expression?
A JavaScript function can also be defined using an expression.

> A function expression can be stored in a variable:
`var x = function (a, b) {return a * b};`

After a function expression has been stored in a variable, the variable can be used as a function. Functions stored in variables do not need function names. They are always invoked (called) using the variable name.


### Function Expression VS. Function Statement
Example: Function Expression
`alert(foo()); // ERROR! foo wasn't loaded yet
var foo = function() { return 5; }`

Function declarations load before any code is executed while Function expressions load only when the interpreter reaches that line of code.

Example: Function Declaration
`alert(foo()); // Alerts 5. Declarations are loaded before any code can run.
function foo() { return 5; }`

Similar to the var statement, function declarations are hoisted to the top of other code. 

> Hoisting is a concept which enables us to extract values of variables and functions even before initialising/assigning value without getting error and this is happening due to the 1st phase (memory creation phase) of the Execution Context.

`getName(); // Namaste JavaScript
console.log(x); // undefined
console.log(getName); // f getName(){ console.log("Namaste JavaScript); }
function getName(){
    console.log("Namaste JavaScript");
}`
Function expressions aren’t hoisted, which allows them to retain a copy of the local variables from the scope where they were defined.

`getName(); // Uncaught TypeError: getName is not a function
console.log(getName);
var getName = function () {
    console.log("Namaste JavaScript");
}`
// The code won't execute as the first line itself throws an TypeError.

### Benefits of Function Expressions
There are several different ways that function expressions become more useful than function declarations.

- As closures - Function bundled along with it's lexical scope is closure.
- As arguments to other functions
- As Immediately Invoked Function Expressions (IIFE)
CSS Glass Morphism Generator
Tags: css, html, javascript, tooling
Published: 2022-02-12 13:35:52

The glass morphism effect is popping up all over the web at the minute. Although in the past it was generated mostly with images, **we can now achieve the same result using CSS**. The CSS glass morphism effect is pretty widely supported as well. Below, I've created a generator so you can make your own CSS glass morphism effects and add them to your applications and websites.

##CSS Glass Morphism Generator
[A little while ago I used the CSS glass morphism effect to create some apple UI elements](https://fjolt.com/article/css-ios-crystalline-effect-backdrop-filter). To show how this effect works a little better, I've created a CSS glass morphism generator below. You can change the options, and generate your own glass morphism along with code.

Since we are using `mix-blend-mode` to make our effect a little more blended, our text layer will have to sit in a separate div so it the blend mode is not applied to it. Note, that although widely supported, this will not currently work in Firefox as expected.

{% codepen https://codepen.io/smpnjn/pen/OJOgGpJ %}

## How does CSS Glass Morphism work?
This effect is based off two CSS properties - `mix-blend-mode`, and `backdrop-filter`. The first, lets us blend our element with the element behind it. The second, lets us blur or add a filter to semi opaque backgrounds, so that the background behind the element can be filtered. We're using blur as our filter to create the glass effect, but others work too. To read more on this topic, try our other tutorial here.

##Support for Glass Morphism Effect 
The glass morphism effect tends to degrade quite gracefully, as if it isn't supported, there simply isn't an effect displayed. It is broadly supported, however, as shown in the table below.

![Support for Backdrop Filter](https://caniuse.bitsofco.de/image/css-backdrop-filter.png)
Sticky Navigation Bar in html and css
Tags: stickynavigationbar, menu, menubar, htmlcss
Published: 2022-02-12 13:25:51


When working on a website, it's essential to have easy and efficient navigation. That's why having a sticky navigation bar is a must-have for any website. A sticky navigation bar makes your website user-friendly by keeping your readers constantly refreshed with the latest changes. [How to Make Sticky Navigation Bar in html and css](https://nextcodingblog.com/how-to-make-sticky-navigation-bar-in-html-and-css/)

It also helps you keep track of your website's current state and ensures that your readers can quickly get to the content they need without having to scroll through many pages.

**WHAT IS A STICKY NAVIGATION BAR?**
A sticky navigation bar is a type of web navigation that keeps your readers constantly refreshed with the latest changes. It also helps you keep track of your website's current state and ensures that your readers can quickly get to the content they need without having to scroll through many pages.

A sticky navigation bar can be a powerful tool for your website. By adding a sticky navigation bar to your website, you can make it easier for your users to navigate your website. Additionally, a sticky navigation bar can improve the usability of your website by keeping your navigation buttons easy to find.

You May Also Like

- [Hero Section Using HTML and CSS Only – Animation](https://nextcodingblog.com/hero-section-using-html-and-css-only-animation/)
- [How to Create a Hero Image: HTML And CSS Only](https://nextcodingblog.com/how-to-create-a-hero-image-html-and-css-only/)

Sticky Navigation Bar in html and css [**Source Code and Video Toturials **]
You can download all source code files from the below link

## [Download Now ](https://nextcodingblog.com/how-to-make-sticky-navigation-bar-in-html-and-css/)
'Data' in Databases !
Tags: database, dbms, databasemanagement
Published: 2022-02-12 13:21:45


   Let's start with standard definition of database 🛢, "A database is a collection of related data." But before digging into term #database ; let us understand the term data first. Aah, you must be saying ,' what a crap ! We know about the data.'


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gf1weugd7qeo4awz54fd.gif)

   Yes ! You know what is data ; you might know some of the facts of the data. Data is most valuable commodity📈 in the world 🌎. Many of you must be preparing for #MAANG companies , have you ever thought ; why turnover of these companies goes into huge figures. What is their business , what they exchange? Valid question, no? 


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4lod9mwdu7dwybo9no9t.gif)
 
 

Because , they have data ! 

    
We create data , just as nails grows (4.5 quadrillion data is created in FY21 😱); we don't need to take extra efforts🤗. We create data every now and then! By we meaning 'we', it includes our iphones 🤳, drones , laptops , camera and cars now-a-days.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/acz0w9ln7eyyjs70vffz.gif)


We create data , and tech giant collects those data ; they captures it ! That's their business. Why to capture data ? Because data is like a time or like a brain ; if you don't use it ; it gets wasted.  


   Who does the capturing work 📸 ; here comes the #databases💾 . How do you define a database?
A database is an organized collection of structured information, or data, typically stored electronically in a computer system.

How much data we capture ; in FY21 we have stored almost 44 zettabytes of data. 

But , restriction alert ⚠️ Without a #query (command) in #database ; we are powerless.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/92b6z5k6oxnb7nz57ocp.gif)

Though , we define database as , it's a collection of data , a method of for accessing and manipulating that data. 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ixbwn6ufbrksr5z1p11z.gif)

In simplest term data is nothing but hardware associated with software just like computer ; in-fact it  is a computer!🖥️
Though there are some fancy images over the internet. In the most fundamental form it is a computer , period! 

Again , the most beautiful thing about database is that we can this databases by using our iphones , smartphones and laptops.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/oia8wzfd4nuui1rzajs8.gif)

That's all ! You've learnt almost everything about data in #database_management perspective only. Will see the databases in more details in upcoming series of articles.

Smoke me a kipper, I'll be back for breakfast.
🔥3 Ways to Center Content Horizontally and Vertically in CSS✨
Tags: html, css, webdev, beginners
Published: 2022-02-12 13:05:22

3 Ways to Center Content Horizontally and Vertically in CSS✨

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x8tu21auyg8un1do0ymz.jpeg)

***

**Classic Option**

```css
.classic{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
```

**CSS Grid Way**

```css
.grid{
    display: grid;
    place-items: center;
}
```

**Flexbox Way**
```css
.flexbox{
    display: flex;
    align-items: center;
    justify-content: center;
}
```

🛴 Follow me on: 
https://bit.ly/3oBQbc0

***
Why you shouldn't keep a**holes in your team
Tags: career
Published: 2022-02-12 12:59:37

Hi! I recently made a [Twitter post](https://twitter.com/SkylerDevops/status/1478844215975202816) about a**holes at work, and I thought I would expand a bit more in a blog post, so here we go!  

First of all, there are factual proofs, research and [articles](https://hbr.org/2018/04/4-ways-to-deal-with-a-toxic-coworker) that has been done around "why you don't want a toxic person in a team". It's not just me spouting nonsense. Let's dig into the subject a bit more.

## Risk
What is in someone's head stays in their own head if they do not know how to communicate. The person ends up hoarding the information and does not know/want to talk around it. This is a risk to the company long term because you end up with one person really skilled, surrounded by others who aren't really sure what's actually behind x process or Y release, as if there was a "mist" around some subjects. This is a** one man** dependency.

## Burn out
If you have ever worked with one of those specimen, you would have noticed something very quickly: they tend to love work, and they don't get tired of it!  
However, people surrounding them feel the opposite. Therefore, you end up with a higher turnover surrounding that person. A few reasons:
- It gets tiring to discuss a ticket when you know the other person will not back down, will not acknowledge they might be wrong and that, for hours.
- Feeling of demotivation,
- " I haven't progressed as much as I thought in this role",
- ...

## Attitude
There is a lot to say about this one, but I will keep it short. It's obvious a**holes don't have a good attitude - that's why they are what they are. A few examples of behaviours:
- Monitor and doubt others,
- Set unrealistic expectations,
- Likes to point out others 'faults in a non-constructive way,
- Reject situations where they do not feel in control,


## Reputation
That one is usually forgotten in the articles I've read. If a team/department contains a schmuck, I can promise you that they have a reputation. Because, honestly, who wants to include a team who contains someone like that? I have seen situations where a department totally ignored a team, as unprofessional as it might sound. 

## Conclusion
In a few words, why you do not want a prick in your team:
- turnover of people goes higher,
- productivity can actually go down as people don’t feel appreciated/respected,
- if the company has not taken measures against an asshole just because he does tickets… it says a lot.

Have you ever had an a**hole in your team? **Next article, I will share a few tricks on how to deal with the situation :)!**
Why Work Hard When You Can Work Smart?
Tags: programming, productivity, webdev, beginners
Published: 2022-02-12 12:58:15

**Hello techies 👋,**

>This week article will be addressing a very significant aspect of a developer career which is working ethics and this can be toxic most times. This article has a lot to share, so I urge you to read to the end.

### Shall we begin 🚀

Every developer always have a goal to build something(a side project) even if been employed at an organization or not, this can surely be achieved but if not controlled well, it can lead to **burnout** affecting our **mental health** and many more.

>#### All this points down to having a goal and aim and approaching it with a better procedure and below are helpful tips.

### Helpful Tips to Working Smart.
- Always have a weekly goal and break it down to its smallest form for daily implementation.
- Allocate your working hours well in contrast to your responsibilities and health status; are you a parent, how conversant are you with your health and body e.t.c.
- There is never always enough time to code. A day can't be enough so also weeks at times. So always give yourself a break.
- Debugging can be strenuous, if the process is yet to yield out result after a long process, it is advisable you sleep or shut down the computer and find other things to do.
- Maximise the use of Google, Stack Overflow, YouTube and other helpful sources while stuck.
- You need to have a proper observation of yourself. What are the things that aid your productivity? Listening to music etc.
- Always drink water while working because coding at times can dehydrate.
- Always have enough rest.
- Meeting with your fellow developers either physically or virtually tends to improve productivity.
- Your sitting position also helps, you should put that into cosideration

> **Thanks for reading through this article and I hope you found it useful, you can connect with me on;**

- [Twitter](https://twitter.com/chryz_code)
- [GitHub](https://github.com/chryz-code)

**Bye 👋.**
Top 2 Simple Way to CENTER A DIV
Published: 2022-02-12 12:51:38

1> the most common one this one is so simple that we can do this with HTML

```html
<center>
    <p>B)</p>
</center>
```

2> percentage! if you don't understand what I am trying to say that we can use percentage to center a div by CSS here is an example:

```css

.center {
   position: absolute;
   top: 50%;
   left: 50%;
```
Day 97 of 100 Days of Code & Scrum: Aggregate Functions in MySQL
Tags: javascript, webdev, beginners, 100daysofcode
Published: 2022-02-12 12:50:48

Hello there, everyone!

I spent my free time today practicing aggregate functions in MySQL, such as `COUNT`, `MIN`, `MAX`, `SUM`, and `AVG`. `GROUP BY` took a little bit of time for me to understand, but I eventually understood how it groups together related rows.

Anyway, let's move on to my daily report!

## Yesterday

I did string functions practice in MySQL to get more used to them.

## Today

### MySQL

- I learned how to utilize the most commonly used aggregate functions in MySQL, along with `GROUP BY`.
- continued [Colt Steele's MySQL course](https://www.udemy.com/course/the-ultimate-mysql-bootcamp-go-from-sql-beginner-to-expert/).

### Scrum

- continued reading through [An Introduction to the Nexus Framework](https://scrumorg-website-prod.s3.amazonaws.com/drupal/2016-06/An%20Introduction%20to%20the%20Nexus%20Framework%20-%20June%202016_0.pdf).

Thank you for reading! Have a good day!

![Rammina Thank You Banner](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x9ayfxxxaz2g2hfcqbsk.png)

## Resources/Recommended Readings

- [The Ultimate MySQL Bootcamp: Go from SQL Beginner to Expert](https://www.udemy.com/course/the-ultimate-mysql-bootcamp-go-from-sql-beginner-to-expert/)
- [The 2020 Scrum Guide](https://scrumguides.org/scrum-guide.html)
- [An Introduction to the Nexus Framework](https://scrumorg-website-prod.s3.amazonaws.com/drupal/2016-06/An%20Introduction%20to%20the%20Nexus%20Framework%20-%20June%202016_0.pdf)

## DISCLAIMER

**This is not a guide**, it is just me sharing my experiences and learnings. This post only expresses my thoughts and opinions (based on my limited knowledge) and is in no way a substitute for actual references. If I ever make a mistake or if you disagree, I would appreciate corrections in the comments!

<hr />

## Other Media

Feel free to reach out to me in other media!

<span><a target="_blank" href="https://www.rammina.com"><img src="https://res.cloudinary.com/rammina/image/upload/v1638444046/rammina-button-128_x9ginu.png" alt="Rammina Logo" width="128" height="50"/></a></span>

<span><a target="_blank" href="https://twitter.com/RamminaR"><img src="https://res.cloudinary.com/rammina/image/upload/v1636792959/twitter-logo_laoyfu_pdbagm.png" alt="Twitter logo" width="128" height="50"/></a></span>

<span><a target="_blank" href="https://github.com/Rammina"><img src="https://res.cloudinary.com/rammina/image/upload/v1636795051/GitHub-Emblem2_epcp8r.png" alt="Github logo" width="128" height="50"/></a></span>
It Was Not My Laziness, It Was My Fear That Stopped Me Moving Forward.
Tags: javascript, beginners, react, learn
Published: 2022-02-12 12:45:23

Today, I didn't feel like learning coding. Just wanted to binge watch silly Youtube videos all afternoon and I bumped into this video about laziness. She said we procrasinate not becuase we are lazy it's because we are afraid. Afraid of failing. And I realized that I was afraid of getting stuck while I write my code. I decided to be brave and here is what I made today. 

I just learned basic concepts and basic syntex of React, so what I made is not complicated thing. It is just static web page. But I am still proud of my self. 
[Here is what I build today](https://scrimba.com/scrim/coef44f5eb8ca174f4baf907a?a=11061.0.3.L66_20)
How To Export Text From Adobe Illustrator and Photoshop To Notepad?
Tags: javascript, programming, tutorial, react
Published: 2022-02-12 12:40:02

![Text Extraction From Adobe Photoshop & Illustrator](https://miro.medium.com/max/1400/1*YDOzfhtbGnqodDIC1bCGog.gif)

As a graphic designer, during extensive typing work, there comes a time when you want to copy-paste a large pile of text from the layers or artboard. So you might wonder how would you:

⌨️ Keep yourself relaxed while typing?

📝 Extract out all the text within just a few clicks?

🗒️ Automatically save the extracted text in a notepad file?

Read [this](https://levelup.gitconnected.com/how-to-export-text-from-adobe-illustrator-and-photoshop-to-notepad-95da5d2bea15) article to discover a ready-made solution!