teleren/devto huggingface dataset:
Permission denied for hugepages in QEMU without libvirt
Tags: linux, qemu, libvirt, acessdenied
Published: 2019-10-28 09:53:47

---
title: Permission denied for hugepages in QEMU without libvirt
published: true
date: 2019-06-18 00:00:00 UTC
tags: linux,qemu,libvirt,acessdenied
canonical_url: https://foursixnine.io/blog/2019/06/18/Permission-denied-for-hugepages-in-QEMU-without-libvirt.html
---

So, say you’re running qemu, and decided to use hugepages, nice isn’t it? helps with performace and stuff, however a wild wall appears!

```
QEMU: qemu-system-aarch64: can't open backing store /dev/hugepages/ for guest RAM: Permission denied
```

This basically means that you’re using the amazing _-mem-path /dev/hugepages_, and that QEMU running as an unprivileged user can’t write there… This is how it looked for me:

```
sudo -u _openqa-worker qemu-system-aarch64 -device virtio-gpu-pci -m 4094 -machine virt,gic-version=host -cpu host \ 
  -mem-prealloc -mem-path /dev/hugepages -serial mon:stdio -enable-kvm -no-shutdown -vnc :102,share=force-shared \ 
  -cdrom openSUSE-Tumbleweed-DVD-aarch64-Snapshot20190607-Media.iso \ 
  -pflash flash0.img -pflash flash1.img -drive if=none,file=opensuse-Tumbleweed-aarch64-20190607-gnome-x11@aarch64.qcow2,id=hd0 \ 
  -device virtio-blk-device,drive=hd0
```

