teleren/devto huggingface dataset:
I'm the former tech lead for the NPM CLI, and I've been doing FOSS for 10+ years, Ask Me Anything!
Tags: ama, npm, javascript, opensource
Published: 2019-09-03 22:39:19

Hi! My name's Kat, and I've been an FOSS dev for over a decade. 

I had the opportunity of being, and eventually tech-leading, the NPM CLI team which I was a part of from 2015 until a couple of months ago. I'm the one who wrote things like `npx`, `npm ci`, and I helped design and add `package-lock.json` and much of its behavior to the CLI, and I was the main author of the ~40x+ speedup between `npm@4` and `npm@5` and later that made the CLI catch up (and often surpass) Yarn and PNPM in performance.

I also do a lot of Rust these days, and I'm currently on the NuGet client team at Microsoft, the package manager for the .NET ecosystem. I'm also on the core dev team for the [Entropic](https://github.com/entropic-dev/entropic) client, `ds`, trying to build a new, distributed package manager for the JavaScript community!

AMA!
Increase your browser count to improve productivity
Tags: browsers, ui, mac
Published: 2019-09-03 22:35:21

---
title: Increase your browser count to improve productivity
published: true
description: Software recommendation (Mac) for SaaS specific browsers
tags: browsers, UI, Mac
cover_image: https://thepracticaldev.s3.amazonaws.com/i/8d3e6sgqk9bw4k55j145.jpg
---

The proliferation of SaaS and other web-based applications has led to my routinely having multiple windows open with dozens of tabs. I'll try to limit task-specific tabs by closing them down when task switching but that's not always possible, especially if the task(s) I'm switching to are temporary and I need to keep my main task tabs accessible. But what's harder to manage are things like Jira, the odd PHPMyAdmin window, github pages and sites I use to consume audio in the background. These tabs tend to stay open permanently, and they can get lost in background windows or buried in a myriad of tiny tab icons. Finding the one I want in a hurry isn't always possible. I've used various browser plugins over the years to manage task specific sessions but task switching remains painful.

Last week I idly Googled for site specific browsers and what came back was [Fluid](https://fluidapp.com/). This might be old news to some, but it's absolutely been revolutionary for me. Jira now has its own application icon on the Command-tab overlay and Dock, along with Overcast, Workflowy and client specific PHPMyAdmin instances. This has freed up my main browser for tabs relating ONLY to the task I'm working on (side-tasks in separate windows notwithstanding), which eases the burden of task-switching considerably. It's also made the possibility of switching to a new main browser more likely, since I'm no longer invested so much in the ad-hoc window and tab formations of Chrome.
Angular + FontAwesome in Five Easy Steps
Tags: angular, fontawesome, beginners, css
Published: 2019-09-03 22:07:28

---
title: Angular + FontAwesome in Five Easy Steps
published: true
description: FontAwesome is the internet's most popular icon toolkit which has been redesigned and built from scratch. On top of this, features like icon font ligatures, an SVG framework, official NPM packages for popular frontend libraries like React, and access to a new CDN.
tags: angular, fontawesome, beginner, css 
canonical_url: https://www.carloscaballero.io/angular-fontawesome-in-only-5-steps/
series: five-easy-steps
cover_url: https://carloscaballero.io/content/images/2019/07/Peek-2019-07-02-15-29.gif
---

## Angular + FontAwesome in Five Easy Steps

A step-by-step angular tutorial

[FontAwesome](https://fontawesome.com/) is the internet’s most popular icon toolkit which has been redesigned and built from scratch. On top of this, features like icon font ligatures, an SVG framework, official NPM packages for popular frontend libraries like React, and access to a new CDN.

In this post, I am going to show you how to configure fontawesome to be used in angular in only 5–1 steps.

In these steps, we will configure fontawesome without using the specific [Angular package](https://github.com/FortAwesome/angular-fontawesome). In a future post, it will be configured using the official package, which is even simpler, and we will have fontawesome working with the same Angular ecosystem.

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

## Step 1 (or 0). Init your project

If you are thinking about using fontawesome in your angular project, you probably have an initialized project already. However, for this tutorial, let’s start with our project from scratch.

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

## Step 2. Install fontawesome

Install fontawesome.

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

## Step 3. Include fontawesome

There are several ways to include fontawesome in our project:

 1. Open angular.json and insert a new entry into the styles array:

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

 1. Open styles.scss and insert a new entry into the file:

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

## Step 4. Add fontawesome CSS Class

Open your template’s component and add the fontawesome CSS class in any of the html elements:

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

## Step 5. Run your app!

Run your app:

    ng serve

## More, More and More…

* [Fontawesome](https://github.com/FortAwesome/Font-Awesome)

The **GitHub** branch of this post is [https://github.com/Caballerog/angular-fontawesome-1](https://github.com/Caballerog/angular-fontawesome-1)



*****

*Originally published at [https://www.carloscaballero.io](https://www.carloscaballero.io/how-to-reach-your-goals-1000-github-stars-in-the-first-open-source-software/) on September 03, 2019.*
Top 5 DEV Comments from the Past Week
Tags: bestofdev
Published: 2019-09-03 21:49:43

---
title: Top 5 DEV Comments from the Past Week
published: true
description: Highlighting some of the best DEV comments from the past week.
tags: bestofdev
cover_image: https://res.cloudinary.com/practicaldev/image/fetch/s--7VrAA2ln--/c_imagga_scale,f_auto,fl_progressive,h_420,q_auto,w_1000/https://thepracticaldev.s3.amazonaws.com/i/qmb5wkoeywj06pd7p8ku.png
---

This is a weekly roundup of awesome DEV comments that you may have missed.  You are welcome and encouraged to boost posts and comments yourself using the **[#bestofdev](/t/bestofdev)** tag.

@humrochagf replied to **[The Programming Language That Changed My Life!](https://dev.to/lukegarrigan/the-programming-language-that-changed-my-life-2kc7)** with their own associations with different languages:
{% devcomment en5f %}

The **[Is this a €1.000,00 worth Node script?](https://dev.to/cobe_tech/is-this-1-000-00-worth-node-script-548l)** is a truly fun read.  @antontsvil talks about the importance of making sure you're truly following the requirements:
{% devcomment ekg0 %}

@andrewbrown had a great answer lined up in this discussion thread: **[If your manager told you to spend the next two weeks working on any "fun and fulfilling" project at work, what would you do?](https://dev.to/ben/if-your-manager-told-you-to-spend-the-next-two-weeks-working-on-any-fun-and-fulfilling-project-at-work-what-would-you-do-2cek)**.  I, for one, am looking forward to seeing this eventually become a reality:
{% devcomment eim2 %}

**[Is JavaScript the most confusing programming language?](https://dev.to/ilonacodes/is-javascript-the-most-confusing-programming-language-48be)**  Well, @curtisfenner has some additional thoughts and examples:
{% devcomment emh0 %}

In response to **[Apple wants to remove scripting languages from macOS](https://dev.to/stereobooster/apple-wants-to-remove-scripting-languages-2l0i)** @codemouse92 jumps in with some thoughts about the term itself and Apple's potential motivations:
{% devcomment en1o %}

See you next week for more great comments ✌
Three things from today - 9/3
Tags: devjournal, datascience, kubernetes
Published: 2019-09-03 21:39:54

#9/3/2019
###Happy Post-Labor day!

Hope everyone's Labor day was wonderful.


##1. Overwrite entrypoint for Non-interactive Docker container

Monkeying around with a Docker image today I found I needed to run some commands on a non-interactive container. 

Luckily I was able to find the exact command I needed to shell in and do my work. 

```
docker run -it --entrypoint /bin/bash <image>
```

##2. What the heck is R?

As I am finding myself being drug (dragged?) into the world of data science kicking and screaming i'm finding the world is wrought with acronyms, disparate and similar programming languages, and all sorts of other demons.

Today's demon is R.

R is a interpreted language (yay no compiling) which is used primary for statistical computing.

I was able to install the Deb for [https://www.rstudio.com/](RStudio) - which seems like the best IDE for the platform.

From there I was able to draw a pretty graph with some of the demos.

First, I pulled some data from here regarding the [Bulls in '93](https://basketball.realgm.com/nba/teams/Chicago-Bulls/4/Rosters/Regular/1993) 

I saved it as a CSV and was able to load it into RStudio and show a pretty Pie chart with the commands below:

```
#Read data from CSV
data = read.csv("bulls.csv")
#Let's see the data with just Player and points.
data.frame(x=data$Player,y=data$PTS)
#Pretty piechart!
pie(data$PTS,labels=data$Player)
```
![piechart](https://thepracticaldev.s3.amazonaws.com/i/ogcugq4e5sp69rpj6gkm.png)

Finally, data science can tell us who the best Bulls player is!

##3. [Kubefwd](https://github.com/txn2/kubefwd)

###"Bulk port forwarding Kubernetes services for local development."

Putting a pin in this project - this seems to be super handy for developing locally on minikube. 

It's benefit seems to be its simplicity. 

Only one command and you can forward all of the service ports associated with the specified namespace.

Instead of messing around with host entries of forwarding ports, you can let this do it for you.


See you all tomorrow!
My favorite CSS hack
Tags: css, webdev
Published: 2019-09-03 21:14:02

---
title: My favorite CSS hack
published: true
description: Using x-ray goggles to see boundaries of all layout elements.
tags: css, webdev, javascript, html
---

There is one CSS snippet that I have been copy-pasting for 5 years:


```css
* { background-color: rgba(255,0,0,.2); }
* * { background-color: rgba(0,255,0,.2); }
* * * { background-color: rgba(0,0,255,.2); }
* * * * { background-color: rgba(255,0,255,.2); }
* * * * * { background-color: rgba(0,255,255,.2); }
* * * * * * { background-color: rgba(255,255,0,.2); }
* * * * * * * { background-color: rgba(255,0,0,.2); }
* * * * * * * * { background-color: rgba(0,255,0,.2); }
* * * * * * * * * { background-color: rgba(0,0,255,.2); }

```

^ This is one of my favourite inventions.

Update 2020 October. I have since adopted a bit more elaborate snippet:

```css
* { outline: 1px solid rgba(255,0,0,.2); :hover { outline: 1px solid rgba(255,0,0,0.6); } }
* * { outline: 1px solid rgba(0,255,0,.2); :hover { outline: 1px solid rgba(0,255,0,0.6); } }
* * * { outline: 1px solid rgba(0,0,255,.2); :hover { outline: 1px solid rgba(0,0,255,0.6); } }
* * * * { outline: 1px solid rgba(255,0,255,.2); :hover { outline: 1px solid rgba(255,0,0,0.6); } }
* * * * * { outline: 1px solid rgba(0,255,255,.2); :hover { outline: 1px solid rgba(0,255,0,0.6); } }
* * * * * * { outline: 1px solid rgba(255,255,0,.2); :hover { outline: 1px solid rgba(0,0,255,0.6); } }
* * * * * * * { outline: 1px solid rgba(255,0,0,.2); :hover { outline: 1px solid rgba(255,0,0,0.6); } }
* * * * * * * * { outline: 1px solid rgba(0,255,0,.2); :hover { outline: 1px solid rgba(0,255,0,0.6); } }
* * * * * * * * * { outline: 1px solid rgba(0,0,255,.2); :hover { outline: 1px solid rgba(0,0,255,0.6); } }

```

I first shared it on Quora in 2014 ([What are the most interesting HTML/JS/DOM/CSS hacks that most web developers don't know about?](https://www.quora.com/What-are-the-most-interesting-HTML-JS-DOM-CSS-hacks-that-most-web-developers-dont-know-about/answer/Gajus-Kuizinas)) and I still get notifications of someone upvoting this answer daily.


But what does this horrible thing do?

It is meant to be used when you are working with layout, e.g.

![Without CSS hack](https://thepracticaldev.s3.amazonaws.com/i/ls79zc4kh298f4mwex2i.jpg)

The problem is that unless the element on the page has a solid background or it is a picture, you do not see how does it fit into the layout, e.g. most of the text nodes, pictures with transparency, etc.

With the above CSS applied you will see something along the lines of:

![With CSS hack](https://thepracticaldev.s3.amazonaws.com/i/1tmes0fhm81ddzoqnxmd.jpg)

Different depth of nodes will use different colour allowing you to see the size of each element on the page, their margin and their padding. Now you can easily identify inconsistencies.
Open tools for teaching
Tags: education, linux
Published: 2019-09-03 21:02:04

---
title: Open tools for teaching
published: true
description: An introduction on how to be more "open" when teaching
tags: education, linux, open source
---

September is the most important month for teachers. It's a decisive moment for them to organize (even though this should have been a previous work), meet their students and face new teaching challenges. This is the perfect opportunity for learning about open resources that could be helpful. 

I'm currently teaching Linux/security in exchange of self-defense classes. I really wanted to use a shared document without counting on Google and I decided to use a [**disroot** pad](https://pad.disroot.org/); we are getting along so well with it, it allows basic editing, comments and it's easy to use. 

If you are teaching any computer science subject, using gitlab is a really nice resource. I [had a teacher at university](https://dev.to/jj) that used this method and forced us to learn about testing, pull request and git. This is a real-life experience as well as handy, because you can take advantage of the _Kanban_ board as well. 

![](https://media1.giphy.com/media/VbnUQpnihPSIgIXuZv/giphy.gif?cid=790b7611312cd37a3b5c03c622ebbef72ade67b694f6f3b0&rid=giphy.gif)

For communicating and organizing, you can use [Matrix](https://matrix.org/) (chat) and maybe if you feel comfortable enough programming and deploying you can consider using [redmine](https://www.redmine.org/) as an students platform. 

For creating a public book list that your students can take a look at, I suggest [inventaire](https://inventaire.io/) and incipient, yet easy to use, webapp for making a library. 

![](https://media.giphy.com/media/7aPevwPAgsBkQ/giphy.gif)

Of course, using a Linux OS is a must, for that some of the most user friendly are the classics: Mint, Ubuntu... also Elementary if you feel more comfortable in a MacOS-like OS.  

I invite you to comment more examples that can be useful! T
Hello World
Tags: javascript, go, webdev, firstpost
Published: 2019-09-23 03:27:55

---
title: Hello World
published: true
tags: javascript, golang, web dev, first post
canonical_url: 
---

How exciting! This is my very first blog post (ever). Don’t try Googling it, because it’s definitely true.

You’re probably thinking, “what’s this blog about?“. To that, I’d like to respond with the following:

I’m primarily starting this blog so I can share the knowledge I’ve amassed over the last 4 years of professional web and software development. I’ve built distributed applications with both [Go](https://golang.org/) and [Node.js](https://nodejs.org/en/), complete desktop apps, warehouse management solutions, and more.

Over the last 4 years, I’ve spent my time at

1. Agencies
2. Full time freelancing
3. Running an E-Commerce business
4. Working full time as a lead developer for one company

Along with technical know-how, based on my success in the freelancing world, I have gained a lot of knowledge with respect to being successful in the shark-infested waters that is freelance web development and software engineering.

If you’re curious, I’m branching out and have rebuilt my entire website using [GatsbyJS](https://www.gatsbyjs.org/) and plan to do some pretty neat things once I get out of this boilerplate stage.

I hope you follow along on [Twitter](https://twitter.com/tracy_codes) and [Instagram](https://instagram.com/tracycodes) as I’ll be posting updates there when I push a new post live 🤓

As a parting _gif_t, I’ll leave you with this… an accurate representation of me last week while on vacation in another state after deploying a broken branch to production…

![Diet Coke and Mentos explosion](https://tracycodes.com/14ef62945dedbbf5ff58230f9c557f97/mess.gif)
[Video] Shell script using ADB (Android Debug Bridge) to automate a repetitive task
Tags: android, unix, script, devops
Published: 2019-09-03 20:42:36

Another relatively quick video to highlight the power of writing scripts to automate boring & repetitive processes.

I explain my process when it comes to tasks, that if I have found that I have done that same task, the same way, 3 times, then I will instead find a way to automate that task! In this video I use downloading my most recently recorded video file from my phone to my computer for editing, as usually its a bit of a fiddly, clicky, boring process that I discovered a computer can do much faster than I can.

I use a command line tool called ADB, Android Debug Bridge, to achieve this... Have a look...
(More reading below the Embedded Video)...

{% youtube 0lBTc4aE10I %}

Here is the contents of the script mentioned in the video (VidPull) that basically asks a connected Android device for the file name of the newest mp4, aka video file, that exists on the phone then it downloads it onto your machine... Easy Peesey!

{% gist https://gist.github.com/Kardelio/b3a25e22f5ef0fedaaf08c1a2d1c189d %}

Hopefully it all makes sense, if you want to use the script mentioned then don't forget to chmod the script so that your system can run it...

```
chmod +x vidpull
```
(where vidpull is the name of the script)

I am trying to grow my new YouTube channel too...

*cough*
Link: https://www.youtube.com/channel/UCMz9lmndR0BEqi70kM_ioyA
*cough*

So please give me as much feedback & criticism as possible so that I can improve and if you liked it or any other video that I have done please share it around, it would really help!

For any questions about ADB or even ideas for future videos please reach out on twitter https://twitter.com/ben_kadel

Thanks!
Deep Dive: Three Tips for Faster, Easier Video Delivery
Tags: uncategorized
Published: 2019-12-29 08:08:04

---
title: Deep Dive: Three Tips for Faster, Easier Video Delivery
published: true
date: 2019-09-03 20:35:21 UTC
tags: Uncategorized
canonical_url: https://dougsillars.com/2019/09/03/deep-dive-three-tips-for-faster-easier-video-delivery/
---

The best way to deliver video that starts up quickly and doesn’t stall is to make sure that the file downloads quickly. Since we cannot control the network our customers are using - this means we need to make the files smaller. In a previous post at Cloudinary, I described three techniques to reduce file … [Continue reading Deep Dive: Three Tips for Faster, Easier Video Delivery](https://dougsillars.com/2019/09/03/deep-dive-three-tips-for-faster-easier-video-delivery/)
Pushing Left, Like a Boss — Part 5.9 — Error Handling and Logging
Tags: programming, tutorial, beginners, security
Published: 2019-09-03 20:34:36

---
title: Pushing Left, Like a Boss — Part 5.9 — Error Handling and Logging
published: true
description: The 5th section of this series details various examples of secure coding.
series: Pushing Left Like a Boss
tags: programming, tutorial, beginners, security
---
###This series, and my blog, have moved! [Check it out](https://wehackpurple.com/g8tg)!

All errors should be caught and handled gracefully; there should never be a stack trace or database error on the screen. Not only so that we look like professionals, but so that attackers are not given extra information to use against us when creating their attacks. When errors happen, an application should never fail into an unknown state, it should always roll back any transaction it was performing, and ‘close’ anything it may have opened. Such a situation should also always be logged, so that if an incident were to arise incident responders would have something to work with when they investigate, and so that auditors can verify that the system is and has been working correctly.

![In Hong Kong, at “The Peak”.](https://thepracticaldev.s3.amazonaws.com/i/aync7rp6ql1wpvw054ps.jpeg)

###[Read the rest on my NEW blog!](https://wehackpurple.com/gglr)!
If you are working remotely, how do you keep yourself accountable, productive and efficient without external supervision?
Tags: productivity, remote, workfromhome, discuss
Published: 2019-09-03 20:27:20

I think the most difficult thing on remote working is to not get sidetracked. Which, lets be honest, is easy in a bad home environment (screaming kids anyone?) or if you dont have military-level discipline.

So what do you do to keep yourselves accountable, productive and efficient when "working and no one is watching"?
Back to static site
Tags: github, hexo, static, site
Published: 2019-09-03 20:18:45

---
title: Back to static site
published: true
description: 
tags: github,hexo,static,site
---

It's been a while since I wrote [Hello world, again](https://github.com/onmyway133/blog/issues/1), the ease of GitHub issue indeed motivates me to write more.

In the mean time I also wrote on https://medium.com/@onmyway133 and https://dev.to/onmyway133 and got some traction.

Then I started using GitHub pages again, with Jekyll and remote theme, it works great. But then I needed to manually link the GitHub issues to my page, that's just labor work.

The best combo is to have a GitHub page backed by GitHub issue. After a bit comparison between different static site generators, I actually tried them all, I chose Hexo because I simply like Javascript

- [How to use Hexo to deploy static site](https://github.com/onmyway133/blog/issues/392)
- [How to get all GitHub issues using GraphQL](https://github.com/onmyway133/blog/issues/393)

I use the simple [cactus](https://github.com/probberechts/hexo-theme-cactus) theme for now with local searched power by https://www.npmjs.com/package/hexo-generator-search.

Then I wrote a node.js script to mirror my GitHub issue to my page, with correct tags and updated date.

If you by any chance visit my new page https://onmyway133.github.io/, ohayou from me 👋