teleren/devto huggingface dataset:
Understanding Kubernetes: part 38 – Kubernetes is deprecating Docker
Tags: kubernetes, devops, docker, beginners
Published: 2020-12-03 23:34:12

---
title: Understanding Kubernetes: part 38 – Kubernetes is deprecating Docker
published: true
description: Serie of sketchnotes about Kubernetes. Explaining in a visual way Kubernetes principles.
tags: Kubernetes, DevOps, Docker, beginners
series: Understanding Kubernetes in sketchnotes
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/dmi5ny2n5mp0lk057ewk.jpeg
---

Understanding Kubernetes can be difficult or time-consuming. In order to spread knowledges about Cloud technologies I started to create sketchnotes about Kubernetes. I think it could be a good way, more visual, to explain Kubernetes (and others technologies).

We continue the serie of Sketchnotes about Kubernetes, with an explanation about one news: Kubernetes is deprecating Docker as a container runtime after v1.20.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/dmi5ny2n5mp0lk057ewk.jpeg)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/v3c7k7k1m0i1mhfr8ect.jpeg)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/dvtxpytzbce5f6nuwlmb.jpeg)


If you are interested, I published all the sketchnotes on Kubernetes (and new ones!) to make a "book" of 120 pages: ["Understanding Kubernetes in a visual way"](https://gumroad.com/aurelievache#uCxcr).

As usual, if you like theses sketchnotes, you can follow me, and tell me what do you think. I will publish others sketchs shortly :-).
Buscador de bebidas con React 16 y useContext
Tags: react, javascript, frontend, webdev
Published: 2020-12-03 23:21:32

A continuación un proyecto intermedio desarrollado con React.js u usando el hook useContext para manejo de estados. 

La app luce como en las imagenes: 
![poster](https://raw.githubusercontent.com/crisdux/buscador-bebidas-react-2020/main/poster1.jpg)
![poster](https://raw.githubusercontent.com/crisdux/buscador-bebidas-react-2020/main/poster2.png)

[Link del proyecto en github](https://github.com/crisdux/buscador-bebidas-react-2020)

[deploy en netlify](https://hopeful-babbage-0d99c9.netlify.app/)

### **Nota:**
Mencionar que este no es un proyecto mío, esta eleborado siguiente el siguiente [tutorial](https://www.udemy.com/course/react-de-principiante-a-experto-creando-mas-de-10-aplicaciones/)
Host Sharelatex in Docker (with HTTPS)
Tags: docker, traefik, sharelatex, latex
Published: 2020-12-03 23:17:26

---
title: Host Sharelatex in Docker (with HTTPS)
published: true
description: Host Sharelatex Docker Container with Encrypted Connection via Traefik
tags: docker, traefik, sharelatex, latex
cover_image: https://www.thoughtco.com/thmb/5o6AU_uq5lSBYVCBpKl_XkvTzKg=/768x0/filters:no_upscale():max_bytes(150000):strip_icc()/business-woman-working-on-desk-850630688-5b35962f46e0fb00370dc606.jpg
---
This guide is about setting up Sharelatex in a Docker container with https connection.

# Install Docker
Here two examples of installing the Docker deamon. The required Packages are docker and docker-compose.

## Arch Linux
```bash
yay -S docker docker-compose
```

## Debian / Ubuntu
```bash
curl -fsSL https://get.docker.com -o get-docker.sh
sh get-docker.sh
```

# Enable Service
To enable the service as background task simply run
```bash
sudo systemctl enable docker
sudo systemctl start docker
```

# Setup Sharelatex Container

## 1. Create Virtual Docker Network
```bash
sudo docker network create main
```

## 2. Configure Docker-Compose File
In the Docker-Compose File you must change several values to your custom needs.
The specific lines to change are commented.

{% gist https://gist.github.com/corusm/9d4c3e05b0225048339651c4e830a004 %}

## 3. Set Password for Proxy Page
You need to paste the output in line 43 of the Docker compose file.
```bash
echo $(htpasswd -nb username password) | sed -e s/\\$/\\$\\$/g
```

**Example:**
```
- "traefik.http.middlewares.traefik-auth.basicauth.users=test:$$apr1$$.LOxTF4y$$/OjdUK3pSGiT/flYY42uS1"
```


### 4. Install Latex Packages
First of all, the package manager must be installed including all Latex Packages. The package manager of Latex is called tlmgr.


**Run Docker Container:**
To run the Sharelatex Server enter
```bash
sudo docker-compose up -d
```


**Create User:**
Enter your own E-Mail address to this command
```
docker exec sharelatex /bin/bash -c "cd /var/www/sharelatex; grunt user:create-admin --email=max@test.com"
```


**Install Packages:**
If the Sharelatex Container is running enter following commands
```bash
sudo docker exec sharelatex wget http://mirror.ctan.org/systems/texlive/tlnet/install-tl-unx.tar.gz
sudo docker exec sharelatex tar xvfz install-tl-unx.tar.gz
```


Then open the Bash Console of the container
```bash
docker exec -ti sharelatex /bin/bash
```

1. Change directory: `cd install-tl-XXX`
2. Change rights: `chmod u+x install-tl`
3. Run `./install-tl`
4. Wait until everything is installed
6. `exit` the Bash Shell of the container


**Update Packages:**
Now check the tlmgr (Latex Package Manager) for updates
```bash
docker exec sharelatex tlmgr update
```


# Important Docker Commands
## Start Container
```
sudo docker-compose up -d
```
Run without `-d` if you want to see the console output.


## Stop Container
```
sudo docker-compose down
```


## Reload Docker-Compose File
When Container Stopped
```
sudo dokcer-compose up --force-recreate -d
```


# You're done! :heart:
Neon design system v4.0.0 released
Tags: vue, design, typescript, webdev
Published: 2020-12-03 23:13:07

Announcing the release of Neon v4.0.0 design system for VueJS - https://aotearoan.github.io/neon/

Lots of new stuff including a new ‘smooth’ theme, gradient buttons and labels, better accessibility and a few more components.

All feedback is welcome!
A.
Two weeks since I started studying Swift and that what I learned
Tags: swift, beginners
Published: 2020-12-03 23:11:04

---
title: Two weeks since I started studying Swift and that what I learned
published: true
description: 
tags: swift, beginners
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/aqtyguk5seavuxdbague.jpg
---

It's been an intense two weeks and I did my best to dedicate at least one hour a day to the study of Swift.

Once I assimilated the basics of the language, I started learning more interesting things like functions, closures, struct and classes.

Having studied Java back at the University, I found very familiar how functions and classes are made in Swift except for a couple of things like [mutating functions](https://medium.com/the-andela-way/swift-understanding-mutating-functions-in-two-minutes-d9e363904e3a) and [lazy methods](https://www.hackingwithswift.com/example-code/language/what-are-lazy-variables#:~:text=Swift%20has%20a%20mechanism%20built,that%20variable%20is%20first%20requested.). I actually don't know if Java supports something like these. If it does, I never used them before.

I also found interesting the differences between `struct` and `class`. Basically, a `struct` is a **constant** so it's not so useful to be used to manipulate objects. I'd use the `class` instead, which brings all the advantages of the class inheritance, methods overriding, mutability and restricted access to the private attributes.

As usual, I keep pushing all my work on GitHub

{% github rossanodan/swift-playground %}

I've got some catching up to do to stay on track with the 100 days challenge :smile: :rocket:
17 - Turning static into fantastic with Erica Jacobs 
Tags: design, illustration, creative, community
Published: 2020-12-03 22:43:00

Designer, Illustrator, Volunteer, Celebrator of women in the design and tech community, Creator of the Neon Swan Awards and Creative Mind extraordinaire. Ladies and gentlemen, todays guest is Erica Jacobs!


**Pixadactyl**: [pixadactyl.com](pixadactyl.com)


**Pixadactyl TeeSpring**: [https://teespring.com/stores/pixadactyl](https://teespring.com/stores/pixadactyl)


**Neon Swan Awards**: [http://neonswanawards.com](http://neonswanawards.com)


**Orlando Lady Boss podcast**: [http://www.orlandoladyboss.com/take-credit-erica-jacobs-podcast-9/](http://www.orlandoladyboss.com/take-credit-erica-jacobs-podcast-9/)


**Lore Olympus**: [https://www.webtoons.com/en/romance/lore-olympus/list?title_no=1320&page=13](https://www.webtoons.com/en/romance/lore-olympus/list?title_no=1320&page=13)


**Graphic Artists Guild Handbook**: [https://graphicartistsguild.org/product/the-graphic-artists-guild-handbook-pricing-ethical-guidelines/](https://graphicartistsguild.org/product/the-graphic-artists-guild-handbook-pricing-ethical-guidelines/)


**Have Her Back**: [https://www.haveherback.com](https://www.haveherback.com)

#awesometechqueen
16 - ABC's of success: Authenticity, Balance and Communication with Bill Conyea
Tags: management, career, communication, startup
Published: 2020-12-03 22:38:09

{% spotify spotify:episode:22uDGfdUpTQ8z76Ldy3z3i %}

Developer, CTO, Investor, Technology Staffer and Entrepreneur. Ladies and gentlemen, today’s guest is Bill Conyea!


Crestview Global: [www.crestviewglobal.com](www.crestviewglobal.com)

For career opportunity inquiries, send an email with your resume to opportunities@crestviewglobal.com or subscribe to Crestview Global's email list for updates.


Outro: Running from the One Nine - Bill Conyea, Guitar


Quotes:

"What it takes to succeed in a corporate environment… it’s not just technology. It’s business domain acumen, it’s technology and it’s interpersonal skills"


"I know I’m working harder than most people, they’re going to notice me. But you’re not doing the kinds of things you need to do to engage at a human level. So that people know what you’re doing. You just assume people know. They don’t… It’s human relations at the end of the day."
How do I set the version for a deno module?
Tags: deno, discuss, codenewbie
Published: 2020-12-03 22:29:20

I got the following message when I uploaded a deno module to https://deno.land/x/ after following all the steps:

No uploaded versions
This module name has been reserved for a repository, but no versions have been uploaded yet. Modules that do not upload a version within 30 days of registration will be removed.

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

How do I upload a version?
Should a custom React Hook be in 2 files? Also... should a reusable component be in one file? 
Tags: react, computerscience, vue, dev
Published: 2020-12-03 21:58:17

When you make a react hook, should it be in one file or 2? Such as news.JS and setNews.JS?
Also, when you make a reusable component such as a “to do”, do you want the info in the same file as the template “render or return”?
Top 5 DEV Comments from the Past Week
Tags: bestofdev
Published: 2020-12-03 21:33:03

---
title: Top 5 DEV Comments from the Past Week
published: true
description: Highlighting some of the best DEV comments from the past week.
tags: bestofdev
cover_image: https://res.cloudinary.com/practicaldev/image/fetch/s--7VrAA2ln--/c_imagga_scale,f_auto,fl_progressive,h_420,q_auto,w_1000/https://thepracticaldev.s3.amazonaws.com/i/qmb5wkoeywj06pd7p8ku.png
---

This is a weekly roundup of awesome DEV comments that you may have missed.  You are welcome and encouraged to boost posts and comments yourself using the **[#bestofdev](/t/bestofdev)** tag.

@mpodlasin shared this on-point response to ["Please explain why I need software architecture"](https://dev.to/patarapolw/please-explain-why-i-need-software-architecture-fe5) 

{% devcomment 18iok %}

It's always heartening to hear that a global event like Hacktoberfest is what brought someone to DEV. We're thrilled to have you as part of the community, @busseyl — and congrats on completing Hacktoberfest 🎉 
{% devcomment 18khb %}

Super interesting response by @andreidascalu to [Why Does PHP Get So Much Hate](https://dev.to/koreymoffett/why-does-php-get-so-much-hate-42ca). I learned a lot from this. 

{% devcomment 18di7 %}

That's some great advice, @toddpress 👀  
{% devcomment 18ge1 %}

Congrats to @codebyjustin for their first post here on DEV!   
{% devcomment 18ed2 %}


See you next week for more great comments ✌
MyBooks Sinatra Project
Published: 2020-12-03 21:05:40

I just completed my Sinatra Project, and, I must say: it was probably the most fun application I had to work on. Having been able to build a full application as a future software engineer and also experience it as a user was a testament of the power that lies at the tip of our fingers by knowing how to code. 
The idea for my application was conceived out of a real world problem I was having. I am avid reader, and like all avid readers, the books pile up and eventually it becomes hard to keep track of them. I wanted to build an app that a user could utilize to save a list of their books and also sift through in an easier manner. With all that in mind, I wanted to create something super simple but sound enough to get the job done. 
Since the beginning of the bootcamp, there is one thing that was more challenging than coding itself and that was getting error messages. My attitude towards this reality of coding made me dread it to the point where I felt like I failed at being a great coder every time I got one. What I quickly learned is that errors are actually a coder's best friend; they will point you out to the right direction and improve your work flow and coding abilities as you progress. 
One particular error message I wanted to speak about is: 
"NoMethodError: undefined method WHICHEVER_METHOD for nil:NilClass. 
This is a fairly common error in the Ruby language which informs the coder of a method that has not been defined when it was called on an object. A particular instance of that occurrence happened to me when I tried authenticating a user that did not exist in my database. The authenticate method verifies the identity of a user that wants to access data. The mistake I had made was that I had forgotten to assign a value to the instance variable of user (@user) and when the method was called, it was not able to find any. 
Knowing how to read and interpret error messages such as this will be a valuable tool to use in your journey to building applications and also finding solutions for many future problems.
Advent of code - Day 2
Tags: javascript, typescript, adventofcode
Published: 2020-12-03 20:56:39

Are you participating in the [Advent of code](http://adventofcode.com) this year?

If you don't know what the advent of code is, it's a website where you'll find a daily challenge (every day it gets harder). It's a really fun event, you should participate!

I try to solve the exercises using either JavaScript or TypeScript and will share my solutions daily (with one day delay so no one can cheat!). I only share the solution for the second part.

Here is my solution for day #2:

```js
// I completed this one directly in the console of the website
$('body > pre')
  // get text line by line
  .textContent.split(/\r?\n/)
  .filter(Boolean)
  // differentiate the definition from the string
  .map((definition) => definition.split(': '))
  .filter(([definition, password]) => {
    const [minMax, letter] = definition.split(' ')
    const [min, max] = minMax.split('-').map((x) => parseInt(x) - 1)
    return (
      (password[min] === letter && password[max] !== letter) ||
      (password[max] === letter && password[min] !== letter)
    )
  })
  .length
```

The code doesn't look pretty, but it does the trick.
Feel free to share yours in the comments!

________________________

Photo by [Markus Spiske](https://unsplash.com/@markusspiske?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText) on [Unsplash](https://unsplash.com/?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText)
Easter eggs and lols in comments? 
Tags: watercooler
Published: 2020-12-03 21:04:08

## Hi fellow programmers, coders, hackers and devs.

Do you put small easter eggs in your projects? Or perhaps add humour in comments to make the next maintainer lol?

I do for sure and it makes my day a little more fun.

Do others also do this? Or am i a unicorn in this sense?

E.g
// this code will self dis-truct unless you clap your hands 5 times.

Or

Press on the footer bottom right and a ninja flys across the screen.

Thanks.
Generate resources for Nuxt-Capacitor-Integration
Published: 2020-12-03 21:00:53

* Create *resources* folder in root directory.
* Add *icon.png* with size - 1024x1024 px Add *splash.png* with size - 2732x3732 px
* So we have placed icon and splash in resources folder, now we need these in all sizes compatible with our android and ios platforms.
* Lets add script to generate it and then *sync* it to platform.
* Add the following command to scripts in **package.json** file of nuxt app

> "resources": "cordova-res-generator -p android,ios && node resources/sync.js android"

As we see, we have used **[cordova-res-generator](https://www.npmjs.com/package/cordova-res-generator#installation)** so lets install this generator by

> yarn add --dev cordova-res-generator

We have successfully add res-generator now we are ready to go but we still have **node resources/sync.js android**

This will sync the resources to android platform using sync.js, so lets add sync.js in resources where we have added our icon and splash

> [Sync.js](https://github.com/anshcena/blog/blob/main/nuxt-capacitor/sync.js)

Copy the code from above mentioned [Sync.js](https://github.com/anshcena/blog/blob/main/nuxt-capacitor/sync.js) to generate sync.js inside resources.

so our resources will have these 3 :

![Structure resources](https://github.com/anshcena/blog/blob/main/nuxt-capacitor/img/sync%20file.jpg?raw=true "Resources")

We are ready to generate and sync now

> yarn resources

🎉 Resources are generated and sync to platfrom - android 🎉

For **iOS** , we can make change in scripts of package.json as **node/sync.js ios**

*Make sure to put logo in splash screen in middle as well as small for better resource generated results and optimized images.*
Handling Form Submissions II
Tags: javascript
Published: 2020-12-03 18:21:13

## Leverage `name`

Previously, I advised against using `name` as it's mostly just clutter. But, now, we will actually want to use it. So, make sure that all of your `input`s have a `name` `attribute.` Or, just use [this Gist (includes HTML and CSS.](https://gist.github.com/manavm1990/2837df7176d1011de3aea8fb3c011efb)

## `FormData`

We simply pass our form into this _constructor `const myFormData = new FormData(form)`._ However, if you `console.log(myFormData)` - it's just empty. 

Don't fret. Read on.

There are many points regarding `FormData` and _iterables_ covered in [the docs.](https://developer.mozilla.org/en-US/docs/Web/API/FormData/FormData)

**The purpose of this post is to show how to convert your 'form data' into an _object._**

## `Object.fromEntries`

Again, [the docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/fromEntries) contain more details and examples. All we need to know is that our `FormData` can be turned into an _object literal_ like so: `Object.fromEntries(myFormData)`. That's it.

![Filling out demo form and logging the finished object in the console](https://dev-to-uploads.s3.amazonaws.com/i/jtpwnmbaa0r93ez90ye3.gif)
newFunction ()
Published: 2020-12-03 20:28:53

Today I'm setting a README.md on my GitHub profile. I'm still learning how to do it, but I think I did a lot of progression there.

Later I'm gonna create a C project to upload on GitHub.

I have so much to learn, it's a good feeling btw, I hate to only play games to not get bored easily. I like to learn things.

p.s.: Idk how to set a properly title lmao
S3E5 Learn JMeter Series - Synchronizing Timer
Tags: performance, testing, tutorial, webperf
Published: 2020-12-03 20:20:02

Welcome to Learn JMeter Series!

In this Season 3, Episode 5, you will learn following:

🔹 Synchronizing Timer

{% youtube DBaC8t3FLtU %}

☑ Buy me a tea 🍵 : https://www.buymeacoffee.com/qainsights
☑ [My Blog](https://qainsights.com)
☑ [My Udemy Course](https://www.udemy.com/course/performance-testing-using-truweb)

{% github QAInsights/Learn-JMeter-Series%}
AzureFunBytes Episode 22 - @Azure Migrations with @LBugnion
Tags: azure, tutorial, beginners, migrations
Published: 2020-12-03 20:08:28

Not all applications are born in the cloud, some are both in data centers across the globe.  Moving them into the cloud should be something that excites you rather than looks like a challenge.  This time, [Laurent Bungion](https://twitter.com/LBugnion) joins me on AzureFunBytes to discuss how to begin your migration journey into Azure.

We chat about "Why" we migrate, "how" we migrate, and "when" to execute your migration plan.

{% youtube AAB1PsUwbdY %}

Learn about Azure fundamentals with me! [Microsoft LearnTV!](https://docs.microsoft.com/learn/tv/?WT.mc_id=devops-10835-jagord) The most interactive way to join the show!

Live stream is available on Twitch at 2 pm EST Thursday. You can also find the recordings here as well:

https://twitch.tv/azurefunbytes
https://twitter.com/azurefunbytes
https://aka.ms/jaygordonontwitter

Join me, ask questions, and learn about Azure!

[Microsoft Learn: Azure Fundamentals](https://docs.microsoft.com/en-us/learn/paths/azure-fundamentals/?WT.mc_id=blog-devto-jagord)
[Microsoft Azure: $200 Free Credit](https://azure.microsoft.com/free/?WT.mc_id=devops-11037-jagord)
[Azure Migrate](https://azure.microsoft.com/services/azure-migrate/?WT.mc_id=devops-11037-jagord)
[Migrate to the Cloud with Azure Migrate](https://azure.microsoft.com/resources/migrate-to-the-cloud-with-azure-migrate/?WT.mc_id=devops-11037-jagord)
[Azure Migrate Learning Path](https://docs.microsoft.com/learn/paths/m365-azure-migrate-virtual-machine/?WT.mc_id=devops-11037-jagord)
[Azure Migrate Documentation](https://docs.microsoft.com/azure/migrate/?WT.mc_id=devops-11037-jagord)
[https://galasoft.ch/](GalaSoft)
Firma edited
Published: 2020-12-03 20:04:48

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css">


<center><div class="firm"><div class="letrotas">I'll be good<br>for i promise</div></center>@import url('https://fonts.googleapis.com/css?family=La+Belle+Aurore');

.firm {width: 450px; height: 200px; border: 2px solid #c83f3f; position: relative; background: url('https://i.ibb.co/6gzHqfW/tumblr.jpg');}

.letrotas {margin-top: 75px; margin-left: 190px; color: #68130d; width: 230px; color: #17EBF2; padding: 25px; text-align: center; transform: rotate(-8deg); font-family: 'La Belle Aurore', cursive-bold; font-size: 35px; line-height: 109%; letter-spacing: px; text-align: center;}

.toggle {
    margin: 0;
    padding: 0;
}

.toggle ul {
    position: absolute;
    top: 86%;
    left: 74%;
    transform: translate(-50%,-50%);
    margin: 0;
    padding: 0;
    display: flex;
    font-family: sans-serif; 
}

.toggle ul li {
    list-style: none;
    position: relative;
    margin: 10px;
}

.toggle ul li a {
    position: relative;
    width: 40px;
    height: 35px;
    display: block;
    text-align: center;
    line-height: 35px;
    box-shadow: 0 0 0 3px #c83f3f;
    border-radius: 50%;
    font-size: 20px;
    z-index: 1;
    background: #fff;
    padding-top: 5px;
    color: #c83f3f;
    transition: .5s;
    overflow: hidden;
}

.toggle ul li a:before {
    content: '';
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    transition: .5s;
    background: #c83f3f;
    z-index: -1;
    transform: rotate(-45deg) scaleX(0);
}
.toggle ul li a:hover {
    color: #fff;
}
.toggle ul li a:hover:before {
    transform: rotate(-45deg) scaleX(1);
}

.toggle ul li span {
    position: absolute;
    top: -35px;
    left: 50%;
    transform: translateX(-50%) translateY(-20px);
    width: 120px;
    height: 24px;
    line-height: 24px;
    background: #c83f3f;
    color: #fff;
    border-radius: 8px;
    font-size: 11px;
    text-align: center;
    transition: .7s;
    opacity: 0;
    visibility: hidden;
}

.toggle ul li:hover span {
    opacity: 1;
    visibility: visible;
transform: translateX(-50%) translateY(0);}

.toggle ul li span:before {
    content: '';
    bottom: -8px;
    left: 49%;
    transform: rotate(45deg) translateX(-50%);
    position: absolute;
    width: 10px;
    height: 10px;
    background: #c83f3f;
    z-index: -1;
    
}