The machine tries to start, but utimately I get that dreadful message. You can simply do a chmod to the directory, use an udev rule, and get away with it, it’s quick and does the job but also there are few options to solve this using libvirt, however if you’re not using [hugeadm](https://linux.die.net/man/8/hugeadm) to manage those pools and let the operating system take care of it, likely the operating system will take care of this for you, so you can look to `/usr/lib/systemd/system/dev-hugepages.mount`, since trying to add an udev rule failed for a colleague of mine, I decided to use the systemd approach, ending up with the following:

```
[Unit]
Description=Systemd service to fix hugepages + qemu ram problems.
After=dev-hugepages.mount

[Service]
Type=simple
ExecStart=/usr/bin/chmod o+w /dev/hugepages/

[Install]
WantedBy=multi-user.target
```
Handling Background Processes in Bash
Tags: bash
Published: 2023-01-06 02:01:00

---
title: Handling Background Processes in Bash
published: true
date: 2019-06-17 23:50:30 UTC
tags: Bash
canonical_url: https://brandonrozek.com/blog/bashprocesses/
---

For multi-process applications, I want to be able to start it up using the `bash` command processor and be able to stop all the processes just by hitting `CTRL-C`.

As a quick reminder, to have a task run in the background you need to add a `&` at the end of the line.

```
execute_app &

```

Previously, I was grabbing the PID of this background process, trapping the interrupt signal and taking the time to send the interrupt signal to all of the background processes.

You can get the child pid by referencing the variable `$!` after sending a process to the background.

Now I just use `setsid` to set the process group of the background processes to be the same as the bash process itself. The following demo script here will show the capability.

```
#!/bin/bash
setsid sleep 5 &
setsid sleep 10 &
wait

```

This script will send two processes to the background and will wait until all the processes are finished. Hitting `CTRL-C` during execution will send the interrupt signal to all of the processes achieving my goal.
Python in the browser
Tags: python, web
Published: 2019-06-17 23:38:32

---
title: Python in the browser
published: true
description: python, web
tags: python, web
---
![](https://thepracticaldev.s3.amazonaws.com/i/be4pcdin17te9kocgetn.png)

You can use Python on the web, instead of Javascript. 
Yes, really.

There's a project named Brython: "A Python 3 implementation for client-side web programming".

So how does it work:

Step 1: Include Brython

    <script type="text/javascript" src="/src/brython.js"></script>

Step 2: Write your code, say

    <body onload="brython(1)">
    
    <script type="text/python">
    from browser import document, alert
    
    def echo(ev):
        alert("Hello {} !".format(document["zone"].value))
    
    document["test"].bind("click", echo)
    </script>
    <p>Your name is : <input id="zone" autocomplete="off">
    <button id="test">clic !</button>
    </body>

Step 3: Demo https://brython.info/gallery/hello.html


More resources,

## Learn python and demos

* https://brython.info/demo.html?lang=en
* https://brython.info/gallery/gallery_en.html?lang=en
* https://pythonbasics.org
* https://pythonprogramminglanguage.com
How Do You Manage Dotfiles Across Environments and Machines
Tags: discuss, dotfiles
Published: 2019-06-17 22:48:16

---
title: How Do You Manage Dotfiles Across Environments and Machines
published: true
description: I need some help figuring out how to sync my configurations intelligently across OS's and machines.
tags: discuss, dotfiles
---

I'm looking for a better way of managing my dot/configuration files across multiple environments.

## What I'm Doing Currently

I've got a dotfiles git repo with some build-scripts that dynamically build files, detect the operating system, and fill in the templates accordingly.  This works okay-ish.  Sort of.  It could be better.  The downside is that I'm always making teeny tiny tweaks to my dotfiles (particularly my `.vimrc` and `.zshrc` files), and so the individual instances drift apart pretty quickly.  This is driven by the fact that I always forget (read: am too lazy) to do "commit/push" after I make a small change, and "pull/build/deploy" whenever I sit down at a different workstation.  So, I almost always end up re-writing the dotfile for any given new workstation from an obsolete version.  Which is lame.

## Features I'd Like

1. A non-local central place to store my configuration files.
2. A method of making them OS- or machine-specific.  For example, I've got an alias on my Mac  that aliases `rm` to `trash` for a more ergonomic delete.  I don't necessarily need this on a Linux server, and I definitely don't need it on a Windows machine.
3. Ideally, it should be able to handle tiny tweaks robustly, so that it syncs up after the change (or periodically) without me having to type a bunch of git commands.
4. It would be nice if it was easy to deploy to a new, fresh machine.  What this means is that if it uses a build or deploy script, that should run without having to install a bunch of stuff beforehand, since that kind of defeats the purpose.  I'm currently using a Ruby script, but, as you might know, Ruby is anything but simple to set up and it's certainly not consistent across OS's.
5. There are certain pieces (keys, usernames, etc.) that are needed to fully configure a machine, but I don't necessarily want to put those out in public.  I'm not sure how to separate the secret/private stuff from the public stuff.

Anyways, I'm happy to implement as much custom scripting as needed.  In fact, I super duper love it.  I'm just looking for some ideas.
[Video] Move over GUI, let's build a VUI with JavaScript!
Tags: cascadiajs2018, videos, javascript
Published: 2019-06-17 22:46:18

---
title: [Video] Move over GUI, let's build a VUI with JavaScript!
published: true
description: The ability to use our voice to to interact with technology opens up a whole new world of posibilites for users, designers and developers. Join us at this session where we will talk about the best practices we have uncovered in the rapidly evolving voice first ecosystem. The session will include a live-coding demo on using AWS Lambda to building and deploy a VUI in minutes.
tags: cascadiajs2018, videos, javascript
cover_image: https://pbs.twimg.com/media/DtM87aIU0AMyD94.jpg:large
---
*As we lead up to [CascadiaJS 2019](https://2019.cascadiajs.com), I'm going to share the 24 amazing talks from 2018 here on dev.to. Sit back and enjoy the show!*

![Memo Döring](https://2018.cascadiajs.com/speakers/memo.png)

The ability to use our voice to to interact with technology opens up a whole new world of posibilites for users, designers and developers. Join us at this session where we will talk about the best practices we have uncovered in the rapidly evolving voice first ecosystem. The session will include a live-coding demo on using AWS Lambda to building and deploy a VUI in minutes.

https://www.youtube.com/watch?v=HjWr40_N1Fg
30 Days Of AWS (Day 11)
Tags: aws, challenge, 30daysofaws
Published: 2019-06-17 22:36:04

---
title: 30 Days Of AWS (Day 11)
published: true
description: 
tags: AWS, challenge, 30DaysOfAWS
cover_image: https://thepracticaldev.s3.amazonaws.com/i/xk3wcpnc2h8nk8oy9xh6.png
series: 30 Days of AWS
---

Welcome back guys, Another update in this crazy challenge. I almost finish this course, It has taken more time than I expected but I'm excited about all the thing that I've learned.

Today I was studying about Load Balancing, Elasticity, and Scalability, these topics are interesting because I don't know a lot about ELB (Elastic Load Balancer)  and Autoscaling, important topics in the certification and the real life.

## Elastic Load Balancer (ELB)

ELB is a service that allows you to distribute the traffic between EC2 that are associated with it. 

As its name says it's a load balancer that let you distribute the incoming traffic across multiples EC2 instances in different availability zones. One important thing about the ELB is that increase the fault tolerance of your applications, detecting unhealthy instances and redirecting to healthy instances.

![IMAGE](https://thepracticaldev.s3.amazonaws.com/i/a0iwf81iv8ee37uoqamh.png)

The image above you sees the ELC in the middle of our infrastructure, trying to balance all the request across our EC2 instances.

## Auto Scaling

From the docs "AWS Auto Scaling monitors your applications and automatically adjusts capacity to maintain steady, predictable performance at the lowest possible cost. Using AWS Auto Scaling, it’s easy to setup application scaling for multiple resources across multiple services in minutes."

In other words, auto scaling is a process to add or remove EC2 instances based on the traffic that your app is getting.

For example, imagine that your application doesn't have ELB and Autoscaling, so the maximum users that support your EC2 are 3 when the user number four uses our application, this could be crashed or the service will be denied.

![IMAGE4](https://thepracticaldev.s3.amazonaws.com/i/v4s5hyijv4hkzclubdw4.png)

But using autoscaling, when the maximum of users reached, automatically the EC2 will scale up:

![IMAGE3](https://thepracticaldev.s3.amazonaws.com/i/x21o9166zxnangz3de0z.png)

Autoscaling is free nevertheless, will be charged for the resources auto-scaling provisions, For instance, any EC2 provisions that go beyond the free tier.


## Route 53

Route 53 is where you manage and configure web domains for websites or applications you host on AWS.

It has 3 main functions:

1. _Domain registration_: Amazon Route 53 let you register a domain.
2. _DNS Service_: Amazon Route 53 translate your domain like www.mypage.com into IPs 192.160.10.0.
3. _Health checking_: It verifies whether your domain is reachable, available or functional.

So that's all for today, I completed the lab and I passed the exam today, only I have one topic left in this course.


![PASS](https://thepracticaldev.s3.amazonaws.com/i/su1va8t1ng7by5i7xnyn.png)

Thanks for reading.
Linear Searching Algorithm in Javascript
Tags: javascript, algorithms
Published: 2019-06-17 22:06:54

# Naive Linear Searching Approach

## First what is linear search?

Linear search is the process of looking for a certain value in a list or set of values (e.g) looking for a value in a javascript array in a linear fashion, which means looking by order since javascript arrays are indexed we can compare what we're looking for to the current value we're looking at in the array and return true if we find it, false if not. note that there are different ways of searching but in this particular post we're going to focus on linear search only

### Implementation

```
// first, let's create the function used to do the search
```

```javascript
// as you can see in this post I am using ES6(new version of Javascript)
```
```javascript
const linearSearch = (arr, query) => {
    let i;
    for (i = 0; i < arr.length; i++) {
      let currentValue = arr[i];
      if (query === currentValue) {
         return i;
      } 
    }
    return -1; 
}
```

```javascript
// Hell no!!! what is all of this? don't worry it's simple
```
```javascript
/*
1. First we created a function called linearSearch.
2. We passed two arguments to our function.
3. The first argument is the list we are searching in.
4. The second argument is the value to look for inside the list.
5. We declared a variable called i.
6. Now we want to iterate or (loop) over the list.
7. We are comparing the currentValue on the list to the query argument
8. if they are equal we are returning the index we found the value we were looking for.
9. if not we are returning -1 which means we did not found it.
/*

That's it Enjoy!!!
Uplifting Stories of Tech Leads
Tags: discuss, technology, management, career
Published: 2019-06-17 21:12:08

---
title: Uplifting Stories of Tech Leads
published: true
description: Let's talk about positive ways leaders have impacted our career.
tags: discuss, technology, management, career
---

I had a tweet that seemed to resonate with a huge number of people this week.

{% twitter 1140080146424246272 %}

We've all had feedback that stays with us, or actions that have been harmful.

BUT, instead of sharing those I'd love to flip this on its head and talk about leads and mentors who really made a difference. What they did right and how it helped you in your career. I'm all ears.
LitElement series: I need your help!
Tags: lit, litelement, webdev, javascript
Published: 2019-06-17 20:32:25

---
title: LitElement series: I need your help!
published: true
description: All about writing templates using lit-html. It is the the second post of a series about lit-html and LitElement.
tags: lit, LitElement, webdev, javascript
series: LitElement
cover_image: https://instagram.fmad10-2.fna.fbcdn.net/vp/1029fc88fd8b75151957c2e4b2d6fbb6/5D8E72C5/t51.2885-15/sh0.08/e35/p750x750/41632015_242163606643232_593789419859796815_n.jpg?_nc_ht=instagram.fmad10-2.fna.fbcdn.net 
---

📣Hi Dev people!

This is the first time I make a series of posts and I have doubts on how to face it. Do I write detailed articles step by step explaining everything or is it better to explain briefly the basics but focusing on complex topics and things that are not obvious and aren't in the official documentation? Do I write for newbies or for those already initiated?

The posts for _beginners_ are longer and can be boring for those who already have some experience, but they explain all the details and do not take anything for granted.
On the other hand, posts with an _intermediate_ level are shorter and go straight to the point, but they can be more difficult to understand for those who are starting to develop. They would rely less on words, and more on code samples with comments. They are easy to use as a reference.

As these posts have to be useful and of interest to **you** I ask you: 

_Girls and guys_, what do you prefer???
* Posts for beginners developers
* Posts for experienced developers

For this time, the second post for the `LitElement` series goes in two flavours. Please 🙏 read them and tell me your opinion!

* [lit-html templates from zero to hero for beginners](https://dev.to/julcasans/lit-html-templates-from-zero-to-hero-for-beginners-3eje)
* [lit-html templates from zero to hero](https://dev.to/julcasans/lit-html-templates-from-zero-to-hero-2afm)

Thank you!
Sick Console Bro! How To Style Your console.log with CSS
Tags: javascript, css
Published: 2019-06-17 19:38:43

_Originally Posted On [Harner Designs](https://harnerdesigns.com/blog/style-your-console-log-with-css/) | Photo by [Glenn Carstens-Peters](https://unsplash.com/@glenncarstenspeters?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText) on Unsplash_

In [Chrome](https://developers.google.com/web/tools/chrome-devtools/console/console-write#styling_console_output_with_css) and Firefox (>31) you can add CSS styles to your console.log() messages. It's fairly simple and straightforward. 

All you need to do is include a `%c` string before your log message and then pass your CSS as a parameter to the console.log( ) function. Like so:

```js
console.log("%c{{Log Message}}", "{{CSS}}");
```

For example, this code runs on [my portfolio](https://harnerdesigns.com): 
```js
console.log("%cHarner Designs", "color:#233E82; font-family:'Ubuntu'; display: block;font-weight:bold; font-size:48px; background:#fff;");
    console.log("%cLike to dig into the meaty bits of the website?\nThanks for looking! Hit us up on Twitter @harnerdesigns!", "color:#222; font-family:'Ubuntu'; font-weight:100; font-size:24px; background:#fff;");
    console.log("%cDid you know you can style your console output?!", "color:#333; font-family:'Ubuntu'; font-weight:100; font-size:18px; background:#fff;");
    console.log("%cCheck our blog to learn how: https://harnerdesigns.com/blog/style-your-console-log-with-css/", "line-height: 3em; padding: 0.5em; text-align: center; border: 1px dotted #aaa; background:#fff; font-size: 14px;");
```

and outputs like this to the console: 

![](https://harnerdesigns.com/wp-content/uploads/2019/06/styled-console-update.png)

## Styling Multiple Strings In One Log

It's also [possible](https://stackoverflow.com/a/13017382/10425698) to include multiple strings in one command and style them differently. Check it out:

```js
console.log("%cString1" + "%cString2", "{{CSS for String1}}", "{{CSS for String2}}");
```

## Reusing Styles Across Log Messages

You can also store the CSS You want to apply to a variable and then pass that to multiple console.logs:

```js
var consoleStyle = "{{Reusable CSS}}";
console.log("%cString1", consoleStyle);
console.log("%cString2", consoleStyle);
```

## Conclusion
Do you leave any little easter eggs in your console? Could you see a use case for this in your own projects? I'd love to know down in the comments! Show me some examples of cool things you've found in console messages. 

## Recent Blog Posts
* [Anatomy of a WordPress Theme](https://harnerdesigns.com/blog/anatomy-of-a-wordpress-theme/)
* [Add Logout Link To Account Menu – BigCommerce For WordPress](https://harnerdesigns.com/blog/add-logout-link-to-account-menu-bigcommerce-for-wordpress/)
* [How To Measure Angles In Illustrator](https://harnerdesigns.com/blog/measure-angles-in-illustrator/)
Allow Me To Brag About My Team...
Tags: career, management, fun
Published: 2019-06-17 18:58:03

{% twitter 1140662022486528000 %}

Today, one member of my team taught me a lot about time series analysis and forecasting that I didn't know before, and the other member was able to clearly and succinctly express parallelisation overhead in Spark vs. R with just a single plot. I'm really proud of these two today!

What was your proudest moment as a senior dev / team lead / manager?
Theme Selector
Tags: html, css, javascript, webdev
Published: 2019-06-12 06:21:38

Well, Today I'll show you how to make " Theme Selector " 


Result:         ![Theme Selector](https://dl.dropboxusercontent.com/s/kv5f9g52apfs6cq/ktIcIsyNdX.gif)


# Add jQuery

`jQuery`


```     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>```


# add Themes btns

![btn](http://bit.ly/2IDpD5U)

So how we can add it, and how much?

as much as you want, if you want to add 3 btns u can.

go to `index.html` and add  `ul` with class `switch-color`

.then : inside the `ul` tag.
add as much as you want `li` tag, with attribute `data-color`

``` <li data-color="COLOR"></li> ```

How We'll use it?
well, for example: ![ul li](http://bit.ly/2IEL1YR)


We'll get this: ![lis](http://bit.ly/2IEk8E8)

So, now we have to add CSS

# CSS

First, we will add `:root` that it will change when we click the theme btns


` :root {
  --maincolor: #080; // Original Theme
} `



Quick CSS code

``` .switch-color li {
  display: inline-block;
  width: 20px;
  height: 20px;
  cursor: pointer;
  transition: 0.5s;
}```

and then style for the `li`


``` .switch-color li:first-child {
  background-color: #b71540;
  color: white;
}
.switch-color li:nth-child(2) {
  background-color: #0c2461;
}
.switch-color li:nth-child(3) {
  background-color: #3c6382;
}
.switch-color li:nth-child(4) {
  background-color: #079992;
}
.switch-color li:nth-child(5) {
  background-color: #e58e26;
}
.switch-color li:nth-child(6) {
  background-color: #8e44ad;
}
.switch-color li:nth-child(7) {
  background-color: #2c3e50;
  color: black;
}```


Result: ![result](http://bit.ly/2IA6LVv)


Now we want some content to test the btns.

# Content

Soo quick code HTML & CSS for Content

`HTML`

`<div class="main">
        <h2>Title</h2>
        <div class="main-content">
            Content
        </div>
    </div>`


# CSS

` main h2 {
  color: var(--maincolor); // From => :root
} 
 .main-content {
  background-color: var(--maincolor); // From => :root
  color: #fff;
  padding: 20px;
} `

Result: ![Ressult](http://bit.ly/2IzuchV)


# JavaScript

` $(function() {
  $(".switch-color li").on("click", function() {
    $(":root").css("--maincolor", $(this).data("color"));
  });
});`


Explain: in click one of ul items. it will change --maincolor in :root to the data from the clicked li.



That's it :)
How to embed react charts on a simple web application
Tags: react
Published: 2019-06-17 18:24:31

I have created a bar chart with React app and would like to embed or render this chart on a simple web application i.e. want to show this chart in 800x600 size in a html page.

I wanted to know, if there are ways to do this. Please share links or steps to achieve this. Googled but nothing found. Thanks.
Give your website a responsive makeover in 4 easy steps

Tags: webdev, responsive, codenewbie, css
Published: 2019-06-17 18:11:51


A responsive website means that your design adapts to whichever device a user is browsing your website in.


By applying responsive design principles, you are ensuring your site will be able to work well on different screen sizes, so more people can access your content. Given that a good amount of your users would be very likely to browse you from their phones, it's important to keep this in consideration.


Here's some quick tips that you can apply to your project to make it responsive:
###Use media queries
A media query consists of a media type, if that type matches the type of device the document is being displayed on, the styles are applied. How do I do this? Easy as following this syntax:
`@media(max-min width:100px){
Your CSS rules go here}`

###Make sure your images also get the responsiveness memo
![](https://thepracticaldev.s3.amazonaws.com/i/4uk6iwyg7y7b0ddf38ap.jpeg)
Instead of applying an absolute width to an element (i.e. width:70px), it's better to use something like this: 
`.img{
Max-width: 100%;
Display: block;
Height: auto;}`


Here, max width scales to fit image without stretching it and height in auto keeps the original ratio aspect.


###For higher resolution displays, use retina image
The simplest way to do this is to define their width and height as half of the original.
`            .img{
                   Height: 250px;
                   Width: 250px;}
                   <img src="linkpic500x500" alt="image">`


###Take care of your typography
Instead of using px or em units, switch to viewport units. Viewport units are relative to the viewport dimensions (width/height) of a device and percentages are relative to the size of the parent container elements.
For example: 
`.div{
Font-size: 10 vw; ->10% viewport width
3 vh; -> 3% viewport height;
Vmin: 70 vmin; -> 70% of viewport's smaller dimension
Vmax: 100 vmax; ->100% of viewport's bigger dimension`


Applying these tips, your website will render in any device without problems, **congratulations**!