teleren/devto huggingface dataset:
Developer Tools - Terminal
Published: 2021-04-25 03:01:58

I love my terminal setups. I don’t know what it is about it. It reminds me of my first PC, where I was running Windows 3.1 / MS-Dos 6, except, well, its better. It also reminds me of when I first tried out linux. And I don’t mean a bloated full blown distro… this was back when I was in highschool and I found a distro that could boot off a floppy disk. The amount of power you have in the terminal is outstanding, and yet, a lot of people shy away from it. I think seeing a blinking cursor and a c:\ can be a bit intimidating. That said, as a developer, I have a terminal window open much of the time. I find switching git repos and getting latest a lot smoother using the git command then most GUI based tools. That said I’ve been using some form of terminal / prompt for many moons, and even I get nervous using it. To make my life easier however, I have “prettyfied” my terminal, and will show you how you can too.
So, I use the phrase terminal gets thrown around a LOT. I am not going to get into the nuances of terminal vs shell, since Scott Hanselman covers it very well here… https://www.hanselman.com/blog/whats-the-difference-between-a-console-a-terminal-and-a-shell

## As a Windows Developer - 
First and foremost is I download Windows Terminal. Second is Powershell Core. I also run the latest Powershell Core and Powershell shells. Windows Terminal gives you the option of quickly switching to Command Prompt, Powershell, Powershell core, Azure, or any installs WSL linux distros on your machine. From there I install NerdFonts, powerline, and Oh My Posh. Directions to install can be found here..https://docs.microsoft.com/en-us/winddows/terminal/tutorials/powerline-setup
This not only makes my terminal super nice looking, it gives me quick access to git information such as number of changes made, if it’s in sync, and which branch I am in.

