teleren/devto huggingface dataset:
AMP ⚡ using Gatsby
Tags: react, gatsby, amp
Published: 2019-02-20 23:56:25

---
title: AMP ⚡ using Gatsby
published: true
tags: react,gatsbyjs,amp
canonical_url: https://blog.tomoyukikashiro.me/post/amp-using-gatsby
---

**This post was originally published at [AMP ⚡ using Gatsby](https://blog.tomoyukikashiro.me/post/amp-using-gatsby).**

I created gatsby plugin (called [gatsby-plugin-html2amp](https://github.com/tomoyukikashiro/gatsby-plugin-html2amp)) for generating AMP (Accelerated Mobile Pages). I try to explain how to use it.

It’s easy to use 😁

## Prepare Gatsby blog

```
$ npm install --global gatsby-cli
$ gatsby new gatsby-blog https://github.com/gatsbyjs/gatsby-starter-blog
```

then check the blog

```
$ cd gatsby-blog
$ npm start

# Access http://localhost:8000
```

## Make it AMP !

### Add plugin

```
$ npm install --save gatsby-plugin-html2amp
```

Set plugin configuration to `gatsby-config.js` at bottom of file.

```
{
  resolve: 'gatsby-plugin-html2amp',
  options: {
    files: ['**/*.html'],
    dist: 'public/amp'
  }
}
```

### Modify blog post template

To make your post page valid as AMP add `canonical` in `<head>`

**_src/templates/blog-post.js_**

```
export const pageQuery = graphql`
  query BlogPostBySlug($slug: String!) {
    site {
      siteMetadata {
        title
        author
      }
    }
    markdownRemark(fields: { slug: { eq: $slug } }) {
      id
      excerpt
      html
      fields { // ⚡ Add this fields.slug into Graphql
        slug
      }
      frontmatter {
        title
        date(formatString: "MMMM DD, YYYY")
      }
    }
  }
`
```

then add canonical

**_src/templates/blog-post.js_**

```
<Helmet
  htmlAttributes={{ lang: 'en' }}
  meta={[{ name: 'description', content: siteDescription }]}
  title={`${post.frontmatter.title} | ${siteTitle}`}>
  <link rel="canonical" href={`${post.fields.slug}`} /> // ⚡ Add canonical
</Helmet>
```

### Generate

```
$ npm run build
```

Now you can see AMP source at `public/amp` ⚡
Trucos Aws Lambda (parte 2)
Tags: python, awslambda
Published: 2018-11-19 15:20:26

---
title: Trucos Aws Lambda (parte 2)
published: true
tags: python, aws-lambda
canonical_url: https://yorodm.github.io/blog/trucos-aws-lambda-ii/
series: lambda tricks
---

# Trucos con AWS Lambda (II).

## Truco 1. Utiliza las tags.

Los tags en AWS nos permiten:

1. Tener asociados un máximo de 50 a cada recurso.
2. Llaves de hasta 128 caracteres Unicode.
3. Valores de hasta 256 caracteres Unicode.
4. Distinción entre mayúsculas y minúsculas para llaves y valores.

Basicamente todo lo que necesitamos para hacernos un caché:

```python
lambda_cient = boto3.client('lambda')
def save_cache(tags): # tags is a dict of string:string
    lambda_client.tag_resource(
        Resource=self_arn, # get it from handler context
        Tags=json.dumps(tags)
    )

def get_cache():
    return lambda_client.list_tags(
        Resource=self_arn # get it from handler context
    )

def invalidate_cache(keys):
    return lambda_client.untag_resource(
        Resource=self_arn,
        Tags=json.dumps(keys)
    )
```

## Truco 2. Desarrolla tus Lambdas en otros lenguajes.

Los lenguajes soportados oficialmente por AWS Lambda son (en el momento en que escribo este artículo):

1. Javascript (Node.js).
2. Python (2 y 3).
3. Java.
4. C#.
5. Go.

¿No está el lenguaje de tu preferencia? Pues no te preocupes, esa lista se puede extender a:

1. Kotlin, Groovy, Ruby Clojure y todo lo que soporte la JVM.
2. Cualquier lenguaje soportado por la plataforma .NET, incluido [PHP](https://www.peachpie.io).
3. Rust sobre [lando](https://github.com/softprops/lando) o [crowbar](https://github.com/ilianaw/rust-crowbar) incluso con integración con [serverless](https://github.com/softprops/serverless-rust).
4. [Cualquier cosa que genere WASM](https://blog.scottlogic.com/2018/10/18/serverless-rust.html)

## Más trucos

¿Tienes algún otro que compartir? Deja tu comentario aquí o en [DEV](https://dev.to/yorodm).
Understanding Difference Between For, For…In and ForEach Loop In Javascript
Tags: javascript, es6, react
Published: 2018-11-18 11:35:37

---
title: Understanding Difference Between For, For…In and ForEach Loop In Javascript
published: true
description: Understanding Difference Between For, For…In and ForEach Loop In Javascript
tags: #javascript #js #es6 #react
---

Post Link : <a href="https://www.skptricks.com/2018/11/understanding-difference-between-for-foreach-forin-loop-in-javascript.html" > Understanding Difference Between For, For…In and ForEach Loop In Javascript</a>

This tutorial explains basic implementation of  For,  For…In and ForEach loop in Javascript and it's working in real time scenarios. Loops in JavaScript are used to execute the same block of code a specified number of times or while a specified condition is true. Lets see the below example that helps you to build more understanding on  For,  For…In and ForEach loops. 


Understanding Difference Between For,  For…In and ForEach Loop In Javascript

For Loop
The for loop is used when you know in advance how many times the script should run. lets see the below example for  For loop syntax, it will iterate for nth times.( depending upon looping times specify the nth value.)

Syntax :
for (i = 0; i < n; i++) { 
  // do something
}

Example 
const array = ['skptricks', 'php', 'java'];
for (i = 0; i < array.length; i++) { 
  console.log(array[i])
}

Output:
--------------
> "skptricks"
> "php"
> "java"


<a href="https://www.skptricks.com/2018/11/understanding-difference-between-for-foreach-forin-loop-in-javascript.html" > Understanding Difference Between For, For…In and ForEach Loop In Javascript</a>

<img src="https://1.bp.blogspot.com/-osyHzGqxeNs/W_FLfeEK3ZI/AAAAAAAACJo/j406A-ytFYgumOnLO13Y8nZG0Wu9EEFewCLcBGAs/s400/for.png" />

<a href="https://www.skptricks.com/2018/11/understanding-difference-between-for-foreach-forin-loop-in-javascript.html" > Read More...</a>
VS Code hides git folder
Tags: vscode
Published: 2018-11-18 17:02:21

---
title: VS Code hides git folder
published: true
description: 
tags: vscode
---

So this is something I noticed today. I have been using VSCode for quite some time now and I had saw that unlike Atom and Sublime, VS Code doesn't show the .git folder.

Now that might not be of much use but here is the solution anyways.


<img src="https://thepracticaldev.s3.amazonaws.com/i/238lu1qffvmv3ulqsiyl.png">

1. Go to settings
2. Type <b>files.exclude</b>
3. Remove .git from there. That will be the first option. Delete it.


And you should have it now.
Open todo list standard?
Tags: discuss, opensource
Published: 2018-11-18 16:55:55

Ah, the todo list. This seemingly simple app seems impossible to get right.

With that in mind, has there ever been discussion around a todo list standard? Like, everyone manages their own todo list clients, but items can be shared/synced, etc. via a shared standard?

I'm not entering this conversation with a lot of intentionality, but I have been tasked at figuring out, once and for all, how we are going to approach todo lists amongst the DEV team, so I've been thinking about todo lists from many different angles.
Building SDKs for your SAAS
Tags: dev, programming, saas, productivity
Published: 2018-11-13 02:25:42

---
title: Building SDKs for your SAAS
published: true
description: Journey to easily build sdks for your next product or API
tags: dev,programming,saas,productivity
---

# Building SDKs for your SAAS

I recently build a service, [docxmerge](https://docxmerge.com), which does a merge from a Microsoft Word and JSON document and converts it to PDF.

The API is very simple, but in order to make easy for developers to integrate it in their applications, I chose to create a library for at least four languages, NodeJS, Dotnet, Java, and Python.

Yeah, it looks like we got a bit of work. This task can be either too easy or too embarrassing. But I had a benefit, which was to use Swagger for the API definition, so basically, I could generate all the boilerplate code and just do a class in every language and publish it to the corresponding registry.

With Swagger, all is based on the JSON generated in the backend in this case the next one:

https://api.docxmerge.com/api/swagger/v1/swagger.json

Having that JSON, the swagger codegen is able to generate the code to interact with your api in a typed way and with no effort at all. I generate that code with docker which is much cleaner:

```bash
docker run --rm --network=host -v ${PWD}/src/swagger:/local swaggerapi/swagger-codegen-cli:v2.3.1 generate -i ${SWAGGER_URL} -l typescript-node -o /local --additional-properties supportsES6=true
```

As a said, Swagger was the biggest advantage, as it was effort free and I didn't have to worry about paths, query strings, multipart requests, etc. And lucky me, I was able to generate it from C# annotations using this [Swashbucle library](https://github.com/domaindrivendev/Swashbuckle.AspNetCore) , so didn't have to write that mega JSON ;)

I will do one post per language explaining how I built each library from the swagger-codegen to the publish.

This is the repository where I'm working: 
https://github.com/Docxmerge/docxmerge-sdk

It's still in progress, and I'm still missing the Java one to be deployed because of the verification, but it works.
Introduction To map(), reduce(), and filter() function in javascript
Tags: javascript, es6, web
Published: 2018-11-18 16:44:07

---
title: Introduction To map(), reduce(), and filter() function in javascript
published: true
description: Introduction To map(), reduce(), and filter() function in javascript
tags: #javascript #es6 #js #web
---

Post Link : <a href="https://www.skptricks.com/2018/11/introduction-to-map-reduce-and-filter-in-javascript.html" >Introduction To map(), reduce(), and filter() function in javascript </a>

This tutorial explains how to use map(), reduce(), and filter() function in javascript programming language. Nowadays these function are widely used during react and react native application development.

These are 3 really powerful array functions:
map returns an array with the same length,
filter as the name implies, it returns an array with less items than the original array
reduce returns a single value (or object)
NOTE : map, filter and reduce were introduced in ES5, so you can safely use them as implemented in every browser.


<a href="https://www.skptricks.com/2018/11/introduction-to-map-reduce-and-filter-in-javascript.html" >Introduction To map(), reduce(), and filter() function in javascript </a>

<img src="https://1.bp.blogspot.com/-h_KinjbmKN0/W_GUAzvxG-I/AAAAAAAACJ0/0BCnliF3gZ88dutpYAb9-Vplzry1qfZjwCLcBGAs/s640/map.png" />

<a href="https://www.skptricks.com/2018/11/introduction-to-map-reduce-and-filter-in-javascript.html" > Read More... </a>
BxJS Weekly Episode 37 - javascript news podcast
Tags: javascript, node, podcast, news
Published: 2018-11-18 16:08:11

---
title: BxJS Weekly Episode 37 - javascript news podcast
published: true
description: Listen to the best javascript news of the week in a podcast form
tags: javascript, node, podcast, news
---

Hey dev.to community!

BxJS Weekly Episode 37 is now out! 🚀
Listen to the best javascript news of the week in a podcast form right here.
You can find all the mentioned links [here on github](https://github.com/BuildingXwithJS/bxjs-weekly/blob/master/links/18-46-Episode-37.md).

You can also watch or listen to this episode on:
- [YouTube](https://youtu.be/IqJKDIXij0s)
- [Castbox](https://castbox.fm/episode/BxJS-Weekly-Ep.-37-Nov-17%2C-2018-(javascript-news-podcast)-id1378315-id101179952?country=us)

Any feedback is appreciated 😁

Additional stuff:
- [Twitch channel](https://www.twitch.tv/yamalight)
- [Discord server](https://discord.gg/hnKCXqQ)
- [BxJS Weekly github repo](https://github.com/BuildingXwithJS/bxjs-weekly)

Social media links:
- [Twitter](http://twitter.com/yamalight)
- [Medium](https://medium.com/@yamalight)
- [Github](http://github.com/yamalight)

If you enjoy my content, please consider [supporting me](https://codezen.net/support.html) 😉
BUIDL Free DApps on Ethereum with Ethless
Tags: ethereum, blockchain
Published: 2018-11-18 15:02:58

---
title: BUIDL Free DApps on Ethereum with Ethless
published: true
description: BUIDL Free DApps on Ethereum like EOS with Ethless
tags: ethereum, blockchain
---

Free DApps on Ethereum
Let's free up the GAS of DApps on Ethereum like DApps on EOS.

1. Users do not need to have ETH: Users who use DApps developed by you do not need to have ETH.

2. Do not compromise on dispersibility: You can shift only the payment source to the service provider while maintaining dispersibility.

3. Just add several lines of code: Developers just add a few lines of javascript code. Deployed Smart Contract can be used as it is.


For more details, check out this URL bellow:
https://ethless.v4x.co/index.en.html
What is the cool thing that you like about your job ?
Tags: discuss
Published: 2018-11-18 12:49:00

---
title: What is the cool thing that you like about your job ?
published: true
description:  What is the cool thing that you like about your job ?
tags: discuss
---

Hey fellow devs, I work in a media analytics startup. I work primarily in java and apache spark, sometimes a little of python. I love solving problems, it's like problems are asking me to solve them :P 

Okay answering my own question, being a big data analytics company we are sometimes tasked with processing huge amounts of data in a short period of time. Enter apache spark, a cluster computing framework which allows you to run your code parallely in thousands of cores. I was once running a piece of code powered by 3600 cores. I just loved the feeling of raw power and that fact that my code didn't break at that scale :P 

So what's yours ?
Favourite albums to listen to while coding
Tags: music, productivity
Published: 2018-11-18 10:43:25

---
title: Favourite albums to listen to while coding
published: true
description: Like many developers I put my headphones on when coding. It helps me get in the zone and get into that flow state. Here's a list of my favourite albums to listen to while coding.
tags: music,productivity,
---

Like many developers I often put my headphones on when coding. It helps me get in the zone, block out other distractions and get into that flow state.

Not all types of music helps me though. I find what works for me best is listening to instrumental albums, particularly progressive rock/metal. The tracks feel structured and often flow nicely. 

And the flow is not just on a track-by-track basis. The whole album just flows and, as a result, so do my thoughts. So I don't play these on shuffle (who plays albums on shuffle?). I also occasionally play them at the gym too!

Below is a list of my favourite instrumental albums to listen to while coding. And here's a [Spotify playlist](https://open.spotify.com/user/1284397941/playlist/4olgCu22Fb0Xje2JFerKdN?si=Os189sT0RP2ltMExF4-CIA) containing them all.


### 1. [(II)](https://open.spotify.com/album/54LcH6rOpnX8afrvtGvL1h?si=_PrVbxhZSs6Gyvg30KeUxw) by [Toundra](https://open.spotify.com/artist/3cgIU3hh7Y4pUsPgHB8aYT?si=LY0FwRKnTUWkqbhXuzEjbg)


### 2. [Mozaic](https://open.spotify.com/album/3cWgv0dLq4Odj2iYnnhcqU?si=3bEvzkO2TR-2LvFU26DIEQ) by [Sunset in the 12th House](https://open.spotify.com/artist/09VgjC02elNRzXBG9Kc4R2?si=CHIXwt-VQCmpQEajLkFSrg)


### 3. [Back to Earth](https://open.spotify.com/album/6tbMoRTY3brzgQfwSzkTGH?si=tXMRrPGkSrO6ns4jab1YMA) by [Exxasens](https://open.spotify.com/artist/7935eVYpj7jQM3mRJ3kGeX?si=M-tpkoQ4QQaFUHtsRr6gEQ)


### 4. [Boundless](https://open.spotify.com/album/6w7q5ueU8FNwqSYDgxaqqg?si=7PYC51aTQdG7yLPdB0Q8Hw) by [Long Distance Calling](https://open.spotify.com/artist/3SiCxhceGZgzusCLHd4Zz6?si=e0GShmi9Q_OBZS4HXyrkjg)


### 5. [(III)](https://open.spotify.com/album/6Ued283OOMYn1KTaheTflx?si=kUiTTN6CRuGxLNU6hABkWA) by [Toundra](https://open.spotify.com/artist/3cgIU3hh7Y4pUsPgHB8aYT?si=LY0FwRKnTUWkqbhXuzEjbg)


### 6. [O](https://open.spotify.com/album/3OLFb9cgHkWklwjXqB6AbH?si=0pVYIkbfTf6Tj_fjHPyfeg) by [The Gentle Art of Cooking People](https://open.spotify.com/artist/4vjUp8pCIGfJVuBOKddn3B?si=SRntv7scTUqjxP5SVtBAcw)
Develop and build ASP.NET Core applications to run on Kubernetes with Draft
Tags: aks, acr, draft, aspnetcore
Published: 2019-06-04 19:43:37

---
title: Develop and build ASP.NET Core applications to run on Kubernetes with Draft
published: true
tags: aks,acr,draft,aspnetcore
canonical_url: https://carlos.mendible.com/2018/11/18/develop-and-build-aspnetcore-applications-to-run-on-kubernetes-with-draft/
---

You start developing an ASP.NET Core application to run it in Kubernetes and suddenly you find yourself creating a docker file, building an image, pushing the image to a registry, creating both a deployment and a service definition for Kubernetes and you wonder if there is a tool out there to help you streamline the whole process.

Meet [Draft](https://github.com/Azure/draft) a tool that will not only help you create the artifacts needed to build and run applications in Kubernetes but to also build the container image and deploy it.

## Prerequisites:

1. A Kubernetes cluster and the [kubectl](https://kubernetes.io/docs/reference/kubectl/kubectl/) CLI tool
2. Installation of [Helm](https://github.com/Kubernetes/helm) on your Kubernetes cluster
3. A Container Registry

## Install and Configure Draft

To install Draft I run the following command:

```
cinst -y draft
```

Then configure it:

```
draft config set registry <registry full name>
```

Be sure to log on to the Container Registry:

```
docker login <registry full name>
```

or if working with Azure Container Registry:

```
az acr login --name <acrName>
```

## Create and prepare the application

Creat an ASP.NET Core MVC application and create the artifacts with Draft:

```
dotnet new mvc
draft create --pack=csharp -a mvcdraft
```

Note that I’ve specified two parameters:

- **pack** to tell draft that we are using C# as the language.
- **a** to specify the name of the Helm release we will run on Kubernetes

## Deploy and test your application

Run the following command to build the container image and then deploy the application to Kubernetes:

```
draft up
```

The first time you run the command it will take a while. The output should look similar to this:

```
Draft Up Started: 'netcoredraft': 01CWKAZ79WR6W66PHHR2AFRSGC
netcoredraft: Building Docker Image: SUCCESS ⚓ (1.0008s)
netcoredraft: Pushing Docker Image: SUCCESS ⚓ (3.2891s)
netcoredraft: Releasing Application: SUCCESS ⚓ (2.7629s)
Inspect the logs with `draft logs 01CWKAZ79WR6W66PHHR2AFRSGC`
```

To test the application run:

```
draft connect
```

The output should look similar to:

```
Connect to netcoredraft:80 on localhost:50998
[netcoredraft]: No XML encryptor configured. Key {ea9dac08-e7af-468c-9e00-cbe38ab40fa8} may be persisted to storage in unencrypted form.
[netcoredraft]: Hosting environment: Production
[netcoredraft]: Content root path: /app
[netcoredraft]: Now listening on: http://[::]:80
[netcoredraft]: Application started. Press Ctrl+C to shut down.
```

Browse to the url shown in the output (i.e. http://localhost:50998) and you should be good to go!!!

## Cleaning up

Once you finish your tests you can cleanup with the following command:

```
draft delete
```

Hope it helps!!!
What's your setup for JavaScript Testing and Code Coverage
Tags: javascript, unittest, testing, discuss
Published: 2018-11-18 07:42:18

---
title: What's your setup for JavaScript Testing and Code Coverage
published: true
description: JavaScript Testing and Code Coverage
tags: JavaScript, UnitTest, Testing,discuss
---

I'm curious to know what are the tools/frameworks you guys use in your development environment for testing and code coverage for your JavaScript applications(React, Angular, Vue, or just vanilla/native JavaScript)?

I know there a are a lot of tools available, but I would really like to know what my fellow developers/software engineers are using.

Thanks! :)
Show parameter name in usage message of flag  
Tags: go
Published: 2018-11-18 07:37:34

---
title: Show parameter name in usage message of flag  
published: true
description: 
tags: golang
---


Flag package provides features about command-line flag parsing. It includes a usage message of course. For example, it shows them as following.

```go 
package main

import (
	"flag"
	"os"
)

func main() {
	var importFile string
	var config bool
	var number int

	flags := flag.NewFlagSet("mycmd", flag.ExitOnError)
	flags.StringVar(&importFile, "import", "", "import file.")
	flags.BoolVar(&config, "c", false, "edit config.")
	flags.IntVar(&number, "n", 0, "number of executions.")

	flags.Parse(os.Args[1:])
} 
``` 

```  
$ ./mycmd --help
Usage of mycmd:
  -c	edit config.
  -import string
    	import file.
  -n int
    	number of executions.
```
 
This build automatically. The parameter name uses the flag's type. But sometimes want to customize parameter name. 
For example, in the example above, I would like to use `file` as an argument to `-import` and `number` as an argument to `-n`(Because that is surely more natural ;)).  

This can specify from `usage` argument `xxVar` methods. If includes a back-quoted name in `usage`, it uses for the parameter name.  

```go 
package main

import (
	"flag"
	"os"
)

func main() {
	var importFile string
	var config bool
	var number int

	flags := flag.NewFlagSet("mycmd", flag.ExitOnError)
	flags.StringVar(&importFile, "import", "", "Import `file`.")
	flags.BoolVar(&config, "c", false, "Edit config.")
	flags.IntVar(&number, "n", 0, "`Number` of executions.")

	flags.Parse(os.Args[1:])
} 
```

```
$ ./mycmd --help 
Usage of mycmd:
  -c	edit config.
  -import file
    	import file.
  -n number
    	number of executions.
``` 

I didn't know long about this. This describes in the doc of [`PrintDefaults` func](https://golang.org/pkg/flag/#PrintDefaults).  

 I hope this helps someone.
Throwing in the towel.
Tags: discuss
Published: 2018-11-18 05:26:05

---
title: Throwing in the towel.
published: true
description: writing daily is tough.
tags: discuss
---

Today really feels like the last day I do this challenge. I could not think of anything to write all day, I have lots of topics I want to write about. Just not in a rushed article a day fashion. I feel like I have learned a lot with this challenge so far and I’m not sure how much more there is to learn from it. However I want to sleep on the idea of dropping it. So I’m writing this, counting it and deciding if I’ll post again tomorrow.