teleren/devto huggingface dataset:
How we are maintaining ProtoBuf (Protocol Buffers) at Nuclei
Published: 2020-03-02 00:00:00

---
slug: 'maintain-protobuf-nuclei'
title: 'How we are maintaining ProtoBuf (Protocol Buffers) at Nuclei'
date: '2020-03-02'
author: 'Piyush Mehta'
published: true
description: 'How we are maintaining ProtoBuf (Protocol Buffers) at Nuclei!'
categories:
  - 'grpc, protobuf'
---

We at Nuclei, welcome the latest technologies in our stack. We have our Micro Services in Java and Go Lang. I as a Full Stack Developer got an opportunity to completely build this system for us.
> # GitHub Actions + GitHub Package Registry + gRPC

## **Problems which our solution solved!**

1. Getting Go and Java artifacts at a swoosh
2. Cost effective practice
3. Robust Architecture
4. Managing protocol buffer definitions at ease
5. Generating the appropriate language files from the definitions
6. Following Semantic Versioning along with Pre-Releases.

## Challenges we faced.

Managing proto files is a cumbersome task for both the user and the creator of the proto.
Distributing it in a cost effective yet efficient method was another big task.
Using JFrog Artifactory with Jenkins needed separate server to host.

## How We Manage Protocol Buffer Files.

We have a monorepo known as Protorepo where we keep our latest protocol buffer files.

![](https://cdn-images-1.medium.com/max/4496/1*gj7PHDuRNdy84xw7Wy2ZhQ.png)

## How do we build the Java and Go Lang code?

We are using GitHub Actions + GitHub Package Registry.
When one creates a new release. Let’s say version V1.0.0. It triggers our GitHub Action which generates GitHub Packages (Artifacts for Java) available for the other projects and it even pushes new releases with same versions for Go Lang according to the project name.

## How do we pull dependencies?

For java →
```json
    plugins {
        id("maven-publish")
    }

    publishing {
        repositories {
            maven {
                name = "GitHubPackages"
                url = uri("https://maven.pkg.github.com/USERNAME/URL")
                credentials {
                    username = project.findProperty("gpr.user") ?: System.getenv("USERNAME")
                    password = project.findProperty("gpr.key") ?: System.getenv("PASSWORD")
                }
            }
        }
        publications {
            gpr(MavenPublication) {
                from(components.java)
            }
        }
    }
```
For Go →
```
    go get <URL of the release>
```

## How helpful it is?

1. We are able to generate 30+ artifacts for Go as well as Java in less than 3 minutes.

1. Building code and shipping it was never so quick and easy for us.

1. All our Development Operations become even more easier.

1. GitHub gives us storage and CI & CD minutes in our team plan, so why not use it.

1. Data is safe and secured.

## Future Scope

Implementing Chat-Ops with HuBot.
Detect man in the Middle
Tags: security, mitmattack, linux, nmap
Published: 2020-03-01 23:13:41

---
title: Detect man in the Middle
published: true
description: Security
tags: Security, MITM Attack, Linux, Nmap
---

`
nmap -sn --script=sniffer-detect 192.168.0.102
`

"sn"  This command is for "ping" scan, but it will not necessarily do an ICMP request.
 
"--script" This will tell Nmap to run a script. In this case, it was "sniffer-detect."
 
"sniffer-detect" This was the script name that we used for detecting the sniffer.
 
"192.168.0.108" This is the target network that may be compromised. In this case, this may not always work, so you can also scan the whole network by adding /24 after the gateway address. For example, in this case, it would be 192.168.0.1/24.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/n62hnp43lnlg8ikdbl5a.png)
Code Knowledge
Tags: comments, constructivecriticism, kudos
Published: 2020-03-01 23:05:34

Please explain in your own words what is the importance of responsive web design for you?

