teleren/devto huggingface dataset:
What Motivates Open Source Contributions?
Tags: opensource, business
Published: 2020-10-24 15:45:19

Open source contribution is no longer just for fun or personal interest. Many developers use open source tools in their day job and surveys have found that a [majority contribute to the projects](https://thenewstack.io/the-surprising-truth-about-how-many-developers-contribute-to-open-source/) in some form. Companies are contributing to open source, [especially the tech giants](https://www.freecodecamp.org/news/the-top-contributors-to-github-2017-be98ab854e87/).

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

(Analysis from [Felipe Hoffa](https://www.freecodecamp.org/news/the-top-contributors-to-github-2017-be98ab854e87/).)

Stackoverflow surveys have found that up to [65% of developers contribute to open source](https://insights.stackoverflow.com/survey/2019#developer-profile-_-contributing-to-open-source) and that the percentage is [not very different for professional and non-professional developers](https://insights.stackoverflow.com/survey/2018#developer-profile-_-contributing-to-open-source). These same surveys also show that [more and more developers have been contributing in recent years](https://dev.to/rhamedy/why-you-should-think-twice-about-contributing-to-open-source-1l4d).

There can be multiple motivations for an open source contribution. This makes personal motivations hard to identify from surveys. One is a belief in the value of open source as a practice and a desire to be part of that. Developers are also motivated by personal and career development. 

The presence of more personal motivations does not mean that developers aren't in some way getting paid to contribute. Developers who work directly for open source companies are certainly paid to contribute. Developers who work for a company using an open source product may also contribute as part of their day job. A [2016 Survey](https://opensource.com/business/16/5/2016-future-open-source-survey) found that 65% of companies were contributing to open source.
TIL: How to add validation on Agular Material form field
Tags: angular, todayilearned
Published: 2020-10-24 15:44:25

I'm using a text area inside a form field from Angular Material components. My view for `postMessage` component looks something like this:
####post-message.component.html
```html
<form class="post-message-form">
    <mat-form-field class="full-width">
     <textarea matInput [formControl]="messageFormControl" 
            cdkTextareaAutosize cdkAutosizeMinRows="1" 
            maxlength="500" placeholder="What's happening?"> 
     </textarea>
     <mat-error 
         *ngIf="messageFormControl.hasError('required')">
           Message is <strong>required</strong>
     </mat-error>
    </mat-form-field>
<form>	
```

And on my controller, I initialize the form control with an empty value
####post-message.component.ts
```typescript
import { Component, OnInit } from '@angular/core';
import { FormControl, Validators } from '@angular/forms';

@Component({
  selector: 'post-activity',
  templateUrl: './post-activity.component.html',
})
export class PostActivityComponent implements OnInit {
  messageFormControl = new FormControl('' 
     [Validators.required]);
	
  constructor() { }

  ngOnInit(): void {
    //other code
  }	
}
```
Here, I have declared a form control as `messageFormControl` and added a built-in required validation. The form control takes validation as an array; so for example, if I want to add an email validation then it will look something like  
```typescript
messageFormControl = new FormControl('' 
     [Validators.required, Validators.email]);
```
You can also add your own custom validation on the array but might create a separate post for that.

That's all for today.
Secure Configuration of Web Application Firewalls
Tags: security
Published: 2020-10-24 15:38:12

Security threats have always been a prominent issue in this digital era. The more data in digital space, the more precautions we need. 

There’s a possibility of many security threats existing in a typical enterprise distributed application including DDoS, SQL injection, Cross-Site Scripting, etc. When organizations are trying to increase their internal security, hackers are becoming more creative.

Good security program always requires multiple layers of defence. Multiple layers of security allow one system to catch an attack that may be missed by others. In a hosted application environment those layers typically include firewalls, intrusion detection systems (IDS), and server security.

A web application firewall or WAF could be the first line of defence among these security layers.
A web application firewall, which is dynamic and heuristic has a promising role in an IT infrastructure.

It is a type of reverse-proxy, protecting the server from exposure by having clients pass through the WAF before reaching the server.  The WAF can look for unusual traffic activity and automatically block that traffic, even if the traffic does not match a known “bad” pattern which makes it different from intrusion detection systems.

A WAF operates through a set of rules often called policies. It is also customizable, allowing you to write rules specific to your application.
Some of the WAF policies are listed below:

* Web attack signature policy
* URL protection policy
* HTTP protocol constraint policy
* SQL/XSS injection detection policy
* Bot detection

Even though many companies have implemented a WAF, most of the web application firewall configurations are not secure. It would be more effective if the following points are considered while configuring a web application firewall.

* Coordinate web application firewall configuration and Web 
  Application Update
* Always check for vulnerabilities
* Use a web application firewall with built-in acceleration
* Lockdown the backdoor
* Understanding of web application environment

A web application firewall acts as the first line of defence and it allows you to make sure that an application is safe by putting in a reasonable amount of initial effort. In addition to implementing them, it is also necessary to properly configure them so that it can be an effective defence mechanism in your bid to keep away hackers.

A more detailed version on secure configuration of web application firewall published at
https://beaglesecurity.com/blog/article/secure-web-application-firewall-configuration.html
Coding Snake in JavaScript Complete Tutorial Every Step Explained with HTML5 Canvas


Tags: javascript, canvas, game, gamedev
Published: 2020-10-24 15:37:01

{% youtube 7Azlj0f9vas %}

In this tutorial we will be creating the game snake using JavaScript and HTM5 Canvas. We will explore the game loop, collision detection, taking keyboard input and adding sound. 

I look forward to any input on this tutorial :)
The Open Core Business Model
Tags: opensource, business, opencore
Published: 2020-10-24 15:21:25

Commercial open source makes money through open source. A favoured model is Open Core. With Open Core there's an upgrade path designed for a subset of users to become paying customers. 

Open core software is funded by a company and the business model requires an paying customers. This means there will often be paid-for closed-source add-ons available for the open source product or a paid-for hosted version.

Many of the most well-known open source software products are [Open Core](https://medium.com/open-consensus/2-open-core-definition-examples-tradeoffs-e4d0c044da7c). Examples include Elasticsearch, MongoDB, NGINX, MuleSoft and GitLab and [use of the model seems to be growing](https://techcrunch.com/2019/01/12/how-open-source-software-took-over-the-world/?guccounter=1).

With Open Core, the open source part of the software is free to use. If a particular use case doesn't require any paid-for add-ons, then there’s no need to pay anything. If it does, then users face a choice of whether to buy the add-on or fill the gap themselves. The mix of how much functionality is open and how much is a paid add-on can vary a lot across tools.

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

(Image from [Joseph Jacks](https://medium.com/open-consensus/2-open-core-definition-examples-tradeoffs-e4d0c044da7c).)

Often add-ons are targeted at high volume use cases. It’s common for enterprise add-ons to relate to permissions, security and monitoring at scale. The idea is that companies with smaller usage requirements can get started for free and move to paying only when they’re deriving a lot of value from the product. 

The open core model can lead to confusion for users about whether and when their use case might lead into becoming a paying customer. Especially if the vendor is not clear about the boundary between the free and paid. When the differentiation is clear then the prospect of paying for the product later down the line usually doesn't put users off the open source.

Some companies confine their enterprise offering to hosted services. This means keeping the open source free for self-installation, while also offering the exact same functionality as a hosted service. 

Some companies charge only for support and services around self-installed open source. In this model the open source and paid functionality is the same. Red Hat, the largest open source vendor, believes strongly in only charging for services and support. Hence we sometimes see [criticisms from Red Hatters of the open core model](https://www.redhat.com/en/blog/open-source-or-open-core-why-should-you-care?ref=hackernoon.com).

My personal opinion is that the open core model can be good for everyone so long as it's done well. But we don't need to get into that debate here. The most important point on Open Core for developers is to be conscious of potential paid upgrade paths when evaluating Open Core tools.
Android CodeView: an Easy way to create a Code Editor app
Tags: android, codeview
Published: 2020-10-24 14:42:55

Hi I am Amr Hesham a Software Engineer, I am interested in Android Development and Compiler Design 😎

Last month when I was creating programming language compilers and interpreters for practice and implement creative ideas, I got an idea to create an Android Calculator app (MathScript) based on a scripting language to represent mathematics operations and functions 🤔.

First, I have worked on the language design to be easy to use with helpful error messages and after implementing it, It’s time to work on the Android app so I need to create a Code Editor for this language with some features to be easy to use.

I have decided that the code editor should have some features to be cool and easy for everyone for examples,

- Custom Syntax highlighter for my new scripting language.
- AutoComplete based on any language keywords.
- Error highlighter to highlight errors and warns.
- Support multi-theme highlighter and can change the theme in runtime.
◾ Easy to update the configuration to add any updates for my language.

So how should I create this Code Editor?
I have started searching for any library that can give me the ability to create this editor.

But the problem is that I want a custom needs because it’s my language, not any popular programming language that people supports in their libraries,
and the result of my searching is that no library will give me all that I need.

So I have thought that I should create my library to solve this problem and
make it generic and anyone can customize it for his needs.

And I have created CodeView library, and the goal of it is to make it easy for anyone to create custom Code Editor and to be small and not include configuration for every programming or every theme, so the idea is to give you the kernel and you can customize it as you want.

![Demo in Java](https://dev-to-uploads.s3.amazonaws.com/i/sxdqq1xkquzeta1rm7zt.gif)

It can support any programming language syntax and even you can use it to highlight links, emails, and hashtags like social media editors, you can support auto-complete easily but add your keywords and the library has a default tokenizer and you can change it too 😋, You can support any number of themes and can move between them in the runtime fast and easy, You can support any types of errors highlighter like error, warn, tips…etc, You can implement some cool features that you love for example highlighter TODO, FIX comment like JetBrains editors.

It’s very easy to use, well documented, has many examples on Github you can know how to download and use from the Github link:
https://github.com/amrdeveloper/codeview

and I hope you will enjoy creating your editor with CodeView 😋
Logging in Android
Tags: logs, androidfundamental, android
Published: 2021-12-30 13:19:41

---
title: Logging in Android
published: true
date: 2020-10-19 10:30:00 UTC
tags: logs,androidfundamental,android
canonical_url: https://medium.com/@magdamiu/logging-in-android-1ee917286896
---

In Android, we are able to log info by using the static methods provided by the final class [Log](https://developer.android.com/reference/android/util/Log). This class is part of the _android.util_ package.

![](https://cdn-images-1.medium.com/max/640/0*xvtLlDkgsKZrw9rO)

### Available methods

![](https://cdn-images-1.medium.com/max/960/0*D98Fr6hVyvoPo1Mk.png)

### Method signature

![](https://cdn-images-1.medium.com/max/960/0*h7AR8vb0fd9GG4hS.png)

If we log the next messages, the result from _Logcat_ is present in the picture below.

{% gist https://gist.github.com/magdamiu/4e2f646ccbf803742aa7b3d60f0fd284 %}

![](https://cdn-images-1.medium.com/max/640/0*YAqbqDAfgmZF7gkV)

In **Android Studio > Settings >** search _Android Logcat_ and from there we are able to customise the color of the logged messages from _Logcat_.

![](https://cdn-images-1.medium.com/max/640/0*1uhT_AyT4bBsgsQ6)

### When and what to log?

It is recommended to create different build flavors depending on the available server environments. For example, you could have a dedicated flavor for dev, QA, pre-prod, prod. Based on this classification also the logging strategy is changed.

On the test environments is ok to log many details in order to make sure everything is working properly. In the production environment, it is recommended to log only the most relevant info in order to not affect the performance. Also, you should take care not to log sensitive data like emails, phone numbers, personal ids, and so on.

{% gist https://gist.github.com/magdamiu/46a7379e1ed86596c826fee2d002d93b %}

{% gist https://gist.github.com/magdamiu/8a8a0b5218c431f4aa593fc958cfd6f8 %}

If you want to learn more about logging you could check a dedicated episode on the [Fragmented Podcast](https://fragmentedpodcast.com/episodes/191/).

Enjoy and feel free to leave a comment if something is not clear or if you have questions. And if you like it please share!

Thank you for reading!

_Originally published at_ [_http://magdamiu.com_](https://magdamiu.com/2020/10/19/logging-in-android/) _on October 19, 2020._
How to make your model training stops when reached a threshold?
Published: 2020-10-24 14:42:51

Sometimes you need your model training phase stops if you reach a certain threshold. Maybe this way you can avoid overfitting or you have a pipeline and you want it deal with these kind of things automatically. Whatever your reasons are, there is a solutions: Callbacks. According to wikipedia, callback is:

"In computer programming, a callback, also known as a "call-after" function, is any executable code that is passed as an argument to other code; that other code is expected to call back (execute) the argument at a given time. This execution may be immediate as in a synchronous callback, or it might happen at a later time as in an asynchronous callback. Programming languages support callbacks in different ways, often implementing them with subroutines, lambda expressions, blocks, or function pointers."

Here is a small chunk of code that you can use in Tensorflow-Keras.


def train_mnist():
    class myCallback(tf.keras.callbacks.Callback):
        def on_epoch_end(self, epoch, logs={}):
            if(logs.get('acc')>0.99):
              print("\nReached 99% accuracy so cancelling training!")
              self.model.stop_training = True
    
    mnist = tf.keras.datasets.mnist

    (x_train, y_train),(x_test, y_test) = mnist.load_data()
    x_train, x_test = x_train / 255.0, x_test / 255.0
    callbacks = myCallback()
    model = tf.keras.models.Sequential([
        
      tf.keras.layers.Flatten(input_shape=(28, 28)),
      tf.keras.layers.Dense(512, activation=tf.nn.relu),
      tf.keras.layers.Dense(10, activation=tf.nn.softmax)
        
    ])

    model.compile(optimizer='adam',
                  loss='sparse_categorical_crossentropy',
                  metrics=['accuracy'])
    
    # model fitting
    history = model.fit(x_train, y_train, epochs=10, callbacks=[callbacks])
    # model fitting
    return history.epoch, history.history['acc'][-1]


References:
https://en.wikipedia.org/wiki/Callback_(computer_programming)
https://www.coursera.org/learn/introduction-tensorflow/
How To Download and Install Mysql Workbench
Tags: mysql, webdev, database
Published: 2020-10-24 14:28:13

### 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-Go to mysql workbench download
here is the Link :https://dev.mysql.com/downloads/workbench/

![A1](https://dev-to-uploads.s3.amazonaws.com/i/j39k76uti41nz6j43kl4.png)
### 3-Click Download 
![a2](https://dev-to-uploads.s3.amazonaws.com/i/drouldopik1o5uyrhanv.png)
### 4- click the link at the bottom 
![a3](https://dev-to-uploads.s3.amazonaws.com/i/xwbybl49twxv3w0v6jzw.png)
 
After downloading the MySQL community edition, double-click the installer file to begin the installation process. It’ll launch the installer window.

Subsequently, follow the below steps. Take help from the snapshots attached. Make sure to edit or select the option, as shown in the picture.
### step-1
![a4](https://dev-to-uploads.s3.amazonaws.com/i/gmoh71pi3u3oulfwcxod.png)
### step-2
![a5](https://dev-to-uploads.s3.amazonaws.com/i/26y0kr6cllfpysjo5pbg.png)
 
### step-3
![a6](https://dev-to-uploads.s3.amazonaws.com/i/msrudwylisx4n5gyksfr.png)

### step-4 

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

### step-5
just wait a bit

![a8](https://dev-to-uploads.s3.amazonaws.com/i/oh771o6gu6omzy7jg8js.png)
You’ve completed the MySQL installation on your Windows system. 
Finaly the result

![a9](https://dev-to-uploads.s3.amazonaws.com/i/uimacgwdqqvs1ds2rwbv.png)
Downloading and Installing XAMPP on Windows 10
Published: 2020-10-24 14:06:19

XAMPP is a free and open-source cross-platform web server solution stack package developed by Apache Friends, consisting mainly of the Apache HTTP Server, Maria DB database, and interprets scripts written in the PHP and PERL programming language.

Head over to https://www.apachefriends.org/download.html

![Download XAMPP - Mozilla Firefox 10_24_2020 10_16_35 AM](https://dev-to-uploads.s3.amazonaws.com/i/rl36ub53vq0lpasexe2i.png)

👉Download the latest version (the one found at the bottom). At the time of this writing, the latest version is 7.4.11 by clicking on the Download (64 bit) button.

👉There you go, now wait for the download to complete. As soon as it completes, navigate to your download folder, then double click on the XAMPP download to start the installation.
 
![Downloads 10_24_2020 10_19_01 AM](https://dev-to-uploads.s3.amazonaws.com/i/tne3u1lryf077szk3h6r.png)

👉Click on the Next button
![xampp](https://dev-to-uploads.s3.amazonaws.com/i/kbrx75z6szpndcpm5qx9.png)

👉You can select the components you wish to install and clear the components you do not want to install. It is recommended to leave the defaults and proceed to the next button.

![xampp 2](https://dev-to-uploads.s3.amazonaws.com/i/p92n9zhg8lnr69lvm1le.png)

👉Choose an installation path, avoid choosing c:/program-files, because it requires User Access Control will restrict some features of XAMPP.
 
![xampp 3](https://dev-to-uploads.s3.amazonaws.com/i/u0tq2kpeyt64sxvditl9.png)

👉On the next screen, you should see Bitnami. Bitnami is open-source software that enables you to add plugins to your existing XAMPP application.
👉Click on the Next button: The installation proper should start

![xampp 5](https://dev-to-uploads.s3.amazonaws.com/i/357j2tcoc2lz3n7kxlc3.png)

👉This may take some time to complete, you may also see a popup from Windows firewall, asking you for permission to allow it to communicate on private networks. Just click to allow access.

![xampp 6](https://dev-to-uploads.s3.amazonaws.com/i/c7lkautsskdq9p0f4pms.png)

👉Click on finish to exit the setup and launch the XAMPP control panel.
 

 ![xmapp 7](https://dev-to-uploads.s3.amazonaws.com/i/q8bz19cmgsrl4l0ujq91.png)


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

Congratulations!!! 🎉🎊You have successfully downloaded and installed XAMPP.
Github Developer Stats
Tags: github, webdev, git, javascript
Published: 2020-10-24 14:02:58

Do you want to get the github developers stats at your fingertips with a simple search. Then check it out [github-stats](https://rahulmanoj.xyz/github-stats)

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

This is created using [github-api](https://docs.github.com/en/free-pro-team@latest/rest)

Interested check out the source code - [source code](https://github.com/rawho/github-stats)


For this project I only used two endpoints of the api
- https://api.github.com/users/USERNAME
- https://api.github.com/users/USERNAME/repos

Note: Change the username with your github username to see the results

If your are interested you can contribute to this project.
Future plans are listed here [future plans](https://github.com/rawho/github-stats#future-plans)
simple-sitemap-renderer: A bare minimum sitemap renderer written in TypeScript
Tags: npm, typescript, javascript, node
Published: 2020-10-24 13:57:37

If you're looking for a easy to use sitemap renderer and don't need extra features like extended sitemap or sitemap index files, this library might be helpful.

## 💻 Installation

```sh
$ npm i simple-sitemap-renderer
```

or

```sh
yarn add simple-sitemap-renderer
```

## 🎈 Usage

```ts
import { renderSitemap } from 'simple-sitemap-renderer'

renderSitemap([
  {
    url: 'https://your-site/your-page-1',
    lastmod: '2020-10-10',
    changefreq: 'always',
    priority: 0.8,
  },
  {
    url: 'https://your-site/your-page-2',
    lastmod: '2020-10-10',
  },
  {
    url: 'https://your-site/your-page-3',
  },
])
```

### Rendered Result

> the sample here is formatted for readability, but actual result will always be minified.

```xml
<?xml version="1.0" encoding="UTF-8"?>
<urlset>
  <url>
    <loc>https://your-site/your-page-1</loc>
    <lastmod>2020-10-10</lastmod>
    <changefreq>always</changefreq>
    <priority>0.8</priority>
  </url>
  <url>
    <loc>https://your-site/your-page-2</loc>
    <lastmod>2020-10-10</lastmod>
  </url>
  <url>
    <loc>https://your-site/your-page-3</loc>
  </url>
</urlset>
```

### More info

{% github tars0x9752/simple-sitemap-renderer %}