teleren/devto huggingface dataset:
DAY 5 - Advent of Code 2020 w/ GoLang
Tags: go, adventofcode
Published: 2020-12-06 14:10:14

---
title: DAY 5 - Advent of Code 2020 w/ GoLang
published: true
description: AoC 2020 Day5 solutions in GoLang
tags: golang, discuss, AdventOfCode
series: Advent of Code 2020
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/gb6jnhz1didpnth3pbsw.jpeg
---

**DAY5:**
Didn't feel great about this code, but being able to use two iterators on a for loop really helped me out here. 🤷🏼‍♂️

I think the *not feeling great* was more because I spent waaaay long on a bug I couldn't find than actually making it work 🤦🏼‍♂️

```golang
package days

import (
	"fmt"
	"sort"

	inputs "../inputs"
)

// Five : advent of code, day five part1 and 2
func Five() {
	inputSlice := inputs.Day5

	seatIds := partOne(inputSlice)
	fmt.Println("")
	fmt.Println("Your seat ID is: ")
	fmt.Println(partTwo(seatIds))
}

func partOne(inputSlice []string) []int {
	seatIds := []int{}

	for dir := range inputSlice {
		toRune := []rune(inputSlice[dir])
		rowRange := []int{0, 128}
		colRange := []int{0, 8}
		finalRow := 0
		finalColumn := 0
		for i := 0; i < 7; i++ {
			if toRune[i] == 'F' {
				rowRange[1] = rowRange[1] - ((rowRange[1] - rowRange[0]) / 2)
			} else if toRune[i] == 'B' {
				rowRange[0] = rowRange[0] + ((rowRange[1] - rowRange[0]) / 2)
			}

			if i == 6 {
				finalRow = rowRange[0]
			}
		}

		for i := 0; i < 3; i++ {
			if toRune[i+7] == 'L' {
				colRange[1] = colRange[1] - ((colRange[1] - colRange[0]) / 2)
			} else if toRune[i+7] == 'R' {
				colRange[0] = colRange[0] + ((colRange[1] - colRange[0]) / 2)
			}

			if i == 2 {
				finalColumn = colRange[0]
			}
		}

		seatIds = append(seatIds, ((finalRow * 8) + finalColumn))
	}

	highest := 0
	for i := range seatIds {
		if seatIds[i] > highest {
			highest = seatIds[i]
		}
	}

	fmt.Print("Highest Seat ID: ")
	fmt.Println(highest)
	return seatIds
}

func partTwo(seatIds []int) int {
	sort.Ints(seatIds)
	seatsLeft := []int{}

	for i, seat := 0, seatIds[0]; seat < seatIds[len(seatIds)-1]; i, seat = i+1, seat+1 {
		if seat != seatIds[i] {
			seatsLeft = append(seatsLeft, seat)
			seat = seatIds[i]
		}
	}

	return seatsLeft[0]
}

```

