teleren/devto huggingface dataset:
Do you ¿ UTF-8? It's easier than you think
Tags: misc
Published: 2020-04-01 15:59:38

---
title: Do you ¿ UTF-8? It's easier than you think
published: true
date: 2020-03-04 21:19:00 UTC
tags: Misc
canonical_url: https://www.petefreitag.com/item/895.cfm
---

Understanding how UTF-8 works is one of those things that most programmers are a little fuzzy on. I know I often have to look up specific on it when dealing with a problem. One of the most common UTF-8 related issues that I see has to do with MySQL's support for UTF-8. Also known as _how do I insert emoji into mysql?_

The TLDR answer to that question is that you have to use the `utf8mb4` encoding, because MySQL's `utf8` encoding won't hold an emoji. But the longer answer is sort of of interesting and not as hard as you might think to understand.

**So UTF-8 can take 3 or 4 bytes to store?**

Encoding a character with UTF-8 may take, 1, 2, 3, or 4 bytes (early versions of the spec went up to 6 bytes, but was later changed to 4).

What’s cool about UTF8 is that if you are only using basic ASCII characters (eg, character codes 0-127) then it only uses 1 byte. Here’s a handy table that shows how many bytes it takes to encode a given character code in UTF8:

| Character Code (decimal) | Bytes Used |
| --- | --- |
| 0-127 | 1 byte |
| 128-2047 | 2 bytes |
| 2048-65535 | 3 bytes |
| 65536-1114111 | 4 bytes |

So hopefully that helps you 😍 UFT8. BTW that emoji is `1F60D` in hex, or `128525` in decimal, which means it takes 4 bytes to store in unicode.

**So why can't MySQL uft8 store an emoji?**

The `utf8` encoding in MySQL can only hold up to 3 bytes UTF-8 characters, and UTF-8 actually supports up to 4 bytes. I don’t know why they choose to limit `utf-8` to 3 bytes, but I will speculate that they probably added support while uft8 was still not officially standardized, and assumed that 3 bytes will be plenty big enough.

So to get the real UTF-8 in MySQL you need to use `utf8mb4` encoding. Which can store all 4 bytes of a Unicode character, including emoji.

**UTF-8 != Unicode**

I've probably mistakenly used the terms `UTF-8` and `Unicode` interchangeably in the past, it's a common mistake, so let's clarify the difference.

Unicode is a character set standard, it specifies what character a given character code maps to. In Unicode parlance they call the character codes _code points_. This is probably just to confuse you. There are many ways to encode a unicode string into binary, and this is where the different encodings come in to play: UTF-8, UTF-16, etc.

