teleren/devto huggingface dataset:
Docket : connect to your docker's container easily !
Tags: docker, container, bash, ruby
Published: 2020-03-05 15:54:46

I'll introduce you today a tool helping you to connect to docker containers quickly and easily using CLI.

The current docker way you already know is simple. If you want to connect to one of your running containers, you have to execute "**docker ps**" command, listing all your (*running*) containers informations. 

Next you have to execute "**docker exec -it my_container bash**" command. This will connect you in your container to a bash session.

Every time I use the "docker ps" command, I get a long and large table. Unreadable if your terminal is not with 6px font-size .. On my terminal it looks like this : 

![docker ps command](https://i.imgur.com/Dkc2VgY.png)

Not really easy to read. But because I hate loose my time and love to find funny's solutions, I tried to develop a script that automatically get all containers available in "docker ps" command, only displaying "name" in a list option. I just have to select the right one with my keyboard, and it give me the good bash session, that's all !

## Docket : docker in your pocket !
That's why Docket is born : in a few lines of bash or ruby (*maybe one day it will be available in python too*), job is done !

![Recordit GIF](http://g.recordit.co/vN2zEXCrgw.gif)

All of my mates that saw it on my computer just asked to use it, so maybe it will be useful to you too! Go on the [GitHub project](https://github.com/Pobb/docket) for setup instructions. You just have to download script (bash or ruby, as you want), and execute it. For more comfortable use, you can create an alias.
GH first impression and what needs to be changed
Tags: git, gh, hub, webdev
Published: 2020-03-05 15:53:25





Hi everyone



Today I am writing about `gh`, the Github wrapper that entered beta. Also the Github devs are looking for feedback on thier new cli tool.



So after installing it, I first tested if it enters in conflict(fights) with `hub`, that I already had it installed.


```shell
hub --version                                                                             ✔  at 17:31:38 
git version 2.20.1
hub version 2.7.0
```

```shell
gh --version                                                                              ✔  at 17:31:49 
gh version 0.5.7 (2020-02-20)
https://github.com/cli/cli/releases/tag/v0.5.7


A new release of gh is available: 0.5.7 → v0.6.1
https://github.com/cli/cli/releases/tag/v0.6.1

```

No problems so far.

So As you can see Dear reader they don't enter conflicts or collide.



Going a bit further I wanted to test `gh` in a project created with `hub` to see if it can manage this challenge.



If you followed my articles **Dear reader**, you may have read about my Absinthe series, so let's test if `gh` can use the following command as `hub`.



```shell
hub checkout -b 01-new_branch
```



But when I tried `gh` the result was:

```shell
gh pr checkout -b 01-new_branch                                                                                        ✔  at 17:37:23 
unknown shorthand flag: 'b' in -b

Usage:
  gh pr checkout {<number> | <url> | <branch>} [flags]

Global Flags:
      --help              Show help for command
  -R, --repo OWNER/REPO   Select another repository using the OWNER/REPO format
```



**So no `-b` flag for creating a new branch from an existing one?!**



Then when I executed `gh` for the first time it wanted for me to log in to my GitHub using the browser and not the terminal.



**I think that I will report these things to GitHub regarding `gh` and ask them nicely to keep the normal `git commands` so that we don't need to learn a new `git`!?**



What do you think **Dear Reader**? Have you tried `gh` yet?

If you enjoyed this article and also found it useful, share it on social.
Shell installers may be stronger than package installers on GitHub
Tags: npm, swiprolog, github
Published: 2020-03-05 15:04:10

---
title: Shell installers may be stronger than package installers on GitHub
published: true
description: Is this a reverse psychology article on NPM?
tags: NPM, SWI-Prolog, Github
cover_image: https://1.bp.blogspot.com/-0lqrRp7qM4A/XmEdCxzlpkI/AAAAAAAAHY8/7D1p2USS5qQfvv5YrKBXT28CY90hc759QCLcBGAsYHQ/s400/file-overload-1557051-1279x959.jpg
---

Scenario: I want to make installing my repository that is dependent on another of my repositories easier. I want to make the installation easier by doing it "in my way" (with a shell script) rather than package installers, which allows command-line installation of repositories, at the cost of development speed. 

Wouldn't the idea be installing the repository with a particular version that corresponds to the version of the repository dependent on it? For example, an inductive algorithm finder of version 1.0 requires an interpreter of version 0.5. I saw the versions page somewhere while checking on the traffic to my GitHub repository. 

I read on a well-known repository that SemVer is a preferred system of organising versions in the x.y.z format. 

Is my repository ready for the industrial exposure of availability on the command-line? Is it just me, or did I add too many unnecessary, bug ridden features meaning I am grateful I kept an old version as a separate repository (some may have kept it as a separate version) and I can transfer the best (working) features from the new to the stable version... Why is my stable release my first of my three generations of my program - will it be too simple for be available on a command line argument? 

Do I get credit for these uses of my software - I always wondered if people would use my programs when I had an Apple IIe, and was very steadfast about putting my name and the date in the documentation of the program. What if I make a famous program, does that make me famous? 

Do I need a copywriter for my documentation page, you know that one that someone seems to copy onto various websites? Different in what way? Whatever happens, I don't want to be that person who wrote too much or too little documentation - "where is it?" 

I could think of more to write - who (with which OS's, etc.) needs my program, do I need a single set of instructions on a page for using my dependency of repositories - with training, walkthroughs, even videos? 

So, would using a package installer allow a user to search through a description of my repository and my algorithm given greater awareness? Should I label it "what I got up to" and "what I want, or rather how it fits into the eco-system of my other repositories"? 

I just wish SWI-Prolog had a verify (input) feature, or should I put it in myself? Maybe I should explain how users should format input into my algorithm.

Photo by <a href="/photographer/brainloc-32259">Bob Smith</a> from <a href="https://freeimages.com/">FreeImages</a>
Using Firebase with Gatsby
Tags: firebase, gatsby, react, javascript
Published: 2020-03-05 15:03:01

I struggled a lot with this because you don't have the window object when trying to initialize firebase, so every post I found in how to solve it propones to create a method to check if it was initialized and save the instance to a variable.

I don't like that, I just want to use it without caring if I have to initialize it or not.

This is how I solved it:

```js
import firebase from "firebase/app";

import "firebase/auth";
import "firebase/firestore";

export default new Proxy(
  {
    get database() {
      return firebase.firestore();
    },
    get auth() {
      return firebase.auth();
    },
    providers: {
      get google() {
        return new firebase.auth.GoogleAuthProvider();
      },
    },
  },
  {
    get: function(target, name) {
      if (!firebase.apps.length) {
        firebase.initializeApp({
          apiKey: process.env.GATSBY_API_KEY,
          authDomain: process.env.GATSBY_AUTH_DOMAIN,
          databaseURL: process.env.GATSBY_DATABASE_URL,
          projectId: process.env.GATSBY_PROJECT_ID,
          storageBucket: process.env.GATSBY_STORAGE_BUCKET,
          messagingSenderId: process.env.GATSBY_MESSAGING_SENDER_ID,
          appId: process.env.GATSBY_APP_ID,
        });
      }

      return target[name];
    },
  }
);
```

This way we always check if firebase is initialized without the need of doing it explicitly, just be sure to have the window object when you call a method.

Example of use:
```js
import firebase from "../firebase";
import { IUser } from "../session";

import { ITodo } from "./types";

export default {
  add: (user: IUser["uid"], todo: Partial<ITodo>) =>
    firebase.database
      .collection("users")
      .doc(user)
      .collection("todos")
      .add(todo),
  update: (user: IUser["uid"], todo: ITodo) =>
    firebase.database
      .collection("users")
      .doc(user)
      .collection("todos")
      .doc(todo.id)
      .update(todo),
  remove: (user: IUser["uid"], id: ITodo["id"]) =>
    firebase.database
      .collection("users")
      .doc(user)
      .collection("todos")
      .doc(id)
      .delete(),
  onChange: (user: IUser["uid"], callback: (todos: ITodo[]) => void) =>
    firebase.database
      .collection("users")
      .doc(user)
      .collection("todos")
      .onSnapshot(snapshot => callback(snapshot.docs.map(doc => ({ id: doc.id, ...(doc.data() as ITodo) })))),
};
```

You can find the full repo where this is being used in here:
https://github.com/goncy/typescript-firebase-context-gatsby-todos
Nevertheless, ShaAliLiton Coded
Tags: wecoded
Published: 2020-03-05 14:59:15

<!-- ✨This template is only meant to get your ideas going, so please feel free to write your own title & narrative! ✨ -->

## Equality in tech looks like… 

## I’m an expert at…

## My advice for allies to support self-identifying women and non-binary folks who code is...

<!-- Once your post is published, it will not appear on the /t/shecoded page until an admin approves it. This is an extra step to ensure there is no abuse on this important tag. -->
Can coding breaks be too long?
Tags: discuss
Published: 2020-03-05 14:57:37

---
title: Can coding breaks be too long?
published: true
description: How hard is it to get back into actively coding after taking long breaks for any reason even career changes.
tags: discuss
---

Has anyone taking a long hiatus from active coding either due to career changes or whatever reason and then try to get back into it? What's the experience like? What steps did you take to get back on your groove? And how did you catch up on all the numerous new technologies and practices you may have forgotten?
New migration methods in Laravel 7
Tags: laravel, php, webdev
Published: 2020-03-05 14:54:53

#id()
Up to Laravel 6, we used to put the `id` column on tables in our migrations like below:

```php
$table->bigIncrements('id');
```
With Laravel 7 release, there is more cleaner syntax 🔥
```php
$table->id();
```
Let's also take a look at its definition:
```php
    /**
     * Create a new auto-incrementing big integer (8-byte) column on the table.
     *
     * @param  string  $column
     * @return \Illuminate\Database\Schema\ColumnDefinition
     */
    public function id($column = 'id')
    {
        return $this->bigIncrements($column);
    }
```
#foreignId()
Up to Laravel 6, we needed to define foreign key constraint like:
```php
Schema::table('posts', function (Blueprint $table) {
    $table->unsignedBigInteger('user_id');

    $table->foreign('user_id')->references('id')->on('users');
});
```
Behold the Laravel 7 syntax 🤯
```php
Schema::table('posts', function (Blueprint $table) {
    $table->foreignId('user_id')->constrained();
});
```
one-liner! How cool is that 🥳

Definition of method:
```php
    /**
     * Create a new unsigned big integer (8-byte) column on the table.
     *
     * @param  string  $column
     * @return \Illuminate\Database\Schema\ForeignIdColumnDefinition
     */
    public function foreignId($column)
    {
        $this->columns[] = $column = new ForeignIdColumnDefinition($this, [
            'type' => 'bigInteger',
            'name' => $column,
            'autoIncrement' => false,
            'unsigned' => true,
        ]);

        return $column;
    }
``` 

Read more about these in the [docs](https://laravel.com/docs/7.x/migrations).

{% twitter 1189977857243660288 %}
Google Sign-in for android app with flavours
Tags: android, signin, flavours
Published: 2020-03-05 14:42:17

I work for a local bussiness in Peru. I'm developing a android app so my product owner tell me that the bussiness needed a new funcionality for the delivery app. He told that the app needed a Google sign-in The requerimient looked easy because I've already done that in another apps, so I think this is easy.

So I followed the steps from this page:

[Google Sign-in for Android: ](https://developers.google.com/identity/sign-in/android/start-integrating)

I tought that it would take me at least at few hours but I couldnt. I did all the steps in the google's guide but ALWAYS throw me this message:

**com.google.android.gms.common.api.ApiException: 10:**

I was strugglin about two days, reading a lot of post of SO, fixing my code, trying new ways to achive the google sign in but nothig worked. Actually, I created a simple demo app just to try the google sign-in and this demo worked fine! I was really frustated.

At the second day, in the afternoon, around the 14:00 hours, FINALLY I found the solution and I hope this can help you my dear android developer.

The delivery app works with flavours. This may sound normal, but when you configure your app to use Google sign-in, the ask you for the package that you're using in your app. And HERE IS THE KEY:

When you use flavours, you create package for each one. I was working in a dev flavour so my package was

**dev.mydeliveryapp.peru** 

But in the console I register the production flavour:

**mydeliveryapp.peru**

When I changed that, and tried again, the google sign-in works fine.

Also, just in case you didn't know, you shoul register your SHA1.
In the android studio, to the right there is an gradle option option as you can see in the image. 

<figure>
  <img src="https://i.ibb.co/gTtwc2B/gradle.png" alt="views-sktech" border="0"></a>
  <figcaption>Fig. 1</figcaption>
</figure>

Then, click in sigin report and the console will shoy you your SHA1:

<figure>
  <img src="https://i.ibb.co/GkB2T5x/sigin.png" alt="views-sktech" border="0"></a>
  <figcaption>Fig. 1</figcaption>
</figure>

So that's all. I hope this help someone out there strugglin with this.

Happy code!
How is data secure over https?
Published: 2020-03-05 14:40:55

Link: https://blog.joshsoftware.com/2019/08/23/how-is-data-secure-over-https/

Everyone of us have heard that data transferred over HTTPS is secured. As a result we provide our highly confidential information like bank details, credit card details to a website which runs overHTTPS .

Have you ever thought what makes your data secure when transferred over HTTPS ? How HTTPS makes sure that the data cannot be read by any intruder ?
Export SwiftUI code from Figma design files. New plugin released.
Tags: swiftui, swift, ios, figma
Published: 2020-03-05 14:20:27

---
title: Export SwiftUI code from Figma design files. New plugin released.
published: true
description: SwiftUI inspector is here. Enhance your development workflow by copying and pasting element styles from your Figma files into your Xcode project.
tags: swiftui, swift, iOS, figma
---

Guys, excited to let you know about a new plugin we are building. If you are working with Figma & SwiftUI this will greatly increase your productivity.

Would love to get your initial thoughts. Currently supports colors and text labels. Shapes & components coming soon. 

https://www.figma.com/community/plugin/784879032180068427/SwiftUI-Inspector
How to customise markdown anchor tags
Tags: gatsby, javascript, markdown, frontend
Published: 2020-03-05 14:20:21

Customising anchor tags in a markdown file can be daunting when adhering to markdown syntaxes.
For example \[click-here\](url) will generate a corresponding anchor tag \<a href='url'>click-here \</a>, this makes it difficult to add customisations such as.

* Opening external links in a new tab, while local links retain default behaviour (opens on same tab)
* Adding attributes to the anchor tags
* Adding className links so as to do more customisation with CSS and JavaScript.

So, I have created an NPM package to solve this challenge. Check it out https://www.npmjs.com/package/customise-links
Useful Flutter Resource To Become A Flutter Developer
Tags: flutter, dart, nativeapps
Published: 2020-03-05 14:17:22

---
title: Useful Flutter Resource To Become A Flutter Developer
published: true
description: Flutter Guideline for beginner, useful resource for every flutter developers.
tags: Flutter, Dart, Native Apps
cover_image: https://flutter.dev/assets/homepage/news-2-599aefd56e8aa903ded69500ef4102cdd8f988dab8d9e4d570de18bdb702ffd4.png
---

Just including some resources to kick start flutter development. 

# Flutter Resources

Documentation: https://docs.flutter.io/
Github: https://github.com/flutter/flutter
StackOverflow: https://stackoverflow.com/questions/tagged/flutter
Gitter: https://gitter.im/flutter/flutter
Effective Dart Guide: https://www.dartlang.org/guides/language/effective-dart
Dart Tips: https://www.dartlang.org/resources/dart-tips
Flutter FAQ: https://flutter.io/faq/
Flutter Rendering: https://www.youtube.com/watch?v=UUfXWzp0-DU
Flutter Engine: https://github.com/flutter/engine/wiki
Hot Reload: https://flutter.io/hot-reload/
Flutter Inspector: https://dart-lang.github.io/observatory/
Dart Style Guide: https://www.dartlang.org/guides/language/effective-dart/style
Dart Observatory: https://dart-lang.github.io/observatory/
Flutter Widgets: https://flutter.io/widgets/
Flutter Gallery App Code: https://github.com/flutter/flutter/tree/master/examples/flutter_gallery
Flutter Gallery Android App: https://play.google.com/store/apps/details?id=io.flutter.demo.gallery
Flutter Layout: https://flutter.io/tutorials/layout/
Material: https://material.io
Icons: https://thenounproject.com
Images: https://unsplash.com
Fonts: https://fonts.google.com
Google APIs: https://pub.dartlang.org/packages/googleapis
Async and Futures: https://www.dartlang.org/tutorials/language/futures
Testing: https://flutter.io/testing/
A note on naming colors
Published: 2020-03-05 13:28:25

Posted earlier on [my blog](https://www.buszewski.com/writings/2020-02-27-a-note-on-naming-colors/).

Remember that text saying "in IT, naming thing is hard"? This is even harder when it comes to colors.

Most of the time, a color is already named. Red. Blue. [Rebecca Purple][1]. But those names bare no context. Anything can be _blue_. So, what to do, when we want to know, what we are dealing with?

## Even more abstraction

One thing that I've used is to generate color names at random. With [Name That Color][2], I was able to tell the difference between one [shade of teal][3] from [the other][4]. Even though they are visually different, in the code they are just different strings. Take a look at this:

```css
:root {
  --color-spray: #74E5EF;
  --color-java: #24C7C0;
}
```

Seems pretty obvious and easy. Or does it?

Try to wait a bit. [Forget some stuff][5]. And suddenly, _what is that "java" color?_ pops in your head.

## Use contextual names

When you are getting your colors, they are for _something_. This is for the header text. That's for links. And that one's for the background. Why not name them as such?

```css
:root {
  --color-bg: #fafafa;
  --color-text: #222;
  --color-links: #ffffaa;
}
```

This is the most readable thing you can do when naming colors. That way you won't have to care whether this color is "red" or "blue". It will be "background". 

Seems obvious, but much too often I found people reinventing the wheel.

### Bonus: theming

During the design phase, colors are carefully picked. But sometimes a need arises. _Let's have a dark mode!_ Or _let's have a colorblind mode!_ Using contextual names allowed to define themes with ease:

```css
:root {
  --color-bg: #fafafa;
  --color-text: #222;
  --color-links: #ffffaa;
}

@media (prefers-color-scheme: dark) {
  :root {
    --color-bg: #000;
    --color-text: #666;
    --color-links: #fcfcfc;
  }
}
```

There you have it. Simply overwriting values basing on some external factors is very simple using such notation.

---

Naming things is hard. But using meaningful names will always be the way to go.

[1]:	http://www.colors.commutercreative.com/rebeccapurple/
[2]:	http://chir.ag/projects/name-that-color/#6195ED
[3]:	https://www.colourlovers.com/color/74E5EF/Flowering_Flow
[4]:	https://www.colourlovers.com/color/24C7C0/buy_tramadol_online
[5]:	/writings/2020-02-10-dont-forget-to-forget-your-code
The most underrated feature of React
Tags: react, webdev
Published: 2020-03-05 14:12:58

A little bit of background on my experience. 2 years ago I joined a small team that was not using a modern Front-End framework like React, Vue, Angular. Over time the we migrated to using React for all of our front ends.

The team grew fast and we hired a lot of juniors developers and using a framework such as React enabled us to actually onboard the developers much more quickly than before when we were just using Jquery. There is a vast amount of documentation out there, hence they didn't need as much time figuring out how our web apps worked together.

**React forced us to normalize our codebase structure way.** Because of this, we didn't need to spend much time discussing and reviewing code that was not modular or had no structure.
Ask Dev: What tools do you use to create Programming video tutorials ?
Tags: discuss, webdev, askdev
Published: 2020-03-05 14:09:05


:wave: 

I have seen some Good Programming tutorials videos in `YouTube`, and was curious about the Tools they used to create it.

I have heard about paid ones like `Camtasia`.

Recently I heard about Open Source Software like `OBS` which can be used to create good videos.

Few points to discuss. :smile:

What Tools and Mic do you use ?

If you are using `OBS` , Whats your settings for `OBS` ?

Do you use `PPT` effects to make presentation more clear ?

Is there a freeware available with below features:

- Recording,
- Editing , Clipping
- Adding Audio Track.
- Add some Transition effects.

:+1: