teleren/devto huggingface dataset:
Go R1 Day 26
Tags: tech, development, 100daysofcode, go
Published: 2021-02-09 22:57:38

---
title: Go R1 Day 26
published: true
date: '2021-01-13 03:25:48 UTC'
tags:
  - tech
  - development
  - 100DaysOfCode
  - golang
canonical_url: 'https://www.sheldonhull.com/microblog/go-r1-day-26/'
---

## Progress

- Evaluated gorm usage best practices with Slack Gopher community.
- Obtained a great example to get me started on go routine and channels usage with multi-database queries.
I Created a full stack toDoApp with auth using the MERN stack (mongodb, express, react & node)
Tags: showdev, webdev, codenewbie, programming
Published: 2021-01-13 03:24:26

>Preview the toDoApp: [toDoApp](https://chaoo-todos.netlify.app/)
>Follow my comprehensive `MERN` stack series:  [MERN Stack Tutorials](https://youtube.com/playlist?list=PL63c_Ws9ecIQkH5xD6JW4cf2VporjzSRW)
>Subscribe to my YouTube Channel: [SUBSCRIBE](https://www.youtube.com/channel/UCe8uN9zoKksCb1hfw61myRw?sub_confirmation=1)
>Follow me on twitter: [@chaoocharles](https://twitter.com/ChaooCharles)

The reason for creating [this toDoApp](https://chaoo-todos.netlify.app/) was to refresh my MERN stack skills and also to create comprehensive tutorials for beginners. Check out my free MERN stack tutorials [here](https://youtube.com/playlist?list=PL63c_Ws9ecIQkH5xD6JW4cf2VporjzSRW).

When you are a beginner, creating a todo app is one of the ways you can get your hands dirty when learning to code. You should not learn a new technology by reading it like a book or watching the tutorials like your favorite movie series. Develop a habit of creating things. Let those errors get you out of your comfort zone. Creating a todo app is a good beginning.

On the other hand, for experienced developers, a todo app can be a good and simple way of refreshing basic skills. Basics are very important, you wouldn't understand the complex topics if you missed the basics. or would you?

While todo apps are usually simple, I created a quite complex one. I created my own endpoints using node.js and express, secured these endpoints using `jwt`, hashed the password with `bcrypt`, stored the data on MongoDB atlas, and hosted the backend on `Heroku`. I then created a front-end using `React`, `react-router`, `material UI` `redux and redux hooks`, protected the routes, and deployed the frontend on `netlify`. You can access it [here](https://chaoo-todos.netlify.app/)

To learn how I did all this from scratch to deployment, you can follow [these tutorials](https://youtube.com/playlist?list=PL63c_Ws9ecIQkH5xD6JW4cf2VporjzSRW) on my channel. You will learn how to perform `CRUD operations`, `authentication and authorization`, and `deployment`.

Happy coding 💙
Digital Transformation with Red Hat & Alibaba Cloud: Security
Tags: linux, cybersecurity, cloudnative
Published: 2021-01-13 03:07:12

Our second online event with Red Hat is live today. The series will focus on leveraging Alibaba Cloud and RHEL to speed up digital transformation among enterprises. Today, the 2nd episode of the digital series will deep dive into our security capabilities and showcase our technologies in defending cyber attacks and threats. Please tune in or share with your customers of this great piece. 
Thanks for encounter with RHEL. #linuxworld #itarchitecture #cloudbasedsolution #redhatlinux #alibabacloud

【Watch Replay Right Now】
https://www.alibabacloud.com/campaign/red-hat-on-ecs
Data Structures and Algorithms in Javascript - Part 2
Tags: javascript, mergesort, binarysearch, interview
Published: 2021-01-13 02:32:30

This is a continuation of my post on [Data Structures and Algorithms in Javascript...to get you started](https://dev.to/jeenajohn/data-structures-and-algorithms-in-javascript-to-get-you-started-4hel).

In Part 2, we will cover

* Merge Sort
* Binary Search

## **Merge Sort** ##

Merge sort is a divide and conquer algorithm. Merge sort works as follows:
* ***Divide*** the unsorted list into n sublists, each containing one element (a list of one element is considered sorted).
* Repeatedly merge sublists to produce new sorted sublists (***conquer***) until there is only one sublist remaining. This will be the sorted list.


```javascript
let array = [38, 27, 43, 3, 9, 82, 10];

function merge(left, right) {
  let results = [];
  while (left.length && right.length) {
    left[0] < right[0]
      ? results.push(left.shift())
      : results.push(right.shift());
  }
  return [...results, ...left, ...right];
}

function mergeSort(arr) {
  if (arr.length === 1) {
    return arr;
  }
  let mid = Math.floor(arr.length / 2);
  let left = mergeSort(arr.slice(0, mid)); // first half
  let right = mergeSort(arr.slice(mid)); //second half
  return merge(left, right);
}

console.log(mergeSort(array));
```

**Time Complexity:** In sorting n objects, Merge sort has an average and worst-case performance of O(n log n). 


## **Binary Search** ##

Binary Search is used to search for an element in ***sorted*** arrays. It uses divide and conquer approach. Binary Search works as follows:
To search for target value(num),
* Compare the middle element of the array with num. 
* If num equals middle element, its position in the array is returned. 
* If num < middle element, the search continues in the lower half of the array. 
* If num > middle element, the search continues in the upper half of the array. 
As the array is sorted, in each iteration the algorithm eliminates the half in which the target value doesn't exist.

```javascript
let array = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

function _findNumber(arr, left, right, num) {
  let mid = Math.floor((left + right) / 2);
  if (num === arr[mid]) {
    return mid;
  }
  if (left === right) {
    //only one element to be checked and it is not num
    return -1;
  }
  return num > arr[mid]
    ? _findNumber(arr, mid + 1, right, num)
    : _findNumber(arr, left, mid - 1, num);
}

function findNumber(arr, num) {
  if (arr.length === 0) {
    // no elements in array
    return -1;
  }
  return _findNumber(arr, 0, arr.length - 1, num);
}

console.log(findNumber(array, 4));
```


**Time Complexity:** O(log n) where n is the number of elements in the array.
I need some Lambda Function/ Netlify Function stuff.
Tags: lambda, netlify, javascript
Published: 2021-01-13 02:08:57

What I am trying to do is invoke a function by sending a POST request directly to it then send the data sent in the request to an api.

I know what I need to do, and I think I know how, but testing, quite frankly, is a pain in the butt while in development. 

Would love to learn how to test functions locally before having to republish on Netlify/ Amazon each time an update is made.

Any help would be awesome!
Lodash Intro
Tags: javascript
Published: 2021-01-13 00:40:02

I recently came upon a JS library called Lodash for a small app I am working on which supplies utility functions and readability of objects, arrays, string etc. There are more than 100 functions already added and split into 13 categories which simplify common problems. As hinted by the name, Lodash means, essentially, an underscore

##Installation

With npm:

`$ npm install lodash`

And then import it at the top of your JavaScript file in which you would like to use it.

`import _ from Lodash`

#Usage

Here are some of the functions that Lodash provides:

**Map**

Iterating over an array of an object with Lodash looks like:

```
const data = [
  {
    name: 'Bob',
    age: '25',
  },
  {
    name: 'Will',
    age: '24',
  },
  {
    name: 'Mary',
    age: '26',
  }
];

_.map(data, 'name');
// [ 'Bob', 'Will', 'Mary' ]
```

**CloneDeep**

This method recursively clones the whole object, so if any property of the resultant object changes, it will not change the original object as the references will also be new.

```
const users = [
  {
    name: 'Bob', age: '25', profile: { experience: 3 }
  },
  {
    name: 'Will', age: '24', profile: { experience: 2 }
  },
  {
    name: 'Mary', age: '26', profile: { experience: 4 }
  }
];

const usersClone = _.cloneDeep(users);
usersClone[0].age = '27';

usersClone[0].age;
// 27
users[0].age;
// 25
```

**Intersection**

In this example you have two separate arrays with different ingredients in each and want to know which ones come up in both.

It would look like this in JS:

```
let array1 = ["pizza", "icecream", "salads"];
let array2 = ["burger","hotdog", "pasta"];

let commonResults = [];

for (let i = 0; I < array1.length; i++) [
  if (array2.indexOf(array1[i]) !== -1) {
    let indexPosition = array2.indexOf(array1[i]);
    commonResults.push(array2[indexPosition]);
  }
}

console.log(commonResults);
```

In lodash you can simply do:

```
console.log(_.intersection(array1, array2));
```

This is just a brief overview of Lodash and some of its utility functions. On the official [site](https://lodash.com/), you can read more documentation.

**References**

- https://lodash.com/docs/4.17.15
- https://medium.com/techshots/introduction-to-lodash-4d1518eac63a
10 JS Projects
Tags: javascript, webdev
Published: 2021-01-13 00:32:29

> I love to challenge myself so I decided to make 10 projects with different **JS** frameworks and libraries as I could.

### 1. Text Editor [code](https://github.com/ahmadfathy97/10-js-projects/tree/text-editor) |  [preview](https://online-text-editor.netlify.app/)
  * Vuejs
  * codemirror

### 2. 3d-car [code](https://github.com/ahmadfathy97/10-js-projects/tree/3d-car) | [preview](https://3d-car.netlify.app/)
  * three.js

### 3. just smile [code](https://github.com/ahmadfathy97/10-js-projects/tree/face-recognition) |  [preview](https://just-smile.netlify.app/)
  * face-API

### 4. calculator (desktop app) [code](https://github.com/ahmadfathy97/10-js-projects/tree/calculator) | [download](https://github.com/ahmadfathy97/10-js-projects/releases/download/Calculator/calculator.Setup.1.0.0.exe)
  * electron

### 5. space war (online game) [code](https://github.com/ahmadfathy97/10-js-projects/tree/space-war) | [preview](https://space-war2.netlify.app/)
  * p5.js

### 6. covid19 cases [code](https://github.com/ahmadfathy97/10-js-projects/tree/covid19-cases) | [preview](https://covid19-cases-charts.netlify.app/)
  * chart.js

### 7. Twitter Anti Curse (browser extension) [code](https://github.com/ahmadfathy97/10-js-projects/tree/anti-bad-words)
  * javaScript

### 8. photos gallery [code](https://github.com/ahmadfathy97/10-js-projects/tree/photos-gallery) | [preview](https://photos-gallery-preview.herokuapp.com/)
  * expressjs
  * mongodb
  * cloudinary cloud
  * ejs preprocessor

### 9. chat app [code](https://github.com/ahmadfathy97/10-js-projects/tree/chat-app) | [preview](https://chat-app-test.netlify.app/)
  * expressjs
  * socket.io

### 10. jokes (mobile app) [code](https://github.com/ahmadfathy97/10-js-projects/tree/jokes-app) | [dwonload](https://github.com/ahmadfathy97/10-js-projects/releases/download/Calculator/jokes.apk)
  * NativeScript
  * VueJs
Big List of Hosted Headless CMS Providers with Free or Developer Tier in 2021
Tags: headless
Published: 2021-01-13 00:23:52

## What is a Headless CMS

Headless CMS are applications that give you a visual dashboard for managing data but don't lock you into any particular way of building a frontend for that data. Instead, they deliver the data via an API which you can pull into the frontend application build of your choice. Headless CMS has become an integral part of the JAMStack movement and you can find a full list of Headless CMS solutions hosted and self-hosted/open source at JamStack.org.

## The List

- [ButterCMS](https://buttercms.com/)
- [Contentful](https://www.contentful.com/)
- [AgilityCMS](https://agilitycms.com/)
- [GraphCMS](https://graphcms.com/)
- [Sanity.io](https://www.sanity.io/)
- [SlickNode](https://slicknode.com/)
- [Builder.io](https://www.builder.io/)
- [Scrivito](https://www.scrivito.com/)
- [Typewriter](https://www.typewriter.cloud/)
- [Flotiq](https://flotiq.com/#pricing)
- [CloudCannon](https://cloudcannon.com/pricing/)
- [TakeShape](https://www.takeshape.io/pricing/)
- [StoryBlok](https://www.storyblok.com/pricing)
- [Stastic](https://editor.stastic.net/#/)
- [SiteLeaf](https://www.siteleaf.com/plans/)
- [prepr](https://prepr.io/pricing)
- [Prismic](https://prismic.io/pricing)
- [Gridly](https://www.gridly.com/pricing/)
- [FrontAid](https://frontaid.io/)
- [Forestry](https://forestry.io/pricing/)
- [Flamelink](https://flamelink.io/pricing)

## Small Scale Alternatives

These aren't full-blown Headless CMS Solutions but using their Rest API's you can pull data from these sources as a small-scale solution or to feed a static site generator.

- [Google Sheets](https://www.youtube.com/watch?v=GF8ybYKINtA&list=PLY6oTPmKnKbYonuqTHD-RyTAHmWvM1-kU&index=3)
- [Airtable](https://www.youtube.com/watch?v=pGOddJe1kEE&list=PLY6oTPmKnKbYonuqTHD-RyTAHmWvM1-kU&index=1)
- Wordpress.com (Has an API)
- Trello
- Asana
- [Json Files Hosted on Netlify](https://tuts.alexmercedcoder.com/2020/NetlifyJSONApi/)

## Self-Hosted Solutions

A Bigger list is available at JAMStack.org but here are a few Headless CMS Solutions that are open source meaning you can install it on your own server and avoid vendor lock-in.

- Strapi
- KeystoneJS
- Prisma
- Hasura
- SquidEx
- cockpit
- daptin
- mesh
- hashbrown
- unite cms
- ponzu

## Public API Data

In case you need existing data for your application here is a list of free public APIs!

- [FREE API LIST](https://github.com/public-apis/public-apis)
Project 1 Blog Post
Published: 2021-01-13 00:06:57

Hooray! Phase 1 down, 4 more to go. This was a great project and I really enjoyed using my creativity and new knowledge to create my own CLI Application. I decided to use a Studio Ghibli Films API so that my CLI could have access to external data. The API gave me access to an array of information containing film titles, a description of the film, the director, etc. This was used in my CLI as a result for the user choosing a specific option. I parsed the original API array so that my API would return a list containing only the titles. Then I called that list in my CLI as a result for the user choosing another specific option. The last option I made possible was the exit option. For this option I used the sleep () function as well as system “clear”. The sleep () function makes the system wait (x) seconds before the next action occurs. System “clear” has the power to automatically clear everything in the user’s terminal prior to that action. Two of the most interesting gems I found along the way are TTY-Prompt and Awesome_Print. TTY-Prompt has a wide range of functionality and you are capable of doing a lot with this gem. TTY-Prompt is the options and scrolling functionality of my CLI. View this link if you would like to see all of the functionality that TTY-Prompt has to offer “https://github.com/piotrmurach/tty-prompt”. Awesome_Print has amazing functionality as well. It takes a plain/ordinary list of information and ‘prints’ it in an ‘awesome’ way. Both of the gems I just mentioned can be found at “https://rubygems.org/”. When I first started this project I felt confident that I would get it done while running into minimal issues. That quickly changed as I reached a point where I felt like I had no clue what direction to go in or what to do. That was a very discouraging moment but I stayed persistent and eventually had a break through with my issue. After that I moved right through the rest of my project, and I am very satisfied with the result. If I had more time I would have loved to add more layers and functionality to my project, but overall, I feel like I made a great first project. I’m looking forward to seeing what Phase 2 has to bring, and I can’t wait for my next project!
Cards Against Pandemic
Tags: project, webdesign, showdev, javascript
Published: 2021-01-13 17:11:01

---
title: Cards Against Pandemic
published: true
date: 13/01/2021
tags: project,webdesign,showdev,javascript
canonical_url: https://nervewax.com/cards-against-pandemic/
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/j8pkodbv78z6r8725rrn.jpg
---

* * *

**[Cards Against Pandemic - GitHub Repo](https://github.com/nervewax/cards-against-pandemic)**  
An online / web version of [Cards Against Humanity](https://cardsagainsthumanity.com/), built in desperate times.

* * *

I built this so I could play Cards Against while on video call with friends during the COVID-19 lockdown. This was mainly because the other versions out there felt a bit hard to use, and I thought it could be fun to have a go myself.

![Enter screen](https://nervewax.com/content/images/2020/08/cards03.png)

I got the game into a _just about_ playable state, played a bunch of games with friends, but then haven’t worked on it since. ¯\\_(ツ)\_/¯ It does work though!

If you do come across this and want to raise **issues** or even better a **PR**, please do so. 🙏

- 🕹 [Current _barely_ playable version](https://cards-against-pandemic.glitch.me/) (on glitch.me)
- 🐙 [GitHub Repo](https://github.com/nervewax/cards-against-pandemic)
- 💾 Built using [vue.js](https://vuejs.org/) and [socket.io](https://socket.io/).
- 🃏 Cards json sourced from [JSON Against Humanity](https://crhallberg.com/cah/)
How to skip a commit during the git rebase process?
Tags: git
Published: 2021-01-13 00:00:00

---
  title: How to skip a commit during the git rebase process?
  published: true
  tags: Git
  date: Wed Jan 13 2021 05:30:00 GMT+0530 (India Standard Time)
  canonical_url: https://melvingeorge.me/blog/skip-commit-in-rebase-process-in-git
  cover_image: https://melvingeorge.me/_next/static/images/main-f1d82961f24e9741befbd7b3d173e2e8.jpg
  ---
  [Originally posted here!](https://melvingeorge.me/blog/skip-commit-in-rebase-process-in-git)
  
Sometimes during a Git rebase process, you may encounter some conflicting commits and wants to skip the specific commit for some reason.

You can do that by passing the `--skip` flag in the `git rebase` command.

It can be done like this,

```bash
git rebase --skip
```

### Be sure to check not to skip an important commit during the rebase process.

### Feel free to share if you found this useful 😃.

---
List of JS Bundlers 🚀
Tags: javascript, node, webdev, webperf
Published: 2021-01-12 23:48:27

---
title: List of JS Bundlers 🚀
published: true
date: 2021-01-12 23:47:32 UTC
tags: JavaScript,Nodejs,WebDevelopment,WebPerf
canonical_url: https://h.shadowtime2000.com/list-of-js-bundlers
---

## List of JS Bundlers

In [my previous article about ES6 tree shaking](https://h.shadowtime2000.com/what-is-es6-tree-shaking) a [reader commented suggesting that I add a list of bundlers that support tree shaking to the bottom of the article](https://dev.to/aidenybai/comment/1a057). Instead I am going to create a list of JS bundlers.

1. [Webpack](https://webpack.js.org)

2. [Rollup](https://www.rollupjs.org/guide/en/)

3. [Parcel](https://parceljs.org/)

4. [esbuild](https://esbuild.github.io/)

5. [SWC](https://swc.rs)

6. [Pax](https://pax.js.org/)

7. [Bundl](https://bundljs.org/)

8. [Klap](https://www.npmjs.com/package/klap)

9. [Brunch](https://brunch.io/)

10. [Microbundle](https://www.npmjs.com/package/microbundle)

11. [Packem](https://packem.github.io/)

12. [Lasso](https://www.npmjs.com/package/lasso)

13. [Browserify](http://browserify.org/)

14. [FuseBox](https://fuse-box.org/)

15. [Metro](https://github.com/facebook/metro)

16. [Module Concat](https://github.com/bminer/module-concat)

17. [Bit Bundler](https://bundler.bitjs.io/)

18. [SystemJS Builder](https://www.npmjs.com/package/systemjs-builder)

19. [Steal](https://stealjs.com/)

20. [Blade Runner](http://bladerunnerjs.org/)

21. [Rome](https://rome.tools/)

### Other Articles You Might Like

1. [What is ES6 Tree Shaking?](https://h.shadowtime2000.com/what-is-es6-tree-shaking)

2. [Everything You Don't Know About ES Modules](https://h.shadowtime2000.com/everything-you-dont-know-about-es-modules)

Feel free to suggest any more bundlers that I can add to the list in the comments!
Deploying React, Angular, Svelte and Vue to Netlify & Vercel
Tags: netlify, vercel
Published: 2021-01-12 23:45:22

## Creating Your Project

Doesn't matter if you use the official project generator for any of the major frontend frameworks or if you used other generators like my merced-spinup tool (check it out on npm), deploying the Vercel or Netlify is super simple!

## Info we need to collect

There are two things we need to figure out

- **The Build Command:** This is the command that triggers the build step

- **The Output Folder:** This is the folder the build command will leave the final website in.

Here are the commands for the main official templates for each framework.

| FrameWork | Build Command | Output Folder |
|-----------|---------------|---------------|
| *React | npm run build | build |
| Vue | npm run build | dist |
| Angular | npm run build | dist |
| Svelte | npm run build | public/build |

*For Created React App make sure to add "CI= " in front of the build script or it may error on netlify or vercel

#### For other templates

When using other templates look inside the package.json scripts to find the build command, and run it locally to see what folder the output is created in.

## Uploading your project to Github

The next step is to push your code to a repository on github, make sure that the root of your repository (the top level) is the directory where the package.json file exists other Netlify and Vercel will not be able to run the build command to deploy your project. The repo can be uploaded to github, bitbucket or gitlab.

## Connect the Repo

Log on to Vercel or Netlify and create a new project linked to your repository, when it asks for the build command and output directory enter the right entries and wait a moment for the website to build a voila! Your Site is deployed!

Not only that, the site will auto-update whenever you update your github repo, continuous deployment for the Win!

## Configuring for router

If your using client-side routing (React-Router, etc.) make sure to take these extra steps.

#### Netlify

In the root of your repository create a netlify.toml and add the following entries

netlify.toml
```toml
[[redirects]]
  from = "/*"
  to = "/index.html"
```


#### Vercel

On the root of your or repository create a vercel.json with the following

vercel.json
```json
{
  "version": 2,
  "routes": [
    { "handle": "filesystem" },
    { "src": "/.*", "dest": "/index.html" }
  ]
}
```

## Bottom Line

Deploying your frontend application regardless of the framework on Vercel and Netlify is super easy, so go build some applications!
Bad habits you need to get rid of as a software developer
Tags: programming, career, softwaredevelopment, webdev
Published: 2021-01-12 23:33:35

---
title: Bad habits you need to get rid of as a software developer
published: true
description: 
tags: programming, career, softwaredevelopment, webdev 
//cover_image: https://direct_url_to_image.jpg
---
Check out my latest blog here: 
https://jeffreyuvero.medium.com/bad-habits-you-need-to-get-rid-of-as-a-software-developer-263978636ab3