teleren/devto huggingface dataset:
Want a Gatsby Theme for your blog? Use and Modification My Personal Theme
Tags: react, gatsby, beginners, motivation
Published: 2020-03-20 16:59:06

Hi Everyone,

I will like to motivate my fellow beginner developers by sharing my personal Gatsby theme for use and modification. 

While I have gained a lot here, I'm glad to contribute a token. 

This Gatsby site is based on React library and GraphQL. Though the blog post content comes from Markdown filesystem, I have a couple of resources that will help you [source content from CMS like contentful](https://ibaslogic.com/blog/gatsby-with-contentful-cms/). 

I believe this theme is not too complex for a basic Blog site.

If you like the fluidity but don't know where to start, I have you covered.

Start here:

[Learn to write React code from scratch](https://ibaslogic.com/blog/react-tutorial-for-beginners/).

[Gatsby tutorial from scratch](https://ibaslogic.com/blog/gatsby-tutorial-from-scratch-for-beginners/).

Once you are comfortable with that, modifying this theme will be a piece of cake.

[Theme source code on GitHub](https://github.com/Ibaslogic/Ibaslogic)

#### [View site here](https://ibaslogic.com/)

For senior developers that beginners like myself look up to, please I will like to hear your feedback.

Thanks.

If you have any question, I will be happy answering them.

#### PS: I will be sharing my awesome project to motivate beginners. Be sure you [follow me on Twitter](https://twitter.com/ibaslogic) so you don't miss out.
  
<br />
A Guide To Magento 2 Theme Development 
Tags: magento, theme
Published: 2020-03-21 20:14:15


The theme is a component of Magento 2 which gives a consistent look and feel to your whole store. It provides an improved look to areas like Magento 2 Admin and Storefront by utilizing a combination of custom templates, designs, styles or images development.
In Magento 2, there are no restrictions on using the Luma theme for your live store. However, if you want to customize the default design or if you need to create your own theme, Magento strongly recommends not to change or edit the default Luma and Blank theme files. Many people ask why Magento does not allow to change or edit Luma and Blank theme files? The answer is: when you change or edit the default files, your changes can be overwritten by the latest version of the default files during your Magento 2 upgrades.
To read the full article on <a href="https://www.cloudways.com/blog/create-custom-theme-magento-2-part-1/">how to install theme in magento 2</a> visit Cloudways
Primeiros passos com o editor Vi parte: 1
Published: 2020-03-21 21:11:20

Recentemente, eu vi que tinha que aprender a usar o editor vi, pois estava editando arquivos grandes com o nano e como só tinha o bom e velho terminal para editar esses arquivos e estava com muitas dificuldades porque editar arquivos grandes ou o nano se torna mais difícil , entre outros problemas.

Vamos começar com a navegação no modo de edição de texto igual a qualquer editor de texto, utilizado como setas do teclado para isso.

Bom, vamos ao básico como eu faço para inserir coisas no arquivo? Isso é muito simples, basta abrir a tecla "i" e começar a digitar a partir de onde você estiver no texto.

E para sair da inserção de texto como eu faço? Basta abrir a tecla "esc" e vc voltara para uma navegação normal.

Também temos a tecla "a" que começa a inserir o texto na posição a seguir de onde você estiver.

Feito nossa alteração como salvamos o arquivo? Digitamos o ": w" e, em seguida, damos um valor para confirmar e pronto o arquivo salvo.

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

Mas e se você quiser sair e agora como fazer? É possível fazer isso sem desligar o computador?

É uma resposta simm, para isso usa o ": q", também pode combinar os comandos e executar várias ações em conjunto ou executar um combo com o kkk, vamos usar o exemplo de salvar e sair.

ex: :wq

Sim com o :wq podemos salvar e sair do arquivo.
chegamos ao fim da primeira parte do artigo, fazendo o proximo nos seguintes dias de quarentena. 😅
Suppressing Ruby 2.7.0 warnings in RubyMine and zsh/bash
Tags: ruby, rubymine, zsh, rails
Published: 2020-03-21 22:56:43

Hi all. If you've already decided to use Ruby 2.7.0 you may struggle with warnings like this one:

```
/Users/r.kornev/.rbenv/versions/2.7.0/lib/ruby/gems/2.7.0/gems/actionpack-6.0.2.2/lib/action_dispatch/middleware/stack.rb:37: warning: Using the last argument as keyword parameters is deprecated; maybe ** should be added to the call
/Users/r.kornev/.rbenv/versions/2.7.0/lib/ruby/gems/2.7.0/gems/actionpack-6.0.2.2/lib/action_dispatch/middleware/static.rb:110: warning: The called method `initialize' is defined here
Running via Spring preloader in process 1224
Loading development environment (Rails 6.0.2.2)
irb(main):001:0> Post.first
   (6.7ms)  SELECT sqlite_version(*)
  Post Load (0.1ms)  SELECT "posts".* FROM "posts" ORDER BY "posts"."id" ASC LIMIT ?  [["LIMIT", 1]]
/Users/r.kornev/.rbenv/versions/2.7.0/lib/ruby/gems/2.7.0/gems/activemodel-6.0.2.2/lib/active_model/type/integer.rb:13: warning: Using the last argument as keyword parameters is deprecated; maybe ** should be added to the call
/Users/r.kornev/.rbenv/versions/2.7.0/lib/ruby/gems/2.7.0/gems/activemodel-6.0.2.2/lib/active_model/type/value.rb:8: warning: The called method `initialize' is defined here
=> nil

```

I didn't understand is there a way to add a global environment variable which could affect all running processes like zsh, bash, RubyMine in MacOS Catalina.

So I've decided to split solutions:

# RubyMine

Open `Run -> Edit configurations` 

Then in an appropriate configuration add `RUBYOPT=-W:no-deprecated -W:no-experimental`

![RubyMine Ruby 2.7.0 warnings](https://dev-to-uploads.s3.amazonaws.com/i/azo1f79a3c379bngx468.jpeg)


# zsh/bash

Add `export RUBYOPT="-W:no-deprecated -W:no-experimental"`
to `~/.zshrc` or/and `~/.bashrc`

That's it :)

You also may be interested in these articles:
* https://dev.to/andrewmcodes/hiding-ruby-2-7-deprecation-warnings-in-rails-6-2mil
* https://prathamesh.tech/2019/12/26/managing-warnings-emitted-by-ruby-2-7/
* https://rubyreferences.github.io/rubychanges/2.7.html
My One-Man Hackathon Session
Tags: vue, javascript
Published: 2020-03-21 23:20:15

Last week I got an email for a telephone interview for my first full-time software engineering job. The shop uses mainly Vue.js and Laravel. I only had brief contact with Frontend programming using Angular 4 and Typescript during one of my internships before. Being overprepared that I am, this weekend, I wrote a simple static web application using Vue.js. My goal is to show my future employees (hello if you're reading this :) that I am ready to learn new languages/frameworks if need be.

Due to the timezone differences, the phone interview will be conducted in Malaysian office hours. I am currently in Germany (UTC+1), and the company that I'm applying for is based in Malaysia (UTC+8). While finding a suitable time for the interview, I realized that even though there are a lot of world clocks online that show what the current time in other timezones is, I cannot find any that offers me to enter any arbitrary time. So why not write one?

I started hacking around Friday at noon. My first commit is a design document describing what this application is about and how the user will interact with it. Here's a blog post from Julia Evans explaining [why design document is a great idea][1], even for a small project.

After that, I dove into the documentation of Vue.js and started learning. My experience was pretty good, and the Essentials section had all that I need to know to bring my idea to life. I learn the most by using the framework directly. I ask myself questions on how to do something and then look for it in the documentation. Going through the docs all at once is okay, too, because we got to have an overview of what tools are available, but sometimes some concepts are a bit vague, and we cannot discern the differences unless it is put into practice. 

![The final product][2]

Not all the things that I planned to do end up in the final product, but that's just how it is. You can go to https://pokgak.gitlab.io/whatistheirtime to check it out.

I hosted the application on Gitlab Pages (free hosting!) instead of Github because I had used Gitlab CI before and liked it. The idea of having an integrated platform for doing CI/CD and the whole DevOps lifecycle seems cool too. I know Github also has Actions now, but I haven't got to it yet.

I'm satisfied with the project as a weekend hack session. I got to learn a lot and brushed up on my HTML, Javascript skills and taught me some CSS. Aside from knowing what the abbreviation means and what it does, I knew nothing about CSS, so my application only has minimal styling for now. I plan to upgrade it further when I have the time in the future.

[1]: https://jvns.ca/blog/2016/06/03/learning-to-like-design-documents/
[2]: https://dev-to-uploads.s3.amazonaws.com/i/pk4zerxgnen3ammgaab6.png "The final product"
Code like a Fullstack girl updates #1
Tags: codenewbie, codequality, node, javascript
Published: 2020-03-21 23:39:52

Hi, everyone!

I came back with a new post just to talk to you about my new hobby in quarantine: learning!

By the moment I posted this on my Portuguese blog, I had 7 certificates, and I wanted 10. At first, I thought I was going to do 7 a day and end it in 3 days, but as I saw that it looked humanly impossible, I decided to do it the way I could. Actually, this is my third - and the most productive - day doing the Bootcamp. I've learned about Logic, Systems Architecture, Github, HTML/CSS, a little bit of Bootstrap, and other issues.

I believe ending this Bootcamp won't be enough for me, but I'm learning a lot. I need to practice what I'm learning, and not just staying in theory, as I loved to do in my disastrous first semester at uni. I need to read and write code and test it to see if it really works, and if it doesn't, to pass hours trying to discover the reason, as I did in the data science course at Udemy.

I had learned a lot of theory, but I frequently ask myself Where Am I Going To Use This And When. I need more material to know about it, but it was a great start, as I still don't know exactly what my interests in Computing are, and that opened my eyes to many possibilities.

But! I still need to do the other 2/3 of the course, as I just made 1/3 of it to this moment. I hope there are even more things between what I learned until now and the technical knowledge of a full stack developer. And I want to know what are these things as soon as possible.

During quarantine, I decided to learn more. I want to graduate in four years - if the universe allows me to do it - and the faster and more efficient way I can learn what I need, the better this situation will be for me, and sooner I will be able to invest in my own entertainment. In this first week, I've watched the 3 seasons of Anne With an E, and Netflix: how do you dare to sleep at night promoting such things as Elite and 13 Reasons Why and ignoring the masterpiece that is Anne?

Many platforms are open for us to pass this Corona Time with education, and I recommend you to search it up too so you can avoid boredom and not being a full-time desperate mess about isolation.

See you soon!
My COVID-proof /etc/hosts file
Tags: focus, coronavirus
Published: 2020-03-27 18:20:13

---
title: My COVID-proof /etc/hosts file
published: true
description: Dusting off the OG site blocking app: /etc/hosts
tags: focus, coronavirus
---

There's a point at which the news ceases to serve you, and only feeds the part of your brain that wants to reduce uncertainty. 

I have reached that point.

Unfortunately, the world is extremely uncertain right now. And I just gotta learn to live with that.

First, though, I wanted to break the habit of checking the news as often as I was. I figured I could, in the short term, block the news-related sites that were distracting me most often, e.g.: Twitter, The New York Times, and The Washington Post.

To block these sites, I reached for an age-old trick: Modifying `/etc/hosts` to map certain urls to localhost (example below). 

```
##
# Host Database
#
# localhost is used to configure the loopback interface
# when the system is booting.  Do not change this entry.
##
127.0.0.1	localhost
# TO STAY FOCUSED
127.0.0.1 twitter.com
127.0.0.1 www.twitter.com
127.0.0.1 mobile.twitter.com
127.0.0.1 www.mobile.twitter.com
127.0.0.1 nytimes.com
127.0.0.1 www.nytimes.com
127.0.0.1 washingtonpost.com
127.0.0.1 www.washingtonpost.com

255.255.255.255	broadcasthost
::1             localhost
# Added by Docker Desktop
# To allow the same kube context to work on the host and the container:
127.0.0.1 kubernetes.docker.internal
# End of section

```

So, instead of the stream of "holy sh*t" headlines I was checking every hour, I now see (_pardon the Dutch_ 🇳🇱):

![nytimes.com shows no server connection possible](https://dev-to-uploads.s3.amazonaws.com/i/og11a9iv4c0cmrfih4vk.png "This is what you'll see, except probably not in Dutch")
<figcaption>This is what you'll see, except probably not in Dutch 🇳🇱</figcaption>

Works like a charm!

If, like me, you're on a Mac, you'll want to run `sudo killall -HUP mDNSResponder` afterward editing `/etc/hosts` in order to flush your DNS cache.

Also, I should note that *messing up this file can have bad consequences*... so make a copy before you toy with it, okay?

Otherwise, stay inside and enjoy your weekend.

✌️


***

_Also, as a post script, I should mention that my new deal with myself is only to check this [Axios one-pager](https://www.axios.com/coronavirus-latest-developments-8b8990c4-6762-494a-8ee0-5091746bda9b.html) on pandemic updates. We'll see how that goes._
Know more about function in JavaScript
Tags: javascript, help
Published: 2020-03-27 22:28:56


Hello everyone,
I met a problem in this case. I try to execute the "call" function by involving another function (in this case "question". In "question", I want to call the "call" function inside "question" to get the finally result that is "Hello" + name, but it didn't work and when I add "return" before the line "call(getName)" or console.log it, the result can be displayed, and I don't really understand WHY. Can anyone explain me? 
Here is the link: https://repl.it/@doHoangKhanh121/Pratique-JS
Thanks a lots.
Reverse Proxy MS SQL with Nginx
Tags: mssql, nginx, linux
Published: 2020-03-28 00:27:58

---
title: Reverse Proxy MS SQL with Nginx
published: true
description: Used Nginx reverse proxy to access remote database over VPN
tags: #MSSQL #nginx #linux
---

Hey it's my first post!  Did something nifty today to work around a technical issue I ran into while trying to do my job.

With the COVID-19 thing, I am working from home.  The VPN connection we have is a point to point, so I have access to the office LAN.  But I don't have access to our data center that is connected to our office via VPN.

To get around this today I had a Linux VM spun up to create a reverse proxy.  I first started with HAProxy, and it worked great... till I needed UDP for port 1434.  So I switched to Nginx, and was able to proxy both 1433/TCP and 1434/UDP to give me access to the MS SQL server.

Here's the simple Nginx config:
```
stream {
    upstream dbtcp {
        server db1:1433;
    }

    upstream dbudp {
        server db1:1434;
    }

    server {
        listen 1433;
        proxy_pass dbtcp;
        proxy_connect_timeout 1s; # detect failure quickly
    }

    server {
        listen 1434 udp;
        proxy_pass dbudp;
        proxy_connect_timeout 1s; # detect failure quickly
    }
}
```
Note that Nginx listens to tcp by default and you only need to denote udp.
Convert String to Int and Int to String in Golang
Tags: go, tutorial
Published: 2020-03-28 07:11:01

Golang standard library has provided 2 functions [Atoi](https://golang.org/pkg/strconv/#Atoi) and [Itoa](https://golang.org/pkg/strconv/#Itoa) to convert string to int and int to string respectively.

> Originally published on [schadokar.dev](https://schadokar.dev/to-the-point/convert-string-to-int-and-int-to-string-in-golang/)

These 2 functions placed inside the [strconv](https://golang.org/pkg/strconv/) package.

> Package strconv implements conversions to and from string representations of basic data types.

## String to Int

The `strconv.Atoi` function takes a string and returns an int and an error.

```go
func Atoi(s string) (int, error)
```

It will return type `int` and type `int` is system dependent. It is 32 bits on the 32-bit system and 64 bits on the 64-bit system.

>  💡 Use the term ASCII to Int to remember the func name.

```go
package main

import (
	"fmt"
	"strconv"
)

func main() {

	str := "1234"

	i, err := strconv.Atoi(str)

	if err != nil {
		fmt.Println(err)
	}

	fmt.Printf("Type: %T, Value: %v\n", i, i)

	// convert int to int64
	i64 := int64(i)
	fmt.Printf("Type: %T, Value: %v", i64, i64)
}
```
Output
```
Type: int, Value: 1234
Type: int64, Value: 1234
```

## Int to String

The `strconv.Itoa` takes `int` as an argument and returns the `string`.

```go
func Itoa(i int) string
```

Example:

```go
package main

import (
	"fmt"
	"strconv"
)

func main() {
	num := 322020

	str := strconv.Itoa(num)

	fmt.Printf("Type: %T, Value: %v", str, str)
}
```
Output

```
Type: string, Value: 322020
```
🤖 Create your Discord bot by using TypeScript and decorators!
Tags: typescript, javascript, discord, bot
Published: 2020-03-28 11:33:30

Some time ago, I posted an article about a module allowing the creation of Discord bots using the TypeScript decorators.
Well today, I'm pleased to announce the version 2.0 of this module!

This version includes two new very useful decorators which are `@Command` and `@Guard`.


# @Command 📟
First of all, `@Command` allows you to simplify the management of the commands launched by the user in the chat, here is a small example of what this gives:

```typescript
import {
  Discord,
  Command,
  CommandMessage
}

@Discord({ prefix: "!" })
abstract class App {
  // Executed when the user send "!hello"
  @Command("hello")
  hello(message: CommandMessage) {
    message.reply("Hello!")
  }

  @CommandNotFound()
  hello(message: CommandMessage) {
    message.reply("Command not found :(")
  }
}
```

# @Guard ⚔️ 
The `@Guard` decorator, on the other hand, allows functions to be executed before the event or command is executed, e.g. to check whether a condition is satisfied in order to block the event if it's not.

```typescript
import {
  Discord,
  Command,
  CommandMessage,
  Guard
}

function IsUserMaster(message: CommandMessage) {
  return message.author.username === "TheMaster139";
}

@Discord({ prefix: "!" })
abstract class App {
  // Executed when the user send "!hello" and if user's username is "TheMaster139"
  @Guard(IsUserMaster)
  @Command("hello")
  hello(message: CommandMessage) {
    message.reply("Hello!")
  }

  @CommandNotFound()
  hello(message: CommandMessage) {
    message.reply("Command not found :(")
  }
}
```

Thanks for reading! 😊


# But that's not all, for more information you can go to the [GitHub repository](https://github.com/owengombas/discord.ts).

  


**You can also [join the Discord server](https://discord.gg/VDjwu8E).**
Angular Child Routing
Tags: angular
Published: 2020-04-09 14:18:41

Angular's [documentation on Routing seems to require a master's degree](https://angular.io/guide/router) to get through the whole thing. Blurred vision, random thoughts, repeated readings, and a real implementation of [Too Long, Didn't Read](https://www.google.com/search?q=tldr) are all symptoms of diving in to Angular Routing, but...

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

**Angular Child Routing**

A newly created Angular application has just one router-outlet.

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

Found in this file:
```
app.component.html
```
We know from the documentation that this is a placeholder for Angular to know where to render injected content. But what is injected content?  One type of injected content is found in HTML using a routerLink directive. Notice that a path is being spelled out named bar-chart.

```html
  <a class="nav-link" routerLink="/bar-chart">Bar Chart</a>
```
When this link is clicked the content of /bar-chart is rendered in the router-outlet placeholder. This is also true for our custom components. Such as:

```html
    <app-bar-chart></app-bar-chart>
```
So far, so good for root level injection of any component. But what if we want to inject content into other paths not in the root? For example a component named test has two other components it wants to display from it's page.

```html
  <app-root>
   <app-test>
     <app-test1></app-test1>
     <app-test2></app-test2>
   </app-test>
   </app-root>
```
We don't want app-root or app-test to refresh when we are on app-test, and click a routerlink to test1 or test2. We can do this by configuring a router-outlet in app-test, and setting up children routes in our app-router.ts file.

Step 1) Place a router-outlet tag in app-test.html file.
Step 2) Go to app.router.ts and add a router to app-test like this
```
   path:'test', compoent:testcomponent
```
This route handles this case:
```
localhost:4200/test
```
Step 3) Add Children Routes to the 'test' route.
```
   path:'test', component:testcomponent,
   children:[
     {
       path:'test1', component:test1component
     },
     {
       path:'test2', component:test2component
     }
   ]
```
Because the testcomponent has a router-outlet, when ever these urls are seen:
```
localhost:4200/test/test1
localhost:4200/test/test2

```
The content of test1 and test2 are rendered within the testcomponent's router-outlet, this means that the app-root and the app-test components are not re-rendered!

Take Away:
Routes that are configured with Children are referring to the URL style. A child route is based on the parent route that contains it. This simply means that as shown above when the route itself has a test1, or test2 (for this example) those child routes are rended in the parent testComponent route and not the appRootComponent. 

JWP2020
100daysofcode Flutter
Tags: 100daysofcode, flutter
Published: 2020-03-28 15:31:52

day 18-19/100 of #100daysofcode #Flutter
Learning Flutter , courses Udemy from
@maxedapps

Learning about Tab,tabScreen, bottombar, and some property bottombar, excercise Mapping
https://github.com/triyono777/100-days-of-code/blob/master/log.md