teleren/devto huggingface dataset:
Adding large external GIFs to GitHub README.md (over 10MB limit)
Tags: github, gif, tutorial, markdown
Published: 2020-08-22 11:46:29

### [(SKIP TO SOLUTION)](#the-answer-is-yes)

I've recently been adding a GIF to a `README.md` in [my new repo on GitHub][2], following for instance [this cool tutorial on DEV][3] and I was puzzled with this unfortunate choice:

* Either I include the GIF in the repo, pumping its size from less than 1MB to 30MB, or
* I host the GIF externally, but that only will work with GIFs below 10MB [(See this SO answer)][4].

Neither was great, since:

* I don't want to needlessly bloat my repo.
* My GIF is 1 minute long, 500x500px, 10 FPS, average quality - and still occupies around 30MB. 
* I could make it shorter, faster, lower resolution, lower FPS, lower quality - all of which are not great either. Is the only choice dropping readability? 😔

### However 😮

If GitHub allows the GIFs to be over 10MB if they're currently in a GitHub repo, will it allow me to link to a large GIF located in a different public repository?

* I could keep the original repo clean, no large GIFs stored directly inside.
* I could have a `README.md` with a large, good quality GIF.

### The answer is YES

 1. Create a new public GitHub repo. I called it `voyz/voyz_public`
 1. Open terminal, create a new direcotry where you want to locate the repo. For me it was `mkdir voyz_public`.
 1. Copy-paste the large GIF into that directory.
 1. Once inside, run:
  *(you need installed Git working with GitHub credentials)*
  1. `git init`
  1. `git add .`
  1. `git commit -m "added large GIF"`
  1. `git remote add origin https://github.com/Voyz/voyz_public.git` - Naturally, change this address for the URL of your repo.
  1. `git push`
 1. Now that the GIF is hosted on GitHub, its URL can be used in a `README.md` of another GitHub repo! Go to your new repo, find your GIF and copy its address to the `README.md` you want to include it in. Works in both Markdown and HTML:

Markdown:
```Markdown
![](https://github.com/Voyz/voyz_public/blob/master/databay_promo_vidA_gif_A03.gif)
```

HTML:
```html
<img src="https://github.com/Voyz/voyz_public/blob/master/databay_promo_vidA_gif_A03.gif" alt="Databay showcase gif" title="Databay showcase gif" width="500"/>
```

Hey I can even link to it here on [dev.to](dev.to) if I add `?raw=true` to the URL! 😊
<a id="databay" href="https://www.youtube.com/watch?v=8XL7d_ehhsA">
    <img src="https://github.com/Voyz/voyz_public/blob/master/databay_promo_vidA_gif_A03.gif?raw=true" alt="Databay showcase gif" title="Databay showcase gif" width="500"/>
</a>

I tried to look for information whether GitHub is okay with this method, although to no avail. Any feedback on this method most welcome! There are even other repos like [this repo with a ton of GIFs][1] so I'm gonna cross my fingers that this isn't unexpected or illegal. Otherwise... quick! upload bloated GIFs while GitHub are asleep!

Hope it helps! 👋
Voy

[1]: https://github.com/jglovier/gifs
[2]: https://github.com/Voyz/databay
[3]: https://dev.to/kelli/demo-your-app-in-your-github-readme-with-an-animated-gif-2o3c
[4]: https://stackoverflow.com/a/46701929/3508719
Slice in JavaScript
Tags: webdev, javascript, beginners, tutorial
Published: 2020-08-22 11:19:23

The slice method returns a new array with a copied slice from the original array.

<u>Syntax:</u>

```js
arr.slice([start[, end]])
```

`start` refers <mark>Zero-based</mark> index. If `start` is undefined, `slice` starts from the index 0.

In `end`, slice extracts up to but not including end.

Its too theoretically right 😜, lets understand by few examples.


#### Using two arguments ✅:

```js
const arr = ['🍏', '🍓', '🌽', '🍇', '🍒'];
const newArr = arr.slice(2,4);
console.log(newArr); // ["🌽", "🍇"]
```

#### Without arguments, you get a copy of the full array ✅

```js
const arr = ['🍏', '🍓', '🌽', '🍇', '🍒'];
const newArr = arr.slice();
console.log(newArr); // ["🍏", "🍓", "🌽", "🍇", "🍒"]
```

#### Using one argument, you get a copy from the specified index to the end of the array ✅

```js
const arr = ['🍏', '🍓', '🌽', '🍇', '🍒'];
const newArr = arr.slice(3);
console.log(newArr); // ["🍇", "🍒"]
```

