teleren/devto huggingface dataset:
Re-Use SSH Config Inside Docker Containers with WSL2
Tags: howto, devcontainers, docker, filesystem
Published: 2020-11-08 18:25:21

---
title: Re-Use SSH Config Inside Docker Containers with WSL2
published: true
date: 2020-10-24 20:09:26 UTC
tags: Howto,devcontainers,docker,filesystem
canonical_url: https://avdi.codes/re-use-ssh-config-inside-docker-containers-with-wsl2/
---

Docker and [WSL](https://docs.microsoft.com/en-us/windows/wsl/) have been getting more and more chummy lately. The [Docker Desktop WSL2 backend](https://docs.docker.com/docker-for-windows/wsl/) integrates Docker containers with the “official” integrated Windows/Linux ecosystem (boy that still feels a little weird to write…) and gains performance perks in the process.

However, I ran into some trouble recently getting SSH to work inside of a Docker container. As I’ve written about before, I like to [bind-in my credentials from my host machine](https://avdi.codes/share-netrc-with-your-devcontainers/), rather than proliferating credentials into containers. When a container needs to SSH out to the wider world, that means binding in my `.ssh` directory from the host, e.g. with a `docker-compose.yml`:

```
    volumes: 
      - type: bind
        source: ${HOME}${USERPROFILE}/.ssh
        target: /home/${DEV_USER:-abapa}/.ssh

```

Only one problem: volumes mounted from the Windows side are mounted via `drvfs`, which by default projects all files as having mode 777 on the Linux side. And SSH will refuse to use certificate files that are world-writeable.

After a bunch of research and some trial-and-error, I found a solution that’s working right now (2020-10-24). Recent versions of `drvfs` allow NTFS-hosted files to have fake Linux-side effective permissions attached to them, via NTFS extended attributes. And the `docker-desktop` distro that Docker Desktop installs has this feature enabled:

```
PS> wsl -d docker-desktop
# cat /etc/wsl.conf
[automount]
root = /mnt/host
crossDistro = true
options = "metadata"
```

Notice the `options = "metadata"` line in `/etc/wsl.conf`.

So the trick was to open a WSL terminal in that distro and set the desired effective owner and file permissions:

```
PS> wsl -d docker-desktop
caroline:/tmp/docker-desktop-root/mnt/host/c/Users/avdi_000/.ssh# chown -R 1000:1000 .
caroline:/tmp/docker-desktop-root/mnt/host/c/Users/avdi_000/.ssh# chmod -R u=rwX .
```

These aren’t “real” file attributes, since Windows has a very different permissions model from Linux. But they get saved as file attributes and treated as the effective file permissions inside WSL distros with metadata enabled.

Notes:

- `-R` makes the change recursive through directories.
- User/group 1000 are a common default user/group ID for containers. 
- File mode `u=rwX` recursively sets files to readable/writeable by owner, and directories read/write/traversable by owner.
The fastest docker build in the old west 🤠
Tags: docker, todayilearned
Published: 2020-10-24 20:09:00

Most of the *Dockerfiles* I see around are similar to the example below an api *node*, where we have the source being added to the container before installing the dependencies, this ends up slowing down the `docker build` by not taking advantage of the layer cache, because the *docker build*, when it identifies a change in one of the layers, redoes all the steps below again

```dockerfile
FROM node:latest

WORKDIR /app

ADD . .

RUN npm install

CMD ["run", "start"]
```

## Western-style trigger 🧐
![](https://media1.giphy.com/media/dz0x6x8EK1N4AIRvDz/giphy.gif?cid=ecf05e472fdff5a5b949ad32c5571e5c853f359f2855c745&rid=giphy.gif)
In this approach using *node* I am first passing the dependency file which in the case of this example is *package.json*, but is not limited to this, it can be any file to be done after the build and any change in the source code would not affect the dependency installation cache
```dockerfile
FROM node:latest

WORKDIR /app

ADD package*.json ./

RUN npm install

ADD . .

ENTRYPOINT [ "npm" ]

CMD ["run", "start"]
```
Deploying Angular App On GitHub Pages In 4 Steps.
Tags: publish, angular, deploy, githubpages
Published: 2020-10-24 19:53:48

Show your Angular App to the world for FREE Using [GitHub Pages](https://pages.github.com/)  in 4 Easy Steps.

#1. Create a Repository

Create a **Public** GitHub Repository for your Angular App _You need to create a GitHub account first_.

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

#2. Make a note of your "Owner Name" and "Repository Name" in GitHub.

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

#3. Run this command in the terminal of your Project

```
ng build --prod --output-path docs --base-href https://<owner-
name>.github.io/<repo-name>/
```
For the previous example my command will be:
```
ng build --prod --output-path docs --base-href 
https://YoussefZidan.github.io/Repo-Name/
```

You will see a Docs Folder has been created inside your App Folder:

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

Make a copy of the **index.html** and rename it **404.html** then Push this folder _(Docs Folder)_ to the created Repository.

#4. change GitHub pages to the master branch/docs folder.

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

Now wait a few minutes and you will see your app published in a URL like this:

```
https://youssefzidan.github.io/youtube-api

```

<a href="https://www.linkedin.com/in/youssefzidan/" target="_blank">
    <img src="https://img.shields.io/badge/LinkedIn-%230077B5.svg?&style=flat-square&logo=linkedin&logoColor=white" alt="LinkedIn">
react-router a quick guide
Tags: react, beginners
Published: 2020-10-24 19:53:47

Dynamic routing is the type of routing used by react-router. Unlike static routing, this takes place at the moment our application is rendering. This is because react-router makes use of components to define its routes.
The components that are responsible for displaying the different paths always render. Sometimes they render a component and sometimes null, all depending on the location.

To define the different routes of our application, we can use the Route component. The function of this component is to choose what to render according to the current location identified in the path. This is the case we saw earlier, all Route components always render, but sometimes they render a component and other times they return null.

```javascript
import React from 'react';
import logo from './logo.svg';
import { BrowserRouter, Switch, Route } from 'react-router-dom';
import Principal from './pages/principal/principal';
import Login from './pages/login/login';
import './App.css';

function App() {
  return (
    <BrowserRouter>
      <Switch>
        <Route path="/principal" component={Principal} />
        <Route path="/" component={Login} />        
      </Switch>
    </BrowserRouter>
  );
}

export default App;
```

The way that you can navigate in your application is using the Link component, this causes a redirect to a different route than the current one. The path to which it redirects us replaces the current location in the browser's history, here I present a little example.

```javascript
import React, { Component } from 'react';
import { Link } from 'react-router-dom';
import './Layout.css';
class Layout extends Component {
  render() {
    return (
      <div className="Layout">
        <div className="link-container">
          <Link to="/page1" className="link">go page 1</Link>
        </div>
        <div className="link-container">
          <Link to="/page2" className="link">go page 2</Link>
        </div>
      </div>
    );
  }
}
export default NavBar;
```
I hope this will be helpful and thanks a lot for reading
[Tutorial Linux] Terminal: Gerenciando grupos
Tags: linux, terminal, group, womakerscode
Published: 2020-10-24 19:45:13

Um determinado grupo, no Linux, pode conter várias pessoas e restrições (ou permissões) a determinadas partes do sistema. Quando um usuário é criado, é também criado um grupo com o nome desse usuário.

Para ver os grupos dos usuários existentes no seu sistema, digite:

```
$ cat /etc/group
```

- **$** indica que você deve usar o **usuário comum** para fazer essa operação.

- no diretório **etc/** temos arquivos de configuração, scripts de inicialização, entre outros.

- **group** é o arquivo do sistema que define os grupos aos quais os usuários pertencem.

> sobre o comando [cat, clique aqui](https://dev.to/womakerscode/tutorial-linux-terminal-o-comando-cat-1196).

O arquivo **group** contém as seguintes informações:

```
<nome_do_grupo>:<senha>:<id_do_grupo>:<usuários_que_são_membros_do_grupo_separados_por_vírgulas>
```

Exemplo:

```
cdrom:x:24:danielle8farias,vict0rfarias
```

- **cdrom**, nome do grupo;

- **x**, indica que a senha está encriptada;

- **24**, id do grupo;

- **danielle8farias** e **vict0rfarias**, são os membros que pertencem a esse grupo.

## Ver grupos de um determinado usuário

Para saber quais grupos um determinado usuário é membro, digite:

```
$ groups <nome_do_usuário>
```

- digite o nome do usuário sem os sinais **< >**.

## Ver id do grupo de um determinado usuário

Para visualizar a id do grupo de um usuário, digite:

```
$ id -g <nome_do_usuário>
```

## Ver id de todos os grupos de um determinado usuário

Para visualizar as ids de todos os grupos de um usuário, digite:

```
$ id -G <nome_do_usuário>
```

## Criando novo grupo

Para criar um grupo, digite:

```
$ sudo groupadd <nome_do_novo_grupo>
```

- **sudo** serve para pedir permissões de administrador temporariamente.

## Excluindo grupo

Para excluir um grupo, digite:

```
$ sudo groupdel <nome_do_grupo>
```

## Adicionando usuário a um grupo

Para adicionar um usuário a um determinado grupo, digite:

```
$ sudo usermod -a -G <nome_do_grupo> <nome_do_usuário_que_deseja_adicionar_ao_grupo>
```

- **usermod**, adiciona ou modifica informações de um usuário já existente no sistema.

Outra maneira de fazer isso, é com o comando:

```
$ sudo gpasswd -a <nome_do_usuário> <nome_do_grupo>
```

- **gpasswd** é comando que permite administrar o arquivo **/etc/group**;

- **-a** para adicionar um novo usuário ao grupo.

## Excluindo usuário de um grupo

Para excluir um determinado usuário de um grupo, digite:

```
$ sudo gpasswd -d <nome_do_usuário> <nome_do_grupo>
```

- **-d** para deletar um determinado usuário do grupo.
✨ Announcing 11ty.Rocks: A collection of Eleventy resources
Tags: eleventy, 11ty, webdev, news
Published: 2020-10-24 19:27:57

Eleventy (11ty) is a simple but powerful static site generator that is capable of mixing template languages. Content can be written with Markdown or one of the other template languages. Or, dynamically create pages from local data or external sources that are compiled at build time. It has zero production JavaScript dependencies, so your site is truly static.

I've been very active creating 11ty-based sites and additional resources, so I've released [11ty.Rocks](https://11ty.rocks) as a collection of Eleventy (11ty) starters, projects, plugins, and resources.

**Do you create 11ty things, too**? Then submit a PR to join the [11ty Webring](https://github.com/5t3ph/11ty-rocks/blob/main/join-webring.md), and add the web component to your site! 💫

Check out the available resources including a freshly launched plugin, and be sure to bookmark/add 11ty.Rocks to your RSS feed for future posts!

[Visit 11ty.Rocks >](https://11ty.rocks)
Day 100: I did it !! 
Tags: 100daysofcode, vue, webdev
Published: 2020-10-24 19:13:33


Today's work:

{% vimeo  471765947 %}
I completed the second section and read code on routing. I got a recommendation to use nested routing for the second menu so I'm learning routing and i hope to switch to nested routing as soon as i understand how it works.

Allow me to properly hype this. 🥳💃 I did it!!! I'm so excited. This was AMAZING and TOUGH. I'm happy i didn't quit. Thanks to the amount of support I've received from this community.

Thank you🤗

_Day 100/100_
How to download and install xampp for window
Published: 2020-10-24 18:46:35

1. Downloading XAMPP
![x1](https://dev-to-uploads.s3.amazonaws.com/i/s8ki5rm1xpn4act79cwj.png)

2. Start the .exe file
   Once your file has downloaded, all you need to do is launch the .exe file.

3. Disable antivirus software
   
  Disable your antivirus as this may cause erratic behavior of some XAMPP components.It is therefore advisable to deactivate the software until the installation is complete.
![Capture d’écran 2020-10-24 184414](https://dev-to-uploads.s3.amazonaws.com/i/bhsvndkkls18rf2tc38g.png)

4.Disable UAC
  Besides antivirus, User Account Control can also be a problem 
 when installing XAMPP. You will need to deactivate it

![x3](https://dev-to-uploads.s3.amazonaws.com/i/ak2309q7vqvdggyspngi.png)

5.Start Setup-Wizard
Once you have deactivated any security programs that could cause problems during the installation of XAMPP, click on "next" to ![x4](https://dev-to-uploads.s3.amazonaws.com/i/2i54d2ys4uhvgx8ytbce.png)
 
6.Choice of software component

You will be able to select the components you want to install on your Computer when installing XAMPP. If you are using a test environment, it is best to be guided and install all the components. Click on "next" to continue with the installation

![x5](https://dev-to-uploads.s3.amazonaws.com/i/8dnbjtypkx4wn21e2gm8.png)

 7.Choice of installation file
You will be able to choose the installation folder for your software and its components. By default, the software will create an XAMPP folder at the root of your hard drive.
![x6](https://dev-to-uploads.s3.amazonaws.com/i/usz4jn1os1ojn7gog6st.png)

8.Start the installation
  The installer is now ready to install XAMPP. Click "Next" and wait for the installer to unzip and install the selected components
![x8](https://dev-to-uploads.s3.amazonaws.com/i/rw27hl6oyo21au2qjt0e.png)

XAMPP Management Controller
The XAMPP control panel gives you complete control over all installed XAMPP components. You can use the CP to start / stop different modules, launch the Unix shell, open Windows Explorer and see all the operations running in the background. The actions offered by this interface are as follows:

Config: Allows you to configure XAMPP as well as components
NetStats: Displays current processes on your local computer
Shell: Open a UNIX cell
Explore: Open XAMPP folder in Windows
Services: Shows the services running in the background
Help: provides help links through the user forum
Finish: Close the XAMPP Management Controller
![x9](https://dev-to-uploads.s3.amazonaws.com/i/bfaxq0mdevghtmrym01c.png)
UCSC Undergrads are Escaping the Loop!
Tags: hacktoberfest, opensource, ucschf2020
Published: 2020-10-24 18:33:09

Our youth comes up with many ideas to elevate sustainable development of the country. These ideas have to be brought into light in order to find solutions to combat many issues that we face today. The Mozilla Club of the University of Colombo, School of Computing opened up the door to bring out these innovative ideas by organizing the hackathon “Escape the Loop 2020” for the young enthusiastic undergraduates of the University of Colombo, School of Computing.

#What is Escape the loop?
Escape the loop is a part of Hacktoberfest, a global month-long celebration of open source software backed by Digital Ocean, Intel and the Dev Community.

#How does it work?
After registering as an individual or as a group at Hacktoberfest, participants can start building their project. They have 4 days until the deadline, which is October 26th, to finish and push their sustainable project to GitHub.
This year's Escape the loop is retro/cyberpunk-themed, so the participants can choose between old school 1980s or the futuristic '2080s' design language.

Winning team/individual, 1st runners up and 2nd runners up will be awarded and all the participants of the competition will be receiving a certificate of participation.


#How is it going so far?
The hackathon commenced on the 22nd of October 2020 with an awareness session which motivated many young minds to participate in this competition to bring out their innovative ideas. The deadline for the submission is 11.59 pm on 26th of October.<br>
Until now, the competition has been monumental. Participants are bringing the raddest designs and significant concepts to the table and it keeps on coming. 
The competitors shared that they are bringing exciting projects to the table including projects with technologies like Machine Learning integrated into them!
We are eager to see all the innovative projects our undergrads create in order to make the world we live in a better place!

------------------------------------------------
For UCSC Mozilla Club,
<b>Yashithi Dharmawimala, Akila Maithripala, Mohammadhu Faalil, Marita Thushari and Mohammed Ashfaq Ashar.</b>
Pseudocode
Published: 2020-10-24 17:50:05

What is pseudocode?
==> Pseudocode is a set of instructions or steps written in plain English language before we directly implement or write actual programming language code. It is a way of expressing a program or ideas or concept without worrying about the specific syntax rules. This is something we write that is not an actual code in any programming language, but if anyone read it, they can understand what is happening or what steps are being taken to execute a certain program.

Why should we use pseudocode?
==> Pseudocode helps us to focus on the problem rather than thinking about all those complex syntaxes, functions and other complicated rules. It essentially helps us to break large problems into smaller manageable problems. As a result, we can focus on one problem at a time and can anticipate future problems which may arise in future. Sometimes when we face any problem during code, we tend to jump straight into googling for a solution. There are ways of googling if we don't take time to write pseudocode we may not thinking through the whole process and details of the project. As a result, we may end up googling inefficiently.

How to write pseudocode?
==> There are no rules associated with writing pseudocode. It is just a list of simple instructions written in English. For example -
To make a phone call our pseudocode would be
    1. Unlock the phone
    2. Open contacts
    3. Search for contact
    4. Press the call option
    5. Speak
    6. End the call
That's how simple it is.
I just finished 4 PRs! hacktoberfest!
Tags: hacktoberfest, ruby
Published: 2020-10-24 17:33:02

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/e9uqapj0reyszwk7yxum.png)
Although the approved PRs are still maturing, I'm happy that I did it!

I'm a Rails developer for many years but never contribute to any repository. I just didn't know where to begin. And repository like Rails need so much background knowledge that really intimidates me. However, after joining the event, I found open source projects aren't all some kind of framework or language itself. Many of them are really just website projects need helps from people. So it's not as pressureful as I thought that contributors needs full of algorithm knowledge or knowing everything. Try to search issues and solve them is fun and not really that hard.

Thanks a lot to Hacktoberfest gave me object and energy to contribute to open source projects! I actually knew this event on around in the middle of October. I'm glad I finished on time and it gives me much confidence :D

## Tips
Here are some methods I use to achieve my goals:
1. use Github topic page to search for the repos. If the language I want, ex: Ruby, is not in the list on sidebar. I input the language in the search query in URL directly. ex: `https://github.com/topics/hacktoberfest?l=ruby`
2. use Github's advanced search to search issues with #hacktoberfest
3. If you are an experienced developer. I think by searching thoroughly. Everyone can find 1 or 2 issue they can solve. Reply the issue you want to solve and discuss with the maintainers. For example, I'm pretty good at testing, so 2 of my 4 PR is to fix specs.
How to Download and Install MySQL Workbench 8.0 on Windows 10
Tags: mysql, database, webdev
Published: 2020-10-24 17:29:04

##1-What is MySQL Workbench
MySQL Workbench is a unified visual tool for database architects, developers, and DBAs. MySQL Workbench provides data modeling, SQL development, and comprehensive administration tools for server configuration, user administration, backup, and much more. MySQL Workbench is available on Windows, Linux and Mac OS X.

##2-Installation Process of MySQL Workbench

#####Step 1

To download MySQL workbench, visit MySQL website in your web browser and download URL: 
https://www.mysql.com/products/workbench/

![work1](https://dev-to-uploads.s3.amazonaws.com/i/zygcgas9yv7tlekmr5k5.PNG)

#####Step 2
 
Click on "MySQL installer for Windows". Then, navigate the downloading location and the file will be automatically downloaded.

![work2](https://dev-to-uploads.s3.amazonaws.com/i/abgunispe2jvcumywr6z.PNG)

#####Step 3
 
Double-click the downloaded file to launch the MySQL installer.

#####Step 4
 
Setup window will appear on the screen. Then, click on the "Next" button.

![work3](https://dev-to-uploads.s3.amazonaws.com/i/7q8usoaesknjh98lm2c0.PNG)

#####Step 5
 
Select the folder in which you want to install your MySQL Workbench and click on “Next”.

![work4](https://dev-to-uploads.s3.amazonaws.com/i/kv3ec2o0t0jahivsvsiz.PNG)

#####Step 6
 
Choose the setup type that best suits your needs and click on “Next”.

![work5](https://dev-to-uploads.s3.amazonaws.com/i/u91bn7fsd1bgqdr63fh5.PNG)

#####Step 7
 
"Ready to Install" window will appear on the screen, then click on the "Next" button.

![work6](https://dev-to-uploads.s3.amazonaws.com/i/0fijiu9vlvffbg2rtvyq.PNG)

#####Step 8
 
MySQL Workbench installation process

![work7](https://dev-to-uploads.s3.amazonaws.com/i/4t7he84cog56wlgu5nil.PNG)

#####Step 9
 
Click on the “Finish” button when the installation is completed

![work8](https://dev-to-uploads.s3.amazonaws.com/i/cbg94agkpy6o0evubr8w.PNG)

#####Step 10
 
"Welcome to MySQL Workbench" will appear on the screen and you are now ready to design your databases.

![work9](https://dev-to-uploads.s3.amazonaws.com/i/5vvc25sauilpsotmsmh7.PNG)

##Conclusion
 
By following the above methods, you can download and install MySQL Workbench 8.0 on windows 10 without any issues
 
I hope you enjoyed this document.
 
Thanks for reading
Hacktoberfest finished!
Published: 2020-10-24 17:24:44

I have needed more time I expected, but I finally finished the challenge. This experience has been enriching. I have met people, I have learned how to contribute with an open source project. I realized all the work behind many tools we usually used without keeping in mind who is doing our work easier.

I tried to do the challenge last year, but I wasn't confident, and finally I left. I regret that, but now I have compensated.

 Haven't you done this challenge? You have still 1 week! Don't doubt and try it, because these events are funny and constructive