## As a Mac or Linux Developer - 
Ok, so I haven’t tried this in a shell only linux distro, but in Gnome using xterm. For Mac, I have used terminal and Term2 and between the two, I haven’t seen a reason not to use Macs default terminal. For linux, I install Zsh shell. Mac already has Zsh installed (most recent versions). Once I have it installed, as above, I install a nerdfont based font for the GUI. This gives the nice fancy Icons such as the Git Icon and Linux / Apple logo in the corner. Oh my Zsh (https://ohmyz.sh) is then installed to get the fancy tools for git. For a theme, I installed Powerlevel10k. This gives me a GUI very similar to powerline on windows. Install directions can be found at its website, https://github.com/romkatv/powerlevel10k. This gives me the same bells and whistles I use on my Windows PC
Getting Back to Writing
Published: 2021-04-28 21:50:39

---
title: Getting Back to Writing
published: true
date: 2021-04-25 02:06:56 UTC
tags: 
canonical_url: https://triptych.writeas.com/getting-back-to-writing?pk_campaign=rss-feed
---

![](https://i.snap.as/iPJfkJEx.png)

Lately, I've been working on coding projects, but neglecting my writing. Recently Amazon announced something called Kindle Vella. This is intended to be short form, serial fiction which readers pay tokens to get to the next chapter. It really suits my way of writing, so I'm going to see how far I can go there.

I've also neglected my music listening – to my own detriment. I'm trying to correct all of these things with this blog post. I have so much cool stuff I could talk about, and yet I keep silent and see other's gaining readers through posts that are less complicated and involved than I could get to.

So.

Let's fix that! I need to post more often and share what's going on. And maybe there will be something that interests you, dear reader?

First off let's get to some music!
 (sorry dev.to you won't see this ) 
<iframe src="https://open.spotify.com/embed/playlist/37i9dQZF1E364cjW1qTesS" width="300" height="380" frameborder="0"></iframe>

I know write.as does a great job allowing embeds, so I'm testing this out. There are so many things I could be doing here. Now that I'm vaccinated, it's time to step up and step out.

## Current activities:

- Going through the Threejs tutorial over at [Threejs-journey](https://threejs-journey.xyz/)
- Transferring my serial novel _The Clockwork Apprentice_ to [Kindle Vella]
- Having fun making cool things over on [Observable](https://observablehq.com/@triptych)

## Goals:

- Write ( every day! )
- Create a simple JS web game — dungeon critters
- Write more chapters for The Clockwork Apprentice
Best Options For Recurring Developer Income?
Tags: career, freelance, money, discuss
Published: 2021-04-25 02:01:18

---
title: Best Options For Recurring Developer Income?
published: true
description: I'm curious what's worked and hasn't worked for you!
tags: career, freelance, money, discuss
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/iktex46vg24pqib7gn24.jpeg
---
As a Freelance developer, what's the best way to get recurring income? 

Things like maintenance plans, monthly hosting packages, etc. I'd love to hear what's worked and what didn't for you!
Ai Palettes
Tags: color, palettes, ai, graphic
Published: 2021-04-25 01:59:32

---
title:Ai Palettes
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3pru0edsajh31c1cfhlq.png
tags: color,palettes,artificialintelligence,graphic
published: true
---
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3pru0edsajh31c1cfhlq.png)
AI Palettes , My own recent work , an online website where you can choose one color to generate best fit colors palette that is compatible with your input , A recommendation system based on Artificial Intelligence , You can copy each color code by clicking on it.I made it for a free use to everyone! If you are a Designer / Painter / Art Creator this will help you alot.In order to keep the website online consider to donate.

Website : https://aipalettes.com/ 
Github : https://github.com/bondbenz/aipalettes
Terraforming Alibaba Cloud - VPC and vSwitch
Tags: devops, alibabacloud, terraform
Published: 2021-04-25 01:51:27

This post will help to build an Alibaba Cloud VPC and vswitches. VPC is an isolated network segment. Vswiches are logically divided VPC into smaller groups. For the people coming from another cloud provider, vswitches are overall subnets. 

As a best practice, it is recommended to use all the subnets in different subnets. 

This code is an extension of the previous post. 

```
variable "access_key" {}
variable "secret_key" {}
variable "region" {}

#Provider Definition
terraform {
  required_providers {
    alicloud = {
      source  = "aliyun/alicloud"
      version = "1.121.1"
    }
  }
}

#Provider Variables
provider "alicloud" {
  access_key = var.access_key
  secret_key = var.secret_key
  region     = var.region
}

#Resource Management Definition
resource "alicloud_resource_manager_resource_group" "development-rg" {
  resource_group_name = "aliyun-development-rg"
  display_name        = "aliyun-development-rg"
}

#VPC Definition
resource "alicloud_vpc" "vpc" {
  vpc_name          = "Development-VPC"
  description       = "This is development VPC"
  cidr_block        = "192.168.0.0/16"
  resource_group_id = alicloud_resource_manager_resource_group.development-rg.id
  tags = {
    type       = "development"
    managed-by = "Terraform"
  }
}

#VSwich Definition 
resource "alicloud_vswitch" "vswitch-1" {
  cidr_block = "192.168.1.0/24"
  zone_id    = "ap-southeast-1a"
  vpc_id     = alicloud_vpc.vpc.id

  vswitch_name = "development-subnet-1"

  description = "development-subnet-1"

  tags = {
    type       = "development"
    managed-by = "Terraform"
  }
}
resource "alicloud_vswitch" "vswitch-2" {
  cidr_block = "192.168.2.0/24"
  zone_id    = "ap-southeast-1b"
  vpc_id     = alicloud_vpc.vpc.id

  vswitch_name = "development-subnet-2"

  description = "development-subnet-2"

  tags = {
    type       = "development"
    managed-by = "Terraform"
  }
}
resource "alicloud_vswitch" "vswitch-3" {
  cidr_block = "192.168.3.0/24"
  zone_id    = "ap-southeast-1c"
  vpc_id     = alicloud_vpc.vpc.id

  vswitch_name = "development-subnet-3"

  description = "development-subnet-3"

  tags = {
    type       = "development"
    managed-by = "Terraform"
  }
}

```
Advice
Tags: career, frontend, advice
Published: 2021-04-25 01:47:47

Hello I am Felipe and I live in Brazil, I started programming this year and I am enjoying it more and more, and each time I try to go deeper and deeper.

I know it is a difficult question, but I want to know a little more about people who are following the same path as I am.

I would like to know, if this year I focus on front-end studies, if next year I can already direct myself to the job market as a junior front-end?

And my focus is to find work in another country, if possible someone has a tip about it! Thanks!
LeetCode 221. Maximal Square
(javascript solution)
Tags: algorithms, javascript
Published: 2021-04-25 01:35:32

###Description:
Given an m x n binary matrix filled with 0's and 1's, find the largest square containing only 1's and return its area.

###Solution:
Time Complexity : O(n^2)
Space Complexity: O(n^2)

```javascript
var maximalSquare = function(matrix) {
        const rows = matrix.length, cols = rows > 0 ? matrix[0].length : 0;
        // Create dp array
        const dp = Array(rows + 1).fill(0).map(() => Array(cols + 1).fill(0));
        
        // Keep trac of the max square length
        let maxsqlen = 0;
        for (let i = 1; i <= rows; i++) {
            for (let j = 1; j <= cols; j++) {
                // Only check cells that have a 1 in the original array
                if (matrix[i-1][j-1] == '1'){
                    // Check if the current cell is part of a square
                    dp[i][j] = Math.min(Math.min(dp[i][j - 1], dp[i - 1][j]), dp[i - 1][j - 1]) + 1;
                    maxsqlen = Math.max(maxsqlen, dp[i][j]);
                }
            }
        }
        // Return the area of the square
        return maxsqlen * maxsqlen;
};
```
My javascript / tech / web development newsletter for 2021-04-24 is out!
Tags: javascript, tech, webdev, discuss
Published: 2021-04-25 00:48:35

---
title: My javascript / tech / web development newsletter for 2021-04-24 is out!
published: true
description: A roundup of all the best javascript, tech and web development links posted to my linkblog in the past week
tags: javascript, tech, webdev, discuss
---
In this week’s edition:

Apple, audio hotness, FLoC, regulations, NodeJS16, Linux controversy, future of AR/VR & AI, Next.js, Netbooks, weird podcasts, and so much more

https://markjgsmith.substack.com/p/mark-smiths-newsletter-24-04-2021

Would love to hear any comments and feedback you have.

[@markjgsmith](https://twitter.com/markjgsmith)
Primitives values and JavaScript Objects
Tags: javascript, primitives, objects
Published: 2021-04-25 00:32:28

“In JavaScript, objects are king. If you understand objects, you understand JavaScript.” (w3schools)

All JavaScript values such as Arrays, Functions, Objects and Regular Expressions are considered to be objects, except primitives values, these are not objects.

Primitives values are values that have no properties or methods, and the following is a list of what is called primitives data types ,which are a type of data that have primitives values :
    • string
    • number
    • boolean
    • null
    • undefined

So for example, if we have a string that says `“I am a string”` , the primitive value in this case is  `“I am a string”` and the primitive data type is string.

But you might ask, if primitives values or primitives data types have no properties or methods, then how come the primitive value `“I am string”` have property `length` and other methods such as `charAt()`. 

Well first we need to know what is a `String` object.

A `String` object, is a JavaScript built-in object, this `String` object also have a property called `'prototype'`, this property value itself acts as a template object that contains methods and properties we can use and can be inherited. 
Hence the reason we have methods such as `String.prototype.charAt()`.

In JavaScript and other programming languages, they have the ability to convert a value from one data type to another (e.g numbers to strings,  or a string to an object).

This kind of a conversion is called coercion , and it is done automatically. And to achieve that all we have to do is use a property accessor such the dot or the bracket notation, to coerce the string value `“I am a string”` to a `String` object.:

`“I am a string”.charAt(3) //  “a”`

It is also important to know that primitive values are immutable, so what is happening in background is that the string is temporarily converted to a `String` object.

`new String(“I am a string”).chartAt(3) //  “a”`

in the example above, the `String ()` function is called a “constructor function” since its name starts with a capital letter.
Having the `new` operator in front of a constructor function, will create a new object. 

In our case here, `String()` is JavaScript built-in constructor (or object).

That’s why you can also use a constructor functions to make objects instead of using object literal as show in the example below:

Object literal :

```
var myCar = {
    make: 'Ford',
    model: 'Mustang',
    year: 1969
};
```

Constructor functions:

```
function Car(make, model, year) {
  this.make = make;
  this.model = model;
  this.year = year;
}

var mycar = new Car('Ford', 'Mustang', 1969);// same object as mycar in object literal

```
Read more about constructor functions [here](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects#using_a_constructor_function) or String object [here](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String) and if you have any suggestions or feedback, feel free to leave them below.
Is the Agile Manifesto wrong?
Tags: remotework, facetoface, agile, agilemanifesto
Published: 2021-04-29 08:48:38

---
title: Is the Agile Manifesto wrong?
published: true
date: 2021-04-25 00:00:00 UTC
tags: remotework,facetoface,agile,agilemanifesto
canonical_url: https://jhall.io/archive/2021/04/25/is-the-agile-manifesto-wrong/
---

One of the [twelve principles](https://agilemanifesto.org/principles.html) behind the Agile Manfiesto states:

> The most efficient and effective method of conveying information to and within a development team is face-to-face conversation.

Over the last 12+ months, practically the entire software developing world has done an experiment in non-face-to-face communication. And by many accounts, the result of this experiment has been a demonstration that remote works just fine.

Does this mean the authors of the Manifesto for Agile Software Development were wrong?

Maybe.

One day I hope to ask some of the authors to clarify that principle, but I expect they were largely rejecting an alternative mode of communication: Conveying information by relay. That is, one group of people creating some list of reqiuremens, then handing them off to some sort of Project Manager, who then takes them to the developers.

![“I take the specifications from the customer and bring them down to the software developers.](https://jhall.io/archive/images/tom-smykowski.jpg)

In 2001 when the Agile manifesto was written, the tools for realistic remote and async communication were in their infancy. Many people were still using Dial-Up Internet access, and even those with broadband didn’t have quality tools for voide or video calling online, so online communication was mostly via text-based mediums such as email and [IRC](https://en.wikipedia.org/wiki/Internet_Relay_Chat). Even Wikipedia was brand new then, so the idea of collaborating via wiki was pretty new.

* * *
If you enjoyed this message, [subscribe](https://jhall.io/daily) to _The Daily Commit_ to get future messages to your inbox.
How to convert an array into string literal union type in TypeScript?
Tags: typescript
Published: 2021-04-25 00:00:00

---
  title: How to convert an array into string literal union type in TypeScript?
  published: true
  tags: TypeScript
  date: Sun Apr 25 2021 05:30:00 GMT+0530 (India Standard Time)
  canonical_url: https://melvingeorge.me/blog/convert-array-into-string-literal-union-type-typescript
  cover_image: https://melvingeorge.me/_next/static/images/main-ca6866be8b103f43674a290e6b8fb7eb.jpg
  ---
  [Originally posted here!](https://melvingeorge.me/blog/convert-array-into-string-literal-union-type-typescript)
  
To convert an array of strings into a string literal union type in TypeScript, you can first define the array of strings then make the array as `readonly` using the `as const` keyword, and then use the `typeof` operator on all the values contained in the array.

### TL;DR

```ts
// array of strings but in readonly mode
const namesArr = ["John", "Lily", "Roy"] as const;

// convert namesArr into string literal union type
type Names = typeof namesArr[number]; // "John" | "Lily" | "Roy"
```

I know, it takes some time to understand what is happening. So, Let me take you into it step by step.

First, we can initialize an array of strings like this,

```ts
// array of strings
const namesArr = ["John", "Lily", "Roy"];
```

Our aim is to convert this array of strings into a `string literal union type`.

For that first, we have to use the `as const` keyword on the array itself so that the array becomes a constant thing in every manner or `readonly` mode in TypeScript.

it can be done like this,

```ts
// array of strings but in readonly mode
const namesArr = ["John", "Lily", "Roy"] as const;
```

After making the `namesArr` array into `readonly` mode, you cannot use the usual `push`, `pop`, `slice`, etc. array methods. It is in every manner a constant.

Now we need to make this readonly array into a string literal union type.

For that let's define a type called `Names` and then use the `typeof` operator on all the values on the `namesArr` array.

It can be done like this,

```ts
// array of strings but in readonly mode
const namesArr = ["John", "Lily", "Roy"] as const;

// convert namesArr into string literal union type
type Names = typeof namesArr[number]; // "John" | "Lily" | "Roy"
```

Now you may ask why are we using the `number` type on the `namesArr`, it is to tell the TypeScript compiler to grab all the numbered indexed values from the `namesArr` array and then create a type from all its values.

So when TypeScript tries to infer the type of all values contained in the `namesArr` array it will create a type of string literal union type since all the values inside the array are `constant` and `readonly`.

In the end, the `Names` type would contain something like this,

```ts
type Names = "John" | "Lily" | "Roy";
```

Which is what we want. Now you can use the `Names` type in TypeScript.

See the above code live in [codesandbox](https://codesandbox.io/s/convert-array-of-strings-into-string-literal-union-type-in-typescript-2rpn0?file=/src/index.ts)

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

---
Have you tried using JŌTAI with React yet?
Tags: react, showdev, javascript, beginners
Published: 2021-04-24 23:42:01

---
title: Have you tried using JŌTAI with React yet?
published: true
description: Quick tutorial on jotai and how it compares to other state management solutions in React
tags: react, showdev, javascript, beginners
---

[In this video](https://youtu.be/oKFj5gBeauw) we're going to explore the [Jōtai](https://github.com/pmndrs/jotai) library! 

In the ReactJS ecosystem you've got so many state management solutions to pick from. You've got useState, useReducer, context API, recoil, redux, zustand, and so many more! 

Jotai provides a very simple minimalistic API and focuses on composing "atoms" as a bottom-up model/approach to managing state in a frontend application. 

> **Jotai is pronounced "joe-tie" and means "state" in Japanese.**

I'll be walking you through a basic ReactJS tutorial of Jotai as well as some notes on my own first impressions of using the library. 

**Have any of you used Jotai in production? What are your thoughts about it?**

Code with me and let me know what you think!

{% youtube oKFj5gBeauw %}

If you're interested, I also recently made content on Zustand, _another_ approach to state management from the same authors as Jotai.

{% youtube UcHkC5sJPWw %}
I've completely replaced the need for Postman with this one extension in VS Code!
Tags: thunder, client, vscode, extensions
Published: 2021-04-24 23:10:51

---
title: I've completely replaced the need for Postman with this one extension in VS Code!
published: true
description: 
tags: thunder, client, vscode, extensions
cover_image: https://i.imgur.com/Aff2IEH.png
---
I've completely replaced the need for Postman with this one extension in VS Code! The [Thunder Client extension](https://www.thunderclient.io/) for [VS Code](https://code.visualstudio.com/)
created by [@ranga_vadhineni](https://mobile.twitter.com/ranga_vadhineni) can do everything I need to when testing HTTP Requests.

## Features
- create and send requests
- group requests into collections
- use variables
- much more!

[Thunder Client](https://www.thunderclient.io/)
6 Great podcasts for Frontend Developers
Tags: webdev, codenewbie, beginners, career
Published: 2021-04-24 22:57:30

Photo by <a href="https://unsplash.com/@juja_han?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Juja Han</a> on <a href="https://unsplash.com/s/photos/podcast?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>

![Layout.fm logo](https://layout.fm/static/ccbda74b7edb4fd36bcc1c900e1ebfba/46604/artwork-spec.png)
## Layout.fm
[https://layout.fm/](https://layout.fm/)

A weekly podcast about design, technology, programming and everything else.
By @rafahari previously Netlify, currently superlist.com and 
 @vernalkick Senior UX Manager at @Shopify

![Codepen Radio Logo](https://dbs.radioline.fr/pictures/podcast_774f88f5bf8f3aad35d8a0d8c8918a21/logo200.jpg)
## Codepen Radio
[https://blog.codepen.io/radio/](https://blog.codepen.io/radio/)
Chris Coyier, Alex Vazquez, and Tim Sabat, the co-founders of CodePen talk about the ins and outs of running a web software business.

![Frontend HH Logo](https://i1.sndcdn.com/avatars-000287353351-tdlqh4-t240x240.jpg)
## Frontend Happy Hour
[http://frontendhappyhour.com/](http://frontendhappyhour.com/)
A podcast featuring a panel of Software Engineers from Netflix, Twitch, & Atlassian talking over drinks about all things Front End development.

![Ladybug Podcast Logo](https://pbs.twimg.com/profile_images/1143042724070907904/a0IYZ0uW.jpg)
## Ladybug
[https://www.ladybug.dev/](https://www.ladybug.dev/)
By Kelly Vaughn, Emma Bostian, Sidney Buckner & Ali Spittel share their thoughts and stories from working in tech. They also share some really fun and interesting interviews.

![Syntax FM Logo](https://pbs.twimg.com/profile_images/875075946096676864/MEEwGMpY.jpg)
## Syntax FM
[https://syntax.fm/](https://syntax.fm/)
By Wes Bos & Scott Tolinski
"Full Stack Developers Wes Bos and Scott Tolinski dive deep into web development topics, explaining how they work and talking about their own experiences."

![Fullstack Radio Logo](https://i.scdn.co/image/88ca4712d7edf416343a6b4ffd5d2b5b7f111a9b)
## Fullstack Radio
[https://fullstackradio.com/](https://fullstackradio.com/)
A podcast for developers interested in building great software products. Hosted by Adam Wathan.

And that's it! If you ask me my favorite I recommend Frontend Happy Hour.

<hr />

Follow me on [twitter](https://twitter.com/jordienr) or subscribe to my [newsletter](https://zerotofrontend.dev/) for more resources and tools for Frontend Developers!