#### Index can also be negative, in which case the starting index is calculated from the end ✅

```js
const arr = ['🍏', '🍓', '🌽', '🍇', '🍒'];
const newArr = arr.slice(2,-2);
console.log(newArr); // ["🌽"]
```

#### If `start` is greater than the index range of the sequence, an empty array is returned ✅

```js
const arr = ['🍏', '🍓', '🌽', '🍇', '🍒'];
const newArr = arr.slice(6);
console.log(newArr); // []
```

#### If `end` is greater than the length of the sequence, slice extracts through to the end of the sequence ✅

```js
const arr = ['🍏', '🍓', '🌽', '🍇', '🍒'];
const newArr = arr.slice(1,9);
console.log(newArr); // ["🍓", "🌽", "🍇", "🍒"]
```

#### slice() method can also be used for <mark>strings</mark> ✅

```js
const arr = 'suprabha';
const newArr = arr.slice(0,3);
console.log(newArr); // "sup"
```

**Note: 🧨**

<mark>Slice</mark> is immutable and <mark>Splice</mark> mutates the array.

## Reference 🧐
<a href='https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice'>Slice MDN</a>

<table>
  <tbody>
    <tr>
      <td>
        🌟 <a href="https://twitter.com/suprabhasupi"> Twitter</a>
      </td>
      <td>
        👩🏻‍💻 <a href="https://www.suprabha.me/"> Suprabha.me</a>
      </td>
<td>
        🌟 <a href="https://www.instagram.com/suprabhasupi/"> Instagram</a>
      </td>
    </tr>
  </tbody>
</table>
Wer kennt es nicht?
Tags: netzeug, instagram, spotify, tinder
Published: 2020-09-24 12:03:55

---
title: Wer kennt es nicht?
published: true
date: 2020-08-22 11:11:55 UTC
tags: Netzeug,instagram,spotify,tinder
canonical_url: http://drikkes.com/?p=14565
---

