teleren/devto huggingface dataset:
code-block v0.1 web component released
Published: 2019-10-30 00:20:03

---
title: code-block v0.1 web component released
published: true
date: 2019-04-17 04:47:30 UTC
tags: 
canonical_url: https://justinribeiro.com/chronicle/2019/04/16/code-block-v0.1-web-component-released/
---

Over the last couple of months I’ve gotten a few emails asking how exactly I make my code samples on this blog work. In the past that would have been a harder question to answer (my original web component for this was less than ideal) but with my recent spring updates, I thought it would be nice to break out that very feature.

Announcing `<code-block>`, a [LitElement](https://lit-element.polymer-project.org/)-based web component that utilizes [Prism.js](https://prismjs.com/).

![pre in action](https://storage.googleapis.com/jdr-public-imgs/blog/20190416-code-block-custom.jpg)

It’s available on [npm](https://www.npmjs.com/package/@justinribeiro/pre):

```
$ npm i @justinribeiro/pre $ yarn add @justinribeiro/pre
```

Or you can grab it from the [repo](https://github.com/justinribeiro/pre):

```
$ git clone git@github.com:justinribeiro/pre.git
```

From there, just write code in the element like any ‘ol html element.

```
\<pre language="fortran" theme="/node\_modules/prismjs/themes/prism-okaidia.css"\> program HelloWorld write (\*,\*) 'Hello, world!' ! This is an inline comment end program HelloWorld \</pre\>
```

Like the version I run on this blog, this component uses dynamic language imports that way you don’t have to carry additional weight in your bundle (load only what you need). The v0.1.0 version also includes support for themes, so you can just pass it the path of a theme CSS file and it’ll do the rest.

The biggest hurdle with this setup is that you _have_ to make sure you take the `/node_modules/prismjs/**`, otherwise the loading doesn’t quite work correctly. I considered alternative approaches, but mostly it had me duplicating large portions of Prism’s language support and that seemed very ill-advised.

In the future I’d like to see if I can enable Prism’s vast plugin support. In the mean time, grab it, embed some code somewhere, web component style.
TweatCreate - A Twitter Bot For Creating Social Art
Tags: discuss, showdev, php, webdev
Published: 2019-04-17 03:25:07

---
title: TweatCreate - A Twitter Bot For Creating Social Art
published: true
description: 
tags: discuss, showdev, php, webdev
---

So I was going through some old files of mine and found a project I had created about 5 years ago. I called it TweetCreate.

The idea behind this project was to create a Twitter Bot that would monitor incoming tweets for commands to add a pixel to the an art canvas. The canvas was a 25x25 square image in which you would be able to add your own Pixel by specifying a X,Y coordinate and a hex color.

You can see some of the actual tweets if you visit the old twitter page https://twitter.com/tweetcreate.

I was thinking about resurrecting this project for fun! 

Anybody interested?
Should the ecommerce layer be separated from the CMS?
Tags: help
Published: 2019-04-17 02:09:47

---
title: Should the ecommerce layer be separated from the CMS?
published: true
tags: help
---

Hey guys, got another question. So I'm trying to decide what tools I'm going to use in building an ecommerce site for a client. Currently I've decided to build it using Gatsby.js and Shopify for product creation/inventory and all the ecommerce stuff. I also plan on using Netlify CMS for content management on the site(blog posts, location info etc.) 

I had initially wanted to use Netlify CMS to handle the product creation as well, but I couldn't figure out how to do that and incorporate inventory management. I would be able to create the products through the CMS sure, but how would I update the product count if items get bought or it goes out of stock? I read a tutorial on Contentful where they use Contentful for product creation and Commerce Layer for inventory management. The app then makes api calls to Commerce Layer to update product counts. Is this a normal pattern or is it preferred/easier to just manage product creation and inventory management in the same place?
glitch-localdev – I made a node.js app! I am future!
Tags: npm, node, javascript, glitch
Published: 2019-05-10 02:37:55

---
title: glitch-localdev – I made a node.js app! I am future!
published: true
tags: npm, node, javascript, glitch
canonical_url: https://yiddish.ninja/glitch-localdev-i-made-a-node-js-app-i-am-future/
---

!["80s retro futurey image"](https://thepracticaldev.s3.amazonaws.com/i/bbnpj501oqxejnzokcm9.jpg)

I made a node app recertly, called [glitch-localdev](https://www.npmjs.com/package/glitch-localdev). It helps you take the app you’re developing on [Glitch](https://glitch.com), clone it to your favorite machine to develop on using your favorite editor, and helps keep your machine and Glitch in sync. And if you’re using [Visual Studio Code](https://code.visualstudio.com/), it’ll even set up auto-saving on your project for you.

It’s easy to set up. Install with `npm install -g glitch-localdev`.

Then just navigate to an empty directory in a command prompt or terminal window, and type `glitch-localdev`. It’ll ask you some configuration questions (they’re explained in the [glitch-localdev readme](https://www.npmjs.com/package/glitch-localdev)), and boom, it pulls down the repository and starts keeping an eye on it, committing your saved changes back to Glitch every so often.

It saves your config. So when you come back to it, just run `glitch-localdev` in the directory to launch the watcher function to keep an eye out for changes and periodically commit them while you code.

Have fun and feel free to file issues at the [GitHub repo](https://github.com/YiddishNinja/glitch-localdev) for bugs or suggestions
Pushing Left, Like a Boss! -- Part 3: Secure Design
Tags: design, appsec, beginners, security
Published: 2019-04-17 01:50:41

---
title: Pushing Left, Like a Boss! -- Part 3: Secure Design
published: true
description: Part 3 of the "Pushing Left, Like a Boss" series discusses secure design concepts for software development projects.
series: Pushing Left Like a Boss
tags: design, appsec, beginners, security
---

###This series, and my blog, have moved! [Check it out](pushing-left-like-a-boss-part-3-secure-design/)!

In the previous article in this series we discussed security requirements. When making any product, requirements are a must, and ensuring you have security built into your requirements from the beginning is the first step to ensure your final product will be of high quality. In this article we will discuss the next phase of the system development life cycle: Design.

As you recall, the system development life cycle generally looks like the image below:

![The System Development Life Cycle - SDLC](https://thepracticaldev.s3.amazonaws.com/i/y02hdgzvifmhra9nppqq.png)

####System Development Life Cycle (SDLC)

When designing software applications, software architects not only need to worry about what the customer has asked for (business requirements), functional requirements (user requirements, scheduling, system requirements), but also non-functional requirements that are often taken for granted, such as usability, quality, and of course, security.

###[Read the rest on my NEW blog!](https://wehackpurple.com/pushing-left-like-a-boss-part-3-secure-design/)
Go Lang Installation
Tags: cloud, go
Published: 2019-04-22 17:03:51

---
title: Go Lang Installation
published: true
tags: cloud,golang
canonical_url: https://chkrishnatej.com/blog/install-go-lang
---

## Prerequisutes

* * *

`go` supports a wide range of operating systems. There are two ways `go` can be installed on the system.

- Binaries
- Building it from the source

I am installing it on **MacBook Pro with macOS Mojave v10.14.4** for this tutorial using the Mac binaries.

You could get the download link [here](https://golang.org/dl/)

![golang download page](https://chkrishnatej.com/images/golang/download_page.png)

As shown in the image above, select the relevant package accoridng to the operating system. I have downloaded the one for `Apple macOS`.

- Download file  
 ![golang download page](https://chkrishnatej.com/images/golang/download_file.png)

## Installation

* * *

The installation is a fairly straight. You could go with the defaults as shown below.

![golang installation step1](https://chkrishnatej.com/images/golang/installation_step_1.png)  
 ![golang installation step2](https://chkrishnatej.com/images/golang/installation_step_2.png)  
 ![golang installation step3](https://chkrishnatej.com/images/golang/installation_step_3.png)  
 ![golang installation success](https://chkrishnatej.com/images/golang/installation_success.png)

## Verification

* * *

To verify if the `go` has been successfully, it can be verified from the command line

You could use the following commands in the terminal to verfiy.

```
>>> which go # Returns path where go is installed/usr/local/go/bin/go>>> go version # Returns the version of the go installedgo version go1.12.4 darwin/amd64
```

![golang installation success verification](https://chkrishnatej.com/images/golang/verify_installation.png)

If the terminal shows up as the above, then `go` lang has been successfully installed.

## Setting up workspace

* * *

`Go` follows a different approach to manage the code which requires to setup the project workspace. This means all the `go` projects should be developed and maintained in the defined workspace.

### Steps to setup the workspace

* * *

- 

Open the shell config which is locate in the `HOME` directory.      
**NOTE:**

  - `bash_profile` or `.bashrc` for _BASH_
  - `.zshrc` for _Oh my Zsh!_
- 

Add the following variables to shell config

```
>>> export GOPATH=$HOME/<go-workspace> # <go-workspace> is a filler. Fill it with proper path>>> export PATH=$PATH:$GOPATH/bin>>> export GOROOT=/usr/local/opt/go/libexec>>> export PATH=$PATH:$GOROOT/bin
```

  - `$GOPATH/src` : Go Projects source code
  - `$GOPATH/pkg` : Contains imported packages
  - `$GOPATH/bin` : The compiled binaries home

This completes the setup of `go`. And system is ready for some **code**.
Hidden World Of Podcasts 🎙️🎧
Tags: learning, podcast, developer
Published: 2020-05-16 10:23:18

---
title: Hidden World Of Podcasts 🎙️🎧
published: true
date: 2019-04-17 00:58:00 UTC
tags: learning,podcast,developer
canonical_url: https://2kabhishek.blogspot.com/2019/04/hidden-world-of-podcasts.html
---

[![](https://lh3.googleusercontent.com/-VnAfm4p4T3g/XZSH9O9jUdI/AAAAAAAALWI/Aru43Bkc7X0-J2ARQamlbm61lg8czjMXgCLcBGAsYHQ/s640/1570015207901611-0.png)](https://lh3.googleusercontent.com/-VnAfm4p4T3g/XZSH9O9jUdI/AAAAAAAALWI/Aru43Bkc7X0-J2ARQamlbm61lg8czjMXgCLcBGAsYHQ/s1600/1570015207901611-0.png)
  

What do you have playing on your earphones while traveling, driving  or doing something less mentally taxing? I'm sure most of your answers will be music and I do love my music.  
  
But there's another form of audio only media out there that can take your ears on a joyride - " **Podcasts**"

Yes, podcasts a very powerful form of media which is often under explored. Some of you might have never listened to one and that's relatable since I myself discovered podcasts a short time ago. Podcasts are not a very popular form of media around the world.  
  

**So... What are podcasts?**

Podcasts are audio only form of media similar to shows on a radio, but unlike radio shows, podcasts are distributed via the internet.  
Podcasts cover topics on almost everything from philosophy to sports, technology to spirituality, news to comedy and everything in between. If you have a niche hobby there's a pretty good chance that you'll find a podcast for that out there.  
  

**How do I try one?**

There are podcast players available for all major platforms. Just search for "_Podcast player_" and you will find many good ones.  
  
I personally listen to podcasts while on the go and on my phone and I have tried several different apps, currently I'm using Castbox as my player, it has all the features that you would expect from a podcast player but also has community section and featured editor's choice podcasts.  
  

Here's my personal list of [Podcast Subscriptions](https://gist.github.com/2KAbhishek/2abf301bdb60c972457e5109fc99ed1c), you can import it into your podcast player if you want. Hopefully with this post, I have encouraged you enough to go out and give podcasts a try.
My Keyboard and Mouse
Tags: keyboard, mouse, discuss, gear
Published: 2019-04-17 00:44:17

---
title: My Keyboard and Mouse
published: true
description: Stuff I use to type, what about you?
tags: keyboard, mouse, discussion, gear
cover_image: https://thepracticaldev.s3.amazonaws.com/i/hmy2bwtwb52rld1md5ta.jpg
---

Hey, so I recently got a new keyboard and mouse, one I've wanted for a while since seeing Google's new Pixel Slate tablet and it's nice _round_ keys. What I've got now is the Logitech K380, and a Logitech M720 mouse to go along with it.
I love it so much with the rounded keys, I even recreated it with CSS.

{% codepen https://codepen.io/GRA0007/pen/wZeJzY %}

What are your thoughts on rounded keys? What keyboard/mouse are you currently using? Let us know below!
Can I host a client site on my github?
Tags: help
Published: 2019-04-16 23:30:56

---
title: Can I host a client site on my github?
published: true
tags: help
---


Hey everyone. I could use a little advice on something. I'm taking on a project for a client, building them an ecommerce website. I plan on using gatsby.js to build it with netlify cms. Netlify uses your github repo as the "backend" to the app and for continuous deployment. Is it acceptable to have a client's source on my github? Should I create a separate github account to use for their repo? Not really sure how to navigate this as it's my first time taking on such a job. Any advice would be appreciated, thank you!
Creating Multiple Model Objects at Once
Tags: laravel, eloquent
Published: 2019-04-16 23:00:57

---
title: Creating Multiple Model Objects at Once
published: true
description: Using the `CreateMany()` method for fun a profit
tags: #laravel #eloquent
---

*Disclaimer - I'm still fairly new to Laravel, so I'll readily admit that there may be other/better ways of doing this, or that this is already well known.  But a bit of Googling seemed to indicate otherwise*

So today I was presented with a bit of a challenge.  I have a parent object that I'll creatively call "App\Parent" which has a bunch of children I'll call, um, "App\Child"?

Yeah, that works.

So the children are basically just a bunch of filenames, and the POST request already has them put into an array, so I'd like to just stick that array in some kind of `Model::Create()` method, but `Create()` seems to prefer just one set of attributes, thank you very much.

Some looking around found a solution in using the `Insert()` method.  This would allow me to insert as many records as I wanted but apparently wouldn't set the timestamps.  And I don't want to do that manually.  Or rather, I don't want to waste the server's time doing it manually.

And that's when I stumbled onto the solution.  If you have a HasMany relationship, you can use the `CreateMany()` method on *that*.  Let me give you an example.  Say I have a couple of basic Models that are related with a HasMany/BelongsTo.

```php
class Parent extends Model
{
    public function children()
    {
        return $this->hasMany('App\Child');
    }
}

class Child extends Model
{
    public function parent()
    {
        return $this->belongsTo('App\Parent');
    }
}
```

I can leverage that relationship to create all the children I want in one shot.  Let's say I get a request with `'parentName'` and an array of `'childNames'`.  I can handle it like so:

```php
class ParentController extends Controller
{
    public function store(Request $request)
    {
        $parentName = $request->get('parentName');
        $childNames = $request->get('childNames');
        // Remember, $childNames is already an array

        $parent = Parent::create(['parent_name' => $parentName]);
        $parent->children()->createMany($childNames);
    }
}
```

That's it.  And a little bonus feature is that you don't even have to pass in the `'parent_id'` as an attribute; it's handled automatically.  As I said before, this may all be common knowledge, but if it's not, I want this to at least be easier to find for the next person!

Happy Hacking!
Building URL's to crawl based on other websites
Tags: discuss, help, opinion
Published: 2019-04-16 22:17:47

---
title: Building URL's to crawl based on other websites
published: true
description: 
tags: #discussion #help #opinion
---

The idea behind this is that a user, upon registration, selects a number of preferences of their choosing (min/max price, region, etc..). Then based on those preferences, I'm gonna crawl/scrape other websites to find matches for those preferences (For all of these websites, these matches are found using query parameters).

> Just a sidenote, this is not to steal other peoples content. The idea is to merely gather up the matches from the different websites and list them all on each users authenticated page.

I'm not sure what's the best course of action to do this. This is what I've thought of so far:
+ Manually make a map for each website of the existing values and the corresponding query parameters and build the url's using the corresponding website map
+ Use a browser automation tool like Selenium to automatically browse and build the url each time the preferences are saved (although I'm not sure these are safe to use in production)

Any tips on the best way to move forward with this? (I am open to using API's that would help me do this)
Synergistically Speaking
Published: 2019-04-16 22:15:27

---
title: Synergistically Speaking
published: true
description: 
tags: 
---
#Introduction
I have written this blog post on the process of synergistially orchestrating technically sound sprints in a client-focused architecture environment.The adoption of progressively disintermediate cloud centric channels means that while there are appropriately incept frictionless potentialities, you can excel in efficiently empowering team driven deliverables in a corporate, cross functional experience.

This leads to the adoption of blueprints that enable auto scaling to match the user's search engine optimization in a given promotional field. These type of technologies are vital for conceptualizing adaptive core competencies and convergences in an always online world. Allowing you to make the correct choices to bring your technology to the forefront.

#The Usage of Blockchain Technologies For The Decentralization Of A Company's Core Value Network To Improve Shareholder Retention
We all know how important blockchain developments are in this day and age, they successfully cultivate collaboratively elaborate ROIs on leading edge virtualizations in the market. This lets us *"promote proactive technology rather than effective information"*

However, as we can see in these two diagrams, that is usually not sufficient for our needs.

![Diagram 1](https://thepracticaldev.s3.amazonaws.com/i/fz65927u5wkcreta5d87.jpg)

![Diagram 2](https://thepracticaldev.s3.amazonaws.com/i/azq9dr6vucy8bws9a3ji.jpg)


#So What Can We Do To Fix This And Set Ourselves Up For Success
1. Stop giving global access to high quality scrums.
2. Enact a first in first out service to simplify right-shore market shares.
3. Redefine and refactor core values to disseminate backend methodologies. **VERY IMPORTANT!!!**
    + Your programmers may not like this but it is vital to the success of your corporate validation. You might as well hire ostriches with keyboards tied around their necks!
    + Many companies fail at this but if you succeed, it leads to seamless integration with niche markets, leading to investments in empowered equity, making everyone happy.

#Putting This Into Practice
1. When preparing to deploy, be sure to capitalize on the object-orientated version of SQLAlchemy. That's how yoiu maximize the potential of object-relational mapping in your program, without it you have to start thinking about TensorFlow, which is highly relevant in thee context of React. Without that you might end up having to use MongoDB to interact with your machine learning.
2. There are many unspoken benefits of object relational mapping. Your product becomes more open-source overall, more lightweight and ca n scale to fit your clients needs. Letting you leverage existing technologies into your orchestrated incubator.
3. Pay attention to these diagrams here, it shows the flow your program should have:

![Diagram 3](https://thepracticaldev.s3.amazonaws.com/i/d38oaejqnfur00q04ygj.jpg)

4. Here, we utilized the Google Cloud platform to enable a flow sate

![Diagram 4](https://thepracticaldev.s3.amazonaws.com/i/x332fkrxdg6u7qbotx50.png)
Quick sed lesson
Tags: sed, logs, learning, awk
Published: 2018-10-12 04:02:42

I was looking for a way to "grep" logs within certain time range. The first one I found (and use all the time since then) is using [awk](https://en.wikibooks.org/wiki/An_Awk_Primer):-

```
awk '/run_cmd/ && "00:00:00" < $3 && $3 <= "04:35:00"' /var/log/local1
```

But what if I want just logs from 5 minutes ago? From certain time to now is easy:-

```
awk '/ERROR/ && "10:40:00" < $3 && $3 <= strftime("%H:%M:%s")' /var/log/local1
```

But I can't find a way to get "time ago" with awk. Of course we can use `date` command to generate the date and pass it to awk:-

```
time_ago=$(date --date='10 minutes ago' '+%H:%M') && awk -v time_ago="$time_ago" '/ERROR/ && time_ago < $3 && $3 <= strftime("%H:%M:%s")' /var/log/local1
```

That starting to get out of hand however. As usual, [stackoverflow](https://stackoverflow.com/a/26526710/139870) has better answer. Not using awk but sed.

```
sed -n "/^$(date --date='5 minutes ago' '+%b %_d %H:%M')/,\$p" /var/log/local1
```

While it work, I don't really understand it. Time for some quick sed lesson.

Basic sed - `sed -n 10,15p file.txt` print line 10 - 15 of the file.

`10,15` is an address range. Address range can be a line number or regex pattern.

`sed -n /^813/p file.txt` this function similar to `grep ^813 file.txt`.

Oh, `p` there is a command, which is print. Another command usually use is `d` for delete.

Remember that address can be a range?

```
sed -n /^813/, \$p file.txt
```

Here we specify a range, which simply the end of the file. So sed will print starting from the match to the end of the file.

```
sed -n "/^$(date --date='5 minutes ago' '+%b %_d %H:%M')/,\$p" /var/log/local1
```

Now back to the original command. `date --date='5 minutes ago' '+%b %_d %H:%M'` will return something like Oct 12 10:14.

So basically we're doing:-

```
sed -n "/^Oct 12 10:14/,\$p" /var/log/local1
```

Which mean print from match of Oct 12 10:14 to the end of file.

Oh wait, why the `-n` flag there? sed by default will print each line. So `-n` is for quiet so we instruct it to not print anything. Instead we use `p` to print only the match.

End of lesson ;)
How do you measure your test coverage?
Tags: help, android, tdd, testing
Published: 2019-04-16 22:13:31

---
title: How do you measure your test coverage?
published: true
tags: help, Android, TDD, Testing
---

In some places and teams I've worked with, I've been asked what % of test coverage we want to shoot for and I've never had a good answer. I personally try to write tests that I think help define or validate a piece of code I work on. 

When I run a code coverage scan in Android Studio, it's usually quite a low percentage. However it seems odd to me that you'd have a test for an immutable model that tests all fields. 

What do you think? How would you measure coverage?