teleren/devto huggingface dataset:
2020-04-26 dev.to, glitch, markdown & three.js
Tags: devjournal, javascript, glitch, threejs
Published: 2020-04-27 07:31:16

## Posting to Dev.to?
Blogging as a pastime is a really nice activity for oneself , but where you blog brings other people into the process. So blogging about technical matters on Facebook tends to toward losing followers. Blogging on your own website - unless you are already famous - means almost no readers. Wordpress.com, Blogger.com and Medium.com are all great platforms. I have used and admire all of them. The issue is that the readerships - even when the readers are themselves programmers - don't really have the intention of going to those sites to read about programming.

I have been following Dev.to for a while and this is my second post. From what I have seen so far, Dev.to is a nice place for quick and easy posting dedicated to discussing topical aspects of coding - while at the same fulfilling a bunch of items on my wishlist.   

## Real 3D in the post

I build real-time 3D web-pages that work on your computer, tablet or laptop. The three.js WebGL JavaScript library is my single dependency. Everything I do is free and open source and in plain-vanilla JavaScript.

What this means is that I do not do 2D. I do not do static. I do not do Ruby. I do not do Node. I do not do Videos (2D after all). I do not do databases. So what do I want to be able to show in my blog posts? Real-time, animated interactive 3D. the question is: where can you do this on the web? I have had some success in embedding iframes in WordPress and blogger posts, but the process is by no means satisfactory - let alone easy, fast and producing nice results.

The other day while going through the help menu I noticed this Liquid Tags thing. Scrolling down screws that I noticed that you could embed Glitch files - actual working scripts - in a Dev.to post. just like this one:   

{% glitch ta-2020-04-26 app %}

WooHoo! Write the text in Markdown. View the 3D demo "inworld". This could be the beginning of a dream come true.

## Today's script