[![](http://drikkes.com/wp-content/uploads/2020/08/img_2707.jpg)](https://music.apple.com/de/album/earned-it/1440845197?i=1440845641&l=en)
MLH Fellowship: A new way of learning
Tags: mlhgrad
Published: 2020-08-22 11:02:34

MLH fellowship is a program run by Major League Hacking. It helps students to contribute to open-source by providing a mentor. Fellows are in regular contact with Maintainers. A small education stipend is also provided.

## My Major League Hacking Experience
I am an introvert so I didn't possess good communication skills. Major League Hacking helped me hack people and improve my communications. Daily stands up, mentor one on one and show n tells helped me put more context in my conversations. I learned a lot during the fellowship.

## Project Details
I worked on [Docusaurus](https://v2.docusaurus.io/). It is a static documentation site generator by Facebook. It is like gatsby but for documentation. It has built-in support versioning and themes.
![My Contributions to Docusaurus](https://dev-to-uploads.s3.amazonaws.com/i/vm319dkpwamwb8m1wana.png)

I mostly worked on Migration CLI, validation of various aspects of docusaurus.config.js, swizzle command, and remark plugins for loading image assets and other assets.

## Conclusion
MLH Fellowship is the best thing that happened this year. It is a very good opportunity for students and I highly recommend it. I thank MLh and Github education for this wonderful effort.
Badges for the terminal
Tags: showdev, javascript
Published: 2020-08-22 10:42:46

Hey there!

I've just released a little quirky node-js library. Add badges to your cli apps or npm packages.

{% github nombrekeff/cli-badges %}

### Usage

This is a simple example, using badges to display test results:

```js
const { badge } = require('cli-badges');

const failedBadge = badge('failed', '2', { 
  messageBg: 'red' 
});
const skippedBadge = badge('skipped', '2', {
  messageBg: 'yellow',
  messageColor: 'white',
});
const successBadge = badge('success', '2', {
  messageBg: 'green',
  messageColor: 'white',
});

console.log(failedBadge, successBadge, skippedBadge);
```

The above would output something similar to the terminal:

![](https://github.com/nombrekeff/cli-badges/raw/master/output-example.png)

You could also create a donate badge with a link ([if supported](#links)):

```js
const { badge } = require('cli-badges');

const donateBadge = badge('donate', 'ko-fi', {
  link: 'https://ko-fi.com/logginjs',
});

console.log(donateBadge);
```

![](https://github.com/nombrekeff/cli-badges/raw/master/donate-output-example.png)

> ###### Example output is a mock, console output will vary slightly from terminal to terminal.

---

**cli-badges** is now also available for Python, thanks to [haideralipunjabi](https://github.com/haideralipunjabi).

{% github haideralipunjabi/cli-badges no-readme %}

---

It would be awesome if you could pass by and give me some feedback. 🥰
A Brief 10-Point Guide to AWS Aurora
Tags: aws, serverless, devops, database
Published: 2020-08-22 10:28:16

When I’m learning new about new technologies, one of the first things, I’ll do is write a numbered list 1-10 and then fill that numbered list in with points about that particular technology. I realised that these lists might be useful to others so I’m going to start posting them. This week I looked at AWS Aurora.

1. Amazon Aurora is a cloud-based database solution (database-as-a-service DBaas) that is compatible with MySQL and PostgreSQL.

2. Using Amazon Aurora has the benefit that users don't have to deal with the headaches involved in managing and maintaining physical hardware for their databases. 

3. Another benefit of using Aurora over MySQL and PostgreSQL is the performance. Aurora is around 5 times as fast as MySQL, and around 3 times as fast as PostgreSQL when compared on the same hardware. 

4. With Aurora, the concern about database capacity is eradicated because the storage on Aurora will automatically scale all the way from the 10gb minimum to the 64TB maximum. Meaning, the maximum table size (64TB) using Aurora is four times the size of the maximum table size (16TB) of innodb. 

5. A further benefit of Aurora over MySQL is replication.  In Aurora, you can create up to 15 replicas 

6. One of the most prominent drawbacks of AWS Aurora is that it is only compatible with MySQL 5.6 and 5.7. 

7. A somewhat minor drawback is that the port number of connections to the database cannot be configured, they are locked at 3306

8. Another benefit is that, as you would expect, Aurora has great integration capabilities with other AWS products, for example, you can invoke an AWS Lambda function from within an AWS Aurora database cluster. You can also load data from S3 buckets. 

9. With AWS Aurora, the minimum RDS instance size you can use is r3.large, which will impact the cost of using AWS Aurora. 

10. AWS Aurora is also not available on the AWS free tier
balalaika IT newsletter #8
Tags: react, node, java, webdev
Published: 2020-08-22 10:24:11

---
title: balalaika IT newsletter #8
published: true
description: Curated IT newsletter. From Russia with love. Issue #8.
tags: #react #node #java #webdev
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/7dwkz927sf2ausnqygq3.jpg
canonical_url: https://blog.balalaikait.com/balalaika-it-newsletter-8
---

# General
- Databases are one of the most complex pieces of software ever made by humans, not only in terms of their internals, but also in terms of the behavior for the end-users. This comprehensive [blog post](https://medium.com/@rakyll/things-i-wished-more-developers-knew-about-databases-2d0178464f78) might help you to avoid common pitfalls when dealing with DBs.
- Designing a successful language is very hard, no doubts. If you are interested in the topic, watch [this talk](https://youtu.be/Sg4U4r_AgJU) by Brian Kernighan.
- Nowadays application development assumes dealing with distributed systems of various kinds. If you feel that you are at the beginner level in the wild ocean of distributed systems, you should watch this nice [overview talk](https://youtu.be/Y6Ev8GIlbxc).

# Java
- Were you capable to catch up with all the new stuff introduced in Java 9, 10, 11, 12, 13, and beyond? If not, here is a [busy developers’ guide](https://4comprehension.com/busy-developers-guide-to-java-9-10-11-12-13-and-above/) from Grzegorz Piwowarek.

# JavaScript
- On August 20, Microsoft announced a new major version of TypeScript - 4.0.  It packs lots of goodies. [This lengthy post](https://devblogs.microsoft.com/typescript/announcing-typescript-4-0/) goes over them one by one and it is an absolute must-read for every TS developer.

# React
- TypeScript is the official language of frontend web development at Airbnb. Yet, the process of adopting TypeScript and migrating a mature codebase containing thousands of JavaScript files didn’t happen in one day. In [this article](https://medium.com/airbnb-engineering/ts-migrate-a-tool-for-migrating-to-typescript-at-scale-cd23bfeb5cc) Sergii Rudenko tells us about their TypeScript migration strategy and tools.
- On August 10, React published their first release candidate for React v17. Even though it’s almost three years since a major release of React, surprisingly, there are no new features added for the new version. [This concise read](https://medium.com/better-programming/the-6-major-changes-in-react-v17-0-d14fed5b0529) covers the major updates.

# Node.js
- Node.js Technical Steering Committee is currently running a survey on unhandled Promise rejections handling. You have a chance to a part and impact the final decision. Here is the [blog post](https://medium.com/@nodejs/node-js-promise-reject-use-case-survey-98e3328340c9) which explains the rationale behind the survey.
Programming is not easy, here is the secret to mastering programming.
Tags: 100daysofcode, codenewbie, beginners, career
Published: 2020-08-22 10:00:35

We've all watched movies where they fix a programming bug like it's a piece of cake. Guess what? it's a lie. If you are a beginner or someone who wants to start a career as a software developer you need to know that programming is not easy and never let anyone tell you otherwise. Discussions among software developers usually involve two lovely words, COPY and PASTE. Its true, programming involves a lot of copying and pasting, and having the power to copy and paste code as well as making it work is like enjoying a view from a mountain top. However to enjoy the view you have to climb the mountain first which is the difficult part and the secret in this article.

There are many ways of mastering programming but here are some of the ways that I think are very helpful in becoming a better software developer.

### Be enthusiastic
Breath programming, speak about programming, write about programming, and live a programming life. To become a better programmer you have to enjoy programming, you need to be strongly interested and make it part of your life. Most great developers have no social life but however, you need to know your limits and have other social activities to help you clear your mind since writing code requires a strong, fresh, and active mind.

### Be part of programming communities
Be part of programming communities as well as surrounding yourself with other programmers. Read articles on programming, watch podcasts, and be part of programming meetups. There are great programming communities on every social media platform be part of them even a community of programming memes is a good idea, memes can teach you new concepts. 

### Ask questions
Do not hesitate to ask questions to your fellow programmers, we all learn through asking questions. You can ask questions on a platform like twitter you will get responses from experts though communities like [Stackoverflow](https://stackoverflow.com/) and [Quora](https://quora.com) are the best for programming questions.

### Start with the basics
When you start learning to program do not skip the first pages of a book or the first minutes of a video tutorial. Start with how to declare a variable before trying to save data in a database. Always learn the fundamentals then jump into frameworks and this will make your life easier.

### Challenge yourself
To master programming, there is a need for consistency. You need to practice every day. The twitter dev community has a `100DaysOfCode` challenge which is very helpful. You can use it for consistency sharing of updates on your programming journey and you will be able to meet experts that can help you become a better programmer.

> Lastly, remember counting starts from zero and the root is at the top of the tree.
Whiskey Wednesday - Episode 2: Learning and Unlearning How To Code
Tags: podcast
Published: 2020-08-22 09:04:10

---
title: Whiskey Wednesday - Episode 2: Learning and Unlearning How To Code
published: true
description: 
tags: podcast, 
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/298wnozwth32rhhrfxh1.jpg
---

## Whiskey Wednesday - 2020 June 25th

#### Episode 2: Learning and Unlearning How To Code

In this episode, we have some fantastic guests with different coding backgrounds that will talk with us about how to learn (and unlearn) how to code 💻📚

📺 [Watch it on Youtube](https://www.youtube.com/watch?v=5eJ2a9rn54U)

{% spotify spotify:episode:4QjQa9vO41AdnmZgwvZRpl %}
Best Seo Company in Mohali - Strive Digi Tech 
Published: 2020-08-22 08:03:29

When it comes to SEO services, Strive Digi Tech is the best organization you’ll ever find. We are fully focussed in providing you best and affordable SEO services in India. With our finest quality of services, we have earned a badge of best SEO Company in Mohali! Our only motto is to help those customers who are willing to grow their brand/business and we assure you that, we will assist them in scaling new heights of success. With excellent SEO services, we also provide digital marketing and website designing services. Don’t waste time, massive triumph is waiting for you! Call us now. https://strivedigitech.com/
Migrating Posts from Medium to DEV
Tags: todayilearned
Published: 2020-08-22 08:00:30

Hi Everyone! 👋 

As I create blog posts, I typically use multiple platforms aside from DEV such as Medium. 

Now I have had some posts on Medium in the past that I wanted to move onto DEV. The problem was I didn't want to rewrite the posts on Medium to markdown for DEV, which would require a bit of effort.

Thus began my search for a way around this which led me to stumble onto this awesome tool!

## How to migrate posts ❓

The tool I used is [Medium Exporter](https://www.npmjs.com/package/mediumexporter). In order to use this, you can install this npm package globally via: 

```javascript
npm i -g mediumexporter
```

Now you should be able to run the following command to convert a medium post into an MD file

```javascript
Format: mediumexporter [url] > [filename].md

mediumexporter https://medium.com/@coderarchive/4-lessons-ive-learned-during-my-first-year-as-a-software-engineer-50bc95afd629 > 4-lessons.md
```

**Note**: If you don't have it installed globally, you can also use **npx** which is what I'm using in the example below :)

### Running the command

![Demo CLI 1](https://dev-to-uploads.s3.amazonaws.com/i/895n8r8ftw6y9mf73go4.gif)

### View the file
![Demo CLI 2](https://dev-to-uploads.s3.amazonaws.com/i/9siuczwntn1nzycr6qrj.gif)

There may be some changes to make as it doesn't always convert everything correctly and you'll possibly need to deal with any images yourself but it usually helps with most of the work 👌

---

That about wraps it up for this short one! I'm also aware there is are some chrome extensions and other npm packages to do this as well but I haven't tried them out yet, this way seems to work well enough 😁
Have you built your GitHub Profile README yet?
Tags: github, git, productivity, beginners
Published: 2020-08-22 08:00:20

GitHub recently released a feature that allows users to create a profile-level README to display prominently on their GitHub profile.
<br>
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6f9ncm5fw8q6qgyq1lcs.PNG)


To use this feature you just need to create a new repository that has the same name as your GitHub account. Mine is located at https://github.com/mayankchaudhary26/mayankchaudhary26

<br>
This repository needs to be public and initialized with a README:


![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/btxj9vmln0rc4du1t28e.png)
<br>
Then you have to click on edit and just type everything you want to show-up . Like here, I have written my short bio-type intro and along with that you can upload images , gifs and badges to your other social media accounts. Make your commit, push, and you’re good to go 🚀
<br>
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/tubcpb8hqhydxvz1qh38.png)
<br>
By adding all these things , my profile looks like this:
<br>
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rl7xhjcvgr4cay2xw5x0.png)![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/v89te53oqckrdrmf7kl8.png)

<br>
<br>
To make it look more fascinating , you can add social media badges.
This is my layout:
<br>
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/0avd61405qc752x81j9p.jpeg)

**Here's some cool collection for your github profile** - https://github.com/mayankchaudhary26/Readme-items
<br>

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/sbttw5d4rnrh2aqhpcc2.jpeg)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/crjt5dw00u9cxg5xlx65.jpeg)
Laravel Secret Image
Tags: laravel
Published: 2020-08-22 07:46:50

Hi, everyone!
I've created a useful package for Laravel developers. This package will help you to save your images secretly and show them to ones who you choose.

You can access this package by this link:
{% github mohsenbostan/laravel-secret-image %}

I'd be so happy if you contribute to the package to make it better.
Personal Blog
Published: 2020-08-22 07:31:46

Hello there, I am currently a student enrolled in a Web Design and App. Development course at SU. I have a few skills that I believe translate well into having a good career. 

Firstly, I can play multiple instruments including the main 4 wooden orchestra instruments, guitar, bass-guitar, and piano. I bring this up as I believe it shows that I enjoy and I am capable of learning multiple things. 

Secondly, I am really good with people. I enjoy solo work, but I also flourish in an environment where teamwork is necessary.

My best project I would have to say is winning UIL in orchestra whenever we would. I have not really ever been in a position of leadership, but I don't believe I am incapable of it.

My dream job would honestly be anywhere I can feel proud of the company, and the people working in it.
Parse application/x-www-form-urlencoded in Azure Function
Tags: azurefunctions, azure, serverless, webhook
Published: 2020-08-24 12:26:36

---
title: Parse application/x-www-form-urlencoded in Azure Function
published: true
date: 2020-08-22 07:13:43 UTC
tags: 
- AzureFunctions 
- Azure
- serverless
- webhook
canonical_url: https://www.eliostruyf.com/parse-application-www-form-urlencoded-form-data-azure-function/
---

For a Mailchimp webhook, I had to parse the `application/x-www-form-urlencoded` form data to JSON. Azure Functions does not automatically do this for you, so you have to provide your parser. I knew that I had already done this, so I went on a search journey through my code. 

To make it easier next time, I wanted to share the code snippet with the rest of you. As you will notice, there isn't a lot of code required.

```typescript
import { AzureFunction, Context, HttpRequest } from "@azure/functions";
import { parse, ParsedQs } from 'qs';

const httpTrigger: AzureFunction = async function (context: Context, req: HttpRequest): Promise<void> {
  if (req.rawBody) {
    const parsedData: ParsedQs = parse(req.rawBody);

    context.res = {
      body: parsedData
    };
  }

  context.res = {
    body: 'No raw body data'
  };
};

export default httpTrigger;
```

This code snippet makes use of the [qs](https://www.npmjs.com/package/qs) (querystring) dependency. To install this dependency to your project, all you need to do is: `npm i qs -S -E`.
 ![](https://www.eliostruyf.com/parse-application-www-form-urlencoded-form-data-azure-function/)