teleren/devto huggingface dataset:
Lando and Flask
Tags: docker, lando, python, flask
Published: 2020-02-12 14:14:47

---
title: Lando and Flask
published: true
description: Lando is a Docker abstraction that simplifies local development.
tags: Docker, Lando, Python, Flask
---

## Requirements

You'll need Lando installed, and that's it.

## Setting up Lando

Get into your project directory, and get things started with a Lando file.

```
cd my-project
touch .lando.yml
```

Name your Lando project and define a python service.

```yml
name: flask-example
services:
  python:
    type: python:3.5
```

Expose `python` and `pip` command line tools.

```yml
tooling:
  pip:
    service: python
  python:
    service: python
```

## Install Flask

Fire up the container, and let's get the requirements going. From the command line, run:

```
lando start
lando pip install Flask
lando pip freeze > requirements.txt
```
> **Note:** It may be the case that this will add carriage return characters to your `requirements.txt` file. In that case, you may have to run `lando ssh -s python -c 'pip freeze > requirements.txt'` instead.

Now tell lando that we want it to install requirements during build.

```yml
services:
  python:
    type: python:3.5
    build:
      - 'pip install -r /app/requirements.txt'
```

## Build an app

Build your `app.py` file, specifying the host as `0.0.0.0`, with no port. 

```python
from flask import Flask
app = Flask(__name__)


@app.route('/')
def hello():
    return "Hello World!"


if __name__ == '__main__':
    app.run(host = '0.0.0.0')
```

Flask defaults to port 5000, so let's set up our Lando proxy with that port exposed internally.

```yml
proxy:
  python:
    - flask-example.lndo.site:5000
```

Tell lando to run the python app at startup.

```yml
services:
  python:
    type: python:3.5
    build:
      - 'pip install -r /app/requirements.txt'
    run:
      - python /app/app.py
```

## Conclusion

Your Lando file will finally look like the following.

```yml
name: flask-example
proxy:
  python:
    - flask-example.lndo.site:5000
services:
  python:
    type: python:3.7
    build:
      - 'pip install -r /app/requirements.txt'
    run:
      - python /app/app.py
tooling:
  pip:
    service: python
  python:
    service: python
```

Enjoy!
Linux yum update command tutorial
Tags: linux, tutorial, beginners
Published: 2020-02-12 14:28:25

---
title: Linux yum update command tutorial
published: true
description: 
tags: #linux #tutorial #beginners
---

1 How does yum update work?
2 Update without gpg checking
3 Update from a local repo
4 Show patches
5 Update a single package
6 Update all but one package
7 Exclude multiple packages
8 Check when last yum update ran
9 Rollback (revert) update
10 Clean up a failed yum update (Troubleshooting)
11 Skip errors
12 Get a list of packages that need an update
13 Difference between yum check updates and list update
14 Notify when updates are available
15 What port does yum update use
16 Yum update vs upgrade

https://likegeeks.com/yum-update-command/
CSS Pseudo-classes and Pseudo-elements
Tags: css, webdev, html
Published: 2020-02-12 14:25:42

##### CSS3 brought the distinction between pseudo-classes and pseudo-elements with the double-colon (::) syntax to denote the latter. Let's go over what pseudo-classes and pseudo-elements are and what they are used for!

