teleren/devto huggingface dataset:
Why bascamp built 100 BLN$ Software Empire by doing less ? 
Tags: saas, startup, marketing, design
Published: 2020-09-13 20:42:24

𝐓𝐨𝐝𝐚𝐲 𝐈'𝐦 𝐠𝐨𝐢𝐧𝐠 𝐭𝐨 𝐬𝐡𝐚𝐫𝐞 𝐰𝐢𝐭𝐡 𝐲𝐨𝐮 𝐇𝐨𝐰 𝐁𝐚𝐬𝐞𝐜𝐚𝐦𝐩 𝐛𝐮𝐢𝐥𝐭 𝟏𝟎𝟎 𝐛𝐢𝐥𝐥𝐢𝐨𝐧$
𝐒𝐨𝐟𝐭𝐰𝐚𝐫𝐞 𝐂𝐨𝐦𝐩𝐚𝐧𝐲 𝐛𝐲 𝐝𝐨𝐢𝐧𝐠 𝐥𝐞𝐬𝐬.

Read this post till end to find how Basecamp did entirely opposite of market .

𝐁𝐲 𝐮𝐧𝐝𝐞𝐫 𝐝𝐨𝐢𝐧𝐠 𝐭𝐡𝐞 𝐜𝐨𝐦𝐩𝐞𝐭𝐢𝐭𝐨𝐫𝐬 ...
Not doing more work , rather doing less, shocked ?

Major reasons lot of saas/software do not achieve product market fit.

𝐁𝐚𝐬𝐢𝐜𝐚𝐥𝐥𝐲 𝐰𝐡𝐚𝐭 𝐢𝐬 𝐩𝐫𝐨𝐝𝐮𝐜𝐭 𝐦𝐚𝐫𝐤𝐞𝐭 𝐟𝐢𝐭 𝐢𝐧 𝐬𝐢𝐦𝐩𝐥𝐞𝐬𝐭 𝐭𝐞𝐫𝐦𝐬 ...

