teleren/devto huggingface dataset:
Tracking Code Time ⏲️💻
Tags: developer, plugin, insights
Published: 2020-04-16 03:24:48

---
title: Tracking Code Time ⏲️💻
published: true
date: 2019-05-02 23:06:00 UTC
tags: developer,plugin,insights
canonical_url: https://2kabhishek.blogspot.com/2019/05/tracking-code-time.html
---

[![](https://lh3.googleusercontent.com/--eoFsNVqPnE/XZSBP28AIzI/AAAAAAAALVM/m_FNca8KWOs6LzwnyldOvyOumJn7CgX8gCLcBGAsYHQ/s640/1570013486163268-0.png)](https://lh3.googleusercontent.com/--eoFsNVqPnE/XZSBP28AIzI/AAAAAAAALVM/m_FNca8KWOs6LzwnyldOvyOumJn7CgX8gCLcBGAsYHQ/s1600/1570013486163268-0.png)
  

<u>If</u> you code professionally or as a hobby or are just learning to code, tracking code time can be very useful to you as it can unlock some valuable insights for you.

  

I recently came across one such tool and have a overview of its features here.

[Wakatime](http://wakatime.com/) is one of those <u>tools</u>. the help of a  you can easily logs all your coding activities like:

▪️which editor you are using   
▪️which project you are working on   
▪️which language you are using

All that data is presented very gracefully on the wakatime [dashboard](http://wakatime.com/dashboard).  
  

Another great feature of wakatime is goals where you can set goals for yourself and wakatime will keep track of those goals and send reminders via mail as well.  
This can help you if you are trying to learn a certain framework or library or language or maybe you are trying to learn a new editor like vim.  
  

Wakatime also has other features like shareable embeddables, leaderboards, integrations etc. This kind of gamifies programming and makes it a little more fun.  
  

Wakatime is is not the only tool for this but I find wakatime is unintrusive and a breeze to setup. Wakatime is available for most of the editors that are used today, you just need to install the extension or plugin and enter the API key when asked.
Underrated Articles on Dev.to last Week
Tags: top7, webdev, meta, bestofdev
Published: 2019-05-02 23:02:56

---
title: Underrated Articles on Dev.to last Week
published: true
description: 
tags: icymi, webdev, meta, bestofdev
cover_image: https://thepracticaldev.s3.amazonaws.com/i/5gl92wgm1bcqb6ltnhiv.png
series: Underrated Articles
 ---

Hey folks! I'm back with another installment of underrated posts of last week! Let's check them out and see what the community has been up to.
 
## 1. Leadership in Technology

Technology leadership teaches management and supervision of other technology workers. In this post, Warren writes four aspects that worked for him in balancing technology with leadership.
{% link https://dev.to/wparad/leadership-in-technology-the-four-pillars-of-growth-16j4 %}

## 2. Importance of Teambuilding Activities

In this article by  Trebound Teamlytics, the importance of team building activities is explained well. Team Building activities bring employees closer and one feels happy to go to work daily and team performance improves greatly.
{% link https://dev.to/treboundindia/why-are-team-building-activities-important-for-corporate-groups-2n5p %}

## 3. Node.js is Best

Undoubtedly, Node.js is truly a blessing for a developer. Reasons to choose Node JS for web development are well explained in this article.
{% link https://dev.to/techticsolution/13-reasons-why-node-js-is-the-best-framework-for-web-application-5b5g %}

**BTW, if you're looking for radically easy access to documentation of node modules you use, check out [MoDDoC](https://teamxenox.com/moddoc/)**

## 4. Mentor is Must

Everyone’s had some sort of a mentor in their life. Mentors help us achieve personal and professional success. In this article, Rebecca shares key points which are important to maintain a mentorship that is productive for both parties involved.
{% link https://dev.to/rfern_____/yup-you-need-a-mentor-5el %}

## 5. Testing a Progressive Web Application

In this article, Akshaypai writes introduction and primary characteristics of PWA, short for Progressive Web App. He also explains the process of testing a PWA.
{% link https://dev.to/akshaypai/tips-for-testing-a-progressive-web-application-545j %}

## 6. Improving Page Speed

Aidas explains how to make your website's primary content to be loaded and shown before other parts of the page, and how to improve webpage load speeds by implementing 1. Iframes 2. Ajax and 3. Improving request params.
{% link https://dev.to/djangotricks/improving-page-speed-with-incremental-loading-1ne4 %}
---
*That's all for now. These were my personal favorite underrated posts from last week. I hope you liked this post. Tell me in the comments about your favorite posts of last week that you think went underrated!* ❤️
Password Managers 101 🔑🌐
Tags: internet, password, security
Published: 2020-04-12 03:57:00

---
title: Password Managers 101 🔑🌐
published: true
date: 2019-05-02 22:45:00 UTC
tags: internet,password,security
canonical_url: http://2kabhishek.blogspot.com/2019/05/password-managers-101.html
series: Online Security
---

[![](https://lh3.googleusercontent.com/-go__N4r3eHo/XZSC5QNxplI/AAAAAAAALVY/Kin_KfXuabM_CF9ogKMKhirhNbgKAfLDACLcBGAsYHQ/s640/1570013904259101-0.png)](https://lh3.googleusercontent.com/-go__N4r3eHo/XZSC5QNxplI/AAAAAAAALVY/Kin_KfXuabM_CF9ogKMKhirhNbgKAfLDACLcBGAsYHQ/s1600/1570013904259101-0.png)

  

All of us have at least 10 or more accounts on the net nowadays and managing all those passwords can get tricky if not done correctly.

  

You can easily forget your password and if you don't you have a very easy to guess password, and that is a very terrible thing to do.  
You also have to remember other information like credit card informations, licence keys, secure notes etc.

  

A simple solution to those problems is a password manager.  
A password manager creates a database of your passwords, username and other details. Those passwords could then be easily synced across your devices and with things like autofill they make the whole online experience much more simpler to everyone without worrying about a gazillion passwords. You do have to remember the master password for your specific database and that's a necessary evil.  
  

A good option is [KeePass](https://keepass.info/) it has both online and offline capabilities and is completely free. KeePass is available on all the major platforms including Windows, Android, Linux, Mac OS, iOS, Firefox, Chrome etc.
MFA from command line
Tags: cli, mfa, bash
Published: 2020-08-11 11:15:44

---
title: MFA from command line
published: true
tags: CLI, MFA, bash
canonical_url: https://deeb.me/20190502/mfa-from-command-line
---

MFA, 2FA, 2 step validation, etc. are everywhere these days. And it’s a good thing.

Problem with using the phone to get the authentication code is that you need to have it handy at all times (when you want to login at least) and that you have to read the code then type it in (too many steps)

One possible alternative is to use the command line `oathtool`

Here’s my snippet, I added the following line in my `.bashrc`

```
function mfa () { oathtool --base32 --totp "$(cat ~/.mfa/$1.mfa)" | xclip -sel clip ;}
```

Some preparation work:

```
sudo apt install oathtool xclip<br>mkdir ~/.mfa<br>
```

If you want to use the same account with both a phone based MFA generator and the shell, set them up at the same time. Simply use the generated string for setting up the account in the [Google Authenticator](https://play.google.com/store/apps/details?id=com.google.android.apps.authenticator2) (as an example) and the add it to the `~/.mfa/account_name.mfa`

The use of `xclip` automatically copies the 6 digit authentication code to the clipboard. You can go ahead and paste it.

The above setup works in Ubuntu. Didn’t try it on other systems.
Why I'm Converting my Blog and Portfolio to Gatsby
Tags: gatsby, blogging, portfolios, redesign
Published: 2019-05-02 22:07:59

---
title: Why I'm Converting my Blog and Portfolio to Gatsby
published: true
description: "I just published my new sites less than 2 weeks ago. Yeah, we devs and designers tend to redo our sites a lot, but isn't this a bit excessive?"
tags: gatsby, blogging, portfolios, redesign
cover_image: https://firebasestorage.googleapis.com/v0/b/ashleemboyer-2018.appspot.com/o/images%2Froads.jpg?alt=media&token=4750e655-f53f-4a1c-8462-5988d542108e
canonical_url: https://ashleemboyer.com/why-i-m-converting-my-blog-and-portfolio-to-gatsby
---

*You can also find this post [on my personal blog](https://ashleemboyer.com/why-i-m-converting-my-blog-and-portfolio-to-gatsby).*

Why, yes, I would love to be done with the set up of my sites so I could focus more on the side projects I want to post on my portfolio.

*Didn't you* just *[post about perfectionism](https://ashleemboyer.com/neither-you-nor-your-work-has-to-be-perfect) yesterday?*

Sure did! But this is different. Software will forever be a road with many twists, turns, and hills. 😉

In all seriousness, I hadn't tried Gatsby out before publishing the current Angular version of my sites. I finally gave in over this past weekend and decided to give it a go. It was SO. FUN. **First of all**, their documentation is excellent. They explain things well enough that people with any level of coding experience can work out what to do.

**Second of all**, the framework is just incredibly easy to use. Make some files in a well-named directory, and you have some magical pages. You can make pages *dynamically* too, which is one of the reasons I'm switching.

**Finally**, it's just too easy to do everything you want using their plugins. For example, with the [`gatsby-plugin-react-helmet`](https://www.gatsbyjs.org/packages/gatsby-plugin-react-helmet) plugin, you can handle SEO *and* Open Graph metadata dynamically. Which means you can have cool Twitter cards with images when you share your posts in a tweet. Which blows my mind! *(Is this possible in Angular? Too late for me, but maybe someone else could use that knowledge.)*

And let's be honest, I just want to play around with Gatsby some more. You see a ton of people who use it for their blog sites, so I want to take that information and use it to challenge myself to make something that'll really stand out. 💪🏻

So, what about you? Do you use Gatsby for your sites, or do you plan to? I'd love to hear about your projects in the comments or [on Twitter](https://twitter.com/ashleemboyer).

---

Did you know I have a newsletter? 📬

If you want to get notified when I publish new blog posts or make major project announcements, head over to [https://ashleemboyer.com/newsletter](https://ashleemboyer.com/newsletter).

---

*[Image](https://unsplash.com/photos/dpzp54GkIGI) by [Arnaud STECKLE](https://unsplash.com/@wdtrends) on [Unsplash](unsplash.com).*
Two dimensional array search
Tags: javascript
Published: 2019-05-02 20:45:39

---
title: Two dimensional array search
published: true
description: Searching a two-dimensional array with functional programming
tags: javascript
---
A friend posed a quandary. What's the cleanest way of searching a two-dimensional array in JavaScript for an element and returning the index of its containing array?

That is, return `2` if asked to search the following for `8`.
```javascript
const haystack = [
 [1,2,3],
 [4,5,6],
 [7,8,9]
];
const search = 8;
```

My first attempt.

```javascript
haystack.indexOf(haystack.find(arr => arr.includes(search)));
<- 2
```

Then, after learning of `findIndex`.

```javascript
haystack.findIndex(arr => arr.includes(search));
<- 2
```

What if you need both the column and row in the 2-D array? The following duplicates part of the search, so it's not optimal.

```javascript
const row = haystack.findIndex(row => row.includes(search));
const col = haystack[row].indexOf(search);
```

Maybe the function body inside `findIndex` can use `indexOf` instead and be tricked into storing its value while still returning `true` or `false` to keep from disrupting the outer `findIndex`, though at that point is it still functional programming and is it worth it over using traditional loops?
Auto Layout with different screen sizes
Tags: ios, swift, autolayout, scale
Published: 2019-05-02 19:40:37

---
title: Auto Layout with different screen sizes
published: true
description: 
tags: ios,swift,autolayout,scale
---

Auto Layout is awesome. Just declare the constraints and the views are resized accordingly to their parent 's `bounds` changes. But sometimes it does not look good, because we have fixed values for padding, width, height, and even fixed font size.

Read more [How to make Auto Layout more convenient in iOS](https://medium.com/flawless-app-stories/how-to-make-auto-layout-more-convenient-in-ios-df3b42fed37f)

This can be solved by some degree using `Size Class`. The idea of `size class` is that we have many sets of constraints, and based on the device traits, we enabled some of them. This is more convenient to do in Storyboard (although very hard to reason about), but if we're doing in code (my preferred way), then it is a lot of code. And a lot of code means a lot of bugs.

If you take a look at [iOSRes](http://iosres.com/), we see the ratio `16:9` (`height:width`)
- iPhone SE (320 x 568): 1.775
- iPhone 6 (375 x 667): 1.778
- iPhone 6+ (414 x 736): 1.778

They mostly have the same ratio. So we can have a simple approach, that scale elements based on ratio. Given the fact that the designer usually designs for `iPhone 6 size`, we can make that a base.

In this approach, the content will scale up or down depending on its ratio. You may argue that the idea of bigger phone is to display more, not to show the same content bigger. You may be right, in that case you need to create different constraints and different UIs. But if you want simple solutions that work, this is one of them

This is the technique I used when doing `Windows Phone development`, but it applies to many platforms as well

### Calculate the ratio

```swift
class Device {
  // Base width in point, use iPhone 6
  static let base: CGFloat = 375

  static var ratio: CGFloat {
    return UIScreen.main.bounds.width / base
  }
}
```

### Extension to make it convenient
We can have a computed property called `adjusted` that adjusts the size based on the ratio

```swift
extension CGFloat {

  var adjusted: CGFloat {
    return self * Device.ratio
  }
}

extension Double {

  var adjusted: CGFloat {
    return CGFloat(self) * Device.ratio
  }
}

extension Int {

  var adjusted: CGFloat {
    return CGFloat(self) * Device.ratio
  }
}

```

### Use the ratio
You can adjust as much as you want

```
label.font = UIFont.systemFont(ofSize: 23.adjusted)

phoneTextField.leftAnchor.constraint(equalTo: container.leftAnchor, constant: 30.adjusted),
phoneTextField.rightAnchor.constraint(equalTo: container.rightAnchor, constant: -30.adjusted),

imageView.widthAnchor.constraint(equalToConstant: 80.adjusted), imageView.heightAnchor.constraint(equalToConstant: 90.adjusted),
```


Original post https://github.com/onmyway133/blog/issues/35
React Native: Epic Day/Night Calculator
Tags: reactnative, react, calculator, code
Published: 2019-05-02 19:14:44

---
title: React Native: Epic Day/Night Calculator
published: true
description: Modern Calculator with Day/Night Switch help stand out in dark and light area
tags: react-native, react, calculator, code
cover_image: https://camo.githubusercontent.com/516d59496991eaabb6136142abe42eaf8b9c5795/68747470733a2f2f6f6c697665722d676f6d65732e6769746875622e696f2f696d616765732f676974687562253230696d616765732f63616c63756c61746f722d696e7374616772612e706e67
---


Design Overview: https://www.behance.net/gallery/75906275/Calculator-App-Design-Code
Github Link: https://github.com/oliver-gomes/react-native-calculator.
Adding the missing features to GitHub Pull Requests
Tags: github, chrome
Published: 2019-05-02 18:50:02

---
title: Adding the missing features to GitHub Pull Requests
published: true
description: I love GitHub, but their interface for code reviews and pull requests needs some work. So I created something to solve this.
tags: github, chrome
---

I love GitHub, but their interface for code reviews and pull requests needs some work. So instead of just complaining, here’s a Chrome Extension that adds a file tree view to pull requests as well as sticky file headers:

<img src="https://thepracticaldev.s3.amazonaws.com/i/m1xf246gcw08441gfgmq.png" alt="Chrome extension">

“Better Pull Request for GitHub” extension on the Chrome Web Store
The code is open source and hosted on... GitHub: https://github.com/berzniz/github_pr_tree.

You can also install it from the Chrome Store:
https://chrome.google.com/webstore/detail/better-pull-request-for-g/nfhdjopbhlggibjlimhdbogflgmbiahc

So far 2,000 developers are using it daily and many have contributed their free time for fixing issues and adding additional features.

Coding is fun.
RAuth0 - Our Internal R Package
Tags: r, datascience, datawarehouse, data
Published: 2019-05-02 18:14:24

---
title: RAuth0 - Our Internal R Package
published: true
description: Learn about the R package we use internally at Auth0 for ETL / Data analysis.
tags: #r #datascience #datawarehouse #data
canonical_url: https://auth0.com/blog/rauth0-internal-r-package-open-source/
---

Learn about the R package we use internally at Auth0 for ETL / Data analysis. How we use it for data warehousing, analyzing data and making it available for other teams.

[Read on 📊](https://auth0.com/blog/rauth0-internal-r-package-open-source/?utm_source=dev&utm_medium=sc&utm_campaign=rauth0_intopensource)

![RAuth0 - Our internal R package](https://thepracticaldev.s3.amazonaws.com/i/6p12m0p2c8kxtdel5hyv.png)
Favorite Rails 6 Small Changes/Features
Tags: rails, ruby, discuss
Published: 2019-05-02 17:54:44

---
title: Favorite Rails 6 Small Changes/Features
published: true
description: Discuss upcoming small changes and feature to the Rails framework with the release of Rails 6.
tags: rails, ruby, discuss
---

With Rails 6 on the horizon, we all know the big features and changes to the framework, but what about the small features and changes.

I'm looking forward to these additions.

`rails db:system:change` to change the database of the application.

`rails db:prepare` to create a database if it doesn't exist, and run its migrations.

What small features and changes are you looking forward to?
React Native Create Custom Circle Shape View
Tags: reactnative, android, ios, javascript
Published: 2019-05-02 17:46:06

---
title: React Native Create Custom Circle Shape View
published: true
description: React Native Create Custom Circle Shape View
tags: #reactnative #android #ios #js
---

Source : <a href="https://www.skptricks.com/2019/05/react-native-create-custom-circle-shape-view.html" > React Native Create Custom Circle Shape View</a>

This tutorial explains how to create custom circle shape view in react native application. A circle is a simple closed shape. It is the set of all points in a plane that are at a given distance from a given point, the centre; equivalently it is the curve traced out by a point that moves in a plane so that its distance from a given point is constant. Lets follow the below steps and build more understanding.

<img src="https://3.bp.blogspot.com/-mQksYfoKFG8/XMnKc445R8I/AAAAAAAACxQ/VNJbS7aEHrgPvn474hiQZ9Ght_68LDznACLcBGAs/s400/circle.jpg" />


<a href="https://www.skptricks.com/2019/05/react-native-create-custom-circle-shape-view.html" > Continue reading...</a>
Google Maps - Interactive Maps in React (Video)
Tags: googlemaps, react, maps, javascript
Published: 2019-05-02 17:40:30

Source code can be found here: [https://github.com/leighhalliday/google-maps-react-demo](https://github.com/leighhalliday/google-maps-react-demo)

{% youtube Pf7g32CwX_s %}
Horrible Snippets - Check the string
Tags: horriblesnippets, arrays, javascript
Published: 2019-05-02 17:13:20

---
title: Horrible Snippets - Check the string
published: true
description: Let's check a string
tags: horrible snippets, arrays, javascript
---

**Usecase**
Let's say you're looking to implement a darklaunch feature, you have some options, you can pass a bunch of env vars(RUN_EVENT_1=true, etc.) OR you can just pass a `DARK_LAUNCH` flag with some comma separated vars.  

```javascript
const stringydingy = 'foo,bar,baz';

stringydingy.split(',').includes('foo');

if(stringydingy.split(',').includes('foo')) {
  runDarkLaunchDotCalm();
}
```

Play with it, try it out in your project!  Give me feedback on how it can be improved!
How not to architect your project? 
Tags: architect, discuss, productivity
Published: 2019-05-02 17:06:09

---
title: How not to architect your project? 
published: true
description:  How not to architect your project.Things that you need to be cautioned on.
tags:  Architect, discuss, productivity
---

I have been working with some of the most successful products in the Saas Industry. Here are some of the things I used to say a big NOOO ! Probably you must also do the same.  

#Wrong framework

Know your product and usecase and choose the correct framework. Choosing GoLang for web app development and ruby for high performance code is wrong . Have a good knowledge on all the frameworks and languages, choose wisely. There is no going back on this.
I see people choose Java for webapps because thier employess only knows Java, but inreality Java is no good for webapps.

#Using V1.0

In the year 2013–2014, When asked people not to use angular they used to mock at me. After a couple of years Google ended it support. Simple Thumb rule is dont use any new frameworks/tools/standards till thier version 2.0/ atleast stable for 3 years. First few stable versions also will be having architect failures most of the times. So use some standard approach. 

#Hyper Scalabilty 

 Yes your read it right. People tend to perfect thier product to scale millions of request per second, but in reality it wont happen soon! Customer aquestation is a gradual process and it takes time to reach potential users. Even a killer product will take couple of years to pick up first few thousand active customers.So all the scalability efforts put during the initial products are worthless. It's like you made the yummest recipe but no one is there is take it.

#Nanoservice(Heavy microservices)

Writing eveything as Microservice is the one of the things that usually kills the product soon. Microservices is only recommended if your product has a mamoth code base, which basically needs to be splitted to microservice ,and your are having resources to maintain. Starting the product with everything as microservice service which is a overkill. My recommendation is to start as modular monolithic and move to microservice if necessary. 

#Refactoring

Refactoring the whole code base is wrong. If there was some wrong decision taken in initial days, do refactor as much early as possible. Refactoring too much is a bug prone , vague and non productive job. Customers dont care what is behind they only see if things works. These kinds of problems can be solved by having a good Architect. 

#New Inhouse solutions

We cannot solve all the problems , even we have resources and talent. If there are some ready made solution, Please use it. It is not because of saving money. It is because existing solution usually takes all the learning from the community or customer. I saw many projects used thier inhouse search service instead of elasticsearch or Solr, With in couple of years they failed and return back to the open source solution. 

The above are the major things I used to say a big no while designing new product. 

Please add your suggestions also below.
Dope open source stacks.
Tags: opensource, githunt, startup
Published: 2019-05-02 16:51:40

Are you open source stack hunter like me or just want to know what are trending open source stack out there. I have created a repo which has dope open source stack list based on company who started that project. 
Feel free to fork and add any interesting and dope stack you know out there on the web.
[https://github.com/tushariscoolster/dope-stacks](https://github.com/tushariscoolster/dope-stacks)