teleren/devto huggingface dataset:
I wanna hack my keyboard
Tags: hack, keyboard, microcontroller, qmk
Published: 2019-09-25 03:06:34

---
title: I wanna hack my keyboard
published: true
description: 
cover_image: https://thepracticaldev.s3.amazonaws.com/i/5nb4jimt3aw5jlwk4uac.jpg
tags: #hack, #keyboard, #microcontroller, #qmk
---

A while ago, I took the plunge and decided to buy a mechanical keyboard. I've settled on the Ducky One 2 Mini (I should have bought the TKL version). And I don't regret it (Except for the missing dedicated arrow keys). I don't even notice it when I type and the RGB lights can be mesmerizing when I'm thinking.

Last Saturday in the afternoon, I was updating the keyboard firmware when a thought struck me: Can I install custom firmware on it? I mean the default one is great, but I like to tinker with my devices at a lower level, not just with the options the manufacturer provided. I quickly searched on google to see if the firmware was open-sourced and unfortunately, it wasn't. But searching "ducky one 2 mini firmware" yielded promising results, particularly [this post](https://geekhack.org/index.php?topic=100481.0).


This was the first time I heard about the [QMK project](https://qmk.fm/keyboards/). It's a custom firmware for mechanical keyboards and has a bunch of cool features. I liked what I was reading in the documentation and I decided to give it a go. 

I cloned the [forked version](https://github.com/GitWellBack/qmk_firmware) of the guy (I still don't know his name) who worked on the version for Ducky and created a test branch. I first merged in the `mbi5042gp` branch which I think it's the driver interface to control the RGB lights. Then I merged in the `duckyone2mini` branch which contains the configuration for the keyboard. 

The first build failed due to missing files in the `lib/chibios-contrib` folder. I recalled that this was a submodule and went in for the commit that may contain those missing files. Instead, I found a pull request made by the same guy (great work!). This pull request adds the missing files for the Microcontroller Unit included in the keyboard unit. So a quick `git remote add`, then a `git checkout` retrieved the needed files.

Another build failed, but that was due to some errors in the Makefiles and a constant's name (I should make a pull request for that). They were easy to fix and a final build generated the `.hex` file needed for the keyboard.

I would say that the QMK firmware was very enjoyable and that it was fun to use. But I did not flash the keyboard. It's the only one I have and it will be $100+ gone if I bricked it in the process. And I do not have the necessary tools to do a full recovery (JTAG anyone). So here I am with a compiled firmware and no courage to try it. But I learned a few things during the process and will learn more about the QMK project in the feature.
dotenv, but just 1 line of shell
Tags: bash, devops, zsh, shell
Published: 2019-09-25 03:04:38

### update

The shell script below breaks on significant edge cases due to how inconsistent bash is. The following ruby script works for all cases I know about. This is all for personal fun though. Dotenv has years of fixing edge cases.

https://dev.to/kwstannard/dotenv-but-7-lines-of-ruby-19lp

### =======

This can probably replace dotenv in most situations and is also language agnostic.

##### For BSD(macos) xargs
``` bash
de() { [ -f .env ] && <.env grep -v "^#" | tr '\n' ' ' | xargs -J% env % "$@"; }
```

##### For GNU xargs
``` bash
de() { [ -f .env ] && <.env grep -v "^#" | tr '\n' ' ' | xargs -I% env % "$@"; }
```

##### Examples

```
$ echo hello=world > .env
$ echo $hello        # this is to prove $hello doesn't exist normally
>
$ de bash -c 'echo $hello'
> world
$ de ruby -e 'puts ENV["hello"]'
> world
$ de clojure -e '(System/getenv "hello")'
> "world"
$ de python3  -c 'import os; print(os.environ["hello"])'
> world
```
Learn the complete React-Redux front-end system
Tags: react, redux, javascript, webdev
Published: 2019-09-25 03:00:07

Learn the complete React Developer course with Redux, React-Router, Hooks, Auth0, and more!

What you’ll learn

The Most Modern Version of React and Redux
Modern Authentication and Routing Patterns
The Knowledge and Skills to Apply to Front End Jobs
How React Works Under the Hood
The Knowledge to know how different Front End Technologies work together (enough knowledge to impress other engineers)
Modern ES5, ES6, ES7 Javascript Syntax.

{% youtube c9yklSh53Zk %}
Outubro de contribuição open-source com o #Hacktoberfest
Tags: português, git, github, pullrequest
Published: 2019-09-28 13:53:11

---
title: Outubro de contribuição open-source com o #Hacktoberfest
published: true
tags: português,git,github,pull request
canonical_url: "https://jtemporal.com/outubro-de-contribuicao-open-source-com-o-hacktoberfest/"
---

Já está quase acabando o mês de Setembro e com isso se inicia os preparativos pra festa do mundo _open-source_: o Hacktoberfest. A Digital Ocean liberou hoje (25/09/2019) [o início do cadastramento para o Hacktoberfest na página oficial do evento](https://hacktoberfest.digitalocean.com). Ano passado, cerca de 46 mil camisetas foram enviadas para pessoas que contribuíram no mundo todo. Esse ano, as recompensas estão limitadas à 50 mil.

Se quiser conhecer mais sobre o Hacktoberfest, corre lá no outro blog:


[![](https://jtemporal.com/images/clique-aqui-para-ler.png)](https://jtemporal.com/outubro-de-contribuicao-open-source-com-o-hacktoberfest/)
Taking back control of your URL!
Tags: rant, urlshortener, productivity, react
Published: 2019-09-25 02:46:09

---
title: Taking back control of your URL!
published: true
description: Frustrations with Bitly not allowing me to change the url short link has driven me away!
tags: rant, urlshortener, productivity, react
cover_image: https://thepracticaldev.s3.amazonaws.com/i/rpamxvfw77t6hkzfusrq.png
---

# Out with Bitly in with Rebrandly

## What are URL shorteners and why do I use them?

{% youtube lSX5dPdArZ0 %}

> A URL shortener is a simple tool that takes a long URL and turns it into whatever URL you would like it to be.

Now for https://ajonp.com we have a lot of partners that I track feeds for and keep the "Webdev" world updated. This allows me to offer all of our "Purr-fect Peeps" a one stop shop for much of their knowledge requirements. 

For example I have a relationship with
[![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/cfnvgmh87obgoifi1pub.png)](http://link.ajonp.com/tylermcginnis-subscribe)

{% user tylermcginnis %}

So when I say hey checkout Tyler's amazing [React Course](https://link.ajonp.com/tylermcginnis-react). It is way easier for me to remember two things `tylermcginnis` `react`. So now whenever I feel like mentioning Tyler's course it is easily accessible using my own domain `https://link.ajonp.com/tylermcginnis-react`

## Taking back your domain!

So you may have noticed all of my links are simply `link.ajonp.com` which also gives my brand a much better reputation than a random "bit.ly" link. Yes they offer this capability as well, but it costs some $$!


## Why did I switch?

So here is the __BIG__ reason why I had to make the move!!!

I ran into an issue with Slack (so maybe the blame starts there) my subscriber link stopped working. So I went in for a quick edit on my old link and sure enough I can't change it. Which means the 1,000 places I now have `bit.ly/slack-invite` will no longer work and I cannot update it back to working.

[Bitly-Links-vs-Rebrandly-Links](https://support.rebrandly.com/hc/en-us/articles/360013225774-Bitly-Links-vs-Rebrandly-Links-)


## Now the hard part

Now I have to track down all those bit.ly links floating all over the interwebs and update time...which me luck 😿

🎥 YouTube: https://link.ajonp.com/youtube
🌎 Site: https://link.ajonp.com/😺
📦 GitHub: https://link.ajonp.com/github
🎓Lessons: https://link.ajonp.com/lessons
🗞AJ’s Week in Web: https://link.ajonp.com/week-in-web
💬 Slack: https://link.ajonp.com/slack
🐦 Twitter: https://link.ajonp.com/twitter

## Do you use a URL shortener?

Drop in a comment and let me know why!
Why is my Apache httpd Alias Not Working?
Tags: linux, apache
Published: 2019-11-13 15:13:54

---
title: Why is my Apache httpd Alias Not Working?
published: true
tags: Linux, Apache
canonical_url: https://www.petefreitag.com/item/878.cfm
---

Ran into this today, so I thought I would blog it.

I had an alias in my httpd.conf such as:

```
Alias /virtual-directory /path/to/files
```

I had to change the alias to point to a new folder so I commented out the old one and added a new one like this:

```
Alias /virtual-directory/ /different/path/to/files
```

And now my `Alias` was not working! I was getting a 404 status code response.

One reason an Alias might fail when you change directories could be if the `Directory` directive did not allow access to that folder, but that was not the case here and that would probably cause a 403 response not a 404.

Maybe you have already spotted the problem in my example, but I found the problem by looking at the Apache server error logs. I had an entry like:

```
File does not exist: /different/path/to/filesindex.html
```

As you can see now, my first (working Alias) was set for the URI `/virtual-directory` but my second one had a trailing slash `/virtual-directory/`

The moral of the story is to make sure that the trailing slashes match for the alias and its path, otherwise you might run into this issue.
Install AOL Desktop 9.7 – Free Download AOL Desktop 9.7
Tags: downloadaol, installaol
Published: 2019-09-25 02:18:06

install AOL desktop 9.7, this can be fashionable for its options and functions currently accessible with all new users interface and advance safety features.AOL Desktop Gold will assist you in accessing your emails and for looking at the content and even for browsing purpose. AOL Desktop Gold is best among all internet interfaces.

To know a lot of regarding AOL, Users will visit wiki link (This link is for Reference only)

    Language: English
    Version: Desktop Gold
    Size: fifteen Mb
    License: $4.99 USD / month (Not applicable if already paying or have a subscription)
https://aolgoldwin.com/aol-desktop-9-7/
more details visit this artickel
How do you do language translations
Tags: discuss, webdev
Published: 2019-09-25 02:13:00


Having worked at a company that supported a large number of languages I always wondered how other developers managed theirs.

The basic idea when I first started was: static JSON files with key value pairs. 

So English might look like: 

```json
{
    "welcome": "Hello!"
}
```


Then in the code you would reference the key to fill in the value.

Something like:

```jsx
<Translate>welcome</Translate>
```

That's not a bad solution and the basic ideas were pretty alright. However, it has a few problems.

1. The people who can translate for you don't usually know JSON
2. It doesn't provide much context on _what_ the translation should be
3. It requires a code release every time you need to update a language or even fix a typo.

\#1 is not too hard. You can convert to CSV for loading into excel which is a tool most people know. You can still run into data conversion issues.

\#2 I never had a great solution for. Typically you would have to do a lot of work to provide screenshots and go back and forth  for them to have proper context. If you site was already live it was easier since they could just look at the live site.

\#3 Can be solved with hosting the JSON in another place such as S3 and have the app pull the data from there. But then you no longer have version control.

Eventually I created an internal app to solve #1 and #3. It was a react app that used firebase as the storage. It integrated with our LDAP so we had simple SSO. 
We also had language and environment based permissions. You could say a user could only access French  in dev. 
It had a way to promote dev to production as well.

Firebase was nice to use in that you can have direct JSON access URLs so the consuming app never had to install their bulky tools. (It wasn't important to have live updating of the translations)
The app worked but was clunky, ugly, buggy and had little buy in from anyone but IT. I could think of many things I might improve on it.

This was a bit of a ramble. But after talking about what I've done and worked on. What do you guys do?
Writing cross platform scripts with Sparrow6
Tags: windows, powershell, perl6, bash
Published: 2019-09-25 02:11:45

---
title: Writing cross platform scripts with Sparrow6
published: true
description: How to create scripts for Linux and Windows using unified interface Sparrow6  
tags: Windows, Powershell, Perl6, Bash
---

With the recent changes [Sparrow6](https://github.com/melezhik/Sparrow6) allows to create scripts compatible with Windows and Linux.

Why one would need that?

In my daily _$work_ I create a lot of scripts saving my time. The challenge is that I often switch between Linux and Windows environments.
Having bunch of scripts working say for Linux, does automatically mean they would work for Windows. So I'd end up rewriting a code from the scratch which take a lot of time or would I?

Why not bring this **cross platform feature** into **initial design** and write scripts compatible for both systems?

With Sparrow6 it's really piece of cake.

---

# Hello Linux/Windows on Sparrow6


Let's create a simple script that just print `Hello World`, but have it to do for both Linux and Windows.


Linux version:


`tasks/hello/linux/task.bash`

```bash
echo "Hello world, $(config name)"
```

We base on that fact that Bash is a standard Linux shell available on most Linux systems.


Windows version:

`tasks/hello/windows/task.ps1`

```powershell
Write-Host "Hello world, $(config name)"
```

We again base on the fact that Powershell is a standard Windows shell available on most Windows system.


These examples are too simple, but in real life you'd write more complicated scripts. I just only want to emphasize that you'd **choose proper shell** depending on your system. Bash or Powershell


# Script switch

Sparrow6 is good at glueing things together and at orchestrating scripts. We just need a little *hook*, written on Perl6 to run our scripts conditionally on operating system:

`hook.pl6`

```perl
#!perl6

if os() eq 'windows' {
    run_task "hello/windows"
} else {
    run_task "hello/linux"
}
```

So we end up with a small Sparrow6 plugin we could run:


```
$ tree .

.
├── hook.pl6
└── tasks
    └── hello
        ├── linux
        │   └── task.bash
        └── windows
            └── task.ps1

4 directories, 3 files
```

On my Linux box it would be:

`perl6 -MSparrow6::DSL -e 'task-run(".", %( name => "Raku" ))'`

```
02:32:16 09/25/2019 [.] Hello world, Raku
```

---

Thank you for reading. If you want flexible and no fuss automation try out [Sparrow](https://github.com/melezhik/Sparrow6) - the tool I use in my daily work.

Comments, questions, ideas as always are welcome.
Top 3 mistakes you're probably doing while unit testing
Tags: mistakes, unittests, softwaredevelopment, discuss
Published: 2019-09-25 02:02:26

---
title: Top 3 mistakes you're probably doing while unit testing
published: true
description: Unit testing can be a complicated task if no attention is given to details. These are the top 3 mistakes I've seen (and done) while unit testing. What are yours?
tags: mistakes, unit tests, software development, discuss
---

Sometimes the task of writing unit tests is delegated to the new team member or the Jr. developer, in order to help them get to know the code base. _That's at least the most convincing excuse I've heard_

That being said, if the devs writing these tests don't have prior experience doing so, they can run into some classic mistakes. These are my top 3:

1. Testing more than one thing at the time. Having big test cases checking for several things at the same time can be a problem.

2. Relying on external resources. How many times have we seen a "testing database" being created and destroyed during the tests execution?

3. Finally, aiming for high coverage alone, without context. Coverage by the sake of coverage isn't really helpful, there are better metrics to try to improve and use to measure the success (or lack of thereof) of your tests.

Those are my top 3 mistakes, I've written more about them [over here](https://blog.bitsrc.io/3-mistakes-youre-probably-making-when-unit-testing-d9bdfaf79366). 

_What about you?_ What are the top mistakes you've seen while reviewing (or writing your own) unit tests?
Hacktoberfest 2019: Singapore Meetup
Tags: event, hacktoberfest, singapore
Published: 2019-09-25 00:35:26

---
title: Hacktoberfest 2019: Singapore Meetup
published: true
description: Hacktoberfest 2019
tags: #Event,#Hacktoberfest, #Singapore
---
![Alt text of image](https://thepracticaldev.s3.amazonaws.com/i/shn5b192q86pvyps6idw.jpg)

#WHAT'S HACKTOBERFEST?
Hacktoberfest — brought to you by DigitalOcean in partnership with DEV — is a month-long celebration of open source software.

Maintainers are invited to guide would-be contributors towards issues that will help move the project forward, and contributors get the opportunity to give back to both projects they like and others they've just discovered.

No contribution is too small — bug fixes and documentation updates are valid ways of participating.

#RULES AND PRIZES
First, sign up on the Hacktoberfest site at https://hacktoberfest.digitalocean.com.

To qualify for the official limited edition Hacktoberfest shirt, you must register and make four pull requests between October 1-31.

Pull requests can be to any public repo on GitHub, not just the ones with issues labeled Hacktoberfest.

If a maintainer reports your pull request as spam or behavior not in line with the project’s code of conduct, you will be ineligible to participate.


#EVENT CODE OF CONDUCT
Hacktoberfest events are welcoming, open, and inclusive.

Please read our Events Code of Conduct (https://do.co/hacktoberconduct) before attending.

Happy hacking!

__RSVP__ @ https://www.meetup.com/AzureSG/events/265122447/
Pipe to Clipboard in Linux
Tags: linux
Published: 2019-09-25 00:12:16

---
title: Pipe to Clipboard in Linux
published: true
description: Want to copy the output of a command in Linux?  Here's the easy way.
tags: linux
---

Well, this is a pretty quick tip but if you can memorize this one you'll be happy in the terminal.

Let's say you want to copy the output of a command to your clipboard.  What do you do?  Use `xclip`. 

For example, I just needed to add my public SSH key to my Digital Ocean account.

```bash
cat ~/.ssh/id_rsa.pub | xclip -sel clip
```

**That's it, now you can `ctrl + v` your SSH key.  WIN!**

---

Follow me on dev.to or [on Twitter](https://twitter.com/connorbode) for more quick tips!
A simpler curry for Javascript
Tags: javascript, beginners
Published: 2019-09-25 09:55:59

---
title: A simpler curry for Javascript
published: true
tags: Javascript, beginner
canonical_url: https://techformist.com/simpler-curry-notation-javascript/
---

Here's a simpler way to do curry functions in Javascript.

We have previously seen [currying in Javascript](https://techformist.com/currying-in-javascript/). A simple form and application of that concept is demonstrated below -

```
const addThem = add.curry(2);
const addTotal = addThem(1);
console.log("addTotal: ", addTotal); // 3

```

Alternatively, we could avoid an external function or library and [curry using bindings](https://techformist.com/curry-using-bind-javascript/) ..

```
function add(x) {
  return function(y) {
    return y + x;
  };
}

const addEm = add(1);

console.log(addEm(2)); // 3

```

But, there is a simpler way to get the same result.

We just use arrow functions to collect arguments at different times.

```
const add = x => y => x + y;

const addEm = add(1);
console.log(addEm(2)); // 3

```

We can make the code more readable with a different notation to do the actual curry -

```
const add = x => y => x + y;
console.log(add(1)(2)); // 3

```

Of course, you have to rely back on the previously provided example if you don’t have all arguments in one go.
Load More Data on Page Scroll using Ajax Jquery Laravel 6
Published: 2019-12-06 12:34:27

---
title: Load More Data on Page Scroll using Ajax Jquery Laravel 6
published: true
date: 2019-09-25 00:00:00 UTC
tags: 
canonical_url: 
---

In this article I will show you load more data with scroll using jquery and php Laravel 6 You dont have need to click anywhere to load data because data is loading on page scroll automatically from MySQl databaseIt will check if data length is equal to 0 then display message for No more rec
Reusing CSS With Styled Components
Tags: css, react
Published: 2019-09-28 02:37:25

---
title: Reusing CSS With Styled Components
published: true
tags: css,react
canonical_url: https://stephencharlesweiss.com/blog/2019-09-25/reusing-css-with-styled-components/
---

Styled components are really nice in compartmentalizing styling and keeping it close to the components that use it.

I wasn’t around for the “good old days” when we had a single master CSS file, but I can imagine how challenging it would be.

That’s why I thought it was interesting when I came across an example where I wanted to share styling across different components in a sudo-object-oriented way.

In this example, I have two components. They’re both inputs, but they’re built off of different bases (we’ll take this as granted for the sake of this example). The styling, however, is nearly identical with the second one building on the base of the first.

How could I re-use the styling with Styled-Components without duplicating code and potentially diverging in the future when I forget to update one?

What follows is a simple example demonstrating how I used css helper function within `styled-components` to effortlessly reuse my css _without_ duplicating code.<sup>1</sup>

My original styled input:

```javascript
import styled from ‘styled-components’;

export const DefaultInput = styled.input`
  border: 1px solid ${({error})=>( error ? `red` : `grey` )};
  border-radius: 4px;
  outline: none;
  padding: 0.5em;
`;
```

Since my second component actually _isn’t_ going to be an `input` (it will be a `button`), I unfortunately can’t just do:

```javascript
import styled from ‘styled-components’;

export const SecondComponent = styled(DefaultInput)`
  /* make changes as needed*/
`;
```
This would be ideal since I could simply extend the CSS I defined originally. 

Enter the CSS helper function from styled components!

```javascript
import styled, { css } from ‘styled-components’;

const baseInputStyles = css`
  border: 1px solid ${({error})=>( error ? `red` : `grey` )};
  border-radius: 4px;
  outline: none;
  padding: 0.5em;
`;

export const DefaultInput = styled.input`
  ${baseInputStyles}
`;

export const SecondComponent = styled.button`
  ${baseInputStyles}
	/* make changes as needed*/
`;
```

## <svg aria-hidden="true" focusable="false" height="16" version="1.1" viewbox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>resources

- <sup>1</sup> [api: css | Styled Components](https://www.styled-components.com/docs/api#css)