I won't go into EVERY pseudo-class and pseudo-element, which would likely bore you as the reader and me as the writer. Thankfully, someone has already created a complete guide to all of these at the time of writing! You can checkout [Ricardo Zea's An Ultimate Guide To CSS Pseudo Classes and Pseudo Elements](https://www.smashingmagazine.com/2016/05/an-ultimate-guide-to-css-pseudo-classes-and-pseudo-elements/). And, as always, [CSS Tricks](https://css-tricks.com/) and the [MDN's pseudo-class and pseudo-element docs](https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements) are fantastic resources.

## What is a pseudo-class?
Pseudo-classes are like an "injected" class into an element. They have the same specificity as regular CSS classes since it behaves like a class. Pretty simple, they just act like CSS classes! 

You can use them to add styles in specific states, such as when a navigation item is active (using `:active`) or a form element is disabled (`:disabled`). You can also add styles to the element depending on where it is in relation to its siblings (`:nth-child(N)`) or if the element is (`:is()`) or is not (`:not()`) a particular element or has a specific class, id, pseudo-class, or attribute selector.

## What is a pseudo-element?
A pseudo-element is like a virtual element. It doesn't exist in the DOM, but we can manipulate it as we would regular ole HTML. Since it is like targeting an element, pseudo-elements have the same specificity as an element selector.

Pseudo-elements are great to use when you don't necessarily need or want to add an extra element to the DOM to accomplish a specific task. They can be used to bold the first line or letter (`::first-line` and `::first-letter` respectively) of a paragraph, or add visual-only information (like with `::before` and `::after`).

## Considerations

It's worth noting here that information placed in the `content` property may not be accessible to assistive technologies and likely will not get translated into other languages, since that information does not exist in the document tree. We'll discuss this further in a dedicated blog post.

Also since the double-colon (::) selector is new to CSS3, it's not supported by older browsers, namely older versions of Internet Explorer (IE8 and below). You could certainly use the single-colon (:) selector for both pseudo-classes and pseudo-elements for backward compatibility. As always, make sure you're considering where your site or application will be used before making the decision to use newer syntax. 

**📣 I intend to write a dedicated blog post for the `::before` and `::after` pseudo-elements. Are there any other pseudo-classes or pseudo-elements you'd like to learn more about? Let me know!**

*Title image from [Undraw](https://undraw.co)*
Trimming go binaries of dpcmder - trimming a compression time :)
Tags: go, dpcmder, upx, compression
Published: 2020-02-12 14:07:57

Preparing for the next release of [dpcmder](https://github.com/croz-ltd/dpcmder) I wanted to do some more testing of release binaries compression achievable using [UPX](https://upx.github.io/) and find out I can achieve *40 times faster compression* just by changing single upx compression flag.

Note: this continues where the last post about [dpcmder binaries compression](https://dev.to/vvidovic/trimming-go-binaries-of-dpcmder-1lhg) finished.

I realized there are some upx flags I didn't test (for example "--ultra-brute" or "--best") and read a bit more about them. In the end, it seems (for dpcmder binaries at least) best compression results are achieved using the "--lzma" flag:
```
$ time upx --lzma release.lzma/*
                       Ultimate Packer for eXecutables
                          Copyright (C) 1996 - 2013
UPX 3.91        Markus Oberhumer, Laszlo Molnar & John Reiser   Sep 30th 2013

        File size         Ratio      Format      Name
   --------------------   ------   -----------   -----------
   9146368 ->   2812760   30.75%  linux/ElfAMD   dpcmder-linux-amd64           
   9697256 ->   2789376   28.76%   Mach/AMD64    dpcmder-mac-amd64             
   8932352 ->   2610688   29.23%    win64/pe     dpcmder-win-amd64.exe         
   --------------------   ------   -----------   -----------
  27775976 ->   8212824   29.57%                 [ 3 files ]

Packed 3 files.

real	0m23.254s
user	0m22.911s
sys	0m0.196s
```

Seems that the "--brute" flag makes upx tries many different algorithms and selects one which achieves the best result. The "--ultra-brute" flag tries even more compression algorithms so it takes even more time. In my case (dpcmder binaries built on my Linux machine) best result is achieved using the lzma compression algorithm. As you can see from outputs of both upx run timings, result compression is exactly the same while time spent for compression is drastically faster (more than *40 times*) when using "--lzma" flag.

```
$ time upx --brute release.brute/*
                       Ultimate Packer for eXecutables
                          Copyright (C) 1996 - 2013
UPX 3.91        Markus Oberhumer, Laszlo Molnar & John Reiser   Sep 30th 2013

        File size         Ratio      Format      Name
   --------------------   ------   -----------   -----------
   9146368 ->   2812760   30.75%  linux/ElfAMD   dpcmder-linux-amd64           
upx: release.brute/dpcmder-linux-amd64.upx: UnknownExecutableFormatException
   9697256 ->   2789376   28.76%   Mach/AMD64    dpcmder-mac-amd64             
   8932352 ->   2610688   29.23%    win64/pe     dpcmder-win-amd64.exe         
   --------------------   ------   -----------   -----------
  27775976 ->   8212824   29.57%                 [ 3 files ]

Packed 3 files.

real	15m39.952s
user	15m37.567s
sys	0m1.408s
```
Typescript Models and JavaScript Objects
Published: 2020-01-23 17:04:21

Given a Javascript (JSON) Object like this:

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/a8kemwv5qeeq12j3q9xp.PNG)

**The Typescript Model Equivalent**

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/cuitjj1cgq174ejud5cp.PNG)

**Morphing JSON objects to Strong Types**

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/rpx71oeh7mejlzgkvyv9.PNG)

