teleren/devto huggingface dataset:
My Back-end Adventures - Intro
Tags: node, javascript, sql
Published: 2020-05-09 19:05:31

**TL;DR**: This series is about my journey into the world of Back-end Development. Every milestone, small accomplishment, frustration and major achievement is going to be documented in this series. I'll include a few tutorial articles to run through set ups that I found challenging to understand so that others after me can have an easier time. Enjoy! :smile: 

<hr>

Just until recently (at the time of publishing this article), I decided to dive into the world of Back end Web Development. I already had a lot of experience on the front end and a deep understanding of Angular. But I wanted to change my Web Development focus slightly as well as my career. 

There were a lot of choices laid out in front of me such as:
 - Python Flask 
 - Node.js/Express
 - Golang
 - PHP
 - Elixir (This one is pretty cool!)

Eventually I settled on Node.js/Express since I was already familiar with JavaScript and already had done one or two really small Express projects on my own. Plus I really like JavaScript modern syntax.

The [#100DaysOfCode](https://www.100daysofcode.com/) challenge seemed like a really good way to get me going. I've always had problems with motivation and keeping the discipline to stick with a habit so it was a good fit. 

I laid out a bunch of topics to cover and projects along the way so that I don't get stuck in tutorial hell. Here are some of those topics:

 - Beginner
   - Node.js Express basics
   - Routing
   - MiddleWare
   - View/Templating Engines
   - SQL ORM (Sequelize)
   - NoSQL ORM (Mongoose)
 - Intermediate
   - Security, Passwords and OAuth
   - Caching
   - State Management
   - More Database management
 - Advanced
   - Node.js Core Modules
   - Web Sockets
   - NginX

There are probably some more that I missed but I'll get to them along the way.  So far I've only covered some of the basics but I learned so much that I'm excited to keep going. Can't wait to see what else I learn!
Detect operating system in Go
Tags: go
Published: 2020-05-09 18:07:32

When you code in Go, it runs on an operating system. From within a Go program, you can fetch the operating system.

If golang is not installed you should install Go with your package manager, something like:

```
sudo dnf install go    
sudo apt-get install go
```

depending on your operating system. If go is already installed you can use the code below.

We load the module runtime, which can fetch the current operating system.

```go
package main

import (
        "log"
        "runtime"
)

// Reference: http://stackoverflow.com/questions/19847594/how-to-reliably-detect-os-platform-in-go
func main() {
        log.Printf("%v\n", runtime.GOOS) // output windows or linux
}
```

You can run your program with the command:

```
go run example.go
```

In my case the program outputs:

```
2020/05/09 20:06:46 linux

Program exited.
```

Simple, but neat. 

**Related links:**
* <a href="https://golangr.com/">Golang tutorial</a>
* <a href="https://golangr.com/">Go website</a>
How I texted whole movie script word by word using Selenium in Python 😅
Tags: python, selenium
Published: 2020-05-09 17:57:43

{% github https://github.com/aletisunil/Whatsapp_Spam no-readme %}
Hey all, 
        Hope everyone are doing good, In this post I will share how I texted a whole movie script word by word (just to irritate her) in Python.

Let's start by watching small demo, how its going to look at end 😅
<p><a href="https://media.giphy.com/media/mCxzDkVV84GelbYdnn/giphy.gif" class="article-body-image-wrapper"><img src="https://media.giphy.com/media/mCxzDkVV84GelbYdnn/giphy.gif" alt="run the script" loading="lazy"></a></p>

Now lets talk,
<b>Prerequisites:</b>
<ul>
<li>Python</li>
<li>Selenium</li>
<li>webdriver (I used Chrome webdriver)</li>
</ul>

<b>Step 1 :</b>
need to import webdriver, keys and sleep
```python
from selenium import webdriver
from selenium.webdriver.common.keys import Keys
from time import sleep
```

<b>Step 2 :</b>
Enter the location of Chrome Webdriver and assign it to driver variable
```python
driver=webdriver.Chrome("")
``` 

<b>Step 3 :</b>
I used whatsapp to send messages and I pinned the person to whom we need to send messages, so that there will not be any hustles.
```python
driver.get("https://web.whatsapp.com/")
sleep(15)
driver.find_element_by_xpath("/html/body/div/div/div/div/div/div/div[1]/div/div/div[1]/div/div/div").click()
sleep(5)
```
There should be some time where we can scan the qrcode to login, so I gave sleep(15) and that xpath is to open the chat window of that respective person

<b>Step 4 :</b>
Now locate the movie script file, assign it to fileLocation variable and open it in read mode
<code>fileLocation= ""  #Enter location of movie script file</code>

<b>Step 5 :</b>
Now use "for loop" to send msg word by word

###<b>_Code_</b>
```python
from selenium import webdriver
from selenium.webdriver.common.keys import Keys
from time import sleep


driver=webdriver.Chrome("") #Enter Location of Chrome driver
driver.maximize_window()
driver.get("https://web.whatsapp.com/")
sleep(15)
driver.find_element_by_xpath("/html/body/div/div/div/div/div/div/div[1]/div/div/div[1]/div/div/div").click()
sleep(5)
fileLocation= ""  #Enter location of movie script file
with open(fileLocation,"r") as file:
    for line in file:
        for word in line.split(" "):
            driver.find_element_by_xpath("//*/footer/div[1]/div[2]/div/div[2]").send_keys(word)
            driver.find_element_by_xpath("//*/footer/div[1]/div[2]/div/div[2]").send_keys(Keys.ENTER)
```

A ♥️ would be Awesome 😊
Have you ever worked with an engineer who never leveled up?
Tags: anonymous, discuss
Published: 2020-05-09 17:54:38

---
title: Have you ever worked with an engineer who never leveled up?
published: true
tags: anonymous
---
A co-worker of mine was let go and the consensus amongst the team was an unspoken understanding that although they have 4+ years of experience, they never leveled up past the Junior level.

Have you ever had a co-worker like this?

Is there anything management could've done differently, or are some engineers just hopeless? Is there something we as co-workers could've done differently?

I wouldn't like to add further details for privacy's sake, so I'm more hoping to hear about others' experiences rather than the circumstances here.

_This is an anonymous post sent in by a member who does not want their name disclosed. Please be thoughtful with your responses, as these are usually tough posts to write. Email sloan@dev.to if you'd like to leave an anonymous comment._
Learning Golang 103
Tags: go, beginners
Published: 2020-05-09 17:49:12

## Functions
* Multiple return values
```
func nextInt(b []byte, i int) (int, int) {
    for ; i < len(b) && !isDigit(b[i]); i++ {
    }
    x := 0
    for ; i < len(b) && isDigit(b[i]); i++ {
        x = x*10 + int(b[i]) - '0'
    }
    return x, i
}
```
* Named result parameters
The return or result "parameters" of a Go function can be given names and used as regular variables.When named, they are initialized to the zero values for their types when the function begins; if the function executes a return statement with no arguments, the current values of the result parameters are used as the returned values.
```
func ReadFull(r Reader, buf []byte) (n int, err error) {
    for len(buf) > 0 && err == nil {
        var nr int
        nr, err = r.Read(buf)
        n += nr
        buf = buf[nr:]
    }
    return   // default named result parameters.
}

```

* Defer
Go's defer statement schedules a function call (the deferred function) to be run immediately before the function executing the defer returns. 
```
// Contents returns the file's contents as a string.
func Contents(filename string) (string, error) {
    f, err := os.Open(filename)
    if err != nil {
        return "", err
    }
    defer f.Close()  // f.Close will run when we're finished.

    var result []byte
    buf := make([]byte, 100)
    for {
        n, err := f.Read(buf[0:])
        result = append(result, buf[0:n]...) 
        if err != nil {
            if err == io.EOF {
                break
            }
            return "", err  // f will be closed if we return here.
        }
    }
    return string(result), nil // f will be closed if we return here.
}
```
Live Streaming: learning the manim python library for mathematics animation
Published: 2020-05-09 17:26:43

The creator of the excellent [3blue1brown](https://www.youtube.com/channel/UCYO_jab_esuFRV4b17AJtAw) YouTube videos has an [open source library](https://github.com/3b1b/manim) with which he produces all his videos. I'm trying to learn to use it... [live](https://www.twitch.tv/leotrs1)!
Setting up Your React Project on Windows.
Published: 2020-05-09 17:15:55

This article is for beginners who needs some help setting up their react projects or oldies who needs a reference article each time (I check out my notes each time for the setup guide I noted down for a long time)

Alright, quickly.
Open up your command prompt or bash.

Remember: you need to have node installed before you can continue.
Download node here.

Step 1: 
CD into the parent directory you would want to house your react project.
In my own case, my documents
<code>

Step 2:
Run npm install.
<code>

Step 3:
use npm -v to check out the version of node in your system and to ensure your node package manager installed successfully.

Step 4:
Now its time to create our react app.

Use create-react-app -g myapp

<code>

-g installs the create-react-app globally so you don't have to run it each time you want to create an app inside that directory.

Myapp can be any name you want to give your project.

If your project was created successfully, you'd certainly see something similar to what I have here.

<img>

Step 5: 
You can also check out the version of your create-react-app

Step 6: 
Change directory into your app.

Step 7:
Run npm start to get your node running.

You've successfully compiled your first react project.

Congratulations🎉🎉🎉
Flutter Tutorial for Beginners
Tags: flutter, webdev, tutorial, beginners
Published: 2020-05-09 17:15:32

Doing mobile application development can be difficult especially when you have to install different modules and get things working on iOS and Android in sync. I come from a background in React Native, and wanted to learn and share what Flutter is like.

{% youtube 3zk4Oltga8Q%}
{% youtube jNVAAvhEniQ%}

This will be a small video/series on Flutter.

How it works, what it is, and how to get up and running using it.

In this video we cover:
- Installing Flutter
- Setting up dependencies for it to run
- Setting up VScode for Flutter
- Setting up Android Studio for Flutter
- Creating a Flutter App
- Running and testing Hot Reloading.

This is a quick guide but I hope you guys like it. If you are interested in more, follow me on twitter and youtube and I'll create more content around this.

## Follow and support me: 
Special thanks if you subscribe to my channel :)
* [🎞️ Youtube](https://www.youtube.com/channel/UCvM5YYWwfLwpcQgbRr68JLQ?sub_confirmation=1)
* [🐦 Twitter](https://twitter.com/adrian_twarog)

## Want to see more:
I will try to post new great content every day. Here are the latest items:
* [Adobe XD to Fully Responsive WordPress Site](https://dev.to/adriantwarog/adobe-xd-to-fully-responsive-wordpress-site-16e0)
* [Adobe XD to HTML Full Process](https://dev.to/adriantwarog/adobe-xd-to-html-full-process-ao6)
* [Full Tutorial on how to use SASS to improve your CSS](https://dev.to/adriantwarog/full-tutorial-on-how-to-use-sass-to-improve-your-css-57on)
* [Creating a Mobile Design and Developing it](https://dev.to/adriantwarog/creating-a-mobile-design-and-developing-it-5c4o)
[Tutorial Git] git mv: Renomeando ou movendo arquivos no Git
Tags: git, move, mv, braziliandevs
Published: 2020-05-09 17:00:09

Para renomear um arquivo do repositório, basta digitar o comando:

```
$ git mv <nome_antigo> <nome_novo>
```

- o símbolo **$** indica que você deve usar o **usuário comum** para fazer essa operação.
- substitua o \<nome_antigo> e \<nome_novo> pelos nomes do arquivo e o novo nome que deseja dar a ele, sem os sinais **<>**

Esse comando também é usado para mover arquivos do repositório. Exemplo:

```
$ git mv <arquivo> <diretorio/>
```

Exemplo:

Mudando o nome do arquivo **nintendo64.html** para **n64.html**.

![mudando o nome do arquivo nintendo64.html](https://dev-to-uploads.s3.amazonaws.com/i/sbtg9f6pnwafzltmzhkf.png)

Movendo o arquivo **estilo.css** para o **diretório css**.

![movendo o arquivo estilo.css](https://dev-to-uploads.s3.amazonaws.com/i/4rtl6j0w0nidgbtbrlkn.png)
100daysofcode Flutter
Tags: 100daysofcode, flutter
Published: 2020-05-09 16:56:21

day 61/100 of #100daysofcode #Flutter
Learning Flutter , courses Udemy from
@maxedapps

Today learn firebase authetication,implement some privider and future
https://github.com/triyono777/100-days-of-code/blob/master/log.md
Working with Laravel Livewire is fun
Tags: laravel, livewire, php
Published: 2020-05-09 16:55:45

Development with Laravel is always fun. The more I spend time with Laravel, I enjoy the Test Driven Approach.

Now, when any frontend development comes into picture, there is an entire range of things to do. Browser testing, Unit tests, Mock servers to test your services and APIs and what not. 

However, if you develop your frontend in Livewire, then even your front end code is in PHP. Which means, even your tests are in PHP. Plus, without writing any Javascript, you can create a complete SPA type application.

Under the hood, it doesn't return back JSON responses but rather HTML which is something even big giants like Github is also doing. And using smart dom diff, the new HTML is added to the dom and hence you get updates from the server based on user interactions.

It allows you to play will component lifecycle hooks as well which means, you can add behaviours based on change in state of the component and a lot more.

This in itself is a great thing. And, in this video I show you how you can get started with Livewire and start doing frontend development in PHP. Hope you like it.

{% youtube 2Lzn-VCpxD4 %}
SEO Can Be Deceiving - Especially in NPM Packages
Tags: npm, seo, react, reacthelmet
Published: 2020-05-09 16:37:45

I was recently working on head tag management in React apps, so I searched uncle Google for "react head manager." 

The entire first and second pages of results mentioned two packages, `react-helmet` and `react-head`. I had heard of React Helmet before, which has over 1 million weekly downloads and decent maintenance, while React Head was a lesser-known package with only 6.5 thousand weekly downloads and less maintenance. 

![react-helmet logo](http://static.nfl.com/static/content/public/static/img/logos/react-helmet.jpg)

It seemed like a no-brainer at first: `react-helmet` was the way to go. But I asked myself, what motivated someone to use `react-head` and *what motivated* 6,500 people to use it weekly?

I looked deeper: the `react-head` documentation linked to [an article](https://jeremygayed.com/making-head-tag-management-thread-safe-with-react-head-323654170b45) which discussed some issues with `react-helmet`, mostly that it isn't thread-safe which can lead to problems with SSR.

I investigated more and found out that [`react-helmet-async`](https://www.npmjs.com/package/react-helmet-async) was forked off `react-helmet` by the fantastic React team at the New York Times, and this package has fixed the SSR / async issues from `react-helmet`. `react-helmet-async` has 1.6 million weekly downloads and growing, better maintenance than the other choices, and less open issues and a smaller bundle size than `react-helmet`.

For my team, `react-helmet-async` is the clear choice. But a Google search didn't mention it until the third page of results! Takeaways:

1. JS developers often suffer from "just use the first package we can find from NPM - get the job done!" Instead, take the time to research and compare packages.

2. Get in the habit of questioning: ask yourself why two packages are both maintained if they do roughly the same thing, for example. Ask yourself why two string methods exist, if they accomplish roughly the same thing (maybe one performs better for example). Ask questions.

{% twitter 1259159879702450177 %}
"docker artifact" CLI Plugin
Tags: docker, bash, devops
Published: 2020-05-09 07:21:17

![docker lego](https://dev-to-uploads.s3.amazonaws.com/i/uctjq08p0o9m1lhvlk6c.png)

Hey everyone, my name is Tom Shaw and I've been a Docker user since 2013, Docker Community Leader and Docker Captain since 2015.  This is my first time posting to dev.to and I wanted to share a side project that I've been working on. 

# What does "docker artifact" do ?

The "docker artifact" CLI plugin is a simple little plugin which allows you to pull individual artifacts (files) from a Docker Image in Docker Hub without pulling the whole image. Feel free to use the code as it is or fork it. Pull requests welcome too.

```
Usage : docker artifact [command]

Command :

 	ls    - List all files available to get 
	get   - Get a file (or multiple files) from an Image 
	label - Add a LABEL to file (or multiple files) inside an Image 

Examples : 

	docker artifact ls tomwillfixit/healthcheck:latest 
	docker artifact get helloworld.bin tom.jpg tomwillfixit/healthcheck:latest 
	docker artifact label helloworld.bin tom.jpg tomwillfixit/healthcheck:latest
```


# How does this work ?

We use Docker [Labels](https://docs.docker.com/config/labels-custom-metadata) to point at the "sha256" value of the artifact or multiple artifacts that we want to make available for download. Then we use curl to download the single "blob" (tar bundle) from Docker Hub which contains the artifact we need.

# Why would you do this ?

When building a Docker Image it's quite common to copy a file or directory from another Image. For example :
```
COPY --from=tomwillfixit/test:latest /tmp/shipitcon.jpg /tmp
```

This may be repeated a number of times within the Dockerfile, particularly for those using [Multi Stage Builds](https://docs.docker.com/develop/develop-images/multistage-build/).

This is a fine approach to take but it is quite wasteful. The "COPY --from" directive downloads the whole image in order to access the file or directory you specify.  Using the "docker artifact" CLI we only download the artifact we need.

In a comparison between "COPY --from" and "docker artifact" we were able to reduce build time by 40% when copying a single file from a 60mb image on a freshly installed system (no build cache).

For more details on how to use the plugin and how to add a CLI plugin to Docker then checkout the GitHub repository [here](https://github.com/tomwillfixit/docker-artifact).

Disclaimer : This is just a side project so the code may be a little rough. Pull requests are welcome. There is also a Medium post with more details available [here](https://medium.com/@thomas.shaw78/extracting-a-single-artifact-from-a-docker-image-without-pulling-3fc038a6e57e).

If you have zero interest in this plugin you can still use this approach to extend Docker by creating your own CLI plugins. 

Thanks for reading.

Twitter : [@tomwillfixit](https://twitter.com/tomwillfixit)
Does SCSS take more space or load slow?
Tags: css, webdev, html, javascript
Published: 2020-05-09 16:19:54

Hi Guys,
Today I was surfing on youtube and at a sudden a SCSS crash course pops up. Then, obviously I check it out. It seem to be very good and definitely easy.

But after watching it. I thought if their will be more files of stylesheet it will take more time and more space. So I googled it, but don't find anything.

So, please the Good/Experienced *DEVs*. Give some knowledge..
TetraQuicky09: Get back autocomplete in a Docker container
Tags: docker, ubuntu, bash
Published: 2020-05-09 15:30:09

How many time you shouted as crazy because you could get autocomplete in an ubuntu docker container...

Well: that's life; it is like this by design for a gazillion of very good reasons. Never the less if you are not a genius that can manage to get a container working at the first untested write of the `Dockerfile`, chances are that you need to `-it /bin/bash` in a container to understand what the hell it's going on. 

And it is there where you understand that life has been unfair with you. You don't have the auto-complete. 

But, getting it back, is very easy...

Just install the bash autocompletion:
```bash
$ apt-get install bash-completion
```
and remove one file
```bash
$ rm /etc/apt/apt.conf.d/docker-clean
```
then you have to exit from there...
The container will die. Again: that's life.
But if you `docker ps -a` you get the `id` of the container you just kill it and you restart it and you attach to it... 
```bash
docker start <last container>
docker attach <last container>
```
a couple of ENTER keys and... Voila'!! 

You can TAB ... TAB all your life that has been wasted so far in cmd.com not tab tabbing. :)

Peach, stay home and stay safe!!
User test, updated
Tags: css, frontenddeveloper, html, javascript
Published: 2020-07-01 05:18:47

---
title: User test, updated
published: true
date: 2020-05-09 15:28:00 UTC
tags: CSS,Frontenddeveloper,HTML,JavaScript
canonical_url: https://drmsite.blogspot.com/2020/05/user-test-updated.html
---

[![](https://2.bp.blogspot.com/--li4oQ-oj34/XrbMtLfqe8I/AAAAAAAAmXw/0FrgRp4Y14w9JHSHrQElyD1SmvLNIqafwCLcBGAsYHQ/s400/three_girls_sitting_in_vehicle_backseat-scopio-59b397fb-17a3-4d1d-b5ca-58af1459d1e5.jpg)](https://2.bp.blogspot.com/--li4oQ-oj34/XrbMtLfqe8I/AAAAAAAAmXw/0FrgRp4Y14w9JHSHrQElyD1SmvLNIqafwCLcBGAsYHQ/s1600/three_girls_sitting_in_vehicle_backseat-scopio-59b397fb-17a3-4d1d-b5ca-58af1459d1e5.jpg)
<link href="https://fonts.googleapis.com/css?family=Barlow&amp;display=swap" rel="stylesheet"><label style="display:flex; justify-content: start; align-items: center; font-family: Barlow"><a style="display:flex; align-items: center" href="https://scop.io"><img style="margin: 0px 10px 0px 0px" src="https://cdn.shopify.com/s/files/1/2395/7099/t/46/assets/icon_2x.png?v=17766308506443902960" height="20x"></a> By <a style="text-decoration: none; margin: 0px 5px;" href="https://scop.io/collections/vendors?q=Jenn+O%27Hara">Jenn O'Hara</a></label>

In my [forthcoming book](https://www.amazon.co.uk/Front-End-Developer-BCS-Guides-Roles/dp/1780174764/), I make significant use of a piece of research I carried out some years back on how users could enter data about their family. The example was contrived, but it served its purpose. I talk about how I could've used a <abbr title="Single Page Application">SPA</abbr> but that at that time I wasn't comfortable building them. I also wax lyrical about Native JavaScript Modules along with various other technologies, so last weekend and this I spent some time putting my money where my mouth is.

I set out to replicate the original statically hosted application using Vue, Vuex and Vue-Router, and I'm quite pleased with the result. Then I got a little carried away and updated Bootstrap from v3 to v4. I also dusted out my old Font-awesome account and threw taht into the mix, along with some SCSS, just for fun!

It's nigh on where I want it to be TBH, except I can't get the router to work correctly; going to any page other than the home page throws an error. Scratch that: I'm hosting on repl.it so I need to use the "hash" mode for the router rather than "history". Simples, eh?

- Anyway, here it is: [https://usertestupdated--annoyingmouse.repl.co/](https://usertestupdated--annoyingmouse.repl.co/)
- The original is here: [https://usertest--annoyingmouse.repl.co/](https://usertest--annoyingmouse.repl.co/)

I also ran the text through Grammarly.