The script you see above is a side hustle on my main current project [c10-viz3d]( https://www.ladybug.tools/spider-covid-19-viz-3d/ ). in 2019, three.js added some modules that make it possible to generate and process huge numbers of 3D faces. I just started playing with these modules and the script above has some of the first demos.

This afternoon I set one of the scripts to load and display a million boxes. And to my shock and awe, the script worked - six million faces or twelve million triangles were rotating on my screen at 60 frames per second. I couldn't believe it. Neither could my computer. After three minutes it overheated and shut itself down.
Ember performance tweaks
Tags: ember, performance, webdev, frontend
Published: 2020-04-27 07:26:25

I wrote down my experience on performance tweaks that went well for the Ember apps I worked with. Some of them are simple notes that I wrote down while I was tweaking the build pipelines. I share those tips and tricks that could make your Ember apps faster, accessible and awesome!

Before I talk about how to solve for Ember app's performance tips, I presume you have a good understanding of what Ember is, and you have a basic knowledge of its ecosystem, build pipelines, etc.

## Key areas to optimise Ember apps:

- [Improving build timelines & optimising build size](https://abhilashlr.in/ember-performance-tweaks-part-1)
- [Optimising asset cache](https://abhilashlr.in/ember-performance-tweaks-part-2)
- [Building and optimising Ember apps for SEO](https://abhilashlr.in/ember-performance-tweaks-part-3)
- Improving the accessibility of Ember apps.
- Making Ember apps installable.

As I continue to write my blog posts, I will update this post with all the relevant links.
DevTools and beyond — JSK meets friends #2
Tags: uncategorized, chrome, chromedevtools, javascript
Published: 2020-04-30 18:52:52

---
title: DevTools and beyond — JSK meets friends #2
published: true
date: 2020-04-27 06:57:55 UTC
tags: Uncategorized,chrome,Chrome Dev Tools,JavaScript
canonical_url: https://js-kongress.com/2020/04/27/devtools-and-beyond%e2%80%8a-%e2%80%8ajsk-meets-friends-2/?utm_source=rss&utm_medium=rss&utm_campaign=devtools-and-beyond%25e2%2580%258a-%25e2%2580%258ajsk-meets-friends-2
---

![](https://cdn-images-1.medium.com/max/2560/1*R8Z3f1equyctbifBtzzOdQ.jpeg)<figcaption>JSKongress meets Paul Lewis, Kim Anh Tran, Mathias Bynens, Peter Müller on Tuesday, 28th April, 5:30 pm (CEST)</figcaption>

Here is the second episode of [#jskongress](https://www.facebook.com/hashtag/jskongress) meets friends: We are excited to announce the guests for our next episode.

Join us live on **Tuesday, April 28th, starting 5:30 pm** (CEST) on our channel [youtube.com/jskongress](https://youtube.com/jskongress?fbclid=IwAR2qkYDIf-rqBWIuWVeAd21phyfN6v1hwH3XlawhmkKe5Uc04xYusOxy5nA)

We are so grateful, that these four amazing people from the **Chrome DevTools Team** will join us:

- Kim Anh Tran (WebAssembly SWE)
- [Mathias Bynens](https://medium.com/u/738806bad910) (Design & Accessibility TL)
- [Paul Lewis](https://medium.com/u/97ce3a05d275) (Architecture & Testing TL)
- Peter Müller (UX lead)

We will discuss **Chrome DevTools, especially History and Architecture, Quality & Workflows, Team Organization, Design & Accessibility, WebAssembly Debugging** , and further questions that have been proposed by the community.

Send us your questions until Monday, April 27th — comment here or via mail to hello[at]js-kongress.com

The post [DevTools and beyond — JSK meets friends #2](https://js-kongress.com/2020/04/27/devtools-and-beyond%e2%80%8a-%e2%80%8ajsk-meets-friends-2/) appeared first on [JS KONGRESS 2020: Scaling JS – Pushing the Limits: Massive Platforms, Data-Driven Architectures, and Modern APIs.](https://js-kongress.com).
Over 100 PRs on Github
Tags: git, github, showdev, opensource
Published: 2020-04-27 06:55:44

I have done over 100 PRs on Github and more counting in these 3 years. I thank all the people whom I have in Open Source Communities and learned from various people around the world. 

![](https://pbs.twimg.com/media/EWgActIUEAA_QGK?format=png&name=medium)


I will say that Open Source Community is and always contain good people who will always help you! Don't ever hesitate to ask questions even if they are dumb or stupid, people will help you out!
Turn a REST API into a GraphQL API
Tags: tutorial, graphql, javascript
Published: 2020-04-27 06:46:18

I really like working with GraphQL APIs. I like being able to get data in the shape I want, and using subscriptions to get it in realtime. This weekend I discovered that transforming a REST API into a GraphQL one is easier than it sounds.

This is a walkthrough of turning one REST endpoint to GraphQL. Once you can do one, you can do more 😀

## The REST API Endpoint We'll Transform

To keep things simple, we'll use a simple GET REST endpoint as our starting point:

GET https://pokeapi.co/api/v2/pokemon/pikachu/

Now let's create a GraphQL endpoint.

## Define the GraphQL Schema for a Pokemon Object

First we define our GraphQL type for the Pokemon data we'll be returning from our new API endpoint:

```
type Pokemon {
  id:       String!
  name:     String!
  base_experience:  Int!
}
```

For the sake of example, we're limiting the fields, but add more if you want.

## Define the GraphQL Query Type

Then we define a GraphQL query called `getPokemon` that takes an `id` and returns a `Pokemon` object:

```
type Query {
  getPokemon(id: String!): Pokemon
}
```

## Define the Query Resolver

When a `getPokemon` GraphQL query comes in, under the hood of our resolver, we send a GET request to `/pokemon/<id>/`:

```
const resolvers = {
  Query: {
      getPokemon: async (_, { id }) => {
          
          const response = await fetch(MY_REST_URL + '/pokemon/' + id + '/');
          return response.json();
      },
  }
```

## Try the Query in GraphQL Playground

A copy of the above code is [editable here on Glitch](https://glitch.com/edit/#!/audreyr-pokemon-remote-schema), and running [live here with interactive querying via GraphQL Playground](https://audreyr-pokemon-remote-schema.glitch.me/)

Go to GraphQL Playground and try the query we just created:

``` gql
query {
  getPokemon(id: "pikachu"){
    id
    base_experience
  }
}
```

It responds with real data from PokeAPI:

```
{
  "data": {
    "getPokemon": {
      "id": "25",
      "base_experience": 112
    }
  }
}
```

Yay! As a practice exercise, try implementing another field besides `base_experience`:

1. Remix my Glitch app
2. Add the field to the `Pokemon` schema
3. Add it to your query and see the results in GraphQL Playground

![You Can Do It](https://dev-to-uploads.s3.amazonaws.com/i/rkibazax5pwy70oqb38e.jpg)

With this knowledge and a little practice, there's so much you can do. Enjoy!
Background process in SSH
Tags: ember, node, wfh, linux
Published: 2020-04-27 06:34:11

---
title: Background process in SSH
published: true
description: 
tags: #emberjs,#nodejs,#wfh, #linux
---


**What is SSH ?**

SSH, also known as Secure Shell or Secure Socket Shell. A secure way to access a computer over an unsecured network and also used for managing systems and appication remotely.

**How to keep running ember server in ssh ?**

Screen is one way to keep a process running even after closing SSH connection. Like most things in Linux there are more ways to keep a process running even after closing SSH connection.
[For more](https://dev.to/nexweb/comment/ikgg)


screen is the best solution for keep running the ember server in ssh, even after the ssh connection closed.


**How to keep running node server in ssh ?**

NPM (Node Package Manager) have bundles of packages to run server in background. pm2 (process manager) and forever are the stable packages to use for background process.

P.S: This is my first blog. Please correct me, if am wrong.
Deploying VueJS Front-end to Netlify
Tags: netlify, vue, javascript, beginners
Published: 2020-04-27 06:24:45

---
title: Deploying VueJS Front-end to Netlify
published: true
description: Deploying static site to Netlify free tier.
tags: Netlify, Vue, Javascript, Beginners
---

To preface, I'm currently working on a project whose backend API service I've recently published to heroku. So next step is to deploy my front-end. 

## Why Netlify? 
Considering all the free options, I settled on Netlify. In addition to the Continuous deployments which let me deploy on every pull request, I also did not have to deal with any server side stuff. And unlike the Heroku free servers, Netlify (static)sites never sleep. 

## Deploying in 3 simple steps

Here's how I did it in 3 simple steps:

* Added a netlify.toml in the root directory which consists of: 

   ```
   [build]
     command = "npm run build"
     publish="dist"
     base = "client"
   ```
   Because the front-end vuejs code is inside the 'client' subdirectory, I have to specify in this .toml file that the subdirectory to use is 'client' and the directory to publish after building is ./dist.

* Added a _redirects file inside the /public directory inside client sub-directory.

   ```
   /*    /index.html   200
   ```
   Include this file so that directly going to a different url (like 
   https://yoururl.netlify.app/home) won't return a '404')

* Login to netlify and add a new site from git. Then select the repository.

And voila, netlify should build and deploy the site. 

Thanks for reading.

Project Repo: https://github.com/nipeshkc7/BeatingBookies
Live project: https://beatingbookies.netlify.app/

*P.S. Please follow me on twitter, I'd really appreciate it. [@Nipeshkc](https://twitter.com/NipeshKc7)*
Here are my favorite resources for learning to code!
Published: 2020-04-27 06:09:55

For the last two years I've been learning to code, I wanted to share a quick list of my favorite resources that helped along the way. I hope that this can streamline your learning process!

## Tutorials
* [Frontend Masters](https://frontendmasters.com/). This is the ultimate resource, haven't found one quite like it.  If you are looking to code, and make it a career, this would be a great alternative to a bootcamp.
* [FreeCodeCamp](https://www.freecodecamp.org/).  My first introduction to code was through this site, and as the name states it's completely free!
* [Traversy Media](https://www.youtube.com/channel/UC29ju8bIPH5as8OGnQzwJyA) When I feel like watching a video, this is the channel I run to! Brad is very approachable in his teaching style.
* [Fun Fun Function](https://www.youtube.com/channel/UCO1cgjhGzsSYb1rsB4bFe4Q). MPJ introduced me to functional programming, and may just be one of the funniest people to speak on the subject.

##Blogs

* [Wes Bos](https://wesbos.com/blog).  Just call me a Wes Bos Disciple.  Wes offers a great selection of posts and videos. 

* [Tania Rascia](https://www.taniarascia.com/). I learned React from Tania's walkthrough!  She has quite the library of the things she has learned through the years, it seems likes she always takes her time with each post.

* [Jeff Atwood](https://blog.codinghorror.com/). The true OG. Jeff has been posting continuously since 2004!

* [DEV](https://dev.to/). This goes without saying...

##Podcasts

* [Syntax.fm](https://syntax.fm/). Wes and Scott expand on all things frontend development, and drop some awesome Spotify playlists along the way.

* [Frontend Happy Hour](https://frontendhappyhour.com/). Tech and cocktails?! This podcast takes a relatable, conversational approach to interviews and speaking on software engineering. Provides a great insight into working at major tech companies.


### 🙌 What are some of your favorite resources? 🚀
One year writing on DEV
Tags: writing, dev, meta
Published: 2020-04-27 06:09:33

---
title: One year writing on DEV
published: true
description: One year of writing at DEV: 60 posts, 200+ comments, lots of fun.
tags: writing,dev,meta
---

One year ago, I joined the DEV community. It was kind of random. I wanted to write more often and was testing other platforms too (CodePen and Medium).

DEV's editor seemed easier to use, and the community larger and welcoming... although I must admit that I was a bit wary, as my first impression was of DEV as a techy version of BuzzFeed.

> Fun fact: one of the reasons why I opted for DEV was because I was thinking of developing a personal blog, and it allowed a canonical link... and then I barely ever used that option 😅

My initial monthly goal was writing 2 posts and recording a video... and while I miserably failed at the video part –I'm too self-aware of my voice, and the few videos I recorded are boooooring and only have elevator music–, the writing part was a little bit more successful:

- 60 written posts.
- 55 published posts.
- 200 received comments.
- 250 written comments.

DEV being such a nice platform for blogging and writing, encouraged me to write even more than I initially expected. And in the process, I had to do research, reading, and a lot of learning... which is nice.

So, thanks DEV for providing the platform and the community... And here it is for one more year of writing 🥂
Why useReducer is acting wired ?
Tags: react, reactnative, javascript
Published: 2020-04-27 05:55:00

useReducer the best alternative for the useState , which is also the recommended one for handling the nested state.

Has anyone who's using useReducer checked the render method after each dispatch ?? If not make a console in the JSX and check in development mode

Recently I've started to work with **useReducer** and typescript found a wired behaviour when I dispatch an action it executed twice . 

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/y9elaelbr2u9w1c53nzb.png)

*Nothing special in the code but it made the rendering twice (only in local)*

Since this is the first time I'm using **useReducer** I got doubt in my code & I spent a lot time in fixing this issue (but not a issue actually).

I started to search whether am I the only one who's facing this issue ? or any one who faced this issue and found a solution?  

The answer I got is much satisfactory because it's from the co-author redux [link](https://github.com/facebook/react/issues/16295)

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/uk9el0rw94j6ad9zwolo.png)

The main thing I've to mark here is **If reducer is pure, and it has to be pure, nothing observable happens**.

 *Thanks for your time* 
*Keep Coding!*
Change Default Pi Username
Published: 2021-11-19 17:30:14

---
title: Change Default Pi Username
published: true
date: 2020-04-26 00:00:00 UTC
tags: 
canonical_url: https://www.weckmann.me/posts/change-default-pi-username/
---

If you’re using Raspbian your default username is `pi`. In this article, I will teach you how to change this username, the password, and remap the home directory. To do this you must first log in as the `root` user. By default, the `root` user has no password enabled. Log in as the `pi` user and enter this command.

```
$ sudo passwd root

```

You should choose a safe and secure password for this user. After you change the `pi` username to your desired username I recommend disabling the root password. Make sure password login for root is enabled by editing the `sshd_config` file.

```
$ sudo nano /etc/ssh/sshd_config

```

Find `PermitRootLogin without-password` it could say something similar. Change this value to `PermitRootLogin yes`.

You can now logout of the `pi` user by entering this command.

```
$ logout

```

If this command fails to work use the `exit` command.

Login as the `root` user now with the password you created.

We need to modify the name of the `pi` user now. Run this command. Replace `newuser` with your desired username.

```
usermod -l newuser pi

```

We need to modify the home directory now to match the new username. Again replace `newuser` with your desired username.

```
usermod -m -d /home/newuser newuser

```

You can now logout of the `root` user and log back in as the username you just created. The password for your username is still the default username for `pi`, “raspberry”. If you wish to change this enter this command.

```
passwd

```

Now enter “raspberry” as the `Current Password` and then your desired password for `New Password` and confirm.

If you wish to lock the `root` user password for security reasons you can enter the following.

```
sudo passwd -l root 

```

You’re all set! Enjoy your new username.

* * *
 

[Reply via email](mailto:arpitbatra123@gmail.com?subject=Reply:%20Change%20Default%20Pi%20Username)
JavaScript Cheat Sheet
Published: 2020-04-27 05:35:10

**Variable Declaration**
var x = 5;
var y = 10;
var length = 16;          
var lastName = "Johnson";  
var x = {
  firstName: "Bean",
  lastName: "Cam"
};         
document.getElementById("demo").innerHTML = x + y;
document.getElementById('demo').innerHTML = 'Hello JavaScript';

**WRITE AND ALERT**
document.write('hello world');
window.alert('Hello World'); or alert('Hello World');

**Calling function**
myFunction(){
  alert('Hello World')
}
<'button onclick="myFunction()">Click me.</button>

function toCelsius(fahrenheit) {
  return (5/9) * (fahrenheit-32);
}
<'p id='demo'><p>
document.getElementById("demo").innerHTML = toCelsius(77);

**Array**
var cars = ["Saab", "Volvo", "BMW"];
var x = cars[1];
cars.sort()
How to kill a stuck Rails server
Tags: rails
Published: 2020-04-27 05:02:37

---
title: How to kill a stuck Rails server
published: true
description: Find the PID of your Rails server and kill it
tags: rails
---

When the `Ctrl + C` shortcut has abandoned you there's a simple way to kill your Rails server if you are under a UNIX OS, say MacOs or any Linux distribution.

The first thing you need is to find the PID of the process that is running the rails server, for it, go ahead and open the file under the following location: `YOUR_PROJECT/tmp/pids/server.pid`

Inside this file, you will find a number, that's the PID you are looking for, just copy it to use it in the kill command that we will use to kill the server.

Once you have the PID of the process, you may use the `kill` command on your terminal to end the rails server:

```
kill -9 <your-pid>
```

Alternatively, if you can't find your PID under the mentioned location, you can look for the processes running under the 3000 port to find the proper ID, depending on your OS, the command to find out what processes are running under a given port may differ.

And that's it, whether it's because your code went under a loop, or because you closed your VS Code editor without ending the rails server, this alternative will help you kill your rails server no matter what.
Why I Positioned Sidebar to the Right
Tags: webdev, editor, productivity
Published: 2020-06-20 11:03:09

---
title: Why I Positioned Sidebar to the Right
published: true
date: 2020-04-27 04:57:12 UTC
tags:
  - webdev #webdev
  - editor #editor
  - productivity #productivity
canonical_url: https://ybbond.id/posts/2020-04-why-i-positioned-sidebar-to-the-right/
---

A few minutes ago, I opened twitter and scrolled the timeline.

{% twitter 1254492579275526145 %}

<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

I laughed when I read that tweet. It brings back so much memories of my previous workplace.

Positioning the sidebar to the right reduces distraction when I toggle it. If the sidebar is on the left, the text shifts around whenever the sidebar is toggled on or off. Readjusting my eyes for the moved text creates disturbance to my logical thinking. “Why are you not just leave the sidebar open?", you might be asking. I want to keep the screen real estate wide.

Back then, I often toggle the sidebar because two reasons. First, the project I was working on uses **Redux** - **Saga**. Second, I used to use **VSCode**.

Redux-Saga is a great states and IO management for React, I was blown away when I was first using it. Sadly, cannot grok the Redux paradigm easily. I often need to see the file structure when I write new files or refactoring. My current project uses Apollo GraphQL and Domain Driven Development paradigm. I am comfortable using the current setup.

In VSCode, manipulating file must be done with mouse. Using the built in **Git** also done in the sidebar, with mouse. Nowadays I use **NeoVim**. File management can be done easily with text command. If a more complex file management must be done, which is rare, I use **NerdTree**. Versioning with Git is done with the help of **vim-fugitive** which I found less disturbing.

**As a closing**: if you often toggle the sidebar, try positioning it to the right. That is, if your editor supports that configuration. It might help reduce the distraction when you need it the most.