**The JSON Object with a Name**

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/z8bbs637x4naw8yp16he.PNG)

**Differences?**

The variable *test* allows any object name and any value type. It has no contract on what it contains. Intellisense shows all properties on the 'test' object.

**Conformity and Optional Values**

The *settingDisplay* variable must conform to the *settingDisplay* class model.  All property values must be of the type specified. If they are non conformant, an error at code-time is seen.

See the *checked?* variable in the Typescript model?  This is an optional variable.  It is the reason why the *settingDisplay* assignment did not need to specify it in the JSON object. Intellisense works here too.

**Implicit Interfaces**

The interface is implicitly defined within the class object, no need for a separate Interface definition.

The only time one may want to consider an Interface definition, is when functions require a specific type to work correctly. This is useful for testing in which the test can inject a mock object that follows *the shape* of the expected input. No Jasmine mocking needed when interfaces are used.

This is the essence of Typescript code-time type checking. Static type-checking saves time (majorly). 

Just say no to run-time type error discovery. It's a colossal waste of time. 

JWP2020
golang playground
Tags: go, beginners
Published: 2020-02-12 14:04:28

<a href="https://golang.org/">Go</a> is an open source programming language that makes it easy to build simple, reliable, and efficient software. Do you want to start with Golang as quick as possible? 

You can use the online <a href="https://play.golang.org/">go playground</a>. This lets you run Go programs right from your web browser. 

If you prefer having golang on your computer, you can <a href="https://golangr.com/install/">install</a> Golang on your pc. While it may take some time to install, you can then use your favorite IDE with golang.

## Go playground

The go playground presents you with an interface where in yellow pane where you can type your Go code. It already shows some code when opening:

```go
package main

import (
	"fmt"
)

func main() {
	fmt.Println("Hello, playground")
}
```

This is a basic program that you can run, but you can change the code if you want to. On top there is the navigation, click *run* to run the Go program.

You'll see it output the current program below the yellow pane.

