teleren/devto huggingface dataset:
Installing Rails 6 on Heroku Revisited
Published: 2019-08-23 21:17:37

---
title: Installing Rails 6 on Heroku Revisited
published: true
tags: 
canonical_url: http://www.codeography.com/2019/08/22/rails-6-on-heroku-revisited.html
---

In my [original post](/2019/08/02/rails-6-on-heroku.html) I outlined a solution that involved adding a Heroku build pack. But after a discussion on [`rails/webpacker`](https://github.com/rails/webpacker/pull/2206) found a better way to handle this error.

So if you see this:

```
 Compilation failed:

 !
 ! Precompiling assets failed.
 !
 ! Push rejected, failed to compile Ruby app.
 ! Push failed

```

I was able to fix the issue by moving the sass packages into the production dependencies instead of the `devDependencies`

I moved the two Sass packages to `dependencies`, and it worked:

```
   "dependencies": {
     "@rails/actioncable": "^6.0.0",
     "@rails/activestorage": "^6.0.0",
     "@rails/ujs": "^6.0.0",
     "@rails/webpacker": "^4.0.2",
     "turbolinks": "^5.2.0",
+ "node-sass": "^4.12.0",
+ "sass-loader": "^7.1.0"
   },
   "devDependencies": {
- "node-sass": "^4.12.0",
- "sass-loader": "^7.1.0",
     "webpack-dev-server": "^3.3.1"
   },

```

This winds up being a better solution because:

1. It doesn’t rerun the yarn install (which can take a while, [even if it is supposed to be fast on subsuquent runs](https://github.com/rails/webpacker/pull/2206#issuecomment-519980678))
2. Uses the libraries I expected
3. Works with the default Heroku buildpack

Thanks to [Brian](https://github.com/bbugh) and [Jake](https://github.com/jakeNiemiec) for helping me get this sorted. Still a learning process with NPM, Webpack, and friends.
Javascript hoisting note to myself
Tags: javascript, hoisting
Published: 2019-08-21 22:11:11

---
title: Javascript hoisting note to myself
published: true
tags: javascript, hoisting
canonical_url: https://medium.com/@SelenGora/javascript-hoisting-explained-with-new-variables-let-const-f24fa01178ee
---

A variable can be used before it has been declared.[*](https://www.w3schools.com/js/js_hoisting.asp)

```javascript
x = 24; // Assign 24 to x
console.log(x); // 24
var x; // Declare x
```
## var, let, const Differences

`var` declaration phase and initialization phase are same level. `var` variables are hoisted.

`let` declaration phase after uninitialized state after comes initialization phase.

Hoisting is **not valid** for a `let` variable (including for const and class). 
Before initialization, the variable is in temporal dead zone and is not accessible. [*](https://dmitripavlutin.com/variables-lifecycle-and-why-let-is-not-hoisted/)

Little bit deeper on `let`, `const` variables, actually they are hoisting but…

>It will throw an exception if you access the variable before the initialisation even if the accessing code is below the declaration (e.g. in a hoisted function declaration that is called too early).

user Bergi has the explanation on stackoverflow
{% stackoverflow 31222689 %}

## Function hoisting?

Function declarations are **hoisted**

```javascript
helloFunction(); // Hello hoisting
// function declaration
function helloFunction() {
    console.log('Hello hoisting');
}
```

Assignment functions(Function expressions) are **not hoisted**

```javascript
myNewFunction(); //Uncaught TypeError: myNewFunction is not a function
// function expression
let myNewFunction = function(){
    console.log('Hello hoisting expression');
}
```

References: 
[w3schools](https://www.w3schools.com/js/js_hoisting.asp)
[YDKJS](https://github.com/getify/You-Dont-Know-JS/blob/master/up%20%26%20going/ch2.md)
[@freecodecamp](https://www.freecodecamp.org/news/what-is-variable-hoisting-differentiating-between-var-let-and-const-in-es6-f1a70bb43d)
[@freecodecamp](https://www.freecodecamp.org/news/function-hoisting-hoisting-interview-questions-b6f91dbc2be8)
What should be persisted in the frontend and where?
Tags: react
Published: 2019-08-21 21:23:57

Hi guys I've been searching online and I could not find anything relevant. The thing is that I was wondering if you have any tips on persisting data, let's say if we perform a fetch to query something from the backend, should we persist it in the frontend even if a refresh, or a change of page is made, how do you handle that?

I know the auth credentials are normally stored in the session storage, local storage or even cookies, but is there anything relevant that we should store, let's say a request with lot's of data, is it a good idea to keep it somewhere, or is better to perform the request every time the given page is accessed?

Tag is react because is the library I'm most familiar with, but feel free to discuss if using another framework, library.
VmList: The App To Manage Them All (Instances!)
Tags: react, vmware, xen, node
Published: 2020-04-13 01:42:25

---
title: VmList: The App To Manage Them All (Instances!)
published: true
date: 2019-08-21 21:08:47 UTC
tags: react,vmware,xen,nodejs
canonical_url: 
---

![](https://cdn-images-1.medium.com/max/1024/0*lmUCXfpn8Scr6bB7)<figcaption>Photo by <a href="https://unsplash.com/@imgix?utm_source=medium&amp;utm_medium=referral">imgix</a> on <a href="https://unsplash.com?utm_source=medium&amp;utm_medium=referral">Unsplash</a></figcaption>

I am working in a company that is dealing with too many instances systems. We still have some in-house servers with **Xen Dom-U** running, we have still a fairly large amount on instances running on a **VmWare Vsphere** cluster, and we are moving to **AWS EC2** instances and images since a few month.

This is a great move but it take time to migrate everything at the same place, then employees are lost when they need to interact with a specific instance. Where it is located, how I can connect to it, who is the owner of the application, and so on….

We have decided to write a very simple tool that aim to list all instances of the company, on all backends we have.

![](https://cdn-images-1.medium.com/max/1024/1*dNbo0ImN7Ask2eDWatf-CA.png)<figcaption>VmList screenshot showing instances from AWS mainly</figcaption>

Currently the tool do the job really well, and if you want to get a look and implement it you can just clone the following repository:

[gbandsmith/vmlist](https://github.com/gbandsmith/vmlist)

### Do more

Once the tool deployed we found a new way to improve our employee experience. In order to allow more control over your developer team, we wanted to allow developers to create their own instances for a short term period. We don’t want to allow them to start instances via AWS Console because we want a proper tagging system applied.

We have implemented this feature into the VmList application, so that developers can fire up an instance from a specific set of AMI (Amazon Images) that we set in the backend of the tool.

![](https://cdn-images-1.medium.com/max/1024/1*SvqABrfliuYKRKycQD4yVw.png)<figcaption>VmList with the start instance feature</figcaption>

To manage the ‘short term’ period, VmList is setup to fire the instance with a specific tag, that is triggered by a Lambda function dedicated to that (it terminate all this kind of instances after a few days without usage)

Finally the tool is allowing much more flexibility to our developers, with a better vision, and with a very good management of our costs.

Do you have also this kind of need ? Or does the AWS Console answer all you want ?

Thanks for reading !

* * *
WTF does work-life balance mean to you?
Tags: career, watercooler
Published: 2019-08-21 20:28:05

Work/life balance seems like a super nebulous term and I am wondering what it means to you on a day to day basis. How do you define work/life balance in your head? That phrase gets thrown around so much how do you conceptualize it... 

And, two more questions to the community I am wondering about... 

I've often noticed that if I am doing really "deep" work at work, it is satisfying... but I leave work just fried and it is hard to find the energy for hobbies and my personal life. Is that something you feel, and if so how are you trying to find the balance between doing great work but also leaving room for the other parts of your life from an energy perspective? 

If you could snap your fingers and have the type of work/life balance that is perfect for where you are at in life, what would your week and year look like?
Suggestions for an AI concept
Tags: help, discuss, android, java
Published: 2019-08-21 20:18:23


This is a concept I have for a faster and simpler voice model. It uses tesorflow and java and I am hoping on implementing this in [ara](https://github.com/FultonBrowne/Ara-android), an app I am working on.

In my basic version of the ara voice recognition there is this code:
```java
 switch (labelIndex - 2) {
    case 0:
        resulttxt = "yes";

        break;
    case 1:
        resulttxt = "no";
        break;
    case 2:
        resulttxt = "up";
        break;
    case 3:
        resulttxt = "down";
        break;
    case 4:
        resulttxt = "left";
        break;
    case 5:
        resulttxt = "right";
        break;
    case 6:
        resulttxt = "on";
        break;
    case 7:
        resulttxt = "off";
        break;
    case 8:
        resulttxt = "stop";
        break;
    case 9:
        resulttxt = "go";
        break;
                                }
```
My idea take this basic concept but instead of full words looks for sounds an then words. this could be the new recognition code:
```java
 switch (labelIndex - 2) {
    case 0:
        resulttxt = resulttxt + "LongA";

        break;
    case 1:
        resulttxt = resulttxt + "ShortA";
        break;
    case 2:
        resulttxt = resulttxt +"ShortB";
        break;
    case 3:
        resulttxt = resulttxt +"LongB"; // Such as the words be and bee.
        break;
    case 4:
        resulttxt = resulttxt +"ShortC";
        break;
        // .......................................................
                                }
```
Please give your input, I am no expert on AI, so if its dumb tell me.
PHP... yay or nay?
Tags: healthydebate, php, discuss
Published: 2019-08-21 19:38:45

We usually see two camps:

1. PHP is way better than it used to be, and huge sites still run it (Facebook/Wikipedia, etc...)

2. PHP always sucked... anything is better.

I want to know, which side are you on? What your thoughts on PHP?

<a href="https://twitter.com/jacobian">@jacobian</a> for scale...

{% twitter 1163453179499089921 %}
Monitor choices - ultrawide for dev?
Tags: productivity, monitors
Published: 2019-08-21 19:11:11

---
title: Monitor choices - ultrawide for dev?
published: true
description: 
tags: productivity, monitors
---

I'm reworking my desk at the moment. For the last 10 years I've been use 3 idential 24" (1920x1200) screens.  Anyways, to force myself to upgrade I've parted those out to family members and am sitting in front of a 27" 2k monitor, but its not enough.

I could either add another 27" or 32" screen.. Or may add 2 to get triple display, but I think that may be overkill with 27" screens.  Or maybe an ultrawide?

Anyone used an ultrawide for development? How did it compare to a multiple monitor setup?

This is purely for development, I don't game. On Linux.

Thanks!
React Checkbox Tutorial – Handle Multiple Checkboxes Values
Tags: react, axiospost, multiplecheckboxes, reactcheckbox
Published: 2020-01-31 21:54:59

---
title: React Checkbox Tutorial – Handle Multiple Checkboxes Values
published: true
tags: React JS,axios post,multiple checkboxes ,React Checkbox
canonical_url: https://www.positronx.io/react-checkbox-tutorial-handle-multiple-checkboxes-values/
---

The post [React Checkbox Tutorial – Handle Multiple Checkboxes Values](https://www.positronx.io/react-checkbox-tutorial-handle-multiple-checkboxes-values/) appeared first on [positronX.io](https://www.positronx.io).

In this **React Checkbox tutorial** , we are going to look at **how to handle and store multiple checkboxes values in React application**. A checkbox is an HTML element, and It allows the user to choose one or multiple options from a limited number of choices.

We deal with various form controls to build an enterprise-level web or mobile application. There is various kind of form controls used to create an interactive form such as **checkboxes, radio buttons, dropdown menus,** etc. A checkbox is one of the widely used HTML element in web layout, which allows us to select one or multiple values among other various options.

[Click here to read more](https://www.positronx.io/react-checkbox-tutorial-handle-multiple-checkboxes-values/)
A Better Explaination
Tags: node, javascript, ruby, java
Published: 2019-08-19 21:12:44

## Hello, again!
Since my previous post on Snippet was vague, I decided to make a new one, describing what it is for and what possibilities it could have.

## A Description of Snippet
([Issue Link](https://github.com/opensource-matrix/snippet/issues/3))  So, you found Snippet.  What can you use it for?

It's like Github's `Gist`, but it's completely offline unless you are updating the library.

- *It's updated every day to make sure everything is working!*

It has a variety of "snippets" in multiple programming languages, see [Supported Languages](#supported-languages)

## Example Real-World Usage
Let's say you are looking for an example of, (for this example) how to write a string in C.

(There probably are multiple tutorials for this online!)  You can't find anything online, but you heard of a Node.JS package called "Snippet".  It has code examples in multiple programming languages such as Javascript, Java, C (C# and C++ as well), Python and more.
You check it out, in the `snippets` folder, you see a folder called `c`, open it and *boom*; you found a certain `hello_world_c.c` script.

It's exactly what you are looking for!  Now you can cherish this simple piece of code in your heart, or you can use it.

## Installation
Check out [this post](https://dev.to/revelmind/new-node-package-2ond) or use the command:
```
npm install @matrixoc/snippet
```
Or get it from [GitHub](https://github.com/opensource-matrix/snippet), if you don't want to use the download feature, use the commands:
```
git remote add origin https://github.com/opensource-matrix/snippet.git
git pull
```

## Supported Languages
> AS OF THIS POST
- C
- C#
- C++
- JavaScript/Node
- Ruby
- Crystal
- Python
- HTML
- Batch
- Shell
- Java

It's *super* easy to add a language, let's look into it [here](#creating-a-language)!

# Creating A Language
1. Create a new folder in `snippets` with the name of the programming language.
2. Run the command `node addLanguage [language name] [language file extensions (separated by spaces]

So for example, to add Objective-C, we could do:
```
node addLanguage objective-c .objc .m
```

## Conclusion
If you have any questions at all, create an [issue](https://github.com/opensource-matrix/snippet/issues/new), or check out [this issue](https://github.com/opensource-matrix/snippet/issues/3), and that's about it, thanks for reading!

If you want to contribute, go to the GitHub repository, linked [here](#installation), thanks to the contributors who helped!
Understanding Architecture of Angular 8
Tags: angular, javascript, tutorial, webdev
Published: 2019-08-21 18:41:54

---
title: Understanding Architecture of Angular 8
published: true
description: 
tags: #angular #javascript #tutorial #webdev
---

Just found a nice read on Understanding Architecture of Angular 8 - https://overflowjs.com/posts/Angular-Understanding-Architecture-Part-2.html

The article explains 
1. Modules
2. Components
3. Services and Dependency Injection
4. Component Communication - Parent to Child Component and  Child to Parent Component

Hope it helps someone starting with it.

Happy coding
Which Non-US Software Engineers Should I Follow? (Includes Big Twitter Thread)
Published: 2019-08-21 18:38:40

I've been trying to expand my network, and I'm particularly passionate about building relationships with software engineers in other parts of the world.

I asked Twitter to recommend a few new faces for me to follow, and I got  an awesome response in this Thread:

{% twitter 1163112870122598400 %}

I advise anyone looking for more international diversity in their Twitter feed to check that thread out!

Now, I'm asking the same question here!

## Who should I follow (non-US please)?

Twitter links, Dev.to profile links, blog articles, or whatever are all appreciated!
Override CRA and add webpack config, without ejecting. 
Tags: webpack, reactapprewired, customizecra, react
Published: 2019-08-21 18:10:17

I'll get right down to the process. Webpack is awesome, so is create-react-app. Ejecting CRA(create-react-app) to configure webpack has been a challenge, even to most of the pro developers. Me being a simpleton, I wanted to figure out an efficient way to configure and share so as to help out a fellow dev. 

- Create a react app, use your creativity for naming.
```console
$ npm install -g create-react-app
$ create-react-app my-app

$ cd my-app
```

- Here, we have to customize webpack config. Usually we eject CRA, Instead we are going to use an awesome library called react-app-rewired with customize-cra. Why would we need two libraries?
Lets install react-app-rewired and customize-cra

Note- Do not panic, it doesn't add any noise to your code. 
```console
$ npm install react-app-rewired customize-cra --save-dev
```
You would have to make few changes to your package.json 
```
/* package.json */
"scripts": {
-   "start": "react-scripts start",
+   "start": "react-app-rewired start",
-   "build": "react-scripts build",
+   "build": "react-app-rewired build",
}
```

- Create a config-overrides.js file, this handles all of your webpack configuration. This is an example on how i would use it, add your own plugins, presets and imports just as we do in native webpack. 


Note- Hey if you find any difficulties in importing two libraries, please use my implementation. Before you import, you need babel-plugin-import. This is our Babel plugin for importing components on demand.
```console
$ npm install babel-plugin-import --save-dev
```

I have had issues in doing it the native way: 
```javascript
fixBabelImports('import', {
+     libraryName: 'antd-mobile',
+     style: 'css',
+   }),
```

```javascript
const {
  override,
  addLessLoader,
  disableChunk,
  addBabelPlugins,
  removeModuleScopePlugin,
  addBabelPresets
} = require("customize-cra");

module.exports = override(
  ...addBabelPresets("@babel/preset-env", "@babel/preset-react"),
  ...addBabelPlugins(
    [
      "import",
      { libraryName: "antd", libraryDirectory: "lib", style: true },
      "antd"
    ],
    [
      "import",
      { libraryName: "antd-mobile", libraryDirectory: "lib", style: "css" },
      "antd-mobile"
    ]
  ),
  addLessLoader({
    javascriptEnabled: true,
    importLoaders: true,
    modifyVars: {}
  }),
  disableChunk(),
  removeModuleScopePlugin()
);

```

- Start the app, Voila!, it should be good and working.
```console
$ cd my-app
$ npm start
```

---
For any further information on react-app-rewired or customize-cra, please checkout these links and kudos for their awesome library[^1] 
[react-app-rewired](https://github.com/timarney/react-app-rewired)
[customize-cra](https://github.com/arackaf/customize-cra)
Adding an Emoji Status to Terminal (ZSH)
Tags: linux, productivity, tutorial
Published: 2019-08-21 17:40:14

---
title: Adding an Emoji Status to Terminal (ZSH)
published: true
description: It requires some bash, but if you follow these instructions you can add emoji statuses to your zsh terminal setup!
tags: linux, productivity, tutorial
cover_image: https://blog.emojipedia.org/content/images/size/w2000/2015/09/IMG_0001-1.jpg
---

This post is inspired and credited in large part to @yechielk. He posted this tweet last night and I, like everyone else, also wanted to add emojis that reacted to the success of my commands!

{% twitter 1163984748403933184 %}

This guide can likely be adapted for other setups, but in this case I'm running `zsh`, specifically `oh-my-zsh` so the instructions are based on that.

###1 - Navigate to themes folder
`oh-my-zsh` uses themes to define the visual display of the terminal window. So we'll start by navigating to the folder where the themes are.

```bash
cd ~/oh-my-zsh/themes
```

###2 - Figure out what theme you're running

There are a ton of themes in that folder, but we only want to edit the one we're running. So let's find out what that is.
```bash
echo $ZSH_THEME
```
###3 - Navigate into that theme file

I'm running `alanpeabody` which I've customized over the years. So let's open that file. 

> Yes, I use `nano`! It works for me. You can use `vim` or whatever else works for you.
 
```bash
nano alanpeabody.zsh-theme
```

###4 - Create a variable that will set the emoji

This is the heart of what we're doing and I didn't write it. I lifted it from @yechielk [dotfiles](https://github.com/achasveachas/yechiels-dotfiles) and made some modifications. Work smarter, not harder folks!

Note that you can replace these faces with whatever emoji, or even text, that you want.
```bash
local emoji="${debian_chroot:+($debian_chroot)}\$(if [ \$? == 0 ]; then echo 😊$; else echo 😓; fi) “
```

###5 - Add variable to prompt

The final step is to find where in the theme your prompt is declared. Mine was at the bottom of the file and appropriately named `PROMPT`. Prepend the definition with the emoji variable using the appropriate syntax and we're off to the races.
```bash
PROMPT="${emoji}${user} ${pwd}$  "
```

Note that spaces in this string are taken into account. I have one at the end so my typed commands are spaced out from my prompt, but I removed the one between emoji and my user since it takes up unnecessary space beyond the emoji visual buffer.


### Complete!
And that's it. Remember to restart your terminal so that these changes can take effect. Have fun! 

{% twitter 1164222656717172736 %}
What is the number one thing you look for in a new job?
Tags: discuss
Published: 2019-08-21 17:36:07

---
title: What is the number one thing you look for in a new job?
published: true
description: What's the most important aspect of a new job for you?
tags: discuss
---

When it comes to shopping for a new job, or answering a recruiter's LinkedIn message, what are the things you need to have on the job offer to make you turn your head?
Is it a big salary? Is it flexibility? Ability to work remotely? Perhaps perks such as free food or the like?
Create PR against release branch from merged into develop branch?
Tags: discuss, git
Published: 2019-08-21 17:11:26

---
title: Create PR against release branch from merged into develop branch?
published: true
description: Git release branching problems - create PR against release branch from merged into develop branch?
tags: discuss, git
---

#### Given the following scenario:

- the main development branch is `develop`
- a feature branch (`f` for short) is created from `develop`
- a pull request is opened for the implemented feature
- the new feature should land in the new release but a release branch is created from `develop` before the feature is reviewed and merged
- the PR gets reviewed and merged

After the `f` branch is merged into develop we should create a PR to the new release branch.

P.S. `f` branch is rebased over `develop`

We decided to go with a new branch from the release branch and just cherry pick the commit that we wanted. But it was because we were in a hurry and the commit was only 1. I am still wondering if there is some other easier way to do this.

What do you think will be the best and easiest way to do it?