teleren/devto huggingface dataset:
How to Convert Keras model into Tensorflow lite
Tags: machinelearning, tensorflow, keras, python
Published: 2019-06-14 14:02:54

I just found a great video for converting Keras model into Tensorflow lite model.

https://www.youtube.com/watch?v=IJt_veyTlv8

## requirements
I asked about the version of Tensorflow to `android daily life with ameer`. He told me he was using tensorflow1.12.
So need to install that version

```zsh
!pip uninstall tensorflow
!pip install tensorflow==1.12
```

## code
```python
from tensorflow.contrib import lite
converter = lite.TFLiteConverter.from_keras_model_file('/content/VGG_cross_validated.h5')
tfmodel = converter.convert()
open("model.tflite","wb").write(tfmodel)
```

I will try Tensorflow lite model with Edge-TPU.

{% link https://dev.to/kojikanao/coral-edgetpu-usb-with-virtualbox-57e1 %}
Yup, Formik, React: Differing Drop-downs
Tags: react, javascript, formik, yup
Published: 2019-06-14 13:59:44

---
title: Yup, Formik, React: Differing Drop-downs
published: true
description: Validating drop-down input with Formik, Yup, and React
tags: React, JS, Formik, Yup
---
This assumes familiarity with Formik, Yup, and React.

Today I learned something cool with Yup. Say that you have two drop-downs or fields and you want to make sure that they are different. There’s a really neat way to do this with Yup and Formik.

<img alt="ice cream cones" src="https://cdn-images-1.medium.com/max/1200/0*ARQILtKA_G-Opnp8" />

Let’s go with something easy:

First Flavor: Vanilla

Second Flavor: Chocolate

The user is able to pick through a list of flavors and select their favorites in order. We want these to be different. So in our code we might have something like this:
```javascript
validationSchema: Yup.object({
  vanilla: Yup.string()
           .notOneOf([Yup.ref('chocolate'), null], 
           'Flavors must not match.'),
  chocolate: Yup.string()
             .notOneOf([Yup.ref('vanilla'), null], 
             'Flavors must not match.'),
})
```
Essentially what is happening here is that Formik and Yup are making sure that before your data is captured, that both fields are not the same value. The ‘noOneOf’ method is checking to make sure that vanilla is not chocolate and vice-versa. The ‘Yup.ref’ is grabbing the value of the other drop-down so that you can pass it to the ‘notOneOf’.

Cheers!
The Quite Nice and Fairly Accurate Intro to JS Primitive Data Types (pt. 1)
Tags: javascript, beginners, webdev
Published: 2019-06-14 13:36:54

JavaScript has two data types: **Primitives**, and **objects**. A *primitive* (or a primitive value or a primitive data type), as described in the JavaScript documentation, is the data that is not an object and has no methods.

JavaScript is a *dynamically typed* language which means that even though there are data types in its ecosystem the variables are not bound to any of them.

There are 6 primitive data types in JS: Boolean, Number, String, Null, Undefined, Symbol (ES6)

**Boolean**

Boolean is a logical data type  which can only have two values: true or false; It is a YES-NO switch; Logical operation results in a boolean value;

**Common use case:** control application flow

<img src="https://i.ibb.co/djpfBc7/boolean-1.png" alt="boolean-1" border="0">

**Number**

Number is a numeric data type in the double-precision 64-bit floating point format. In JS, number represents both integers and floating points.
A number can also be +Infinity, -Infinity, and NaN (Not A Number).

**Common use case:** mathematical calculations

<img src="https://i.ibb.co/0r26jfC/number.png" alt="number" border="0">

**String**

A string is a sequence of characters used to represent text. In JS, a string is inside of double or single quotes. ES6 also introduced template literals or template strings. Template literals are string literals allowing embedded expressions (${}). The expression inside ${…} is evaluated and the result becomes a part of the string. 

**Common use case:** Store text

<img src="https://i.ibb.co/Q6VnJvp/string.png" alt="string" border="0">

**Null**

In programming, null usually represents a reference that points to a nonexistent/invalid object or address in memory. In JS though is a special primitive type which represents "nothing".

<img src="https://i.ibb.co/2vpVzpN/null.png" alt="null" border="0">

*Note:* The typeof null is 'object'. It is considered as a bug ([why null is object](https://stackoverflow.com/questions/18808226/why-is-typeof-null-object))

**Undefined**

Undefined is a data type that it stands for a value that is not defined;

**Common use case:** Check if a variable is assigned with a value

<img src="https://i.ibb.co/Xp9z2pK/undef.png" alt="undef" border="0">

[Undefined vs Null] (https://medium.com/@alyz26/undefined-vs-null-c567b539ee71)

**Symbol**

Symbols are introduced in ES6 and are completely unique identifiers. Just like the other primitives they can be created using the factory function Symbol() which returns a Symbol (i.e. new Boolean('true') creates a new boolean value). 

**Common use case:** Create keys, Privacy, Protocols

<img src="https://i.ibb.co/DYHVMKG/symbol-1.png" alt="symbol-1" border="0">

References: 

[A quick overview of JavaScript symbols]
(https://www.freecodecamp.org/news/how-did-i-miss-javascript-symbols-c1f1c0e1874a/)

[JavaScript Documentation](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference)

[JavaScript Data Types Explained] (https://codeburst.io/javascript-data-types-explained-347555cd2d4d)
Going to My First Conference. Pro Tips?
Tags: career, discuss, webdev
Published: 2019-06-14 13:19:04

My company is sending me off to my first conference this week and I am super excited!

The thing is... I have no idea what to do 🤔

What are your tips for getting the most out of the experience? What should I bring, what should I do, who should I talk to? Or do I just kick back and watch the show like all the YouTube videos 😅
Pure CSS Only Portrait - Isla
Tags: codepen, css, html
Published: 2019-06-14 12:28:59

<p>I tried a still life so I thought I would try a portrait, next stop a landscape! </p>

<p>This seems to be a fun, new, pointless hobby of mine. I think it took roughly about 100 hours. </p>

<p>I think there is possibly too much CSS effects, browsers struggle with this one.</p>

{% codepen https://codepen.io/ivorjetski/pen/dBYWWZ %}
[AskDev] Is there any situation where I should not use --init when running a container?
Tags: askdev, docker
Published: 2019-06-14 12:54:27

---
title: [AskDev] Is there any situation where I should not use --init when running a container?
published: true
description: 
tags: AskDev, docker
---

Do you have the answer to my SO question:
https://stackoverflow.com/questions/56517016/is-there-any-situation-where-i-should-not-use-init-when-running-a-container
Gratitude in your life
Tags: discuss, productivity, lifestyle
Published: 2019-06-14 12:54:04

As a response to @Ryland G's "What gets you out of bed in the morning?" I want to know Do you practice gratitude? and if so  How do you practice gratitude?

This practice has been one of the most impactful practices in my life. I attribute this practice to helping reduce anxiety and increasing happiness. And as we know a happy person is a more productive person.

I practice by either writing or thinking about 3 things I'm grateful for in my life each day. The important thing I found through this practice is that you really need to feel emotion for each item.

<h2>How I divide the list of 3 </h2>
<ul>
<li>1 thing that you are grateful for in your life</li>
<li>1 small thing that you are grateful for (i.e. the wind blowing, the way the grass looks in the dew, etc)</li>
<li>1 thing about your self you are grateful for (i.e. your intelligence, your heart, because it never stopped beating, etc)</li>
</ul>

How do you practice? What are you grateful for?
Front End Dev Portfolio Projects
Tags: help, webdev
Published: 2019-06-14 12:53:44

---
title: Front End Dev Portfolio Projects
published: true
tags: help, webdev
---

So I’m not happy with my projects on my portfolio. I’m having “writer’s block” or creative block, whatever you wanna call it. I have spent days thinking of what would be suitable to build and help me stand out to recruiters and employers. 

I feel stuck in the mud. It's analysis paralysis at its finest. I find myself researching and hunting for ideas, but none of them resonate with me. 

I guess… I’m looking for suggestions/recommendations from more experienced front end devs on what has worked in for portfolio projects and what hasn’t?
Quick Paytm Integration using Golang.
Tags: github, go, webdev
Published: 2019-06-14 12:10:15

Are you Merchant and have your website in Golang?

Integrate paytm to your website for easy payment gateway. Luckly Paytm supports many platforms for integration and Golang is one of them.

If you want to know more about this project then check here: [Easy Paytm Integartion with Golang](https://github.com/Mindinventory/Golang-Paytm)

OR

Read about how we made this on our blog: [Blog- Paytm Integration using Golang](https://www.mindinventory.com/blog/paytm-integration-using-golang/)
Repl.it as one of Cloud9 IDE alternative
Tags: cloudide
Published: 2019-06-14 11:44:14

---
title: Repl.it as one of Cloud9 IDE alternative
published: true
tags: Cloud IDE,cloud IDE
canonical_url: https://kevinhq.com/repl-it-as-one-of-cloud9-ide-alternative/
cover_image: https://thepracticaldev.s3.amazonaws.com/i/pll74k1nrtqb4xb848gd.png
---

As the Cloud9.io will disable its service on this end of the month (June 30, 2019), I have no choice but to explore some alternative options to replace it. When I tweeted about this, there are two other Twitter accounts that asked me to try their cloud IDE services. One of them is Repl.it.

P.S. I am also on the process of migrating some clients project from C9.io to AWS Cloud9.

[Read More »Repl.it as one of Cloud9 IDE alternative](https://kevinhq.com/repl-it-as-one-of-cloud9-ide-alternative/)
Learning Gamification great examples!
Tags: quantumcomputing, quantumprogramming, gamification, tutorial
Published: 2019-06-14 10:25:57

An awesome gamified way of getting introduced to Quantum Programming

- (my own gameplay) https://www.youtube.com/watch?v=wuldCFijY0A&list=PLsedzcQz4wyWTKlkGEAOY8wD-iEXKZ2cc

checkout the sources if you wanna play by yourselves (it's from the IBM team but it's all lead by https://twitter.com/decodoku) so Kudos to him for the great work!

- (The android game) https://play.google.com/store/apps/details?id=com.ibm.research.helloquantum&hl=en

- (The command-line version) https://decodoku.com/hello-quantum-command-line
What were your best and worst onboarding experience?
Tags: discuss
Published: 2019-06-14 10:23:49

---
title: What were your best and worst onboarding experience?
published: true
description: 
tags: discuss
---

I am currently building a new onboarding experience for our new hires, and I thought I would love to know more about other people experiences.

What were your best or worst experiences with onboarding?

Any experience is welcome, it does not have to be a technical story :)
React Native WebView
Tags: reactnative, android, ios, javascript
Published: 2019-06-14 10:01:01

---
title: React Native WebView
published: true
description: React Native WebView
tags: #reactnative #android #ios #js
---

Source : <a href="https://www.skptricks.com/2019/06/react-native-webview.html" >React Native WebView </a>

React Native WebView is a component which is used to load web content or web page. The WebView component imports form core react-native library. Now, it is replaced from the built-in core react-native, and placed in react-native-webview library. WebView is the common component used in both android & iOS applications in react native to Open – Embed online website webpage using custom HTTP URL. Developer can modify the WebView settings according to their requirement.

NOTE : The React Native WebView recommended importing react-native-webview or react-native-community.

<img src="https://1.bp.blogspot.com/-T9Vblbr477c/XP81I6aTlHI/AAAAAAAAC-c/aK6gzyGnJWQNt7I0NwZswPEeZtSgDrtPgCLcBGAs/s400/react-native-webview.jpg" />

<a href="https://www.skptricks.com/2019/06/react-native-webview.html" >Click here to read more...</a>
React Native ScrollView Animated Header Example
Tags: reactnative, android, ios, javascript
Published: 2019-06-14 09:59:26

---
title: React Native ScrollView Animated Header Example
published: true
description: React Native ScrollView Animated Header Example
tags: #reactnative #android #ios #js
---

Source : <a href="https://www.skptricks.com/2019/06/react-native-scrollview-animated-header-example.html" >React Native ScrollView Animated Header Example </a>

This tutorial explains how to create animation header in scrollview in react native application. You have noticed in many apps that a fixed height header is positioned on the top of the screen and a scrolling list is used underneath the header. When you start to scroll the list, the header collapses with nice smooth animation from current height to fixed min height based on scrolling list’s scroll value and sticks on the top of the screen. Here you are going to see to similar animation effect in react native application.

<img src="https://1.bp.blogspot.com/-rZjhI8DZSLU/XP0L0eSLeSI/AAAAAAAAC-I/E05bU5-KU40kLwEVT9ogyNM4bryPlxjxQCLcBGAs/s400/react-native-scrollview-animated-header-example.jpg" />


<a href="https://www.skptricks.com/2019/06/react-native-scrollview-animated-header-example.html" > Click here to read more...</a>
Using Standard with VSCode
Tags: vscode, javascript
Published: 2019-06-14 05:13:38

---
title: Using Standard with VSCode
description: How to use Standard JS with VSCode (and not have weird formatting problems).
canonical_url: https://zellwk.com/blog/standard-with-vscode
tags: vscode, javascript
published: true
---

I use [Visual Studio Code][1] as my text editor. When I write JavaScript, I follow [JavaScript Standard Style][2].

There's an easy way to integrate Standard in VS Code—with the [vscode-standardjs][3] plugin. I made a [video][4] for this some time ago if you're interested in setting it up.

But, if you follow the instructions in the video (or on vscode-standardjs's readme file), you'll come to notice there's one small detail that needs to be ironed out.

Try writing a `function` the old way, and save it repeatedly. VS code will toggle between having and not having a space before the left-parenthesis of the function.

<figure><img src="https://zellwk.com/images/2019/vscode-standard/functions.gif" alt="VS code toggles between having and not having a space before '('."></figure>

You get the same problem when you write methods with the ES6 method shorthands:

<figure><img src="https://zellwk.com/images/2019/vscode-standard/methods.gif" alt="Same problem happens when you create methods with ES6 method shorthands."></figure>

There's a quick way to fix this issue.

What you need to do is set `javascript.format.enable` to `false`. This disables VS Code's default Javascript formatter (and lets vscode-standandjs does the formatting work).

So the minimum configuration you need to get Standard and VS Code to work together is:

```js
{
  // Prevents VS Code from formatting JavaScript with the default linter
  "javascript.format.enable": false,

  // Prevents VS Code linting JavaScript with the default linter
  "javascript.validate.enable": false,

  // Lints with Standard JS
  "standard.enable": true,

  // Format files with Standard whenever you save the file
  "standard.autoFixOnSave": true,

  // Files to validate with Standard JS
  "standard.validate": [
    "javascript",
    "javascriptreact"
  ]
}
```
[1]: https://code.visualstudio.com/
[2]: https://standardjs.com
[3]: https://marketplace.visualstudio.com/items?itemName=chenxsan.vscode-standardjs "vscode-standardjs plugin"
[4]: https://youtu.be/Hv8FgxJyI9Y

<hr>

Thanks for reading. This article was originally posted on [my blog](https://zellwk.com/blog/standard-with-vscode
). Sign up for [my newsletter](https://zellwk.com) if you want more articles to help you become a better frontend developer.
React native Create Custom Radio Button Component
Tags: reactnative, android, ios, javascript
Published: 2019-06-14 09:57:42

---
title: React native Create Custom Radio Button Component
published: true
description: React native Create Custom Radio Button Component
tags: #reactnative #android #ios #js
---

Source : <a href="https://www.skptricks.com/2019/06/react-native-create-custom-radio-button.html" >React native Create Custom Radio Button Component </a>

This tutorial explains how to create custom radio button component in react native application. A radio button or option button is a graphical control element that allows the user to choose only one of a predefined set of mutually exclusive options.Radio buttons are normally presented in radio groups (a collection of radio buttons describing a set of related options). Only one radio button in a group can be selected at the same time.

<img src="https://1.bp.blogspot.com/-Pe46MVfpN5I/XPyb58IhP8I/AAAAAAAAC9g/wxfgW4QwG38BertmWyFRIH88Ms1ibaZvACLcBGAs/s400/react-native-create-custom-radio-button.jpg" />

<a href="https://www.skptricks.com/2019/06/react-native-create-custom-radio-button.html" >Click here to read more... </a>
How to enable night mode on Dev.to
Tags: productivity, tutorial, discuss, beginners
Published: 2019-06-14 09:33:56

I saw many people trying to get Dev.to in night mode with extensions, code tricks and so on.

<figure>
  <img src="https://thepracticaldev.s3.amazonaws.com/i/swctvf6hb9zumn10n4gd.png" alt="my alt text"/>
  <figcaption>A preview of how Dev.to's night mode is looking</figcaption>
</figure>

The only thing you need to know in order to enable night mode in Dev.to is going to: **Your profile -> Settings -> Misc (left menu)** and changing the theme you want in the **Style Customization -> Site Theme** category.

<figure>
  <img src="https://thepracticaldev.s3.amazonaws.com/i/cqkj4umvs33rqb8gztvf.png" alt="my alt text"/>
  <figcaption>Here you can switch between several themes for Dev.to</figcaption>
</figure>

Click the **Submit** button and Enjoy! 🖖



Please note that the night mode on Dev.to is in public beta. If you want to contribute, you can go on the GitHub repo. 🤓

{% github thepracticaldev/dev.to %}
#PureCSS - Responsive Dwayne Johnson (The Rock) Portrait
Tags: codepen, css, purecss
Published: 2019-06-14 09:26:21

---
title: #PureCSS - Responsive Dwayne Johnson (The Rock) Portrait
published: true
tags: codepen,css,purecss
---

<p>Responsive Dwayne Johnson (The Rock) Portrait using CSS</p>

{% codepen https://codepen.io/AsyrafHussin/pen/WqQPRm %}
The Impact of UX
Published: 2019-06-14 09:22:37

<img src="https://thepracticaldev.s3.amazonaws.com/i/62st96wo1ciaibpln2pd.jpg">

This is YouTube, a video streaming owned by one of the biggest companies in the world, Google.

At first, you may not see anything wrong, but there is a big mistake, they did poorly in one of the most important design principles, <b>contrast</b>.

I lost the count of how many times I was browsing for new videos of that channel, and I ended up watching repeated videos. It is very frustrating when you spend 30 seconds watching a video to then realize that you have already watched it.

The colour of the progress bar is almost the same as the thumbnail background, mistakes like this create frustrating experiences for users. YouTube could fix this simply by adding borders to the progress bar or changing the progress bar colour when the thumbnail has a similar colour.

This is just a small example of how UX design can impact you and how hard it is to actually to offer an awesome flaw-free experience to users.
The Impact of UX
Tags: css, ux, userexperience, design
Published: 2019-06-14 09:19:44

This is YouTube, a video streaming owned by one of the biggest companies in the world, Google.

At first, you may not see anything wrong, but there is a big mistake, they did poorly in one of the most important design principles, contrast.

I lost the count of how many times I was browsing for new videos of that channel, and I ended up watching repeated videos. It is very frustrating when you spend 30 seconds watching a video to then realize that you have already watched it.

The colour of the progress bar is almost the same as the thumbnail background, mistakes like this create frustrating experiences for users. YouTube could fix this simply by adding borders to the progress bar or changing the progress bar colour when the thumbnail has a similar colour.

This is just a small example of how UX design can impact you and how hard it is to actually to offer an awesome flaw-free experience to users.
EP17: Product Management vs Project Management
Published: 2019-07-15 11:38:45

---
title: EP17: Product Management vs Project Management
published: true
tags: 
canonical_url: https://anchor.fm/code-cast-zm/episodes/EP17-Product-Management-vs-Project-Management-e4b0p0
---

In the news, we discuss WWDC and all the releases from Apples' much anticipated event, this includes, their $999 stand. We also discuss the Huawei ban and the ripple effect it has had on the industry. Will it be reversed? Will this be a turning point for innovation and the end of an over reliance on Google services? Send us your thoughts...

On this episode, we talk about building products and managing this process, Cynthia highlights her career progression and explains the differences between a Product Manager and a Project Manager...

We discuss the role of Human Centred Design in developing in any project. Our guest, Joebbrian, gives is insight into how much of a game changer it is in knowing what your potential users consider a great experience before you even build your solution.

Finally, Cynthia gives key recommendations on how startups and corporations can make use of Product Management principles to save money and build solutions that please users right off the bat...

**Recommendations and Links to key tools needed to improve your product development journey:**

- [**Jira**](https://www.atlassian.com/software/jira) **for our sprints and work breakdown structures **
- [**Slack**](https://slack.com/intl/en-zm/) **For internal updates on  a product development and can be connected to Jira **
- [**Basecamp**](https://basecamp.com/) **for communication with clients. This can also be connected to Jira via a plug in **
- [**Trello**](https://trello.com/en) **Boards**
- [**Meistertask**](https://www.meistertask.com/)

**Special Mention**

- [**Asana**](https://asana.com/)

Leave us a review on[<u><strong>iTunes</strong></u>](https://podcasts.apple.com/us/podcast/codecast-zambia/id1442693166?mt=2) to let us know what you think about the show.  

--- Send in a voice message: https://anchor.fm/code-cast-zm/message
Why do you choose Mac over other options?
Tags: mac, linux, windows
Published: 2019-06-14 07:16:34

---
title: Why do you choose Mac over other options?
published: true
description: Mac? Linux PC? Or maybe a Windows PC? Discussion about the pros and cons of each option.
tags: mac, linux, windows
---

I'm planning to buy a new laptop and I'm leaning towards a Linux PC, as I've been experimenting with working on Linux instead of MacOS for a few months already and I don't see any big advantage of MacOS that would be worth the price of a MacBook. 

There's also a Windows PC but I don't even consider it as I love to work on a similar environment that all of my servers are (UNIX*) and I don't work with .NET stuff.

So, I'm very curious: **why did you decide to choose your current workstation? Why is it a MacBook? Or why is it a Linux/Windows PC?**