[Link to Github source file](https://github.com/dizveloper/AdventOfCode/blob/main/2020/days/day05.go)
DAY 3 - Advent of Code 2020 w/ GoLang
Tags: go, adventofcode
Published: 2020-12-06 14:08:10

---
title: DAY 3 - Advent of Code 2020 w/ GoLang
published: true
description: AoC 2020 Day3 solutions in GoLang
tags: golang, AdventOfCode
series: Advent of Code 2020
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/gb6jnhz1didpnth3pbsw.jpeg
---

**DAY3:**
Modulo or your computer explodes (:

I had a silly for loop initially that would just duplicate and append to the remaining lines once it reached the end. It worked I think but I never let it finish because my laptop fans were on *super plus ultra*

```golang
package days

import (
	"fmt"

	inputs "../inputs"
)

// Three : advent of code, day three part1 and 2.
func Three() {
	inputSlice := inputs.Day3

	slopes := [5][2]int{
		{1, 1},
		{3, 1},
		{5, 1},
		{7, 1},
		{1, 2},
	}

	trees := []int{}

	for slope := 0; slope < len(slopes); slope++ {
		treesAtSlope := treesInSlope(inputSlice, slopes[slope][0], slopes[slope][1])
		trees = append(trees, treesAtSlope)
	}

	multiplied := 1
	for tree := 0; tree < len(trees); tree++ {
		multiplied = multiplied * trees[tree]
	}

	fmt.Print("Trees encountered: ")
	fmt.Println(trees)
	fmt.Print("Trees multiplied: ")
	fmt.Println(multiplied)
}

func treesInSlope(grid []string, right int, down int) int {
	trees := 0
	row := 0
	column := 0

	for {
		if column >= len(grid[0]) {
			column = column % len(grid[0])
		}

		if row >= len(grid) {
			break
		}

		if isItATree(grid[row], column) {
			trees++
		}

		column = column + right
		row = row + down
	}

	return trees
}

func isItATree(row string, columnPos int) bool {
	toRune := []rune(row)
	tree := '#'
	return toRune[columnPos] == tree
}

```

[Link to Github source file](https://github.com/dizveloper/AdventOfCode/blob/main/2020/days/day03.go)
DAY 2 - Advent of Code 2020 w/ GoLang
Tags: go, adventofcode
Published: 2020-12-06 14:07:01

---
title: DAY 2 - Advent of Code 2020 w/ GoLang
published: true
description: AoC 2020 Day2 solutions in GoLang
tags: golang, AdventOfCode
series: Advent of Code 2020
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/gb6jnhz1didpnth3pbsw.jpeg
---

**DAY 2:**
You can’t access indices of a string like an array. They are immutable. You’ll need to convert it to a rune or byte array.

```golang
package days

import (
	"fmt"
	"strconv"
	"strings"

	inputs "../inputs"
)

// Two : advent of code, day two part1 and 2.
func Two() {
	inputSlice := inputs.Day2

	partOneSlice := []string{}
	partTwoSlice := []string{}

	for i := 0; i < len(inputSlice); i++ {
		rangeSlice := getRange(inputSlice[i])
		ruleAndPassSlice := getRuleAndPass(inputSlice[i])

		occurances := strings.Count(ruleAndPassSlice[1], ruleAndPassSlice[0])
		if occurances >= rangeSlice[0] && occurances <= rangeSlice[1] {
			partOneSlice = append(partOneSlice, inputSlice[i])
		}

		if checkIndices(ruleAndPassSlice[1], []rune(ruleAndPassSlice[0])[0], rangeSlice[0], rangeSlice[1]) {
			partTwoSlice = append(partTwoSlice, inputSlice[i])
		}

	}

	fmt.Print("Part 1: ")
	fmt.Println(len(partOneSlice))

	fmt.Print("Part 2: ")
	fmt.Println(len(partTwoSlice))
}

func checkIndices(in string, r rune, first int, last int) bool {
	toRune := []rune(in)
	return ((toRune[first-1] == r && toRune[last-1] != r) || (toRune[first-1] != r && toRune[last-1] == r))
}

func getRange(input string) []int {
	splitter := strings.Split(input, " ")
	rangeAsStrings := strings.Split(splitter[0], "-")

	rangeAsInts := make([]int, len(rangeAsStrings))

	for i, s := range rangeAsStrings {
		rangeAsInts[i], _ = strconv.Atoi(s)
	}

	return rangeAsInts
}

func getRuleAndPass(input string) []string {
	splitter := strings.Split(input, " ")
	ruleAndPass := []string{strings.Replace(splitter[1], ":", "", -1), splitter[2]}

	return ruleAndPass
}

```
[Link to Github source file](https://github.com/dizveloper/AdventOfCode/blob/main/2020/days/day02.go)
DAY 1 - Advent of Code 2020 w/ GoLang
Tags: go, adventofcode
Published: 2020-12-06 14:06:11

---
title: DAY 1 - Advent of Code 2020 w/ GoLang
published: true
description: AoC 2020 Day1 solutions in GoLang
tags: golang, AdventOfCode
series: Advent of Code 2020
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/gb6jnhz1didpnth3pbsw.jpeg
---

**DAY 1**:
O(n^3) 😅

```golang
package days

import (
	"fmt"

	inputs "../inputs"
)

// One : advent of code, day one part1 and 2
func One() {
	inputSlice := inputs.Day1

	for i := 0; i < len(inputSlice); i++ {
		for j := i + 1; j < len(inputSlice); j++ {
			for y := j + 1; y < len(inputSlice); y++ {
				if (inputSlice[i] + inputSlice[j] + inputSlice[y]) == 2020 {
					fmt.Println(inputSlice[i] * inputSlice[j] * inputSlice[y])
				}
			}
		}
	}
}

```

[Link to Github source file](https://github.com/dizveloper/AdventOfCode/blob/main/2020/days/day01.go)
Setting Up Width of Images In CSS
Tags: css, codenewbie, beginners, todayilearned
Published: 2020-12-06 14:01:59

Hello Fellow Codenewbies 👋

You probably use `px` or `em` to set up the size of your image in CSS.
Well, I did.

But there is a good practice that I learned recently on how to set up the size of images, particularly the *width*.

*Percentage* is better to be used when we want to set the width of an image.

Let's take a look at this example.
In this example, we set the width of the image to 100%.

{% codepen https://codepen.io/adiati/pen/VwKazNR %}

Oops.
Are you seeing a blurred image?
Maybe now you think that this image has bad quality?

The image has a relatively small resolution of 800 x 532 pixels.
What will happen if we expand the size of an image to be more than its own size?
Precisely! The quality will be reduced and we start to see pixels.

So it is not the image that has bad quality, but *percentage* as one of the [relative CSS units](https://adiati.com/css-units) makes the width of the image relative to its parent.

Setting up the width to 100% to the image means that the width of the image is as big as the width of the parent, which in this example, we've set the parent's width to 200%.

#### What should we do now?

We use the `max-width` instead of `width` and set it to 100%.

```css
img {
  max-width: 100%; 
}

``` 

We cannot change the quality of an image.
But when we work with images, especially images with relatively small-resolution, we better keep their original resolution to maintain their quality.

By setting `max-width` to 100% to an image, we are setting the maximum width to 100% of its own size.
So, the image would never get bigger than it is supposed to be even though the width of its parent gets bigger.

## Conclusion

- When we work with images, it's a good practice to use `max-width` instead of `width` to maintain the quality of the image.
Advent of Code 2020
Tags: challenge, adventofcode
Published: 2020-12-06 13:49:14

I just discovered [Advent of Code 2020](https://adventofcode.com/2020).  I'm signed up and digging in.

Since getting into coding, I'm always looking for some great coding challenges which force me find new, creative ways to resolve a problem.  

When you're learning to code, the hardest part (at least for me) is thinking of scenarios.  Coding challenges solves that problem.

There are many options, but I've listed my favorites below.  Strive to solve one a day/week/month depending on your schedule.  Before you know it, you're an intermediate coder vs a beginner OR suddenly advanced vs intermediate!  

Pro tip - Once you solve the challenge and submit your answer, go back and read other solutions.  You will likely find alternate and sometimes cleaner ways to solve the same problem.

Happy holidays fellow coders!  

## Code Challenges: 
* [Advent of Code 2020](https://adventofcode.com/2020)
* [Code Wars](https://www.codewars.com/)
* [Edabit](https://edabit.com/challenges/)
Adaptive Video Streaming
Tags: webdev, tutorial, showdev, streaming
Published: 2020-12-06 13:47:36

Everyone reading this post must have used video streaming websites like Youtube, Netflix. You must be wondering how we can watch a video of 200MB (approx.) with slow internet without buffering.

When you upload a video on Youtube, that video is sent to Youtube's GPU Server, then [DASH](https://www.cloudflare.com/learning/video/what-is-mpeg-dash/) Algorithm is used to seperate video and audio then breaks the video into chunks of 6-10sec and then converts the video chunks into different resolutions it also creates the video registry xml file (where name and directory of every video is written) and then the all the chunks are sent to CDN.
![dash](https://dev-to-uploads.s3.amazonaws.com/i/o1pump72t18dm0t9bacs.png)

Now, you would be wondering what is DASH, It is video encoding algorithm. **DASH (Dynamic Adaptive Streaming over HTTP )** is one of few algorithms used by major tech companies. Another popular algorithm is HLS developed by Apple.

Here is a sample of DASH XML File generated by my server using [ffmpeg](https://ffmpeg.org/)

{% gist https://gist.github.com/abhishekraj272/6004dcbc848c74baead944271bbcbd4c %}

Read more about DASH and HLS [here](https://www.cloudflare.com/learning/video/what-is-mpeg-dash/).

I will post some articles on automating ffmpeg for generating video segments.

You can visit my Video Streaming Website, [Firestream](https://stream.codedoc.tech/), which I created to learn how Youtube works.

 
> Fun fact: While writing this article, I was experiencing heavy lag on youtube, don't know why!!. xD
Daily Developer Jokes - Sunday, Dec 6, 2020
Tags: jokes, dailydeveloperjokes
Published: 2020-12-06 13:00:18

---
title: "Daily Developer Jokes - Sunday, Dec 6, 2020"
description: "Check out today's daily developer joke! (a project by Fred Adams at xtrp.io)"
series: "Daily Developer Jokes"
cover_image: "https://private.xtrp.io/projects/DailyDeveloperJokes/thumbnail_generator/?date=Sunday%2C%20Dec%206%2C%202020"
published: true
tags: #jokes, #dailydeveloperjokes
---

Generated by Daily Developer Jokes, a project by [Fred Adams](https://xtrp.io/) ([@xtrp](https://dev.to/xtrp) on DEV)

___Read about Daily Developer Jokes on [this blog post](https://xtrp.io/blog/2020/01/12/daily-jokes-bot-release/), and check out the [Daily Developer Jokes Website](https://dailydeveloperjokes.github.io/).___
### Today's Joke is...
![Joke Image](https://private.xtrp.io/projects/DailyDeveloperJokes/public_image_server/images/5e125970d9ec2.png)

---
*Have a joke idea for a future post? Email ___[xtrp@xtrp.io](mailto:xtrp@xtrp.io)___ with your suggestions!*

*This joke comes from [Dad-Jokes GitHub Repo by Wes Bos](https://github.com/wesbos/dad-jokes) (thank you!), whose owner has given me permission to use this joke with credit.*

<!-- 
Joke text:
___Q:___ What is a pirate's favorite programming language?

___A:___ You'd think it was R, but a pirate's first love is Objectively C.
 -->
#1 - Journal: 03/12/2020
Published: 2020-12-06 12:50:23

Today I was working on one of my side projects and needed to move some changes to another branch of the repository. A perfect time to use the [git stash](https://git-scm.com/docs/git-stash) command for the first time, right?

I'm still trying to get comfortable using git - I'm using CLI for now in order to fully understand what is going on - so I started reading this [documentation](https://www.atlassian.com/git/tutorials/saving-changes/git-stash) from Atlassian. But one thing that was not quite there was how to stash a single file. Turns out it's pretty simple: `git stash push -m "message..." file1 file2 ...`
Getting the frequency of an element in an array in JavaScript
Tags: javascript, algorithms, beginners, node
Published: 2020-12-06 12:22:34

First of all, what is frequency?
According to Wikipedia, it's" the rate at which something occurs over a particular period of time or in a given sample."
There are multiple ways to get the frequency of an element in an array. In this article, we'll focus on one of those ways by using some of the higher-order functions in Javascript.

## Let's begin 
For instance, if we have an array of letters:

```js
const letters = ["a", "b", "c", "a", "b", "c", "a", "b"];
```

To get the frequency of each element, we will first need to create an empty `object` named `count`:

```js
const count = {};
``` 

Next, we'll utilize one those higher order functions we were talking about:

```js
letters.forEach(e => count[e] ? count[e]++ : count[e] = 1 );
``` 

What the above code does is simply check, if each element of `letters` is present in `count`. Initially `count` is empty and does not contain any of `letters` elements, so when the ternary operator runs on an element of `letters` to check if its present in `count` for the first time, it's going to work with the falsy condition which is to assign `letters` elements to 1 in the `count` object.
So the count object will then become:

```js
console.log(count) // {"a" : 1, "b" : 1, "c" : 1};
```

Afterward, when the ternary operator checks if `count` has an element of `letters` that has already been checked, the ternary operator will then run the truthy condition which is to increment the value of the elements in `letters` if they are already present in `count`, so `count` will now become:

```js
console.log(count) // {"a" : 3, "b" : , "c" : 2};
```

And just like that ladies and gentlemen, we've been able to get the frequency of each element of `letters`.

## Conclusion 
Here's the complete code: 

```js
const letters = ["a", "b", "c", "a", "b", "c", "a", "b"];
const count = {};
letters.forEach(e => count[e] ? count[e]++ : count[e] = 1 );

console.log(count) // {"a" : 1, "b" : 1, "c" : 1}
```
P.S: This code can be used for both strings and numbers.
I built and ice-cream configurator using CSS and Javascript
Tags: css, javascript, laravel, webdev
Published: 2020-12-06 11:48:07

[![How it works](https://img.youtube.com/vi/4X_fA3UnwoM/0.jpg)](https://www.youtube.com/watch?v=4X_fA3UnwoM)

I build an ice-cream configurator that helps people find roommates in a more entertaining way. You can choose between 3 different toppings, cones, and flavors.

Here is what I used:

- **SVG Images** for cones, flavors and toppings
- **Javascript** to switch between different elements of the ice-cream
- **CSS** to stylize the page
@angular/fire/storage Angular 11 Upload files to Firebase
Tags: angular, firebase, uploadfile, angularfirestorage
Published: 2020-12-06 11:45:58

Tutorial: @angular/fire/storage – Angular 11 (Angular 8) – Upload/Display/Delete files to/from Firebase Storage using @angular/fire

In this tutorial, ozenero.com shows you way to upload, get, delete Files to/from Firebase Storage in a simple Angular 11 App using @angular/fire. Files’ info will be stored in Firebase Realtime Database.

## Technologies for Angular Firebase Storage
– Angular 11
– RxJs 6
– @angular/fire 5.1.3
– firebase 5.11.1

## Angular 11 Firebase Storage Overview

![Angular 11 Firebase Storage Overview](https://ozenero.com/wp-content/uploads/2020/12/angular-8-upload-files-firebase-storage-demo.png)

We will build an Angular 11 Firebase App that can:
– helps user choose file from local and upload it to Firebase Storage
– show progress with percentage
– save file metadata to Firebase Realtime Database
(Functions above from the posts: Upload File to Storage)
– get list Files and display
## How to do – @angular/fire/storage?

![angular-11-upload-files-firebase-storage-overview](https://ozenero.com/wp-content/uploads/2020/12/angular-8-upload-files-firebase-storage-overview.png)

– Upload file:
+ save file to Firebase Cloud Storage
+ retrieve {name, url} of the file from Firebase Cloud Storage
+ save {name, url} to Firebase Realtime Database

– Get/delete files: use file {name, url} stored in Database as reference to Firebase Cloud Storage.

So, after upload process, the results will be like:

-> Firebase Storage:

![Firebase Storage](https://ozenero.com/wp-content/uploads/2019/05/angular-8-firebase-storage-results.png)

-> Firebase Realtime Database:

![Firebase Realtime Database](https://ozenero.com/wp-content/uploads/2019/05/angular-8-firebase-storage-database-results.png)

## Related post

– [Angular 11 Firebase tutorial: Integrate Firebase into Angular 11 App with @angular/fire](https://ozenero.com/angular-8-firebase-tutorial-integrate-firebase-angular-8-app-angular-fire)
– [Angular 11 Firebase CRUD operations with @angular/fire](https://ozenero.com/angular-8-firebase-tutorial-crud-operations-angular-fire-example)
– [Angular 11 Firestore tutorial with CRUD application example – @angular/fire](https://ozenero.com/angular-8-firestore-tutorial-crud-examples-angularfire)
Vue.js SpringBoot CRUD MariaDB Example
Tags: vue, springboot, mariadb, crud
Published: 2020-12-06 11:23:04

Tutorial Link: [Vue.js SpringBoot CRUD MariaDB Example](https://ozenero.com/vuejs-springboot-crud-mariadb)

Tutorial: Vue.js SpringBoot CRUD MariaDB Example | Spring Data JPA + REST + MariaDB CRUD


 
In this Vue.js SpringBoot tutorial, we show you Vue.js Http Client & Spring Boot Server example that uses Spring JPA to do CRUD with MariaDB and Vue.js as a front-end technology to make request and receive response.

## Technologies – Vuejs SpringBoot MariaDB
– Java 1.8
– Maven 3.3.9
– Spring Tool Suite – Version 3.8.4.RELEASE
– Spring Boot: 2.0.5.RELEASE

– Vue 2.5.17
– Vue Router 3
– Axios 0.18.0

## Overview – Vue.js Spring Boot CRUD MariaDB Example

![Overview – Vue.js Spring Boot CRUD MariaDB Example](https://ozenero.com/wp-content/uploads/2020/12/vue-spring-boot-mariadb-example-spring-data-mariadb-rest-api-architecture.png)

## Implement Spring Boot CRUD MariaDB Server


![vue-spring-boot-mariadb-example-spring-data-mariadb-rest-api-spring-server-architecture](https://ozenero.com/wp-content/uploads/2020/12/vue-spring-boot-mariadb-example-spring-data-mariadb-rest-api-spring-server-architecture.png)

## Vue.js RestAPI CRUD Client

![Vue.js RestAPI CRUD Client](https://ozenero.com/wp-content/uploads/2020/12/vue-spring-boot-mariadb-example-spring-data-mariadb-rest-api-vue-client-ui.png)

## Related post

1. [MariaDB – How to use Spring JPA MariaDB | Spring Boot](https://ozenero.com/use-spring-jpa-mariadb-spring-boot)
2. [Vue Router example – with Nav Bar, Dynamic Route & Nested Routes](https://ozenero.com/vue-router-example-with-nav-bar-dynamic-route-nested-routes)
3. [Reactjs JWT Authentication Example](https://loizenai.com/reactjs-jwt-authentication-example/)
Leetcode 102 best practices
Tags: algorithms, computerscience
Published: 2020-12-06 11:14:26

Hashtag how to solve a Leetcode problem. 
You may see a lot of YouTubers that are excellent Leetcode problem solvers. They just type away and you are wondering how you get there, well following are the best practices that I gathered from years of experience ;)

1. (!) start with a piece of paper and a pen.
This is the most important one. How are you able to implement an algorithm, if you cannot go through it with a simple example on the paper?
 * if you cannot think of a solution, can you think of a partial solution that gets you halfway to the goal? Example: https://leetcode.com/problems/rotate-image/, did you think about transposing the matrix first?
2. go through your idea with a simple example. Did you cover all edge cases?
3. calculate the complexity. If it is a hard problem, is the complexity of your algorithm under O(n * log n)?
4. write down your algorithm as a list of steps as comments in your code, maybe in pseudo-code.
5. feel free to use an ide (e.g. IntelliJ for Java Developer) and use parameterized tests to implement your algorithm [tdd](https://www.youtube.com/watch?v=GvAzrC6-spQ). Also feel free to set some debug points to one of your failing tests. 
6. paste your code to Leetcode and submit, if it fails, go back to step 1 to check everything again

```
for () {
  // 1: 

  // 2: 

  // 3: 

  // ...

  // feel free to print out some important variables :)  
}
```

Happy coding ;)