Responsive web design is important in web development because it is the new format the internet world has adopted. A website, or a business for this matter, will not be successful without keeping in touch with mobile users. There are more mobile users now than desktop users. Responsive web design is a format that scales web content to match the screen it is being viewed on. This means the content is viewed successfully no matter the device being used. This method keeps the website in connection with mobile users. It also makes the content easier to work on.
Job Search Week 2
Tags: makers
Published: 2020-03-01 22:56:24

My second week of the job search was fortunate because there was an external careers fair going on in London which meant I was able to apply to a lot of different companies. I also manage to get an external CV done.

Day 1

I started this week by applying to two of the companies at the careers fair, Anthony Nolan and Clear Bank. We were also told about a careers event on Thursday so I had to work on a CV that we could use for companies outside of Makers. This was surprisingly time-consuming because it has to be a lot more serious. I also found it quite difficult because I had to tailor it to a job in tech specifically, which I had never done before but I did get done so I was happy.

Day 2

I spent Tuesday with two other people from our cohort planning out an app as a side project. It's a date planning app that takes your favourite cuisine, activities and your location. It then plans a date based on these inputs, it'll search for a restaurant that matches your favourite cuisine which is within a chosen radius of your location, then it'll search for an activity from your favourite activities in the same way. Hopefully well get it started next week.

Day 3

Wednesday was spent trying to get my CV down to one page because it's best to only use one-page for a CV so that there is no rabbling. It was difficult to decide what was the most important because and get it down to only one-page but after getting it done it was satisfying. 

Day 4

So I spent the morning researching the companies that would be at the event so that I could be informed and ask some good questions. The one that interested me the most was Labworks.io they create party games using Alexa, but unfortunately, they weren't hiring for entry-level jobs but they told me they would be in about 4 months so I handed in my CV.

Day 5

I mentioned that on Tuesday we made out a plan to make an app, we also decided on a MERN stack. So I started learning React on Friday because I've already used Mongo, Express and Node. So for I'm enjoying using React although it is weird writing HTML and CSS in a script tag, I'm sure I'll get used to it.

Summary

I was happy with what I got done this week I have an external CV, a project to start working on and I got to apply to a lot of jobs. I also got to talk to a lot of people in software development and see what technologies a lot of companies use.
Top ten tips for studying for Security+ exam in 2020
Tags: security, 2020, studying, productivity
Published: 2020-03-01 22:38:34

This is my first Dev.to post! 

I'm studying for the Security+ exam. 

Here are my top ten recommendations for anyone studying:

