teleren/devto huggingface dataset:
How will PWAs impact Africa?
Tags: webdev, javascript, pwa
Published: 2020-02-18 09:12:50

I have been interested in the topic of progressive web apps for quite a while now, in fact, ever since I got into the Google Africa's Developers scholarship program in partnership with Andela and Pluralsight.  

I was thrilled by this concept from the very word go! At first, I couldn't get my head around it but diving deeper makes me want to say that, there is a lot one can do with this knowledge.

One of the most cherished things most communities in Africa would want to have is access to the internet. Access to the internet provides a whole world of opportunities for persons, businesses and organizations. Clearly, the possibilities themselves are endless. My goal is, therefore, to look at how progressive web apps can contribute to bridging the gap in areas or communities that may not have the luxury of enjoying the benefits of high-speed internet connectivity. To see this, we need to understand the new things PWAs bring to the table and how they can change lives:

1. PWAs are basically websites but with the added advantage of being able to offer an offline experience or still function in areas of very limited internet connection.
2. PWAs provide the same look and feel that native apps do offer. Perhaps they may be limited to only a couple of device features as opposed to native apps but that still can be overlooked as the main goal of PWAs is providing the most important information when there isn't good internet access.
3. PWAs may have an **install to home screen** concept to make it look like the whole app is being installed, but it really doesn't take up any space as most native apps will. This is a good thing because, users will not have to worry about device space or budgeting for an external **SD Card**
4. Closely following from the above, we can implement push notifications with PWAs. This makes them very reliable.
5. Personally, I think to build a website with a **PWA-First Approach** (my own name entirely) forces developers to think on what is most important to the users under the worst-case scenario. This is also a good thing because not only will a UX Designer think things through to the end, the developers themselves will think not only in the **Mobile-First Approach** but as well as in the **Offline Case** approach, leading to a better experience entirely.

I honestly believe that many developers today can take the advantages that PWAs are presenting to them to build a better and richer product, to reach out to a wider scope of users and most importantly,  grow their skill set. Africa needs far more PWAs to help those who do not have the chance to fancifully enjoy the luxury of high-speed internet connection like others around the world. As technology evolves and continues to grow, so will PWAs grow and be even more inclusive with respect to its end users. Cheers!
Angular Hidden Time Pipe
Tags: angular, html, tutorial, webdev
Published: 2020-02-18 09:02:23

I was integrating an API when I found myself faced with this data format:
```
dateRange: {
  date: '2020/02/02',
  fromTime: '10:00',
  toTime: '13:30',
}
```
It was required to display the date in the following format:
*2 Feb 2020 [10:00 AM- 01:30 PM]*

Now you might have noticed the time field is in 24 hours format while we need 12 hours format.
A time pipe would be perfect for this, except seemingly Angular doesn't include one!

I was about to try my luck with some 3rd party pipe but I wasn't comfortable with including a dependency for such a simple pipe. Should I build it myself?

Then I had an idea, maybe I can construct a date object from the time portion? I don't care what day/month it is; I will be just displaying the time portion anyway right?
Even better... what if:
```
{{dateRange.date + ' ' + dateRange.toTime | date: 'hh:mm aa'}}
<!-- Output -->
<!-- 01:30 PM -->
```
OR
```
{{'01/01/1900 ' + dateRange.toTime | date: 'hh:mm aa'}}
<!-- Output -->
<!-- 01:30 PM -->
```
**SUCCESS!!!**

Conclusion:
Yeah, we just use the date pipe but append a `day/month/year` string ahead of the time portion.

Disclaimer:
This is my first technical "artical" -if we can call it that. Wanted to start simple and I didn't counter any mention of this "trick" online. 
Any feedback is appreciated ^^.
AWS AI & Machine Learning Podcast — Episode 10
Tags: machinelearning, aws
Published: 2020-02-18 19:07:58

---
title: AWS AI & Machine Learning Podcast — Episode 10
published: true
date: 2020-02-18 08:59:24 UTC
tags: machinelearning, aws
canonical_url: https://medium.com/@julsimon/aws-ai-machine-learning-podcast-episode-10-e895b9c71e7b
---

