teleren/devto huggingface dataset:
Infinite Scroll
Published: 2020-06-28 04:55:05

Concerning infinite scroll in JavaScript I happened to come across this solution.
```
var listElm = document.querySelector('#infinite-list');

// Add 20 items.
var nextItem = 1;
var loadMore = function() {
  for (var i = 0; i < 20; i++) {
    var item = document.createElement('li');
    item.innerText = 'Item ' + nextItem++;
    listElm.appendChild(item);
  }
}

// Detect when scrolled to bottom.
listElm.addEventListener('scroll', function() {
  if (listElm.scrollTop + listElm.clientHeight >= listElm.scrollHeight) {
    loadMore();
  }
});

// Initially load some items.
loadMore();
```
Here we have three javascript methods that are ran against our main element:  scrollTop, clientHeight, and scrollHeight.

scrollTop, when applied to an HTML element, is a measurement of the distance from the top of the element to its top most visible content.

clientHeight, on the other hand, is the inner height of the element in pixels.

scrollHeight then is the height of an element's content, including that which is not visible on the screen.

In our solution we identify the element in question, labeled by the "infinite-list" id.  Next we define our function which will add new items to the unordered list, declaring which item we are at then defining a function which will add more items to the list.

Finally, we add an event listener to our initial element, listElm.  This takes the size of our initial element and checks to see if after scrolling the inner height is greater than or equal to the total height of the element.  

If it is, run our function again to add more elements!  Forever!!  :)
My own journey (Part 3)
Tags: career
Published: 2020-06-28 04:18:34

## The last days of school

The last two semesters were really draining to be honest. I had put a lot of effort to keep my grades healthy, and was doing my best to contribute meaningful work on my internship.

I was also expecting my second baby and my life felt like it was upside down at times 😅. But I have to recognize that life has treated me well even if I had my struggles and I am so very grateful for it. I've been surrounded of amazing and uplifting family and friends who have pushed me forward ever since I was a kid. I love my family from when I was a kid 😁.

I mentioned before I worked with someone who eventually became my friend. He contacted me on the phone while I was on my last semester at school and asked what I wanted to do after I finished.

## My first official job

So I said I didn't really have a plan. Microsoft would have come to a recruiting session to one of the Campus months prior, but I didn't quite pass the initial test; also another company that looked awesome and that I contacted during a job fair organized by the school had reached out but I didn't get in either.

So, back to the phone call: my friend asked me if I was interested in interviewing with the company he was working with because they were looking for new hires.

I accepted, got hired and 2 weeks before I graduated I had a job!!!

This was a huge relief to my newly created family and we had the opportunity to have a not-so-bad start. Life was weird for me because I felt like I went from "one of the children of the household" to "the person responsible to feed other people" all of a sudden, but there was I.

The job was really good actually. The perks were good, the pay was more than I originally asked for and I was learning a ton of things about something called Microsoft Dynamics AX at the time. So learning X++ and a little bit of .NET with C# was part of my daily routine. I would also help here and there with IT support, but there was a team dedicated to that and I was part of a development focused team.

This was a really nice place to be, actually. And I am very grateful to have had that opportunity to work and learn and especially meeting more friends that I still talk to and joke about our adventures with the AX migration and the rest of the people in the office. Good times!
My Blog site 🧾
Tags: webdev, beginners, javascript, gatsby
Published: 2020-06-28 04:10:36

Hello Dev Community!

Hope everyone is safe.
I would like to share [my blog](https://blog.rishabkumar.ga) which I recently created. I didn't change much from the Gatsby minimal template by [LekoArts](https://www.gatsbyjs.org/starters/LekoArts/gatsby-starter-minimal-blog/).
- [Live Site](https://blog.rishabkumar.ga)
- [Github](https://github.com/rishabkumar7/blog)

### Why am I sharing this🤔:
The purpose of this post is to get some feedback, as I am still a beginner in front-end development.
Let me know what you guys think and what can be improved📈!
Also, I would love to know that if you guys think there should be only one site for blog and portfolio or they are fine as separate? I am not sure if there is an industry standard for this? 🤔
Also, should I use this template or create my own, once I know Gatsby enough I guess.
A (not so) brief introduction to using the Python database API
Tags: python, database, oracle, postgres
Published: 2020-06-28 03:55:11

---
title: A (not so) brief introduction to using the Python database API
published: true
description: Database access using Python, and some investigations
tags: Python, Database, Oracle, PostgreSQL
//cover_image: https://direct_url_to_image.jpg
---

I've had this post in the works for a while now, and I'm pleased to say that I've finally hit 'publish'. 


Earlier this year I promised a friend at #PyladiesBne that I would write something about using databases with #Python, specifically #Oracle and #PostgreSQL. Here it is: 


https://www.jmcpdotcom.com/blog/posts/2020-06-03-a-brief-introduction-to-the-python-database-api/


It's not actually brief, because I got sidetracked. You know how it is when you have this dataset and realise that you can ask more questions than you expected....


That's just an occupational hazard for a #DataEngineer!
Learn how operating systems work
Tags: linux, tutorial, computerscience
Published: 2020-06-28 03:50:56

*Operating Systems* are a major part of our lives. Mobile phones, computers and the cloud — which serves as a backbone of the entire internet — utilize them every single day. However Operating Systems are not limited to these complex machines, for example MiniOS which is developed for Arduino. This post aims to provide a better understanding of how Operating Systems are developed in a very simplistic manner. Furthermore how various components work together to make a computer do things that we expect from it. Developing a fully fledged Operating Systems from scratch is a lot of work and a huge commitment. 

We will be diving into the details of components such as Bootloaders, Kernels and Drivers which play a key role to make use of the hardware. These **low level programs**, bunched together, working in harmony is what enables us to use our computers and other devices every day 

> An operating system is usually described as a piece of software which enables users to interact with a hunk of metal. 

Traditionally one would say it is essentially a program which runs other programs. So that makes it *the first program*. In other words, everything you do on your computer is totally dependent on the Operating System, directly or indirectly. A few key components of an Operating System are : 

* the Kernel 
* the Bootloader  
* the Drivers 

These three components and many others work together to create an abstracted layer for the user by which they can interact with the machine easily. Essentially these programs are the ones who interact with the bare metal. Example when you press a key on your keyboard, the computer knows which key was pressed and does the job accordingly. Your monitor displays certain stuff depending on the given input so on and so forth. It also interacts with your RAM, CPU and other components in different ways. 

# Overview of an operating system

![](https://www.researchgate.net/profile/Sakshat_Shinde/publication/341001566/figure/fig1/AS:885623338569730@1588160466543/A-basic-working-of-an-Operating-System_W640.jpg)

If you wish to know more about the individual components, checkout my paper linked below which explains those components in detail.
*It's relatively easy to understand, I promise :p*

[Research paper : In depth explanation here](https://www.researchgate.net/publication/341001566_Piecing_together_a_basic_Operating_System)

If you want to see how things are implemented in *code* look no further. It's also a tutorial :D

[Simple implementation of an operating system](https://github.com/cfenollosa/os-tutorial)
What our your thoughts on the new Hey email service?
Tags: discuss, productivity
Published: 2020-06-28 03:28:31

I ran a poll on Twitter that is still going, but I'm wondering what folks on DEV think of the new Hey email service. Is it worth it or are you fine with GMail and the rest of the old guard? I am still conflicted.

{%twitter 1277000517294665731 %}
Concurrency in Go
Tags: go, tutorial, video
Published: 2020-06-28 02:27:16

{% youtube yNOe3STbtGE %}

My second programming tutorial on go, this time on the basics of its concurrency primitives.

I applied some of the feedback from the first video and applied it to this one.

I contemplated talking about a few concurrency patterns commonly used in go in this video as well, but decided it would be better to do that in a separate video. That way I can give each the time it deserves.

Let me know what ya'll think about it.

If you liked it and want to know when I post more, be sure to [subscribe] (https://www.youtube.com/channel/UCTHij3Ac5GizLsn5yB4IX_Q?sub_confirmation=1) and thank ya'll again for your time!
Lens in 2007
Tags: haskell, functional, history
Published: 2020-06-28 02:26:17

[Making Haskell nicer for game programming | Luke Palmer](https://lukepalmer.wordpress.com/2007/07/26/making-haskell-nicer-for-game-programming/)

Luke described in this 2007 blog post an `Accessor` type:

```haskell
data Accessor a
    = Accessor { readVal :: Game a
               , writeVal :: a -> Game ()
               }
```

And used C macro to generate this for each field, and defined some familiar operators for it.

Nowadays the [lens](https://hackage.haskell.org/package/lens-4.19.2) library is the most popular implementation of this pattern, and Template Haskell is used for generating the field lenses. The first version of the lens library was uploaded to Hackage in 2012. There might be even older examples of this pattern. 

How long does it take for a spark of ingenuity like this to develop into a field of research? How long then does it take for the research to become mature applied library? How much is it worth to do so?
Sum root to leaf numbers, solving an Amazon interview question
Tags: computerscience, tutorial, javascript, career
Published: 2020-06-28 02:25:49

<strong>Question :</strong> Given a binary tree containing digits from 0-9 only, each root-to-leaf path could represent a number.

An example is the root-to-leaf path 1->2->3 which represents the number 123.

Find the total sum of all root-to-leaf numbers.

Eg : 
```javascript 
         1
        / \
       2   3
```

For the tree above, 
Path 1 = 1 -> 2  = 12
Path 2 = 1 -> 3  = 13
Output will be 12 + 13 = 25  

Just by reading the question, we can say that we've to traverse the tree, but we've to traverse in such a way that the parent -> child relation is maintained. 

<strong> Depth First Traversal </strong> is a type of traversal in which we select a node, and explores as far as possible along each branch before backtracking.

An animation from Wikipedia : 
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/fuqpnw5vel1p24gr3p44.gif)

Converting it to code:

```javascript 
   dfs(node){
       if(node == null) return;
   
       // do something
    
       dfs(node.left);
       dfs(node.right);
   }
```

Next is how to process the value at the current node, if we look closely, at each level we're multiplying previous level result by 10 and add the value at the current node level. 
Something like this : 
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/75u6ysy2p9iqpl09l46b.png)

```javascript
  dfs(node,prev){
      if(node == null) return;
      
      let curr = prev * 10 + node.val;
      
      dfs(node.left,curr);
      dfs(node.right,curr);
```

A bit about call stack :

Since here we're recursively calling dfs, for each call a separate call stack is maintained which tracks the <strong> root -> current node </strong> value and it doesn't interfere with root -> node value of other nodes since they exist in a separate <strong> call stack </strong>. See animation at the end to understand this better.
      
The last obstacle is how to return the computed value.

We know that a leaf node is a node whose left and right child are null , that's our clue to return the <strong>root -> leaf</strong> value for a particular subtree path.

```javascript 
    if(root.left == null && root.right == null) 
       return prev*10 + node.val;
```

When we come across an internal node, we just add the values returned from the left and right subtrees and return it. 

```javascript
     return dfs(root.left,curr) + return dfs(root.right,curr);
```

Visualizing each step : 
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/04azzyw94qy54tzb7j5n.gif)

Putting everything together in a code : 

```javascript
var sumNumbers = function(root) {
    return dfs(root,0);
};

function dfs(node,prev){
    if(node == null) return 0;
    if(node.left == null && node.right == null){
        return prev*10 + node.val;
    }
    
    let curr = prev*10 + node.val;
    
    return dfs(node.left,curr) + dfs(node.right,curr);
}
```

I hope you liked my explanation :D

github : https://github.com/AKHILP96/Data-Structures-and-Algorithms/blob/master/problems/rootToleaf.js
🇨🇴 Encuesta de Salarios de Programación en Colombia - 2020
Tags: colombia, data, salaries
Published: 2020-06-28 02:06:44

En el 2016, con el fin de entender mejor el mercado laboral Colombiano de Programación de Software [publicamos una encuesta salarial](https://medium.com/colombia-dev/encuesta-de-compensaci%C3%B3n-de-programadores-en-el-territorio-colombiano-2016-b6af01c8c19). Aunque dijimos que la íbamos a hacer cada año, nos enredamos un poco en el camino y no lo hicimos (😅 culpa mía). Finalmente nos hemos organizado, y hoy publicamos una encuesta actualizada para 2020.

Igual que la encuesta anterior, los resultados estarán disponibles de manera abierta y bajo [licencia Creative Commons](https://github.com/colombia-dev/data/blob/master/license.md) en un [repositorio en GitHub](https://github.com/colombia-dev/data/tree/master/salaries) para que sean analizados por la comunidad. 

Esta encuesta es importante por que creemos que la transparencia salarial nos ayuda a crear una industria más saludable, y beneficia tanto a empleados como a empleadores. Por un lado, las empresas pueden evaluar mejor la competitividad del mercado sin tener que pagar estudios salariales costosos y por otro lado, los empleados podemos entender cómo se compara nuestra experiencia al mercado. 

Por favor llena la encuesta si:

- vives en Colombia, sin importar de donde vengas.
- tienes un trabajo que requiere Programación de Software.

Entre más personas llenen la encuesta, mejores datos vamos a tener. Por favor comparte este post en [Twitter](https://twitter.com/intent/tweet?text=%F0%9F%87%A8%F0%9F%87%B4%20Acabo%20aportar%20a%20la%20Encuesta%20de%20Salarios%20de%20Programaci%C3%B3n%20de%20Software%20para%202020%20organizada%20por%20@colombia_dev.%0A%0ASi%20quieres%20aportar%20a%20la%20transparencia%20salarial%20en%20nuestra%20industria,%20ll%C3%A9nala%20t%C3%BA%20tambi%C3%A9n%20en%20https://bit.ly/encuestacoldev20), Facebook, el Slack de tu trabajo o cualquier otro lado que puedas. 

Esta encuesta es **100% anónima**, y recibiremos respuestas hasta la media noche del 20 de Julio de 2020. 

[**💻 Haz click aquí para llenar la encuesta.**](https://forms.gle/ei6GadL79ZfiZdGK7)

Si quieres estar al tanto de los resultados puedes seguir a [@colombia_dev](https://twitter.com/colombia_dev) o a [@buritica](https://twitter.com/buritica) en twitter.
New to JavaScript Project Ideas
Published: 2020-06-28 02:01:39

I struggled when I started learning JavaScript. What helped me the most were projects and labs that were fully immersive. With this, I learned where I should focus my learning more on and I was able to apply concepts that I had trouble with on projects. Not only did I understand it better but my application of it, improved. So here is a list of projects and labs that I enjoyed while learning JS.

1. To Do List
Yes you can probably do this any language but it's simple and you can get creative with it. This help you explore and play with JS functions. This will also help with understanding DOM manipulation better.

2. Anything that holds cards
Get data of anything then put those into cards. This will help with rendering things on page and also experimenting with time on JS. This is also very helpful with adding things to the DOM.

3. Like or Comment
Adding a like or comment animation is very helpful in working with both JS and DOM manipulation. If you want, you can take this a step further and add the backend to it.

4.Easy Game Animations
This can be as simple as moving a bar across the screen with arrows but it did help a lot when I started with JS.

5. Anything with Filtering or Toggles
One of the labs we had worked with both filtering and toggling. Learning this is crucial because most websites have some kind of filtering or toggling involved.

6. Menu Listing
Have a list displayed then make that into an even bigger list by displaying more information and even pictures after clicking on the one of the items on a list.

7. Play with Backgrounds and Text Color
Actually decorate and play with color as you click on different things. This will help you get used to using event listeners.

8. Some Kind of Tracker
For my final project on this module, my group built a fancy job tracker. It helped solidify everything we learned in JS and DOM manipulation.

Hope this gave you some ideas! Enjoy your projects!
Chapter 5: Franc-ly Speaking
Tags: tdd, kentbeck, book
Published: 2020-06-29 01:08:43

---
title: Chapter 5: Franc-ly Speaking
published: true
date: 2020-06-28 00:00:00 UTC
tags: tdd, kentbeck, book
canonical_url: http://www.emmanuelgenard.com/tdd_by_example/chapter-5-francly-speaking.html
series: TDD by Example - A very long book report
---

# Chapter 5: Franc-ly Speaking

## Summary

Beck wants to implement multi-currency multiplication but can't because we only have one currency implemented, `Dollar`. So in this chapter he does a quick and dirty implementation of `Franc`. He copies the code in `Dollar` and renames the class `Franc`. Beck acknowledges that most programmers would consider this bad code but makes the case the the first goal is to get a green test. Once you have a green test, you can then improve the design with a refactoring.

## Commentary

> Good design at good times. Make it run, make it right.

This quote by Beck reminds me something I've heard about writing: "The only kind of writing is rewriting". It's supposedly from Ernest Hemingway. Writing is about getting something, anything, down and then working it until it's good. I think Beck is advocating the same thing for writing programs. You could say that he thinks clean code is _cleaned_ code.

However, I almost never see this attitude. In my experience there is an expectation of a good design immediately. I feel this pressure almost every time. Every time I try to make it run then make it right, I feel like I'm doing something wrong. There seems to be an unstated norm that a good programmer is able to do a good design right away. This maybe some imposter syndrome on my part or some other projection of my fears and insecurities. Nonetheless it feels risky not not make it right, right away.

I think another reason is that I don't always know when I have a good or bad design. When is the code clean? When is it OK to leave it a little dirty? How do I know when to insist on squeaky clean and when not to? I tend to just do what feels right. I settle for "good enough" but I have many different versions of "good enough".

> Good design at good times. Make it run, make it right.

What is a good design? When is it a good time? What makes it right?
Array Methods in JS
Published: 2020-06-28 01:38:01


## Array Utility Methods

Methods that exist on the parent `Array`

### Array.of

```javascript
const x = Array.of("Parwinder", "Bhagat");
console.log(x); // [ 'Parwinder', 'Bhagat' ] 

// Example with the spread operator

const y = Array.of(..."Parwinder");
console.log(y); // [ 'P', 'a', 'r', 'w', 'i', 'n', 'd', 'e', 'r' ]
```

### Array.from

Creates an array with the given length, items, array-like or iterable object.

```javascript
const x = Array.from({ length: 3 });
console.log(x); // [ undefined, undefined, undefined ]

// With items using a callback function as second parameter
const y = Array.from({ length: 3 }, function () {
    return "Hello";
});
console.log(y); // [ 'Hello', 'Hello', 'Hello' ]


// With items using a callback function and arguments
const y = Array.from({ length: 3 }, function (value, index) {
    return index;
});
console.log(y); // [ 0, 1, 2 ]

```

### Array.isArray()

`typeof` an array returns `object` as a type, so this is where isArray comes in handy.

```javascript
const x = ["Hello", "World"];
console.log(Array.isArray(x)); // true

const y = 27;
console.log(Array.isArray(y)); // false
```
Day 27 : #100DaysofCode - Still reviewing the basic rails concepts . . .
Tags: 100daysofcode, womenintech, codenewbie
Published: 2020-06-28 01:22:18

Today, I learned more about rails, here are some of the notes I took down:

When building any app it is important to do the following: 
 
1. Plan out your urls for the app that you are building
2. Figure out what your database("db") needs to fulfill your task. Confirm if your db needs to change or what tables you need to create.         
3. If you end up creating/needing a new table, ask yourself: Do you need a model? Do you need to create or use the model generator?
4. Then after all that, you should play with your database within your console. 

When you first look at a rails application after learning Sinatra, you will see a lot of similar files. For example, you will still find a ``config.ru`` file that your server will reference when you run ``rails server`` in your terminal. Dont be nervous, running ``rails server`` is the same as running ``rackup`` or ``shotgun`` within a Sinatra app except rails runs on localhost:3000 and Sinatra runs on localhost:9393. 

Your ``config.ru`` file will load the environment still and run your rails application. It should look something like this: 

```
require_relative 'config/environment'

run Rails.application
```

The Gemfile still holds all the dependencies.
The Rakefile, still loads all rake task for Rails.

And you still have models, controllers, and views. One major difference is routes. Routes are handled in a separate file and can be found in your config folder. An easy way to view the routes available to you on your rails application is to simply type ``rails routes`` in your terminal. 

When building a rails app, know that naming conventions are important, so keep the following in mind:

1. The table name should be lowercase with a pluralized name of the model. 

2. The model file name should be singular lowercase and underscored 

3. The class name for model should be singular camelcase. 

Feel free to take a look at my practice rails application on Github. 

{% github SincerelyBrittany/rails_blog_flash no-readme  %}

Thank you for reading. 

Sincerely, 
Brittany

Song of the day: Roots Virtual Picnic 

{% youtube OgPp0WBbKpg %}