teleren/devto huggingface dataset:
As a BackEnd Dev, what is your biggest struggle while learning Front End Technologies?
Tags: javascript, discuss, career, learning
Published: 2020-03-23 04:41:38

For me, the biggest struggle while learning Front End Technologies was to distiguish between what is worth learning and revelant and what is not. 

It was early 2016, when Angular 2 was a romour, IE was still supported, flexbox was emerging but not yet supported by most modern browsers. 

A few questions that exemplify my struggle were the following:

* Desciding between using [bower](https://bower.io/) and [npm](npmj.s) as a package manager.
* Choosing a first JS freamework to learn, my candidates were: Angular, Angular 2 that was about to be realeased, Ember or React.
* Should I learn ES6?
* Should I learn Typescript or CoffeeScript?
* Grunt or Gulp? What about Yeoman?

What about you:

As a BackEnd Dev, what is your biggest struggle while learning Front End Technologies?
E-commerse websites' traffic increases during COVID-19
Tags: help, javascript, html, php
Published: 2020-03-23 03:38:59

As they become so popular, e-commerce websites will be a leading branch  in market. What are the steps for running an e-commerce website? 

1.First of all, you'll need to take the domain you want for the environment. E-commerce being less expensive will result a better profit.

2.Afterwards, you need to choose a proper template to make things simple. Believe me, 90% of people who are interested in your product will at first try to calculate their expenses before tapping that 'add to cart' button. Simplicity is the key.

3.Once you have chosen the website design, but it doesn't seem to be so appealng you can turn to editing it any time you feel the need. Customizability is another key factor not to lag behind and be the bearer of trendy design.

4.Finally, after the construction of the display windows of your domain, you want to have as many guests in your website as possible. For that purpose you can choose the contemporary weapon of social media marketing, or the SMM in short. Moreover, with the help of influencers that promote your goods or services,such as [loan lending](shinyloans.com) or [healthcare](doctorsnetwork.com),  your website will have a better rate - appearing in the first pages of search results.
Want to be part of a botnet that could potentially provide new medical information on COVID19 RNA? There's an app for that
Published: 2020-03-23 03:32:49

https://foldingathome.org/start-folding/

99% of the time, you would not voluntarily join a botnet. But this software runs on idle machines and uses their GPU/CPU processing cycles to help scientists and academic institutions run calculations.

They study several diseases and now we have a new one to add to the list.

If you configure the software properly you will volunteer your electricity and hardware as a "bot" in a network of other volunteers (Thus my cheeky use of the term). The devs do not refer to their project as such. 

You too can help debug this new pest  and contribute to a COVID19 antivirus! 🤠
【WordPress】ページネーションのstyleテンプレ
Tags: wordpress
Published: 2020-03-23 03:22:35

```
.navigation { 
text-align:center;
font-size:20px;

}

.navigation a{
text-decoration:none;
}

.navigation .next{
display:flex;
justify-content: center;
background:#003366;
color:#fff;
margin:12px 0;
}

.navigation .prev {
display:flex;
justify-content: center;

}

  .page-numbers.current{
    color:#00a1ff;
  }
```
It's alive. Devlog it's alive!
Tags: nonimportant
Published: 2020-03-23 03:20:38

---
title: It's alive. Devlog it's alive!
published: true
description: I did a thing.
tags: nonimportant
---

It's alive and it's beautiful (to me). You can find it [here](https://vonheikemen.github.io/devlog/)

Anyway, it's a blog thing. Powered by [Zola](https://www.getzola.org/). It's very very basic but it has multi-language support (kinda, just english and spanish). It has syntax hightlight and codepen integration (kinda).

Oh, and [here](https://github.com/VonHeikemen/devlog) is the source code.
Linked Lists
Tags: datastructures
Published: 2020-03-22 23:30:13

#What is a Linked List?

A Linked List is a type of linear data structure, where the elements are not stored at a contiguous location and are linked using pointers. Each element contains data and a reference to the next node. They do not have a reference to the previous node(singly linked list) unless it is a doubly linked list. This post will cover singly linked lists and their advantages/disadvantages over an array.



##Traits of a Linked List
![Linked List representation](https://www.geeksforgeeks.org/wp-content/uploads/gq/2013/03/Linkedlist.png)
Each element, or node, is comprised of two items - the data and a reference to the next node, except for the last node which has a reference to null. The entry point into a linked list is called the head of the list. The head is not a separate node, but a reference to the first node. If the list is empty then the head is a null reference. 

A linked list is flexible with the amount of elements it can contain. The amount of nodes in a list is not fixed and can grow or shrink on demand.

##Advantages

_Dynamic sizing_

The size of arrays are fixed. This means we need to know the upper limit on the number of elements in advance. With a linked list, we don't have that limitation. Linked lists are favored when we are dealing with an unknown number of objects. 

_Insertion/Deletion_

Insertion for arrays is expensive because the room has to be created for the new elements, which also means to create room existing elements have to be shifted. Insertion for linked lists takes constant time(O(1)) for beginning or end insertion as the only steps are to initialize a new node and then update the pointers. However, insertion to the middle of the linked list takes constant time since you need to iterate over *n* elements to get to the correct location before inserting the node. The same goes for deletion: beginning and end deletion takes constant time(O(1)) while deleting in the middle take linear time(O(n)).

##Disadvantages 

_Random Access_

Arrays support Random Access, which means elements can be accessed directly using their index in constant time(O(1)). For a linked list, the time complexity for accessing an element is linear(O(n)), as you do not have direct access to the individual elements like an array does. 

_Memory Cost_

Linked lists require more memory per node as additional storage is required for pointers.
How I handled configuration in my Node CLI package
Tags: node, cli, npm
Published: 2020-03-23 02:10:13

Many folks in the United States are now working from home and social distancing. I am one of them. After cleaning, noodling on the guitar, reading, and pacing around for some time I decided to revisit an open source project I haven’t touched in a year or two: [get-open-prs](https://github.com/sdotson/get-open-prs).

[get-open-prs](https://github.com/sdotson/get-open-prs) is CLI that allows people to quickly see the pull requests opened by their teammates from the command line. Not only that, it’ll allow you to quickly toggle through them with the arrow keys, and when you hit enter, your browser will automatically open that pull request. It does this by saving a Github personal access token and a list of Github usernames representing your teams. Of course this is overridable and changeable at any point.

I’d like to talk about the biggest change I made to this package, which related to configuration.

I moved away from environment variables for the Github usernames and token to a library called [conf](https://github.com/sindresorhus/conf#readme). Environment variables were a quick and dirty solution but not terribly user-friendly in my opinion. I had considered [node-config](https://github.com/lorenwest/node-config) as well, but it seems like that solution is more geared towards backend services and not CLIs. The biggest disadvantage is that node-config doesn’t work correctly for globally installed packages.

[conf](https://github.com/sindresorhus/conf#readme) does work because it sets the configuration in a file that is in the operating system default location for application configurations. For mac that would be `/Users/username/Library/Preferences`. This is determined by a dependency called [env-paths](https://github.com/sindresorhus/env-paths#pathsconfig).

I added more prompts to automatically guide the user through setting these values for the first time and save them with conf. I feel that this makes this tool way more user-friendly.

The other change I made inspired was inspired partly by [my experiences with Clean Architecture](https://engineering.upside.com/eternal-sunshine-of-the-spotless-architecture-75f4298125e1). I refactored the main function so that dependencies are injected into a higher order function that then builds the function I use for the app. There’s still more that I can do but I feel a lot more secure that this CLI does what it’s supposed to do with these tests. When I have time, I’d like to write more tests for some of those dependencies to get the code coverage up, and perhaps switch to typescript so I can more explicitly define some of the interfaces.

[Check it out](https://github.com/sdotson/get-open-prs)! I’m definitely open to feedback, suggestions, and of course, pull requests.
Inspecting ES6
Tags: javascript
Published: 2020-03-23 01:54:37

While several editions have been released since ES6 was released in 2015, it remains one of the most impactful updates to JavaScript (and JScript & ActionScript). ECMAScript "is a scripting-language specification standardized by Ecma International. It was created to standardize JavaScript to help foster multiple independent implementations... ECMAScript is commonly used for client-side scripting on the World Wide Web, and it is increasingly being used for writing server applications and services using Node.js." - Wikipedia (https://en.wikipedia.org/wiki/ECMAScript).

ES6 was particularly noteworthy for several reasons:
1. Better scope management with new variable keywords 'let' & 'const'.
2. Less cluttered and more digestible code with addition of arrow functions.
3. More universally intuitive syntax with ability to create classes.
4. More powerful functions with ability to set default parameter values.
5. Better efficiency with additions of 'Array.find()' & 'Array.findIndex()'.
6. Easier exponentiation with addition of '**'.

The addition of the variable keywords 'let' and 'const' improved on the existing variable keyword 'var'. Before ES6, variables either belonged to function scope or global scope. The addition of 'let' and 'const' allowed for block scope. This created less buggy code.

Arrow functions are helpful in creating concise code. While a normal function declaration requires at least 3 lines of code, an arrow function can often accomplish the same in one line. 

Though both classes and functions are actually objects in JavaScript, the ability to use either allows programmers coming from different disciplines to write intuitive and powerful code without a steep learning curve. 

The ability to set default parameter values can greatly increase the effectiveness of your function. This allows for inputs that may not contain all the information that other inputs contain. 

The additions of 'Array.find()' and 'Array.findIndex()' allows for quick and powerful solutions to array problems. It is common to use one of these built-in functions when dealing with an Array that contains one desired element.

For any programmers that like their code to mirror the way they think about a problem, the '**' operator was a welcome addition. Before ES6 programmers used the 'Math.pow()' function for exponentiation. The addition of '**' allows programmers to write code that looks similar to how one would write exponentiation on paper.

These updates were just some of many that were included with ES6. While ECMAScript is constantly evolving, I felt that ES6 was a special iteration and was worth exploring. 


Sources:

https://www.w3schools.com/js/js_es6.asp
Building a open source e-commerce platform
Tags: javascript, devjournal, typescript, graphql
Published: 2020-03-23 01:22:12

I'm going to build an open source e-commerce platform with TypeScript, Next.js, and GraphQL.

This will be my first large open source project.

I have a lot of ideas for the future of e-commerce.

I also feel that an e-commerce platform has very interesting problems.

I will use TypeScript because although it has an initial upfront investment it pays off in safer code and faster development.

I also want to eventually use Clojure and ClojureScript.

I am also looking for people who want to help.

Follow my progress on Github!
https://github.com/albertstartup/indieshop-admin
Job Search in Uncertain Times
Tags: codenewbie, codepen
Published: 2020-03-23 00:39:12


I have been a professional poker player for 8 years. Over the past 6ish months, I have been self-teaching myself to code. I started my job search just over a week ago right before the corona shut-downs hit hard. Needless to say, I have pivoted my game plan and lowered my expectations.

There is a lot of uncertainty in the world, but I plan to concentrate on what I can control. I will focus on consistently working towards becoming a better developer. Time will not be an issue over the next few months. The goals are clear and simple. <strong> Consistency. Focus. Deep learning.</strong> 

For reference, here is what I have done so far:

<li> Used Codecademy to learn syntax of languages - Python, JS, C++
<li> Built a basic Javascript Todo list app using the Watch and Code tutorial.
<li> Focused on deep learning and problem solving with AlgoExpert. Python has been my main point of focus.
<li> Utilized python, flask, and docker to build a blog app with the Mega Flask Tutorial
<li>Read the book Thinking Python
<li> Working on FreeCodeCamp Responsive web design

My daily process going forward will be simple and easy to execute. I will be applying to 1 job a day. Next, I will do 2 algorithm problems. The first problem will be an easy C++ problem that I am already familiar with. I find that my brain learns the language better when I am trying to solve problems. I will focus on a difficult Python problem that I have never seen before. The goal is to push my problem solving skills. This will take about 3 hours of my day. With the rest of my time, I will be working towards the free code camp certifications and building the projects (fingers crossed for a python certification coming out later this year).

[Here is my first freecodecamp page for responsive web design](https://codepen.io/erhallow1123/pen/vYOaXZL). I will be sharing my projects and work over this time. I hope that this can be a reference to other self-taught developers when they search for jobs. I will talk about job applications, building new projects, new topics I learned, and interview prep. 

Thanks for reading and I hope you all follow along!
Binary Search Trees - Part II/?
Published: 2020-03-22 23:28:14

Welcome to part two of this series of indeterminate length, where I attempt to break down Binary Search Trees into manageable bits. In Part I, I went over what a Binary Search Tree is, and the different forms they can take. In Part II we'll look at how to represent one in code - which turns out to be pretty easy!

Ultimately all you need to represent a binary search tree in code is a "Node" class. Each node will have three properties - data, a left child, and a right child. Each child will also be a node, with its own children. If it does not have any children, they will simply be listed as null. 

Below is an example implementation of this class in JavaScript:


```
// Node class 
class Node 
{ 
    constructor(data) 
    { 
        this.data = data; 
        this.left = null; 
        this.right = null; 
    } 
} 
```

In order to make a really functional binary _search_ tree, though, you of course need to make some functions to go along with! If it were me, I'd encapsulate all those into a nice, neat, wrapper class. We can just call it BinarySearchTree.

Inside that class we can include functions for adding and removing nodes, for accessing the root, for determining if a node exists, all sorts of things. Here is an example class with a few sample functions blocked in:

```
// Tree Class
class BinarySearchTree 
{ 
    constructor() 
    { 
        // root of a binary search tree 
        //while currently null, will be a node once you start filling the tree!
        this.root = null;     
    } 
  

    // functions:
 
    // insert(data) 
    // remove(data) 
                  
  
    // Helper functions
    // findMinNode() 
    // getRootNode()
    // search(data) 
} 
```

We'll cover implementing these functions in future posts, since other than getRoodNode() they are all pretty complex. 

Part II turned out to be pretty short! Next time, adding and removing nodes, and what to do with duplicates.
My goal...
Tags: gamedev, unity3d, beginners, csharp
Published: 2020-03-23 00:10:23

My goal is to reach 200 subscribers on Youtube. I'm a 14 year old gamedev. My channel is mainly based around gamedev. If you could subscribe that would mean a lot :)

https://www.youtube.com/channel/UC8Kqr21rinohnhoUkp3lGWw
Coronavirus Charts Site
Tags: coronavirus, stayathome, dontgoout, vue
Published: 2020-03-23 00:03:22

---
title: Coronavirus Charts Site
published: true
description: Just a site I made to help visualise the way coronavirus is affecting countries all around the world
tags: coronavirus, stayathome, dontgoout, vue
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/skq1uswpmt203n05ok1r.png
---

Over the last week I have been working on this site about <a href="https://coronaviruscharts.site/">coronavirus</a> to help visualise the way coronavirus is affecting the whole world. The charts get updated from data retrieved by scraping the web from sites like <a href="coronavirus.jhu.edu">Johns Hopkins University</a> and <a href="https://www.worldometers.info/coronavirus/">worldometers</a>. 

The site gets updated automatically (every 6 hours due to pipeline restrictions of the free version I am using) many times throughout the day as well as manually every few hours. 

I will keep on adding features I think are necessary so you are more than welcome to add comments in the section bellow and I will try my best to add them if they seem necessary. 

The site is quite responsive so you should be able to use it easily on any screen size mobile/tablet/desktop.

The two main pages the site has at the moment is visualising information on a daily basis and visualising total information. You can choose to see the information for the whole world and per country by selecting the corresponding country on the map.

I hope you find this site informative as the sole purpose of it is to help visualise this data I have managed to collect.

The web app has been built using VueJS, Vuetify for shared components and Google Charts for displaying the data.

https://coronaviruscharts.site/

#stayathome
Building Request Metrics
Tags: javascriptwebdevtutorial
Published: 2020-03-23 12:46:04

---
title: Building Request Metrics
published: true
date: 2020-03-23 00:00:00 UTC
tags: javascript webdev tutorial
canonical_url: https://trackjs.com/blog/request-metrics/
cover_image: https://trackjs.com/assets/images/blog/2020-03-20-request-metrics.min.jpg
---

We’ve been working on something big. We’re **[building Request Metrics](https://requestmetrics.com/)**, a new service for web performance monitoring.

<iframe style="position: absolute; width: 100%; height: 100%; left: 0; top: 0;" src="https://www.youtube.com/embed/NhTcdbd-zYA" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" frameborder="0"></iframe>

TrackJS is a fantastic tool to understand web page errors, but what if your pages aren’t broken, just slow? What if the checkout page takes 10 seconds to load? What if that user API is slowing down from your recent database change? What pages have the worst user experience? Request Metrics will tell you that.

“So what Todd, there’s lots of performance monitoring tools available.” Yes, but they suck. Today’s performance tools require too much configuration and setup. There’s mountains of data to store, dozens of knobs to turn, and alerts to configure. You spend days getting them working, only to have pretty charts that don’t actually tell you anything or dense query languages that you’ll never fully understand.

And you get to pay thousands of dollars for them too!

_Request Metrics is going to be the fastest, the simplest, and probably the cheapest performance monitoring tool ever._ Request Metrics will natively expose the most important performance information. It will automatically alert you when you need to pay attention. And all you need to do is paste our agent in your page.

Plus, it’s going to be cheap enough that any team can use it.

## The Best Part

The best part is that you get to see how we build it! We’ve been recording the development of Request Metrics and publishing episodes for each topic we tackle. You can see how we [started the project with .NET Core](https://requestmetrics.com/making-of/episode-1-file-new-project), how we [configured our first Linux server with Ansible](https://requestmetrics.com/making-of/episode-3_5-basic-ansible-with-ssh-keys), and how we [build and deploy the code](https://requestmetrics.com/making-of/episode-1-file-new-project).

Our first 8 episodes are live now on [our YouTube channel](https://www.youtube.com/channel/UCIklNDcnPT8_eVFM1oOoQyA), with new releases every week. Subscribe to it for updates, or [join the Request Metrics newsletter](https://requestmetrics.com/newsletter/).

* * *

Development is considerably farther ahead of the videos (editing takes a long time). And we’re already testing things internally. It’s so good. We’re going to open it up for beta users in a few weeks, and [Request Metrics subscribers](https://requestmetrics.com/newsletter/) will be the first to know. So be sure to join.
NGINX
Tags: ubuntu, reminders, nginx
Published: 2020-05-10 09:57:12

---
title: NGINX
published: true
date: 2020-03-23 00:00:00 UTC
tags: ubuntu, reminders, nginx
canonical_url: http://jamessessford.com/blog/nginx
---

NGINX has been my web server of choice for quite a few years now.There are many approaches for fine tuning but the template below serves as the starting point for a new Laravel project:

```
server {

    ## Begin - Server Info
    listen 80;
    index index.html index.php;
    root /home/user/site/deploys/current/public;
    server_name site.test;
    ## End - Server Info

    ## Begin - Index
    location / {
        try_files $uri $uri/ /index.php?$query_string;
    }
    ## End - Index

    ## Begin - PHP
    location ~ \.php$ {
        fastcgi_pass unix:/var/run/php/php7.3-fpm.sock;
        fastcgi_split_path_info ^(.+\.php)(/.+)$;
        fastcgi_index index.php;
        include fastcgi_params;
        fastcgi_param SCRIPT_FILENAME $realpath_root/$fastcgi_script_name;
    }
    ## End - PHP

    ## Begin - Security
    # deny all direct access for these folders
    location ~* /(.git|cache|bin|logs|backups|tests)/.*$ { return 403; }
    # deny running scripts inside core system folders
    location ~* /(system|vendor)/.*\.(txt|xml|md|html|yaml|php|pl|py|cgi|twig|sh|bat)$ { return 403; }
    # deny running scripts inside user folder
    location ~* /user/.*\.(txt|md|yaml|php|pl|py|cgi|twig|sh|bat)$ { return 403; }
    # deny access to specific files in the root folder
    location ~ /(LICENSE.txt|composer.lock|composer.json|nginx.conf|web.config|htaccess.txt|\.htaccess) { return 403; }
    ## End - Security
}
```

## Continuous Delivery

The NGINX setup I'm using above allows me to achieve continuous delivery of my projects; `/current/` is symlinked to the correct folder during my deployment process.
JavaScript: Problem with document.write
Tags: help, javascript, html, script
Published: 2020-03-22 23:54:52

Hi guys! I have a problem.
By this script https://pastebin.com/XJ17NJ5E I would like to open the page linked (in this case https://www.google.com/) and add to the html page a a pair of SCRIPT tags. But after putting it in, it removes the rest of the HTML page. How do I solve it?