![go playground](https://dev-to-uploads.s3.amazonaws.com/i/xb0xrckpb3vjmc4torw9.png)

By default it runs the <a href="https://golangr.com/hello-world/">hello world</a> program. There's a share button in the go playground, which lets you share your code online.

So where to go from here?

You could try some go tutorials like the <a href="https://tour.golang.org/welcome/1">golang tour</a> or a <a href="https://golangr.com/">traditional tutorial</a>.
Trafegando dados entre componentes com inbound property (@Input) 
Tags: angular, beginners
Published: 2020-02-12 13:31:37

Para quem está começando a utilizar o framework Angular, eu irei apresentar algo que será utilizado com frequencia, então, é importante que saiba muito bem como e quando utilizar. Vou mostrar o funcionamento do decorador <strong>@Input</strong>.
 
<h2>Para que serve?</h2>
A arquitetura do angular nos permite criar diversos componentes, e esses componentes podem ser utilizados dentro de outros componentes. Em muitos casos, é necessário trocar informações entre o componente pai e o componente filho, e aí que entra o @Input. O @Input é responsável por facilitar a comunicação de pai para o filho. O nome @Input passa a ideia de inserção de um valor, que é o que acontece na visão do componente filho.

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

<h2>Exemplo prático</h2>
Vamos começar mostrando o que o componente pai deve implementar para que consiga passar um dado para o seu componente filho. Ele simplesmente deve criar a varável que será passada. Esta variável pode ser de qualquer tipo, no exemplo utilizamos uma string:

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


Perceba que criamos a variável chamada, <strong>variavelDoPai</strong> e inserimos o valor <strong>"Angular"</strong>.
Para passar a variável, vamos ao html do componente pai. Lá passamos a variável junto ao selector do componente filho, da seguinte forma:

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

Repare que, entre aspas está a propriedade fonte que é a variável do pai. E entre colchetes está a variável alvo, que é a do componente filho.

Agora, vamos implementar a parte do filho. No TypeScript do componente filho, criaremos a variável que irá receber o valor. Como visto na figura anterior, o nome que escolhemos para a variável é, <strong>variavelDoFilho</strong>. Então iremos declara-la com o decorador @Input como mostra a imagem:

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

Caso esta variável seja utilizada em tela, é preciso apenas fazer um data binding:

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


Espero que esse texto tenha ajudado a você que está começando!
python server socket
Tags: python, beginners
Published: 2020-02-12 13:13:15

In <a href="https://python.org">Python</a> you can do network programming. You may be familiar with network programming at high level (the <a href="https://en.wikipedia.org/wiki/World_Wide_Web">web</a>, <a href="https://en.wikipedia.org/wiki/File_Transfer_Protocol">ftp</a>). 

This uses the **client-server** model, where the server sends the data (web, ftp) and the client is your computer. Upon typing the website url, the web data is returned from the <a href="https://pythonbasics.org/webserver/">web server</a>.

On the web, every web browser is a client and every website runs on a server. Typically there are many web browsers connecting to the same server (website).

<img src="https://dev-to-uploads.s3.amazonaws.com/i/c3s6fhdlxtg3kcsaserv.png" alt="cient server">

But did you know you can program low-level and create your own protocols?

Welcome to the world of <a href="https://docs.python.org/3.8/library/socket.html">sockets</a>. You can use sockets to create your own server or client. Before playing with Python, you should know the <a href="https://pythonbasics.org/">basics of Python</a>


## Socket server

Lets create your own socket server. You can do this by following a few steps:

* import sockets
* define host and port
* wait for client
* parse client data (and send)

First import the sockets module:

```python
import socket
```

Then define the host and port

```python
HOST = ''                 # Symbolic name meaning all available interfaces
PORT = 50007              # Arbitrary non-privileged port
```

Open the server and wait for a client:

```python
s = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
s.bind((HOST, PORT))
s.listen(1)
conn, addr = s.accept()
print 'Connected by', addr
```

Then you can wait for data (or send data) and parse it according to your protocol. Data could be in plain text, <a href="https://pythonbasics.org/json/">json</a>, <a href="https://docs.python.org/3/library/xml.html">xml</a> or any other format. If you are implementing an existing protocol, you should use the one defined.

```python
while 1:
    data = conn.recv(1024)
    if not data: break
    conn.sendall(data)
conn.close()
```

That's all there is to it to startup a server. Make sure your firewall isn't blocking the server and that you have the user permissions to open a server.

## Telnet client

If your server is running, open a new terminal. In the new terminal you can use telnet to connect to the server

```
telnet 127.0.0.1 50007
```

Where 127.0.0.1 is your computer (loopback ip) and 50007 is the port you opened in the server program. Once connected try to send some data and take a look at your server terminal. If you need to, you can also create a socket client in Python.

**Related links:**
* <a href="https://pythonspot.com/python-network-sockets-programming-tutorial/">Sockets examples for Python</a>
* <a href="https://docs.python.org/3.8/library/socket.html">Python docs for socket module</a>
* <a href="https://pythonbasics.org/">Learn Python</a>
Letting users search the database with a simple one-liner string (and let user decide which field to search)
Tags: javascript, webdev, typescript, showdev
Published: 2020-02-12 13:04:08

Which is obviously not JSON, YAML or SQL.

I recently did this for <https://learn-unicode.now.sh>, which does come from this topic.

{% link https://dev.to/calin92540842/minuscule-f-markup-in-html-20d9 %}

The solution is inspired from [lunr.js](https://lunrjs.com/guides/searching.html) which for some reasons, support searching by field; but is rare in other search engines. Also, for some reasons, lunr.js, by default, join the fields with OR, instead of AND, which is unintuitive.

{% github patarapolw/qsearch no-readme %}

Generating JSON for usage in search in NoSQL's is relatively easy, tested for MongoDB, LokiJS, NeDB and `Array.prototype.filter`. I also noticed some differences.

LokiJS doesn't allow

```js
{
  'data.a': { $regex: /b/i }
}
```

Or its equivalent `data.a:b`.

Joining with AND or OR, and allow quotes is not as complex as it seems, due to [shlex](https://github.com/rgov/node-shlex) and `/^[-+?]/` prefixes. However, I don't allow brackets this time, because it would get complex. I have [tried to do it before](https://github.com/patarapolw/q2filter), though.

If you are kind, I am looking for library testers. See if you can break it.

<https://q2search.herokuapp.com/>
Daily Developer Jokes - Wednesday, Feb 12, 2020
Tags: jokes, dailydeveloperjokes
Published: 2020-02-12 13:00:28

---
title: "Daily Developer Jokes - Wednesday, Feb 12, 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=Wednesday%2C%20Feb%2012%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/5e1258c20b362.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 computer keep sneezing?

___A:___ It had a virus!
 -->
Adventures in scaling & migrating between large-scale production systems
Tags: todayilearned, scaling, startup
Published: 2020-02-12 13:00:23

*TL;DR notes from articles I read today.*

### [Our adventures in scaling](http://bit.ly/38isk8I)

- Handling sudden activity spikes poses different challenges than scaling a rapidly growing user base.
- Check whether databases are resource-constrained and hence slowing down. Check hardware metrics during spikes to check on CPU, disk i/o and memory.
- If there are no spikes in those metrics, look higher up the infrastructure stack at service resources for increased resource acquisition times. Also, check the garbage collection activity, which indicates whether JVM heap and threads are the bottlenecks. 
- Check network metrics next to look for a constraint in the network between services and databases - for example, if the services’ database connection pools are consistently reaching size limits.
- To collect more metrics, log the latency of all transactions and collect those higher than a defined time, which should be analysed across daily usage to determine whether removing the identified bottleneck would make a significant difference.
- Some of the bottlenecks may be code-related, for example, inefficient queries, a service is resource-starved, inconsistencies in database response itself - so look for metrics on higher-level functioning and not just low-level system components.

*[Full post here](http://bit.ly/38isk8I), 6 mins read*

---

### [Migrating functionality between large-scale production systems seamlessly](https://ubr.to/2tUMR4s)

Lessons from Uber’s migration of its large and complex systems to a new production environment:
- Incorporate shadowing to forward production traffic to the new system for observation, making sure there would be no regressions. This lets you gather performance stats as well. 
- Use this opportunity to settle any technical debt incurred over the years, so the team can move faster in the future and your productivity rises.
- Carry out validation on a trial and error basis. Don’t assume it will be a one-time effort and plan for multiple iterations before you get it right. 
- Have a data analyst in your team to find issues early, especially if your system involves payments.
- Once confident in your validation metrics, you can roll out to production. Uber chose to start with a test plan with a couple of employees dedicated to testing various success and failure cases, followed by a rollout to all Uber employees, and finally incremental rollout to cohorts of external users.
- Push for a quick final migration, as options for a rollback are often misused, preventing complete migration. 

*[Full post here](https://ubr.to/2tUMR4s), 6 mins read *

---

*[Get these notes directly in your inbox every weekday by signing up for my newsletter, in.snippets().](https://mailchi.mp/appsmith/insnippets?utm_source=devto&utm_medium=post08&utm_campaign=is)*
10 years easier or harder?
Tags: discuss
Published: 2020-02-12 12:38:34

---
title: 10 years easier or harder?
published: true
description: 
tags: #discuss
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/28svduydcl7fo7tq7e3n.jpg
---



Is it easier building web application today or has it become more harder compared to 10 years ago?