UTF-8 is a way of encoding the characters into bytes. Now if they decided to use 4 bytes for every character, it would have wasted a lot of space (since the most commonly used characters (at least in the english) can be represented using only 1 byte. Although UTF-8 is defined by Unicode and was designed for Unicode, you could invent another character mapping standard and use UTF-8 to store it.
responsive web design
Published: 2020-03-04 21:12:51

Responsive design is the next big thing in web design. Basically, what responsive design is, is a way to make your website adaptable to different viewports, so that no matter what kind of device or screen size you are using, the website is optimized for that particular viewport. It is mostly to make your website mobile friendly. In today’s world with more and more people accessing the web through mobile devices, you want to make sure your website is usable, accessible and user-friendly for mobile devices and responsive design is the best way to do that.
Alternatively, you would make 2 different websites that are optimized for their particular viewport, but that required more effort and can be more expensive to manage. Even though there are a couple drawbacks to responsive design, as there are with any other design type, overall it is the best option.
waybackmachine February 20'
Tags: kubernetes, bash, fun
Published: 2020-03-04 21:06:27

>... because it's always fun to go back in time and remember how it was back then ...


# CLI :: The power of $tee

tee command is helpful when you need to store and view, both at the same time, the output of any given command.

usage example:

- When you need to save a sudo requiring file while inside a non-sudoed vim execution, without quitting vim. ([usage explanation](https://stackoverflow.com/questions/2600783/how-does-the-vim-write-with-sudo-trick-work))

`` :w !sudo tee %``

I'm quite sure you'd agree with this being the first most common usage of tee.

- When needing to examine the too-long output of an executable JAR.
I wanted to have a look at the complete log in detail (being able to search over it). In other words, I wanted to execute it and have the output both in the sysout and in a file.

```bash
$ java -jar runnable-jar.jar | tee log.txt
```

---

# CLI :: watch the Kubernetes

watch is one of my favourite commands when working with async scopes where the task result is delayed in time.

example of usage:

- watch the application of certain configuration over Kubernetes

```bash
$ kubectl apply -f config.yaml
$ watch kubectl get pods | nodes | services | whatever resource
```

- another common usage I make of it, is when working on a specific API endpoint returning a JSON content-type, as a quick test assurance.
I just watch whether the specific desired expression is being satisfied over time

```bash
$ watch "http :8080 /whateverendpoint | jq 'whatever expression'"
```

---

# watch :: MIT missing semester

I would have loved having this resource while I was in the uni, but yet now, I'm enjoying watching it.

MIT has released a bunch of videos (1h approx each) about the following basic topics:

- The shell
- Shell Tools and Scripting
- Editors (vim)
- Data wrangling
- CLI
- Version control (git)
- Debugging and profiling
- metaprogramming
- security and cryptography
- potpurri and Q&A


Hope you enjoy them as much as I and thanks to whoever started spreading the word on my twitter TL

{% youtube Z56Jmr9Z34Q %}

---

# the w00t? :: [ELMO](https://www.leanproject.com/news/enough-lets-move-on-elmo/)

> Whenever the meeting discussion starts to run off track the chair picks up Elmo to indicate "Enough Let’s Move On" 


---

# a pic :: time to move to an autogen password manager?

Been thinking about this for a while and think I'm gonna start trying the autogen key of Firefox Lockwise mode


![password strength craking](https://pbs.twimg.com/media/EAfIvuXXoAE64PM?format=jpg&name=4096x4096)
source: [@terahashcorp](https://twitter.com/terahashcorp/status/1155112559206383616)

---

# humor strip :: [turnoff](http://turnoff.us)

Just came across this IT comic strip, which has become my welcome tab on the browser.

![malloc joke](http://turnoff.us/image/en/bad-malloc.png)



---

# monthly ear hook :: SandwitchTunes

A groovy version with blues harp!

{% soundcloud https://soundcloud.com/sandwichtunes/heart_soul %}
Bootstrap Preface
Tags: bootstrap, greatness
Published: 2020-03-04 20:52:01


Frontend development can be separated into two eras; before and after Bootstrap.
The reason for this is that in 2011, the greatest frontend framework ever was released. 
For example, before this time, if you wanted to code a nice-looking button, you had to declare a lot of styles and classes in your code. The greatness of Bootstrap is in its components, which can be copied and pasted, the stylesheet is another and the last aspect is the JavaScript plugin.

Basically, it made repetitiveness obsolete if you learn how to use it.
Setting up TailwindCSS in Laravel project
Tags: laravel, tailwindcss, laravelmix
Published: 2020-03-04 20:37:16

---
title: Setting up TailwindCSS in Laravel project
published: true
description: Set up Tailwind CSS in a Laravel project.
tags: laravel, tailwind, tailwindcss, laravelmix
---

Make sure [Composer](https://getcomposer.org/) and [npm](https://www.npmjs.com/get-npm) are installed before you begin!  (Note:  If you prefer using SASS or LESS, the below tutorial may not be applicable.)

If you haven't set up Laravel yet, follow the steps below. Otherwise, skip these two steps. 

1.  Run `composer global require laravel/installer`
2.  From command line, `cd` into the directory you want to install Laravel in and run `laravel new myProjectName`.  A folder titled `myProjectName` will be created with Laravel installed in it.


### Install Laravel dependencies
Navigate to your project's root folder (`cd myProjectName`) and run:

```
npm install 
npm install tailwindcss
```

Then run:

```
cd resources
mkdir css
```

The above commands will create a folder named `css` in `resources`.  

In `resources/css`, create a file named `tw.css` (or whatever name you prefer - just be sure to substitute your file's name for `tw.css` in this tutorial).  This file will contain your uncompiled Tailwind CSS.  Here, you can add `@tailwind base;`, `@tailwind components;`, `@tailwind utilities;`, etc.

Next, navigate to `webpack.config.js` in your project's root folder.  Add the following code snippet:

```
mix.postCss('resources/css/tw.css', 'public/css', [
        require('tailwindcss'),
    ])
    .js('resources/js/app.js', 'public/js')
```

Run `npm run dev`.  After Laravel Mix has finished building successfully, you should have a file in `public/css` containing built Tailwind CSS.  To link to this asset in your project, add the following code:

```
<link href = {{ asset('css/tw.css') }} rel = "stylesheet" />
```

Now you should be all set to go.  Happy coding!
Quick Lists:  Free places to run/store code snippets online
Tags: lists, free, codesnippets, snippets
Published: 2020-03-04 20:23:10

---
title: Quick Lists:  Free places to run/store code snippets online
published: true
description: A list of free online websites to run HTML, CSS, and JavaScript code snippets.
tags: lists, free, code snippets, snippets
series: Quick Lists
---

- [Codepen](https://codepen.io)

- [JSFiddle](https://jsfiddle.net)

- [Glitch](https://glitch.com)

- [Repl.it](https://repl.it) - includes languages and environments besides plain HTML, CSS, and JavaScript

- [JSBin](http://jsbin.com)
PHP localhost everywhere on macOS
Tags: php, localhost, terminal, macos
Published: 2020-03-04 19:13:47

Als ich mal nach irgendwelchen Browser Erweiterungen suchte um kurz mal eine PHP Datei auf dem Desktop zu testen, wurde ich nicht wirklich fündig. Jedoch ist dies einfacher den je. Und zwar mit einem einfachen Befehl im Terminal:
```
php -S localhost:3000 -t /rootpath/to/your/folder/
```
Das ganze hat mehrere Vorteile. Der Port kann selbst bestimmt werden, es können mehrere localhosts gleichzeitig genutzt werden und man hat im Terminal so etwas wie eine log Datei.

Ich hoffe, ich konnte weiterhelfen und über Feedback würde ich mich sehr freuen.
Expo Pedometer not returning step count in Android
Tags: help, discuss, expo, android
Published: 2020-03-04 19:11:47

Hello everybody, today I need help.
I'm developing an app with React Native and Expo.

I'm having issues with the Pedometer included in "expo-sensors". The problem is, the function **Pedometer.getStepCountAsync** does not work in Android, the function returns "Getting step count for date range is not supported on Android yet". I've been reading about this issue and found out that it is an Expo problem, the function worked perfectly around Expo 32, but with the updates, it stopped working.

Does anyone know a workaround for this issue? Or does anyone know how to retrieve the steps the user has taken in the day (with this module or any other)? I would really appreciate any help! 

**March 26, 2021 Edit:**

One year later, I didn't find a solution for this. I've seen the issue I opened on GitHub getting more comments about "I've got the same issue. If many people have this issue why don't they do something?", but no concrete answer (at least, since the last time I checked). 

The most promising thing I found (but didn't test since I was moved from that project) was using the Google Fit API to record the steps the user takes. Hope this helps somebody, and if anybody ever finds a working solution, please leave it in the comments for everyone to see 😊
Lesson 17 DQ
Published: 2020-03-04 19:10:09

  In this lesson we created an app in which we could change the colors of an area that was controlled by sliders and switches. We learned about connecting them to the code so that they would change the color. When connecting the sliders and switches we noticed the difference between an outlet and an action. Outlets connect variables while actions connect the controls such as the switches and the sliders we used. A developer might opt to use control events rather than the default event when they want to personalize a part of their application.
Lesson 16 DQ
Published: 2020-03-04 19:09:14

In this lesson we learned how to make a responsive application, we learned how to program the application give several different responses depending on the question and structure and the length of the question, in this app is similar to the way our brain processes information because when someone asks us a question we first gather the information we analyze it and depending on what their question is we answer their question we, much like the user interface would return a response.
WK2Discussion
Tags: wk2discussion
Published: 2020-03-04 19:07:18

Creating a responsive design allows a higher number of users to have a better user experience no matter what device they might be viewing a webpage from. This is important because when a user is easily navigating your webpage there will be more likely to return to the web page as well as recommend it to someone else. It is also very important because most people have mobile device such as a phone or a tablet and they use them to access. Webpages, responsive web design will enhance and facilitate their experience.
Javascript call, apply and bind methods
Tags: javascript, tutorials
Published: 2020-03-05 14:21:02

---
title: Javascript call, apply and bind methods
published: true
date: 2020-03-04 19:06:51 UTC
tags: Javascript,javascript,tutorials
canonical_url: https://codesquery.com/javascript-call-apply-bind-method/
---

In this article, we are going to learn about the Javascript call, apply and bind methods in detail with the examples. In javascript, all functions are objects and these three methods of javascript are used to control the invocation of the function. Before going further with the article, you first have to familiar with the [...]

The post [Javascript call, apply and bind methods](https://codesquery.com/javascript-call-apply-bind-method/) appeared first on [CodesQuery](https://codesquery.com).
Typescript Migration (JS to TS)
Tags: javascript, typescript, react, webdev
Published: 2020-03-04 19:03:28

New video with tips on how to migrate a JavaScript codebase to TypeScript!!! :)

Let me know what you think about the presented strategy. 

If you have a different strategy that is working for you, let's have a chat. I would love to learn more about it! :)

{% youtube v3lI29trIN8 %}
Doomsday?
Tags: discuss
Published: 2020-03-04 19:01:09

---
title: Doomsday?
published: true
description: What is going to happen with that panic over this virus?
tags: discuss
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/kgalpliio0lsci4j1evb.jpg
---

Do you feel it coming? Just reading all the news and headlines you may think that tomorrow a twisted line will be crossed and everyone will start panicking so bad and chaos will erupt. You won't be able to buy any food from the supermarket because everyone would have stockpiled for months. Or even worse...

What do you think will happen?
Python non-English encoding
Tags: python, beginners
Published: 2020-03-01 17:28:47

You probably learned how to use Python output <a href="https://pythonbasics.org/execute-python-scripts/">"Hello, World! "</a>. In English no problem. But if you output non-English characters, it is likely to encounter encoding problems.

If Python file if the encoding is not specified, an error occurs during the execution (only for older Python versions):
```python
#!/usr/bin/python
print("мир приветствий")
```

More execution output is:
```
File "test.py", line 2
    SyntaxError: Non-ASCII character '\xe4' in file test.py on line 2, but no encoding declared; see http://www.python.org/peps/pep-0263.html for details
```

To prevent the above error message, the solution is to add at the beginning of the file 

```python
#-*- coding: UTF-8 -*-
``` 
or the line:

```python
# coding = UTF-8
```

**Example** (Python 2.0+)

```python
#!/usr/bin/python3
# coding: UTF-8
print("мир приветствий")
```

**Note:** *Python3.X* source file using the **UTF-8 encoding by default**, so you can properly resolve non-English, without specifying the UTF-8 encoding.

**Note:** If you use an <a href="https://pythonprogramminglanguage.com/python-ide/">IDE</a>, you also need to set the encoding of a good editor, such as Pycharm setup steps:

File > Settings > encoding in the search input box.
Find Editor> File encodings > a **IDE Encoding** and **Project Encoding**
Set utf-8.
color picker app
Published: 2020-03-04 18:47:50

In lesson 17 we are learning how to connect your code to the views and controls created in the storyboard. There are 2 kinds of connections between storyboards and code. The first one is an outlet. Outlets connect variables in your code to objects in the storyboard, so you can access those objects within your code. The second one is actions. Actions connect controls like switches and buttons to methods in your code, so tapping a button will run a particular method. We are going to use outlets and actions to create an app that generates colors by mixing red, green, and blue. We add a view from the object library and control-drag from the view into the code and call it colorView. When you use ColorView in the ViewController.swift code, you are referring to the view you’ve just added to the storyboard. You can use the connections inspector on the right side of the screen to check all of your actions and outlets. If something is not connected you will see an open circle. If there is an error where a connection is incorrect, the app will crash. Next is adding switches to change the color of the view by connecting the code to the switch. We then continue to make multiple switches with multiple actions, one for a different color, and when the switch is toggled, it adds that color component to the view. Make sure they are all connected to the view and its switch changed in the connection’s inspector. Finally, we are adding sliders to give better control of what color is displayed. Find the sliders in the object library and apply one for each switch. Control-drag the sliders and call the action slider changed and make sure all 3 are connected. Next is adding a reset button to the bottom of the screen which can be found in the object library. Select it and place it on the bottom, changing its name to reset. The reset button will set the value of each slider to 1 and the isOn property of each switch to false. Finally, we can polish the interface which is basically adding colors and other aesthetics to the interface of the app. Select the switches and change the on-tint color to match the color that it changes. Do the same with the slider’s min track color. This makes the purpose of the switches and sliders clearer. Now we add a border to the color view by specifying a border width, corner radius, and border color. The last thing to do is to create a function that disables the sliders unless the switch is on.
String formatting in Python
Tags: python, beginners
Published: 2020-03-04 18:45:21


You can do two ways of string formatting in Python. The most easy way is to use f-strings or formatted strings.  The other way is similar to the printf function in the C programming language.

The printf way:
```python
>>> print('this is %d %s pet' % (1,'hungry'))
this is 1 hungry pet
>>> 
```
The f-strings way (has an f in front of the string):
```python
>>> n = 1
>>> s = 'hungry'
>>> print(f'this is {n} {s} pet')
this is 1 hungry pet
>>> 
```
Obviously the f-strings way is better, but you may find code with the old C style way. So in the C printf way, what is this `%`?

It lets you output a type of variable. For a string `%s`, for a number `%d`.

```python
>>> 
>>> name = 'goofy'
>>> 'my name is %s ' % name
'my name is goofy '
>>> 'that will be %d dollars please' % 5
'that will be 5 dollars please'
>>> 
```

So you know `%d` and %s` string formatting codes, but there are others. 

Code | meaning
--- | ---
%s | string (or any object)
%r | s, but with repr, rather than the str
%c | character
%d | a decimal integer
%i | integer
%u | Unsigned integer
%o | octal integer
%x | hexadecimal integer
%X | x, but the print uppercase
%e | floating-point index
%E | e, but prints uppercase
%f | floating decimal
%F | floating decimal
%g | e or f floating point
%G | floating point e or f

    >>> a = 678
    >>> print('integer %i is a number' % a)
    integer 678 is a number
    >>> 

If you want a float, change it:

    >>> a = 1.23456
    >>> print('float has value of %f ' %a)
    float has value of 1.234560 
    >>> 

You can use multiple variables in a string:

    >>> name = 'goofy'
    >>> age = 50
    >>> print('I am %s and I am %d years old' % (name,age))
    I am goofy and I am 50 years old
    >>> 

Read more:
* <a href="https://www.python.org/dev/peps/pep-0498/">Python formatted strings</a>
* <a href="https://pythonbasics.org/strings/">Python string examples</a>
Things you must know about Python strings
Tags: python, beginners
Published: 2020-03-04 18:29:54

<a href="https://python.org">Python</a> strings let you work with text. If you define text e.g. Python string, you can do so in two ways:
```python
>>> s = 'abc'
>>> s
'abc'
>>>
>>> s = "abc"
>>> s
'abc'
>>> 
```

So single quoted <a href="https://pythonbasics.org/strings/">string</a> is the same as double quoted. You can be use this interchangeably, but preferably just pick one.

You can even introduce quotes inside the strings:

```python
      >>> 'abc "d'," abc'd "
      ( 'abc "d'," abc'd ")
```

Python can automatically merge strings. To do so you should use a `+` instead of a comma. A comma will give you a tuple.

So not this:

```python
>>> s = "hello ","world"
>>> s
('hello ', 'world')
```

Also, in the above example: the comma in the middle of the string, so the final form is a tuple rather than a string

But this concatenates strings:

```python
>>> s = "hello " + "world"
>>> s
'hello world'
>>> 
```

## Use the escape character for special characters

Python supports many special characters. An escape character starts with a slash.

```python
>>> print('hello\nhello\n',end='')
hello
hello
>>> 
```

Common escape characters:

Escape | sense
--- | ---
\ | Continuous, then the top line
\ | Backslash
\'| Single quotes
\"| Double quotes
\n | Newline
\a | Bell
\b | back
\f | feed
\r | returned
\t | horizontal tab
\v | vertical tab
\n{id} | unicode database id
\Uhhhh | unicode16 bit hexadecimal value
\Uhhhh | unicode32 bit hexadecimal value
\Xhh | hexadecimal values
\Ooo | octal value
\0 | Null
What means "High Performing Team" to you?
Tags: discuss, healthydebate, leadership
Published: 2020-03-04 18:26:04

I have been using to the term _High ~~Performance~~ Performing Team_ when debating with team-mates and friends about performing, way of working, and so on.

After a while, we realized that we were meaning different things when we were thinking about a _High Performing Team_.

I would like to know what means _High Performing Team_ to you, which are the characteristics and how do you identify them.

Thank you for sharing your thoughts and opinions! `(/^▽^)/`

Edit: Replaced ~~`Performance`~~ by `Performing` due to a misunderstanding 😓