Only reason people buy your product of saas/software is to do some type of job,
if they can do it properly or quickly & get results (then you have a solution to market's problem).

𝟑 𝐂𝐨𝐦𝐦𝐨𝐧 𝐌𝐢𝐬𝐭𝐚𝐤𝐞𝐬 𝐌𝐨𝐬𝐭 𝐅𝐨𝐮𝐧𝐝𝐞𝐫𝐬 𝐃𝐨

𝐅𝐨𝐜𝐮𝐬𝐢𝐧𝐠 𝐨𝐧 𝐟𝐞𝐚𝐭𝐮𝐫𝐞𝐬 𝐫𝐚𝐭𝐡𝐞𝐫 𝐭𝐡𝐞𝐧 𝐞𝐱𝐩𝐞𝐫𝐢𝐞𝐧𝐜𝐞𝐬 & 𝐣𝐨𝐮𝐫𝐧𝐞𝐲𝐬
A lot of founders obsess over features ,
rather then experiences & journey's .
this leads to a clunky product that no one likes to use .

Truth is you should focus more on user journey's & how quickly they can do the job &  get results.

𝐍𝐨𝐯𝐞𝐥𝐭𝐲 𝐎𝐯𝐞𝐫 𝐐𝐮𝐚𝐥𝐢𝐭𝐲
I've recently seen a trend where people are trying to integrate AR/VR ,
into some of very basic apps to make it unique or novel ,
this leads to low adoption & response from market ,

Best thing you can do is build things that are usable &
are of good quality rather then building novel products (for faster product market fit/adoption).

𝐂𝐨𝐦𝐩𝐥𝐞𝐱 𝐔𝐈 𝐰𝐢𝐭𝐡 𝐥𝐨𝐭𝐬 𝐨𝐟 𝐬𝐭𝐞𝐩𝐬 (𝐭𝐚𝐤𝐢𝐧𝐠 𝐚 𝐥𝐨𝐭 𝐨𝐟 𝐭𝐢𝐦𝐞 𝐭𝐨 𝐬𝐞𝐞 𝐫𝐞𝐬𝐮𝐥𝐭 𝐰𝐢𝐭𝐡 𝐩𝐫𝐨𝐝𝐮𝐜𝐭)

Good design is like good taste: it’s largely defined by the omission of the unnecessary.
It is very essential to add as minimum features as possible as ,
no one come to use your app but they come to get things done or
make their lives easier .

You sole focus should be making interactions short/reactive &
provide feedback to user in real time for better experience .

𝐖𝐚𝐧𝐭 𝐭𝐨 𝐜𝐡𝐚𝐧𝐠𝐞/𝐢𝐦𝐩𝐫𝐨𝐯𝐞 𝐲𝐨𝐮𝐫 𝐬𝐚𝐚𝐬 𝐢𝐧𝐭𝐞𝐫𝐟𝐚𝐜𝐞 &
𝐦𝐚𝐤𝐞 𝐢𝐭 𝐚 𝐩𝐫𝐨𝐝𝐮𝐜𝐭 𝐭𝐡𝐚𝐭 𝐲𝐨𝐮𝐫 𝐮𝐬𝐞𝐫𝐬 𝐥𝐨𝐯𝐞?

To book a UX Discovery call: 
https://www.saaselevate.com
Feedback needed for React Calculator app
Tags: react, help
Published: 2020-09-13 20:40:21

Hello friends,

I am new to ReactJS and have recently built a Calculator app with ReactJS using functional components and hooks. Calculations can be done with buttons on the UI as well as the keyboard inputs.

I would like to get feedback regarding the folder structure, performance optimizations, coding standards, etc.

Codesandbox link is [here](https://codesandbox.io/s/silly-raman-593lx)
Manage Github issues in Trello using Github Action
Tags: actionshackathon, opensource, showdev, productivity
Published: 2020-09-13 20:34:37

[Instructions]: # (To submit to the GitHub Actions x DEV Hackathon, please fill out all sections.)
Using Trello for project management with your team now made easier with this Github action.

### My Workflow
[Note]: # (Make sure to include the name of your GitHub Action and share where it's being used!)
**Trello Manage** is a GitHub action that helps you automatically manage your issues in Trello with your teammates.

![Alt Text](https://media.giphy.com/media/Urb3nedW0LWA9fF02W/giphy.gif)

It automatically creates a **Board** with the name same as that of the *repository name* and a **list** with name *Issues* so that team working on that repo can manage issues easily.

![Alt Text](https://media.giphy.com/media/jrigO2lFTg5ZO3IJbZ/giphy.gif)

It also assigns the issue **labels** and **colour coding** in your Trello board list same as that of your Github, enabling you to easily differentiate between each issue.

### Submission Category: 

[Note]: # (Maintainer Must-Haves, DIY Deployments, Interesting IoT, Phone Friendly, or Wacky Wildcards)
**Maintainer Must-Haves** (Primary)
**Phone Friendly** (Secondary)


### Yaml File or Link to Code

[Note]: # (Our markdown editor supports pretty embeds. Try this syntax: `{% github link_to_your_repo %}` to share a GitHub repository)
You can easily integrate this action in your workflow using this YAML:

```yaml
name: Trello Issue List
on:
  issues:
    types: [opened]
env:
  TRELLO_KEY: ${{ secrets.TRELLO_KEY }}
  TRELLO_TOKEN: ${{ secrets.TRELLO_TOKEN }}
  
jobs:
  issue_send:
    name: Send Issue to Trello
    runs-on: ubuntu-latest
    steps:
      - name: Runs trello manage
        uses: sisodiya2421/trello-manage@master
        with:
          repo-name: ${{ github.repository }}
          trello-username: ${{ secrets.TRELLO_USERNAME }}
```

You may also check out the Repository for better understanding

{% github https://github.com/sisodiya2421/trello-manage %}

### Additional Resources / Info

Making this action has been a really great journey for me. Being a newbie in JavaScript this action not only helped me in learning JavaScript language but also the core design features and use cases of Github Action. This being my second Github action project, I feel very much satisfied and convinced that there are lots of possibilities that can be made possible using this great tool.

More features can be added to this Trello manage Github action like automated issue assignment to team members or automated adding issues to *Done* list in Trello after it's been closed.

Possibilities are endless.
Data Structures - Pt 2: Linked Lists
Tags: datastructure, beginners, linkedlist
Published: 2020-09-13 20:17:14

If you are new to data structures, this post is for you. I didn't have the easiest time grasping data structures, so I wanted to share the basics of what I have learned so far to help you get started. My [previous post](https://dev.to/brittjavs/data-structures-pt-1-stacks-and-queues-4nd5) covered stacks and queues. This one will cover the basics of linked lists. 

A linked list is an ordered collection of data made up of nodes. 
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/qmh5g51o8f0y32pkvf9p.png)
* Each node must have 2 properties
 1. A data property which contains the data
 2. A next property which is a reference to the next node
```
class Node {
    constructor(data, next=null){
        this.data = data;
        this.next = next 
    }
}
```
* The first node is often referred to as the "head" node and the last node is often referred to as "tail" node. The tail node will not have a reference to any other node.
* The order of nodes will not change unless we explicitly change the order by inserting and/or removing nodes.
* To access nodes, you must go through the pointers. (Linked lists do not use index numbers the same way arrays do.) Below is an example of accessing a specific node in a linked list if given an index. 
```
getAt(index){
  let count = 0
  let node = this.head
    while(node){
      if(count === index){
      return node
      }
      count++
      node = node.next
    }
   return null
}
```
In addition to the basic singly linked list, there are 2 additional types of linked lists.
 1. Doubly linked list
  * A doubly linked list will have both next and previous properties.
 2. Circular linked list
  * A circular linked list doesn't have a tail node. Instead the last node will point to a node at an earlier point in the list, creating an infinite loop.
AWS default user for EC2
Tags: aws, linux
Published: 2020-09-13 19:23:26

---
title: AWS default user for EC2
published: true
description: 
tags: aws, linux
//cover_image: https://direct_url_to_image.jpg
---

When creating EC2 on AWS. AWS will create a default to login to the system.

The default user is provied on AWS.

https://docs.aws.amazon.com/AWSEC2/latest/UserGuide/connection-prereqs.html#connection-prereqs-get-info-about-instance
Process Management (Process vs Thread)
Tags: linux, devops
Published: 2020-09-13 18:38:12

Today I am trying to cover the very common but still confusing topic in process management i.e. Process vs Thread.

So as per me before jumping directly onto the process and thread difference first we should understand what these two terms are and I will also try to explain the difference side by side.

Process: Most common definition for process is "The process can be thought of as a program in execution", or in simple words we can say that if we have any program or binary that is running at that time then we will call it a process. Or we can take an example of objects in OOPs concepts to make it easier. Like we can create multiple objects for a single class, same we can create multiple processes for a single program but all processes will be having different PIDs.
To test with we can take a very simple example where we can open two terminals and open vim editors and then we will see that both will be having different PIDs.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/qs22u5st7j2w90bmh1zn.png)

In the above example we can see that we have different PIDs for both processes while we are running the same program.
For process we can say that these will be exact clones of the same program if we will be having a child process of any process.

Thread: For thread we can say that "A thread is the unit of execution within a process. A process can have anywhere from just one thread to many threads".
I am hoping that the above statement is enough to explain about the threads but still I will try to explain this bit more. So we can say that threads are multiple part of processes but the difference is these are part of the process so these threads will be having the same PID as the process for all threads as they do not clone the process but they use the same data for all the threads within one process they are connected. We can see the example to threads with the help of ps command with the combination of a few flags.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/tsqecfe2zr6snjinrod0.png)

In the above example we took docker threads and we can see that all threads are having the same PID but still they are having different threadIDs.

Difference between process and threads:
Process = Program + State of all threads executing in the program

The simplest example that I can think of to understand this completely is the Daily News-Paper. We can say that the entire news paper is a process and multiple sections like sports or business are threads of the process.

I am hoping that I was able to explain this topic properly but still feel free to correct me in case I am wrong anywhere.
Day 59: Deploying to Firebase
Tags: 100daysofcode, firebase
Published: 2020-09-13 19:04:45

I deployed the web page to Firebase today. Here is an overview of the process.
* Create a new project in firebase
* Install the Firebase CLI using (on ubuntu)
```
curl -sL https://firebase.tools | bash
```
* Login from the terminal by running:
```
firebase login
```
* Initialize firebase
```
firebase init
```
I selected the hosting option and set the root folder to default (public).
* Serve to localhost using:
```
firebase serve
```
* Deploy using
```
firebase deploy
```
Here is the link the deployed site: [My weather app](https://weatherapp-d2d7b.web.app/)

_Day 59_
Intro To React (P2) ES6 features
Tags: beginners, react, tutorial, webdev
Published: 2020-09-13 19:00:59

###Variables 

`var` was used to declare variables in JavaScript.
To avoid errors and solving scoping issues we now use
`let` and `const` where let is a var like declaration and using const we make the variable immutable.

We need to use let and const as per our requirements.

###Arrow function

Regular function in JavaScript
```
function myFunc () {
   ...
   --function_body--
   ...
}
```

ES6 function in JavaScript
```
const myFunc = () => {
   ...
   --function_body--
   ...
}

parenthesis can be removed if 1 parameter is passed and the return statement can be omitted if it is a one-liner

const myFunc = num => num * 5;

myFunc(5);
```

###Export and Import

We use `export default person` to export a default parameter or function. Or we may export multiple functions from a single file
`export const hello`.

To import we follow the below syntax
```
To import default functions
import person from './person.js';
import prs from './person.js';

To import particular function from many export
import {hello} from './hello.js';
import {hello as Hi} from './hello.js';
import * as bundled from './hello.js';
```

###Class

```
class Person{
   name = "Raja";                //Property are variable

   const call = () => { body  }  //Methods are functions
}
Usage:
const myPerson = new Person;
myPerson.call();

class Person {
   constructor () {
      this.name = "Sonu";
   }
   function printMyName () { 
       console.log(this.name);
   }
}
```

###Spread and Rest Operator

This is three dots `...`

The spread operator is used to split up array or object elements

```
oldArr = [a, b, c]
const arr = [...oldArr, 1, 2];    // [a, b, c, 1, 2]

const oldObj = { name : 'Ashu'};
const obj = {
   ...oldObj,
   age : 25
}
```

The rest operator is used to merge a list of arguments into an array

```
function sortArray (...args) {
   return args.filter( item => item === 10);
}

sortArray(1,5,8,10);
```

###Destructuring

To pick up particular items in an array and store them as variables

```
const numbers = [1, 2, 3];
[num1, , num2] = numbers;

console.log (num1, num2);   // 1, 3
```
Roadmap to become a Java developer. If something is missing please comment it down.
Tags: java, career, codenewbie
Published: 2020-09-13 18:47:45

After browsing, searching and watching several resources I developed this roadmap for becoming a java developer. core java-> advance java-> jsp servlet-> spring/apache/hibernate.
Core java is a must then comes advance java which includes Java servlets, JSP,JDBC, maven/gradle ,hibernate/spring.
Comment down your thoughts below. If something is missing please comment down. It will help many tech enthusiast like me who want to become a Java developer.
Print sorted elements of an array using setTimeout
Tags: javascript, webdev, codenewbie, beginners
Published: 2020-09-13 18:34:17

```
const arr = [4, 9, 2, 20, 1, 12];
arr.forEach(num => {
    setTimeout(() => console.log(num), num);
});
```

Output:
1
2
4
9
12
20

---

**Thanks for reading 💙**  
Follow **@codedrops.tech** for daily posts.  
[Instagram](https://www.instagram.com/codedrops.tech/) ● [Facebook](https://www.facebook.com/codedrops.tech/)

Micro-Learning ● Web Development ● Javascript ● MERN stack  
**[codedrops.tech](https://www.codedrops.tech/)**
REDUX CONFUSIONS
Published: 2020-09-13 18:31:42

Hey guys
I am a MERN developer. I am currently working on a project where i have been introduced with redux and redux stores and i am not sure how it works completely, i tried to read a lot of documents also, still i am not getting that confidence, that i am good in redux and i can use it in my project, so here i need your suggestions how can i master redux and can anyone give a brief intro of it and a high level picture of it, thanks in advance...
Raisensu: A Lightweight License Management Application
Tags: python, showdev
Published: 2020-09-13 18:30:55

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/tmpcs74fylsnyvq0e2al.png)

Hello! I want to brag about a little application I wrote called Raisensu. Raisensu is a lightweight license management solution that allows System Administrators to track licenses in a small to medium sized enterprise. 

The idea behind Raisensu was pretty simple - not every application needs a full stack front end web application with a robust and complex backend. Raisensu is lightweight in the sense it operates purely at the commandline level. It supports High Availability between monitoring services (Linux only). Raisensu has the capability of being pure stateless or a stateful application. 

The backend is pretty simple. A single table is used to store licenses. Raisensu supports two backend databases: SQLite3 and Postgresql. 

It's easy to get started with Raisensu; it only takes a few commands! 


Raisensu is supported on both Linux and Windows. The benefit to running on Linux is having High Availability support with the monitoring tool. A service file can be created easily to enable HA.



https://github.com/schnipdip/Raisensu



As a note, I'm not a programmer by trade. I develop small applications to keep up with basic knowledge and terminology for future expectations in my job. If you see any bugs or want to add something please open up a feature. If you want to contribute you can issue a PR.


I hope this application can serve you well :)
Neon effect in text and SVG with CSS
Tags: css, webdev, html
Published: 2020-09-13 18:23:20

I'm currently working in a website for my portfolio and when I found a colour palette I was comfortable with, I bumped into a serious problem: the logo of one project blended with the background.

One approach to solve a problem like this is to add contour to highlight the image. Trying it out, I ended up with a really cool neon-like effect.

![without effect](https://dev-to-uploads.s3.amazonaws.com/i/aqf5d0zezle4b371saak.png)
*The logo without the effect*

![with effect](https://dev-to-uploads.s3.amazonaws.com/i/gayz2ox7i1qjdhv0jv59.png)
*The logo with the effect*

The CSS property used for this is the `filter` `drop-shadow`:
```css
img{
    filter: drop-shadow(0px 0px 3px #116466);
}
```
Where the parameters are `(x-off y-off blur color)`. Find more information [here](https://www.w3schools.com/CSSref/css3_pr_filter.asp).
**Note that the image must have SVG format**. There are other ways to obtain a similar effect with a SVG image, but the advantage that this method have is that it will work even in external images, not only inline SVG.

Also, this works on text too! Here's an example.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/vl7tnvu9qgvkxseszc12.png)
*Text without effect*
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/6pafqr52ss5r4asnu9b5.png)
*Text with effect*

I hope you find it useful!
The Journey so far 5 months after I switched!
Tags: webdev, career
Published: 2020-09-13 18:10:44

---
title: The Journey so far 5 months after I switched!
published: true
description: 
tags: #webdev, #career
//cover_image: https://direct_url_to_image.jpg
---

A few months back, i wrote a blog post that got more attention than i thought it would. You can read more about it [here](https://dev.to/iamkarsoft/i-switched-4h28).

So it's been close to 5 months since i left my old job. This blogpost to give an update on the previous one. 

### How do i feel?

The transition hasn't been that easy. Before i started this internship, i was improving my skills and acquiring more knowledge about what i foresaw as my dream career. My stack before i left my old job was HTML, CSS, PHP, and some WordPress knowledge. Before the interview, I was improving my laravel knowledge and getting into javascript. My goal is to become more versed in javascript (vue js) and laravel.

### What about work?

The internship has been good. Every project brought up new challenges. The first 2 projects got me writing a lot of javascript ( vanilla & Jquery) as well as using bootstrap which i was familiar with. Then came along building landing pages and testing my responsive skills ( which needs a lot of improvement). Lately, I've been wondering how people structure their responsive styles? mobile-first? widescreen first? Would absolutely love some pointers on that. Anyways, i still have a lot to learn but so far so good, and can't wait to acquire more knowledge and experience in the coming months.

### What's next?

I have a personal manifesto for 2020 that i hope to tick all the boxes by the end of the year. This manifesto includes learning vue js, getting deeper into laravel and improving my cms skills, as well as taking my side project [edwuma.work](http://edwuma.work) to another level. I acquired a few courses to guide me through my map. I also want to start meditating to weed out distractions and improve my productivity.

So that's all the update for now. Stay safe and take care.
Extending JavaScript Built-in Classes/Objects
Tags: javascript, beginners, codenewbie, webdev
Published: 2020-09-13 18:09:06

You might want to extend the functionality provided by JS built-in objects or classes. Maybe there is functionality on Arrays or Strings that is not yet supported by JavaScript, but you use it heavily in your project. Typically you can do this by creating a standard utility function.

Let's take the example of shuffling an array. I can create a shuffle function that takes in an array.

```javascript
function shuffle(arr) {
    for (let i = arr.length - 1; i > 0; i--) {
        const random = Math.floor(Math.random() * (i + 1));
        [arr[i], arr[random]] = [arr[random], arr[i]];
    }
    return arr;
}

const input = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
console.log(shuffle(input)); // [ 7, 8, 10, 3, 2, 9, 5, 1, 4, 6 ]
```

**Note**: You will get a different console output compared to me as we are randomly shuffling an array.

We could, however, add this shuffle method to the prototype of Array so we can use it as in-built methods (`pop`, `slice`, `sort`).

```javascript
Array.prototype.shuffle = function () {
    let arr = this;
    for (let i = arr.length - 1; i > 0; i--) {
        const random = Math.floor(Math.random() * (i + 1));
        [arr[i], arr[random]] = [arr[random], arr[i]];
    }
    return arr;
}

const input = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
console.log(input.shuffle()); // [ 2, 4, 9, 8, 5, 7, 3, 10, 6, 1 ]
```

Now we have declared it on the prototype, and we can call it on any array using the format `input.shuffle()`.

### Disadvantages

A lot of people do not recommend extending built-in classes or objects. It is a controversial topic. There are a couple of disadvantages:

1. ECMAScript may implement its version of the custom method we created. For example, if the next ES version brings in `shuffle` property to Arrays, we will have a conflict.
2. Nothing is stopping us from overwriting the functionality of existing methods. For example, I might change the behavior of `slice` method on Arrays with a custom function. Doing so is not a good practice for an enterprise app as others might be dependent on in-built methods. I would be breaking functionality for a lot of people in the organization.
My #100DOC - Day 18
Tags: challenge, 100daysofcode, log
Published: 2020-09-13 18:05:39

### Day 18: September 13, 2020

#### **Today's Progress**: 
1. **[Continued with The Complete JavaScript Course](https://github.com/pablohs1986/javaScriptCompleteCourse2020_Schmedtmann)** (1h):<br>I started with section 6, learning and implementing the module pattern.
    
#### **What I learned**: 
* What is and implement the module pattern in JavaScript.

#### **Total time**:
1h.