### AWS AI & Machine Learning Podcast — Episode 10

In this episode, I cover new features on Amazon Personalize (recommendation & personalization), Amazon Polly (text to speech), and Apache MXNet (Deep Learning). I also point out new notebooks for Amazon SageMaker Debugger, a couple of recent videos that I recorded, and an upcoming SageMaker webinar.

> Video episodes are available on my [YouTube channel](https://www.youtube.com/juliensimonfr).

> Audio episodes are available on [Apple Podcasts](https://podcasts.apple.com/us/podcast/aws-ai-machine-learning-podcast/id1492801210), [Spotify,](https://open.spotify.com/show/1argBtYSeSksGU8dcW4TAS) [Deezer](https://www.deezer.com/show/756292), and more. Visit my [audio podcast page](https://julsimon.buzzsprout.com/) to subscribe and be notified of future episodes.

{% youtube KE83Aw6UvHk %}

<iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fwww.buzzsprout.com%2F780458%2F2769025-episode-10%3Fclient_source%3Dtwitter_card%26player_type%3Dfull_screen&amp;display_name=Buzzsprout&amp;url=https%3A%2F%2Fwww.buzzsprout.com%2F780458%2F2769025&amp;image=https%3A%2F%2Fwww.buzzsprout.com%2Frails%2Factive_storage%2Frepresentations%2FeyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBOGpKZFE9PSIsImV4cCI6bnVsbCwicHVyIjoiYmxvYl9pZCJ9fQ%3D%3D--c836266b57e2bc68585d743589ac963f73619fc3%2FeyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCam9VWTI5dFltbHVaVjl2Y0hScGIyNXpld282QzNKbGMybDZaVWtpRFRJMU1IZ3lOVEJlQmpvR1JWUTZER2R5WVhacGRIbEpJZ3RqWlc1MFpYSUdPd2RVT2d0bGVIUmxiblJKSWd3eU5UQjRNalV3QmpzSFZEb01jWFZoYkdsMGVXbFZPZzlqYjJ4dmNuTndZV05sU1NJSmMxSkhRZ1k3QjFRPSIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--62c0dc9ae0106a9121f982eb952976ff55ebdee3%2Fbackground.jpg&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=buzzsprout" width="500" height="210" frameborder="0" scrolling="no"><a href="https://medium.com/media/a260b78f0b6aa8602cf3d4158ecd1f17/href">https://medium.com/media/a260b78f0b6aa8602cf3d4158ecd1f17/href</a></iframe>
why havent i heard of packagecloud.io before ?
Tags: sysadmin, devops
Published: 2020-02-18 08:55:14

why why why ? and thanks DEV you are teaching me about a whole new world

* https://packagecloud.io/headmelted/codebuilds
* https://packagecloud.io/netdata/netdata
* https://packagecloud.io/phalcon/stable
Nikema's 100 Days of Code - Day 2
Tags: 100daysofcode
Published: 2020-02-18 08:47:32

## [Day 2](https://github.com/prophen/100-days-of-code/blob/master/Day-2.md)

{% twitter 1229685856056659968 %}

Day 2 was a lot of setting things up. I created and merged a PR that I updated a few times throughout the day. 

I'm working on [notes](https://github.com/prophen/serverless-todo/blob/9ca1491333f03a377863aedbd9ad8c71e8a50a2d/notes/1.md) for the app I built the other day. The first video notes are done and I'm ready to start on video two.

{% github prophen/serverless-todo %}


![Screenshot of notes from video one](https://dev-to-uploads.s3.amazonaws.com/i/yqdo9l9q6jmfd2em9o82.png)

****

Follow along with me on GitHub

{% github prophen/100-days-of-code no-readme %}

<p style='text-align:center'> <a href="https://www.buymeacoffee.com/nikema" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/default-orange.png" alt="Buy Me A Coffee" width="150px"></a></center></p>
The one where I start writing again...
Tags: intro, writting, growth
Published: 2020-02-18 08:38:09

---
title: The one where I start writing again...
published: true
description: In this article, I write about my love for writing and my next steps.
tags: #intro,#writting,#growth
cover_image: https://res.cloudinary.com/dnch08bzc/image/upload/v1581959332/rsz_1rsz_img_9200_1.jpg
---
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/28dpj4njcpli29pu6lha.jpg)

Hi, my name is Victory and I love writing but not as much as I love procrastinating the act of writing and worse publishing my writings... 

Writing has always been a means for me to express myself and my thoughts,  two things I struggle to do to my satisfaction when I'm talking... I remember in my University days I had this series I called `"30 mins rush"` basically for 30 mins I'll pull out my phone and go to work on my notepad(I still do it when my thoughts go crazy), I would write about all I was thinking, feeling and experiencing at the time for 30 mins and stop. This provided me a much needed safe place to express myself the way I really wanted to. A few of those writeups others got to see but most of those write-ups and a lot more never saw the light of day, sometimes I never even went back to reading them myself!


Now I'm ready to write again, but this time I want you to see it. I want to know what you think when you see it, what you understood or didn't. I want your unadulterated feedback basically. I want us to have conversations bordering on those posts, I want to connect with you, I want us to be `F.R.I.E.N.D.S`...

> “There is no failure. Only feedback.”

What will I be writing about? Everything. My Opinions on various subject matters, Technical writeups on what I've learned/know, personal(tongue in cheek)... you get the gist.

Cheers to a not so fun time of having to deal with my fear of public scrutiny... 🎉🥂


Want to get in touch with me? [Click me] (http://vic3king.io/)
DEV badly needs an appeals system !
Tags: watercooler
Published: 2020-02-18 08:31:54

an open letter to the @DEVMGMTTEAM 

ANOTHER day and ANOTHER post with a hashtag REMOVED by so called 'moderators' and WITH NO CHANCE TO APPEAL !

Come on DEV lets TRY to be the 100% GOTO site for DEV not just the 98% site

HERES AN IDEA ! 

WHY NOT PUT POSTS IN QUARANTINE FIRST ? - THEN BLAT EM IF AT LEAST 2 MODERATORS AGREE
Can I use React Helmet to add social card meta tags for Twitter and Facebook?
Tags: react, gatsby, javascript, socialmedia
Published: 2020-02-18 12:41:10

---
title: Can I use React Helmet to add social card meta tags for Twitter and Facebook?
published: true
date: 2020-02-18 08:30:00 AEST
tags: react, gatsby, javascript, socialmedia
canonical_url: https://chriscolborne.com/react-helmet-social-card-meta-tags/
---

So you’ve built an awesome React powered site. It’s shiny, and cool, and does everything you need… until your client/boss/best mate’s dad asks about social sharing meta tags. ‘Hey mate, I’ve heard you can put some tags in and I’ll get the cool card when I share my pages on Twitter and Facebook?’ Uhhh sure, just chuck them in [React Helmet](https://github.com/nfl/react-helmet) and you’ll be sweet right? But hang on, it’s not working!

So what’s the deal, can you add social share meta tags with React Helmet?

Absolutely… with a caveat.

See, the problem is that the various social networks don’t run your JavaScript and so won’t see your dynamically updated meta tags as they’re added on page load.

So the answer is that you need a way to either statically generate, or server-side render your React app.

Whilst not exhaustive, here are a couple of ways you can do that.

## React Snapshot

Probably the easiest if you’ve just got a Create React App (CRA) app, is to use [React Snapshot](https://github.com/geelen/react-snapshot).

React Snapshot takes your CRA app, follows any internal links it can find and generates a static site.

Just a simple npm install, update 3 lines and you’ve got a statically generated site.

## static-site-generator-webpack-plugin

If you’ve got a custom Webpack setup, you can use the [static-site-generator-webpack-plugin](https://github.com/markdalgleish/static-site-generator-webpack-plugin)

This plugin formed the basis of Gatsby (mentioned next) before version 2.

## Gatsby

As primarily a static site generator, [Gatsby](https://www.gatsbyjs.org/) can do this out of the box. If you use the [blog starter](https://github.com/gatsbyjs/gatsby-starter-blog), you can use the [SEO component](https://github.com/gatsbyjs/gatsby-starter-blog/blob/master/src/components/seo.js)

Even if you’re not using the blog starter, you can use the SEO component for inspiration and implement it in your site.

## Next.js

[Next.js](https://nextjs.org/) has a feature called [Static HTML Export](https://nextjs.org/docs/advanced-features/static-html-export) which can statically render your site.

`$ next build && next export`

And if you’re not using `getInitialProps`, you might not even need to use `next export`.

Next.js has a feature called [Automatic Static Optimization](https://nextjs.org/docs/advanced-features/automatic-static-optimization) which will automatically prerender `.html` files for those it can.

## Testing your social cards

Once you’ve set up your social card meta tags, you can test your meta tags using the following tools.

- [Twitter Card Validator](https://cards-dev.twitter.com/validator)
- [Facebook Sharing Debugger](https://developers.facebook.com/tools/debug/)
How is usually consistency maintained between DB and cache?
Tags: database, query, cache, mongodb
Published: 2020-02-18 08:18:29

Say I have some documents in MongoDB and have cached a couple of fields in redis. If I were to update some value in both the DB and cache, I would like either both of them to succeed or both of them to fail. How is this problem generally handled?

If both the updates were to happen within MongoDB, I would use transactions. But, I presume that is not possible across two systems like MongoDB & redis.
GitFlow Workflow in a Nutshell
Tags: git, github, devops
Published: 2020-02-18 08:18:28

## What is it?

The Gitflow workflow is a **strict branching model** that provides a robust framework for managing large projects and teams. This workflow assigns specific responsibilities to named branches in the repository and defines how and when they should interact.

## How it works

The five main branches used in this workflow include

- `master` branch
- `develop` branch
- `feature` branch
- `release` branch
- `hotfix` branch

### Master Branch

The sole responsibily of this branch is to contain the `release` and `hotfix` history of the project. Only the `release` and `hotfix` branches can be merged into this branch.

### Develop Branch

This branch is derived from the `master` branch at the beginning of the project.

```shell
git init
git checkout -b develop
git push -u origin develop
```

It serves as the integration branch for all **features** contained in respective `feature` branches.

### Feature Branch

When a new **feature** is to be developed, a `feature` branch is created from `develop`.

```shell
git checkout develop
git checkout -b feature-branch
git push -u origin feature-branch
```

When development is complete, it is merged back into the `develop` branch.

```shell
git checkout develop
git merge feature-branch
```

`feature` branches are never allowed to interact directly with the `master` branch

### Release Branch

When it's time for a new **release**, a `release` branch is created from `develop`. This branch is used to integrate all the **features** - since the last **release** - and fix any bugs that may arise

```shell
git checkout develop
git checkout -b release/2.2.3
```

A version number is usually appended to each `release` branch upon creation. When the **release** is ready, it is merged into the `master` branch.

```shell
git checkout master
git merge release/2.2.3
```

The `release` branch must be merged back into `develop` because it will contain relevant changes from the last **release** that should be integrated back into `develop`

```shell
git checkout develop
git merge release/2.2.3
```

### Hotfix Branch

When a bug is detected in the `master` branch, a `hotfix` or `maintenance` branch is created from the `master` branch to resolve the issues.

```shell
git checkout master
git checkout -b hotfix-branch
```

Afterwards, it is merged into both `master` and `develop` branches

```shell
git checkout master
git merge hotfix-branch
```

```shell
git checkout develop
git merge hotfix-branch
```

## Summary

A good demonstration of the Gitflow workflow can be seen below

```shell
git init
git checkout -b develop
git checkout -b feature_branch
# work happens on the feature branch - multiple feature branches can be created
git checkout develop
git merge feature_branch
git checkout -b release/0.1.0
# work happens on the release branch
git checkout master
git merge release/0.1.0
git checkout develop
git merge release/0.1.0

# if issues arise in master
git checkout master
git branch -d hotfix_branch
# work happens on the hotfix branch
git checkout master
git merge hotfix_branch
git checkout develop
git merge hotfix_branch
```
i will NOT bother to learn react and react native anymore !
Tags: react, reactnative, oraclejet
Published: 2020-02-18 07:56:00

lets spend those 'spare' 2 hours on @oraclejet instead and see if the Oracle JavaScript Extension Toolkit ([JET](https://www.oracle.com/webfolder/technetwork/jet/index.html)) really does "empowers developers" !

BTW im really hoping it does and i really hope it only takes 2 hours as i actually want to start evaluating oracle linux 7 on arm and add netdata to my oracle cloud linux vm's and get my oracle automonous dbs and actually program my oracle iot codecard and ... and  ... and ...

did i mention i DONT work for oracle ! 

PS any oracle recruiters out there ?
Release: DeepSource Ruby analyzer lands in beta
Published: 2020-02-18 07:42:31

Ever since its inception in 1995, Ruby has been a programming language that is "a simple Lisp language at its core, with an object system like that of Smalltalk, blocks inspired by higher-order functions, and practical utility like that of Perl".

Add to it the fact that you get to use Rails, and you have one of the most loved and widely used programming languages in the world. What's not to love!

Today, we are excited to launch continuous static analysis for Ruby, detecting 170+ issues, like bug risks, anti-patterns, security vulnerabilities, and style issues.

## Using the Ruby analyzer

To start analyzing your Ruby code, just enable the `ruby` analyzer in your `.deepsource.toml` file, and you are good to go.

### Sample configuration

```toml
version = 1

test_patterns = [
  "test/**",
  "*_test.rb"
]

exclude_patterns = [
  "vendor/**",
  "**/examples/**"
]

[[analyzers]]
name = "ruby"
enabled = true
```

## Issues detected by the Ruby analyzer

At the time of writing this, the analyzer detects 170+ issues in your Ruby code, across categories like bug risks, anti-patterns, security vulnerabilities, and style issues. Here's some of them to give you an idea:

**Bug risks:**

* Iterable is called with `with_index`, but its value is never used
* Unreachable code detected

**Security issues:**

* Use of `Kernel#open` detected 
* Use of `Kernel#eval`/`Binding#eval` detected

**Antipatterns:**

* A block can be used that cleans up resources automatically on closing
* Use of class variables detected

We're very excited about this release, and hope that this will help you avoid many issues in your code, and make writing Ruby even more fun! Head over to [the docs](https://deepsource.io/docs/analyzers/ruby.html) or [tell us](https://twitter.com/DeepSourceHQ) what you think!
Certified Financial Planner in RANCHI
Tags: certifiedfinancialadvisor, financialadvisorinranchi, mutualfundadvisorinranchi
Published: 2020-02-18 07:22:32

Vedant Asset is the best performing certified financial planner in Ranchi that helps investors to carry out their financial goals effortlessly. We provide online investment platform which let investors track and manage their funds easily.
Role-based auth in Angular 9 🔑
Tags: angular, security, javascript
Published: 2020-02-18 06:48:51

---
title: Role-based auth in Angular 9 🔑
published: true
tags: #angular #security #javascript
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/xghawvmrh6v3z4pmvgts.jpg
---
{% youtube 49FrsKDkt04 %}

👉 Join the [Security Academy](https://angular-academy.com/security) to master Web Security!

⚡ the case of role-based application
⚡ a domain model for a multi-account system
⚡ vectors of authorization
⚡ designing secure REST API for roles
⚡ userAuth object
⚡ Router Guards
⚡ HttpInterceptors
⚡ Silent auth (RxJS magic!)
⚡ Express.js middlewares
⚡ DEMO
Redirecting to an external URL within React Router
Tags: react, reactrouter, javascript
Published: 2020-02-18 06:48:30

##TIL: How to redirect to an external URL within react-router-dom

At my current development position at <a href="https://astrolabediagnostics.com">Astrolabe Diagnostics</a>
 I was tasked with a route loading a React component if the user was signed in, or redirecting to an external site. I wanted to do this from the route level instead of handling the redirect from the component.

We simply need to render a function assigning the `window.location` to the new site, and the user is redirected.

```javascript
{this.state.session.user ? (
  <Route exact path="/" component={MyComponent} />
  ) : (
  <Route exact path="/" render={() => (window.location = "https://redirectsite.com")} />
)}
```
ContentSearch APIで常に真になる条件の生成方法とその使い道
Tags: sitecore, contentsearch
Published: 2020-02-18 04:39:06

以下のコードで常に真になる条件の作成することができます。

```cs
var truePred = PredicateBuilder.Create<SearchResultItem>(item => item.Name.MatchWildcard("*"));
```

`_name`フィールドは全てのドキュメントが持っているので、この条件は常に真(全てのドキュメントにヒットする)になります。あまりリーダブルではないので、コメントで補足するかラップしたメソッドを用意することをおすすめします。  

一見以下のコードでもうまく動きそうですが、単体で使用すると例外が発生する上に、ORで連結すると条件が無視されてしまうため期待した動作にはなりません。

```cs
// うまく動かない例
var truePred1 = PredicateBuilder.True<SearchResultItem>();
var truePred2 = PredicateBuilder.Create<SearchResultItem>(item => true);
```

## 使い道
### 検索結果に重み付けを行う
「`{常に真になる条件} OR {重み付けのための条件}`」でフィルターをかけることで、検索結果に重みをつけることができます。  

以下の例では、Contentフィールドに"Foo"を含むものに絞り込み、さらにTitleフィールドと完全一致したものに重みを付けています。

```cs
var index = ContentSearchManager.GetIndex("sitecore_master_index");
using (var context = index.CreateSearchContext())
{
    var query = context.GetQueryable<SearchResultItem>();

    // Contentフィールドが"Foo"を含むものに絞り込み
    query = query.Filter(item => item["Content"].Contains("Foo"));

    // Titleフィールドが"Foo"と一致する場合に重みをつける
    // ORで連結しているので、条件全体として常に真となる。
    var boostPred = PredicateBuilder
        .Create<SearchResultItem>(item => item.Name.MatchWildcard("*")).Boost(0) // 常に真
        .Or(item => item["Title"].Equals("Foo").Boost(10));

    // 条件をクエリに適用（Filterだと重み付けを無視するためWhereを使用）
    query = query.Where(boostPred);

    // 重みの降順で並び替えて取得
    var result = query.OrderByDescending(item => item["score"]).GetResults();
}
```

`boostPred`で真となる条件をORで結合しています。初期値に`PredicateBuilder.True<SearchResultItem>()`を使用すると、クエリ生成時に条件が無視されてしまい、期待した動作になりません。

またフィルター処理と重み付けを同時に行うこともできますが、多くの場合条件を分けることで柔軟で効率の良いクエリを作成することができます。

### OR/AND条件を動的生成する
リストの値それぞれに対して条件をかけたい場合、AND/OR条件を動的生成する必要があります。  
以下の例では、`values`変数の全ての値がアイテムのTitleフィールドに含まれている条件を生成しています。

```cs
var values = new [] { "Foo", "Bar", "Baz" };

var index = ContentSearchManager.GetIndex("sitecore_master_index");
using (var context = index.CreateSearchContext())
{
    var query = context.GetQueryable<SearchResultItem>();

    // true && item["Title"].Contains(value1) && item["Title"].Contains(value2) && ... 
    // という条件を動的生成
    var pred = PredicateBuilder.Create<SearchResultItem>(item => item.Name.MatchWildcard("*"));
    foreach (var value in values)
    {
        pred = pred.And(item => item["Title"].Contains(value));
    }

    // 条件をクエリに適用
    query = query.Filter(pred);

    var result = query.GetResults();
}
```

`pred`の初期値として、常に真になる条件を与えています。代わりに`PredicateBuilder.True<SearchResultItem>()`を使用しても動作しますが、`values`変数が空の場合に例外が発生してしまいます。