1. Study with a group. Life events have a way of always happening, and a group is a good way to stay on track, be encouraged, and have people around you with the same goals.
2. Food matters. Take care with what you eat, especially while studying. Things to keep in mind with food really range from blood sugar crashes to messy food getting on a laptop. 
3. Sleep matters too! You can't add much to a tired brain. [Sleep helps you learn.](https://www.health.harvard.edu/blog/sleep-helps-learning-memory-201202154265)
4. Write as you go- this is a good way to remember what you're reading or seeing on video. 
5. Especially write down new terms!!!
6. Track your progress. There will always be more to learn, it's good to be able to see how much you've done so far
7. Take breaks- brains learn better when you take breaks and review the material again. I liked [this post](https://www.fastweb.com/student-life/articles/energizing-study-break-ideas-what-to-avoid) for ideas on what types of breaks are especially useful
8. Learn in different formats. Read, watch videos, explain a term to someone else, draw a concept, the important thing is to keep using your brain as you go
9. Ask for help (and say thank you when you get it!) There are lots of helpful people around who will share their knowledge. Asking for help gives them a chance to help you- which is voluntary, so make sure to say thank you. 
10. Say thank you to yourself. There is so much to learn, and there will always be more to learn- that's a guarantee! Don't beat yourself up if you're not as far along as you want to be. Say thank you to yourself for taking the time to study.
Should I Use Gatsby.js
Tags: gatsby, react, javascript
Published: 2020-03-01 22:29:46

## Why are we talking about this?

Within the past few years, a concept known as JAMstack has taken over the web development community by storm. So what is it exactly?

## What is a JAMstack?

JAMstack stands for Javascript, API, and Markdown. Basically it is a web development design/architecture standard for building web applications using these three things. When using this structural pattern, your server is headless.  This can be accomplished by using a CMS (Content Management System) as your backend to store all of your data which is usually written in Markdown. A couple popular CMS’s you may have heard of are Wordpress and Drupal. This data is then accessed using API requests from your front-end code written in Javascript. 

There is more going on here, and if you would like to learn more about JAMstack, checkout this [page](https://jamstack.org "JAMstack.org").

## What is Gatsby?

Gatsby.js is an open source static site generating framework built on top of React. They pride themselves in building "blazing fast websites and apps"(taken straight from there homepage). In fact, this blog you are reading now is built with Gatsby!

The way Gatsby works is simple. You have your data source (usually in markdown files or a CMS but it can be anything), then you query your data using Graphql and display it in your application written in React. You then deploy your site to a static web host and voilà. It's as simple as that! 

## So where does Gatsby fit in?

Gatsby fits in to this whole JAMstack ecosystem by allowing you to build and deploy a simple, yet fast headless application right out of the box. They offer a wide variety of features with a rich plugin system. Gatsby gives you the ability to focus all of your efforts on writing code, as opposed to dealing with configurations and getting everything connected. Whether you are creating a blog, portfolio, or ecommerce store, utilizing the power of Gatsby with a headless architecture will have your site up and running in no time.

If you have any experience using React, then Gatsby will feel very familiar. If not, well luckily for you they have great documentation. Give it a try and let me know how you like it or if you have any questions. Also feel free to checkout my [Gatsby Starter](https://www.gatsbyjs.org/starters/TRamos5/gatsby-contentful-starter/ "Gatsby Starter") I created and published on there site! This will get you up and running with a personal blog very quickly!
How To Use Netlify Forms With Gatsby
Tags: gatsby, react, javascript, netlify
Published: 2020-03-01 22:27:24

This article assumes you have some basic knowledge of [Gatsby](https://www.gatsbyjs.org "Gatsby Homepage") and [Netlify](https://www.netlify.com "Netlify Homepage").

## How do you do it?

Using Netlify's built-in form handling with Gatsby should be simple and intuitive, but sadly it's not that simple.
Well it is, it just requires some extra configuration not detailed in the documentation. So let’s get started!

Normally adding either a _Netlify_ attribute or _data-netlify="true"_ to your form tag is all you'd have to do and Netlify will do the rest for you. If your creating your application with Gatsby, this isn't the case. In order for Netlify to actually see the form, you need to create a reference to the component where your form code will be when your component is rendered. This is as simple as referencing your component in the constructor like this. 

```js
constructor(props) {
    super(props)
    this.ContactForm = React.createRef()
    this.state = {
      name: "",
      email: "",
      message: "",
    }
  }
```

The reason for this is because Gatsby is not rendered during runtime, it instead generates HTML content during build time.
At this point, the information your users will add to the form will be in the form of an object. In order to pass this object along in your POST request, you will need to transform this object into a query string parameter. Add the snippet below  under your constructor to be used later in your submit function. 

```js
encode = data => {
    return Object.keys(data)
      .map(key => encodeURIComponent(key) + "=" + encodeURIComponent(data[key]))
      .join("&")
  }
```

This will not only transform your object, but it will also encode your key/value pairs you pass into it.

### Almost there, just a few more steps!

The next part is actually creating your function to handle your form submission. First create a variable to hold your form reference from a few steps above. Then pass in this variable you created inside the body of your HTTP-request like so.

```js
handleSubmit = event => {
    event.preventDefault()
    const form = this.ContactForm.current
    fetch("/", {
      method: "POST",
      headers: { "Content-Type": "application/x-www-form-urlencoded" },
      body: this.encode({
        "form-name": form.getAttribute("name"),
        ...this.state,
      }),
    })
      .then(() => navigate("/"))
      .catch(error => alert(error))

    this.setState({
      name: "",
      email: "",
      message: "",
    })
  }
```

The final part is writing the code for your form and including either a _Netlify_ attribute or _data-netlify="true"_ in your form tag as discussed above. 
Don't forget to include a name attribute in the form tag as well so your HTTP-request can find the form you just created.
And thats it!
You will find all of the submissions to these forms in the Forms tab of your site dashboard in Netlify. 

I hope this article was helpful, and if you enjoyed it, checkout some of the other [articles](https://travision.dev/blogposts/ "Blog Posts") I have written!
How to add Tailwind to your Vue app
Tags: vue, tailwindcss
Published: 2020-02-19 14:35:23

*Updated for Tailwind v1.7.4+*

Adding Tailwind to your Vue app is easy. No need to use an intermediate Vue library for it, especially since PurgeCSS is now baked in Tailwind!

## Instructions

- Install Tailwind: `npm install tailwindcss`
- Create a CSS file (e.g. `assets/css/tailwind.css`) with the content below and import it in `main.js` (e.g. `import '@/assets/css/tailwind.css'`).

```css
@tailwind base;
@tailwind components;
@tailwind utilities;
```

*Note: don't write these lines directly in App.vue, as this would increase the recompile time during development.*

- Generate the Tailwind & PostCSS config files: `npx tailwindcss init -p`

*Note: if you already have an existing `postcss.config.js`, add the [following content](https://tailwindcss.com/docs/installation#process-your-css-with-tailwind).*

- Configure PurgeCSS in `tailwind.config.js`:

```js
module.exports = {
  theme: {},
  variants: {},
  plugins: [],
  purge: [
      './public/**/*.html',
      './src/**/*.vue'
    ]
  }
}
```
*Note: PurgeCSS is enabled automatically in production.* 

### Whitelisting CSS

In `tailwind.config.js` , you can [whitelist selectors](https://purgecss.com/whitelisting.html#specific-selectors) to stop PurgeCSS from removing dynamically added classes from your CSS. For example, here is how to whitelist classes autogenerated by Vue:

```js
purge: {
    content: ['./public/**/*.html', './src/**/*.vue'],
    options: {
      whitelistPatterns: [ 
	/-(leave|enter|appear)(|-(to|from|active))$/, 
	/^(?!(|.*?:)cursor-move).+-move$/,
        /^router-link(|-exact)-active$/
      ],
    },
 }
```
Python Commandline Argument Parsing
Tags: python, argparse, programming
Published: 2020-06-23 10:56:45

---
title: Python Commandline Argument Parsing
published: true
date: 2020-03-01 21:43:37 UTC
tags: python, argparse, programming
canonical_url: https://ncot.uk/compsci/python-commandline-argument-parsing/
series: python
---

A quick set of notes on how to parse command line arguments properly in Python. This uses the argparse module, totally removing any effort on your part when it comes to processing command line switches.

This is for Python 3.

Here is a basic Python program that demonstrates the idea

```
#!/usr/bin/env python3

import argparse

helpDesc = "Compiles code into bytecode. V0.2"
argParser = argparse.ArgumentParser(description = helpDesc )

argParser.add_argument("inputfile", help="Specify input file(s).")
argParser.add_argument("--verbose", "-v", help="Enable verbose output.", action="store_true" )
argParser.add_argument("--output", "-o", help="Output filename.", default="OUT")
args = argParser.parse_args()

verbose = args.verbose
inputfile = args.inputfile
if (verbose): print ("Input file:", inputfile)

```

All you have to do is import the `argparse` module, add the arguments, parse them and then treat the whole thing as a giant dictionary of data. It’s incredibly simple and handles everything.

For more information, [The Python Docs](https://docs.python.org/3/howto/argparse.html) contains a lot of detail. Mostly though, the code above is all you need.
A few ruby tricks for arrays and hashes
Tags: todayilearned, codenewbie, ruby
Published: 2020-03-01 21:42:39

- You can create a hash from a list of keys and values by using Hash[key, value].

Example:

Hash[‘key1’, ‘value1’, ‘key2’, ‘value2’]

# => {‘key1’=>’value1’, ‘key2’=>’value2’}

- You can directly turn parameters into arrays or hashes using a single star or double star in a method’s parameters.

The single star(arg*) takes all arguments after its call, and stores them in an array.

The double star(arg**) expects you to pass in a key value pair, and stores it in a hash.

Example:

def new_method(a, b*, c**)
   return a, b, c
end

new_method(1, 2, 3, 4, a: 5, b: 6)

# => [1, [2, 3, 4], {:a => 5, :b => 6}]

- Lastly, I found out that any object can be used as a key in a hash.

Example: 

Hash[true, ‘stuff’, false, ‘other stuff’]

# => {true=>’stuff’, false=>’other stuff’}
Node.js: Event handling patterns
Published: 2023-01-30 08:16:50

---
title: Node.js: Event handling patterns
published: true
date: 2020-03-01 21:26:27 UTC
tags: 
canonical_url: 
---

### Node.js ordered event handling with Async Iterators

Events in node.js have become a day to day used programming construct. Along with it comes the need for adopting various event handling patterns.

Usually there are multiple observers listening to an event from an object and node.js will notify all of them at the same time.

But sometimes the requirement might necessitate **executing the observers in an order, instead of notifying all at the same time**. This means we need to notify each observer asynchronously and wait for its response before executing the next.

**With node version 10 we have the async iterators and the for-await key word to get this done.**

In the below example, we have a publisher which emits various events. It has a map to correlate every registered event with an async iterator and a list of observers.

{% gist https://gist.github.com/deepakrkris/c2cdee82c0aad87f94911e133f339946 %}

While the async-iterators are a pretty interesting topic by themselves here we simplify it by using an available iterator module, p-event .

The for-await in the above code block has now become a **background listener** and will loop over when ever a new event is added to the iterator.

Next, let’s add multiple observers for the events.

{% gist https://gist.github.com/deepakrkris/e3134ae8fe5442533aa5260b35073271 %}

**The subscriber above adds 10 observers for two events event1 and event2.**

We expect now the event notifier to execute the observers in the order of addition.

{% gist https://gist.github.com/deepakrkris/d35934dcc9bb72345d98a8ec96375c23 %}

Lets check what is the output when we execute the above code snippet.

{% gist https://gist.github.com/deepakrkris/3ba60e356a9845614204ef486345eb2a %}

**We see that the event observers are executed in an order, though they have different execution times.**
Amazon Alexa and Echo Show 
Tags: javascript
Published: 2020-03-01 21:19:41

Alexa, a virtual digital companion powered by Amazon, from the day of its launch in 2014, Alexa is becoming part of everyday life by offering an "N" number of services in day to day life. whether it is communication, sports, weather updates or real-time information on news or traffic. if you are in the kitchen, Alexa is ready with the new recipe. it makes life easier with different types of skills. All you need is to <a href="https://downloadalexa-app.com/">Download Alexa App</a> and Alexa device. 

Alexa is now available in more than 40+ countries worldwide and on the way to become every home product. with more than 90,000 skills, Alexa's popular skills include setting a timer, play a song or music, setting up recurring routines and regular real-time news, music or weather update. Also, the number of Alexa devices sold by the end of 2019, reached more than 100 million.

From a long Amazon echo segment of products, we have a wonderful product as Amazon Echo Show which was released in 2017 with a touchscreen and a good set of speakers, which definitely changed the digital assistant devices market. Echo Show made it possible to make calls to contacts who own an Echo or the <a href="https://downloadalexa-app.com/">Alexa app</a> setup. It can also stream music and videos while promising better sound quality.