teleren/devto huggingface dataset:
fast mvp cli tool 🔫 🔫
Tags: news, javascript, node, showdev
Published: 2021-12-11 19:12:41

## Hello dev community 👋

*A quick article to share with you my latest creation.*

---

Lately several product ideas come in my mind and I thought to myself that I always use the same tools, languages, libraries to achieve my goals and create my web applications here are the main ones:

* docker.
* nodeJs (expressjs, mongodb with mongoose).
* Vuejs.

Usually I create a repository for each service, that is to say I isolate the api, the front and the container in separate repositories but the disadvantage of this method is that the configuration takes some time and that’s not the goal I want it to be in a few seconds and with some manipulations I'll like to have a dev environment ready to go !

So here's my solution:

**A command line tool that allows me to create a repoitory following a template and clone this folder locally in order to run a single command to have my dev environment ready.**

### What you need:
* Working with a macos operating system.
* Docker.
* Nodejs >= 12.0.0.
* vue-cli installed globally on your computer.
* Github token.!

### What you get:
* Fresh new project connected to a fresh new repo.
* Docker with docker-compose to run all your services.
* Mongodb instance.
* If using mongodb atlas script to dumb database in mongo container.
* Redis instance.
* Nodejs API ready to use with expressjs.
* Vuejs app with vue-cli.
* Eslint airbnb config.
* Prettier config.
* ...

Here is the structure of your project:
```
└── .github/ // github metadata
└── api/
    ├── .eslintrc.json
    ├── .prettierignore
    ├── .prettierrc.json
    ├── dockerfile
    ├── index.js
    ├── nodemon.json
    ├── package.json
└── client/
    ├── dockerfile
    // vue-cli boilerplate.
├── .dockerignore
├── .gitignore
├── LICENSE
├── bdd.sh
├── docker-compose.yml
├── redis.conf
├── README.md
```

### How to use it:
**Install**
Install the project globally:
```
npm i -g fast-mvp-cli
```

**Run process**
```
fast-mvp-cli
```

Or with npx required npm >= v5.2

```
npx fast-mvp-cli
```

Once it's done, just follow the process 🙂

![process of fast-mvp-cli package](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/k04uk90zggof6hn3x78o.png)
 

For those curious, do not hesitate to contribute:

* 👉 More informations [doc](https://www.npmjs.com/package/fast-mvp-cli)
* 👉 [Repo](https://github.com/luctst/fast-mvp-cli)
* 👉 [What I do](https://github.com/luctst)

Thank's :)
Svelte referential identity
Tags: svelte
Published: 2021-12-11 19:06:54

Okay I am switching from React to Svelte , because I love to feel DOM in my own hands , just like a mechanic fella who enjoys feeling engines into one's hands . I decided to follow Svelte wizard-like tutorial series on the man page , I've enjoyed till I've crossed what I've not figured out long time since started learning React tho . I guess I could justify there was no decent explanation why . Some people may agree with this , other may think I deserted React base . Without further ado , let's jump into code !

---

Consider the following code example as presented within this [link](https://svelte.dev/tutorial/keyed-each-blocks) :

```javascript
{#each things as thing}
	<Thing name={thing.name}/>
{/each}
```

That's what happens visually when no referential ID (`thing.id`) for code block provided :

![Before](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rbmyop0y01qfag0alejk.png)

> **Explanation** : the "stack's" index as presented in illustration above slides towards 0th index out of frame – This is not what we presumably expected tho , so let's fix this with the following tweak by adding a referential ID of (`thing.id`) as so :

```javascript
{#each things as thing (thing.id)}
	<Thing name={thing.name}/>
{/each}
```

Visual representation after tweak applied :

![After](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ftb3il15bo2lxxceqhjc.png)

Now we removed first item as expected i.e. removing first item we removing first DOM node . 

---

That's all folks in my very first of **Svelte-series** . If any typos found or suggestions could be made , please leave a comment below !
Fonts with LitElement
Tags: devjournal, css
Published: 2021-12-11 19:05:34

In HTML, fonts are typically applied using the CSS font-family property. This property can list one or more font families and each value can be specified as either a family name or a generic name. 

`font-family: "Gill Sans Extrabold", sans-serif;
`
Alternatively, fonts can be imported from an external CSS stylesheet. 

```
render() { 
return html` <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Kaushan+Script">`;} 
}
```

There is also the capability to import fonts with a script tag if the font is in a JavaScript file. For our button project this is how we were able to import additional fonts that were not previously available when using the CSS font family property.

<script src='http://use.edgefonts.net/butcherman.js'></script>

The imported script font can then be used like other font-family properties:
```
return css`
      :host {
        display: block;
        padding: 10px;
        color: var(--cta-btn-text-color, orange);
        font-family: Butcherman, fantasy;
        font-size: 30px;
      }`
```
Framework Boilerplates in JavaScript
Tags: javascript, devjournal
Published: 2021-12-11 19:02:16

Our group assignment was to implement JavaScript boilerplate code, with each group member doing a different framework.

**What commonalities are there between the boilerplate code?**
The file structure of the boilerplate code was very similar between the examples. Each had a package.json for dependencies, folders for the source/app, and read me files. All boilerplates had steps for the basic setup.

**What is duplicate / overlapping?**
Source folders are commonly overlapping in the boilerplates, although they have some discrepancies in the different files they contain. 

**Which do you think is the easiest DX (Developer eXperience) to get going?**
React seems to have the easier developer experience for getting started. The initial setup seems more intuitive than the other boilerplates. The folder names like app, docs, internal, and server make it very clear which area of the code you are working in.  

**If starting to build an "app" tomorrow, which would you prefer and why?**
If I was going to build an app tomorrow I would certainly prefer React for the reasons outlined above about its easier setup process. I think maintaining code with React would also be less confusing than some of the other boilerplates because of the slight differences in the file structure. 

Provide a links in your post to your organization as well as the repo that you got your boilerplate from
[Organization on GitHub](https://github.com/ist402groupj)
[Boilerplate repository](https://github.com/bdellegrazie/vue-hello-world)
You can run kubectl from a docker container with Docker Desktop
Tags: nuvolaris, docker, kubernets, serverless
Published: 2021-12-11 18:38:38

In the process of setting up the development environment for Nuvolaris, I decided to switch from virtual machines to containers, leveraging the devcontainer feature of VSCode. Then I built a Docker image that is a perfect fit for our needs: there everything is in it to build our project.

  

But, I almost went on panic when I realized that, since a key component is an operator, and a cli that interacts with Kubernetes, we need to be able to access a Kubernetes cluster for development FROM a container.

  

In my initial plans, I would have setup a cluster Kubernetes in the virtual machine itself. But now, that everything is in a container? I actually felt initially very smart having the idea of setting up a Kubernetes cluster using kind. It is a tool that can build a Kubernetes cluster just using docker. But my plans went immediately awry because kind expects to be able to access to docker using localhost, and this is not the case within a container. 

  

Even if I was able to access to docker from docker with a non-root user, inside the container there is not the proxy to localhost that is available outside a container. It is probably possible to configure kind to work anyway, but my first attempt failed.

  

Then I went in deep investigation mode, and I discovered that with Docker Desktop all the services are available using the domain docker.internal. And this domain is available also outside of the container. Then I thought that maybe it is possible to access to the Kubernetes that Docker itself provides from inside a container. maybe changing the configuration. Actually the situation is much better!

  

When you enable Kubernetes with Docker Desktop it creates a configuration file .kube/config that actually uses the domain `kubernetes.docker.internal`to talk to Kubernetes from the outside. 

  

So I just copied the generated kubeconfig inside the container:

  

docker cp $HOME/.kube/conf container:/home/nuvolairs/.kube/config

  

and kubectl worked from inside the container, talking to Docker's Kubernetes!!!

  

Yes, this is a feature already available in Docker Desktop but not documented (or at least I was unable to find specific documentation for it). 

  

I discovered it by myself and it saved my day and a week of efforts building the development environment that is now perfectly usable for our needs.
Wrapping up Video Feeds for Telescope!

Tags: telescope, javascript, opensource
Published: 2021-12-11 18:12:52

I would like to write that I finished the feed processing for videos in [Telescope](https://github.com/Seneca-CDOT/telescope)!🌈😎

I divided the feature in two PRs, [PR #2581](https://github.com/Seneca-CDOT/telescope/pull/2581) and [PR #2596](https://github.com/Seneca-CDOT/telescope/pull/2596). The first PR handles the changes for the backend and API, while the other PR handles the changes in the frontend.

One thing I learned is that, it is better to modify what you currently have to improve, rather than creating something from scratch when adding a feature, because the maintenance burden is a really important factor to consider💡.

I am glad that I submitted a draft at the start, because Dave's🐱‍👤🐱‍🏍 advice on how to implement this really helped to sort out several doubts I had over my code. I am so grateful for Dave's help and advice😊.

Although it doesn't seem like a lot of code, I believe that I worked on this for well over a week🥵, doing research to implement the feature, as well as consulting it with the maintainers at Telescope to know about their opinions regarding my progress. Even if the feature is a small part of a more complex system, I am proud that I was able to contribute to this, regardless of the size of it.🤩
Giving Some Updates for My Contribution for Telescope

Tags: opensource, vscode, typescript, javascript
Published: 2021-12-11 18:05:14

I would like to report a small update for my contribution to [Telescope](https://github.com/Seneca-CDOT/telescope). In a previous post, I had mentioned that I wanted to work on Telescope, implementing a small feature involved with integrating other forms of media, such as videos and live streams🐱‍💻.

Currently, I implemented the code that deals with processing YouTube RSS feeds (if you didn't know, YouTube does produce RSS feeds for their channels). I based off the code that processed the Blogpost RSS feeds, and basically repeated a lot of code!🙈

At first, I was going to use YouTube Data API to track YouTube channels and their videos, but it turns out that you can actually do this with the well-known RSS format. You can learn more about it [here](https://danielmiessler.com/blog/rss-feed-youtube-channel/). This was an article that Dave (my current professor) recommended to me🙏🏻.

After submitting a small draft PR, [humphd](https://github.com/humphd) gave me a small review. He pointed out that there was a whole lot of code that was basically a copy of existing code.😵 This is something that I noticed when I started working on the feature. Dave did mention that it would be better if I tried to simply change the current feed processing for blog posts to process feeds for videos, as well.

At first, my idea was to create something different from the posts, as I didn't want to break the existing behaviour of the posts🤞🏻. Of course, Dave preferred that we simplified and reduced the amount of code we would have to maintain for obvious reasons.

After considering these suggestions, I think I will be able to manage the feature that I wanted to write much faster! Wish me luck😄👩‍💻
Tech stuff that I ❤️ reading or 👀
Tags: papers, books
Published: 2021-12-11 17:34:01

## Books
- Elements of Clojure by Zachary Tellman ⭐⭐⭐⭐
- Hackers & Painters by Paul Graham ⭐⭐⭐
- [Datascience at the command line 2ed](https://datascienceatthecommandline.com/2e/)

## Papers
- [The magical Number Seven, Plus or Minus Two](http://www2.psych.utoronto.ca/users/peterson/psy430s2001/Miller%20GA%20Magical%20Seven%20Psych%20Review%201955.pdf) found when reading Elements of Clojure by Zachary Tellman

## Interviews
- [Interview with a creator of R language](https://www.youtube.com/watch?v=jk9S3RTAl38)

## Conference talks
- [Computer Science Metanotation bu Guy Steele](https://www.youtube.com/watch?v=dCuZkaaou0Q) 🔥🔥
- [Growing a Language, by Guy Steele](https://www.youtube.com/results?search_query=guy+steele+growing+a+language)🔥🔥🔥

## Fundamental ML papers
- [No Free Lunch Theorem](https://direct.mit.edu/neco/article-abstract/8/7/1341/6016/The-Lack-of-A-Priori-Distinctions-Between-Learning?redirectedFrom=fulltext)
    - It proves that you need to make assumptions about the data to choose the best model possible.
- [Tidy Data](https://vita.had.co.nz/papers/tidy-data.pdf)

## Great Research in DS
- [Anton Antonov blog](https://mathematicaforprediction.wordpress.com/) 🔥🔥🔥🔥🔥
    - This blog is a rare gem 
- [Ilya Kostrikov ](https://github.com/ikostrikov)
Blockchain - Commonly used terms
Tags: blockchain, technology
Published: 2021-12-11 16:41:29

Hi all, in this article, we will try to cover some of the terms which are very helpful in understanding blockchain technology better.

**<u>Block Time</u>**
Block time refers to the time it takes for adding new data to the existing network. This time taken by the blockchain network is mainly the time it takes to validate the hash of that data to some predefined value. Like for example for Bitcoin, this time is around 10 mins and for Ethereum it is around 15 seconds which depicts that it is fast to add data on ETH than BTC. To see the average Block time for Ethereum over time you can refer to https://etherscan.io/chart/blocktime .
Average Block time of ETH over time

**<u>Smart Contract</u>**
Smart contracts are accounts controlled by the code. They tell how incoming and outgoing requests are to be handled without the intervention of any other party involvement, that is the reason the blockchain cryptocurrencies are referred to as decentralized banking systems. This is the case of Ethereum has below information:

1. Code: Raw machine code for this contract.
2. Storage: Data storage of contract.
3. Balance: Amount of Ether.

**<u>Hash Functions</u>**
These are the functions that are used to convert input data into encrypted values of a certain length and the same data will always produce the same output. It is not possible to get the original data from the hash outputs which makes it important for blockchains for higher security.

**<u>Proof of Work</u>**
It is how some computations are done by the network nodes to get to the hash output for the certain matching predefined criteria before the block is added to the network. Doing this makes use of resources of computer i.e. work, hence the person who is lending these resources are called minors and is given some rewards in return for this. Bitcoin uses this method to add new transactions blocks to the network. But this method involves higher energy consumption.

<u>**Proof of Stake**</u>
Proof of stake was developed as an alternative to the Proof of Work. In this, the miner can only mine once he has put his/her coins on the stake and can only mine the max of the coins that are on stake. So this solves the issue of higher power consumption that is there is a POW. Ethereum as of now uses both POS and POW and is planning to completely move toward POS.

Thanks for reading this article, in upcoming articles we will discuss more on blockchain technology.
Living in the Shell #12; mv (Move/Rename Files/Directories)
Tags: productivity, linux, bash, devops
Published: 2021-12-11 17:31:05

## `mv` 🧳

Moves/renames files or directories.

⚠️ Default behavior is to **overwrite** destination files.

## Rename a single file

```sh
cd ~ && mv .bashrc .bashrc-renamed
```

## Move a single file into a directory

```sh
cd ~ && mv .bashrc Documents
```

> Note that the `Documents` directory should exist.

## Move a single file onto a specific new path (filename)

```sh
cd ~ && mv .bashrc Documents/.bashrc-moved
```

## Move a whole directory

```sh
mv my-src-dir ~/Documents/my-dest-dir
```

> ⚠️ Note that if `my-dest-dir` already exists, `my-new-src` will be moved under it; i.e., you would have your files under `Documents/my-dest-dir/my-src-dir`

## Create backup for existing destination files `-b`

```sh
cd ~ && mv -b .bashrc Documents/.bashrc-moved
```

## Move by wildcard selection `-t`

```sh
cd ~ && mv -t target-dir *.zip *.txt
```

> Moves all `.zip` and `.txt` files to `target-dir` directory.

## Set to ask for overwriting `-i`

```sh
cd ~ && mv -i .bashrc Documents
```

## Set to keep existing files (no overwrite) `-n`

```sh
cd ~ && mv -n .bashrc Documents
```
How to deploy a private GitHub repo on Netlify
Tags: netlify, github, tutorial, programming
Published: 2021-12-11 17:13:00

If you are a software developer and you want to make your GitHub repository private and deploy it to netlify I will show you how to do that in this article, we will learn how to deploy a private repository to Netlify.


![BMC](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gnt2qsxc672t4dk0wuhi.gif)


##1. Generate deploy key
* In Netlify, go to the app, _site settings > Build & deploy > Continuous Deployment > Deploy Key_

* click on generate deploy key

* copy the deploy key

##2.  Go to the GitHub Repo you want to deploy

* go to, _settings > Deploy Keys_

* paste the deploy key and save

##3. Make the GitHub Repo private

* Inside the Repo that you want to deploy, go to _settings > change visibility_

* make the repo private

##4. Go back to Netlify

* re-deploy the app



<a href="https://www.buymeacoffee.com/ifeanyichima" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/default-orange.png" alt="Buy Me A Coffee" height="41" width="174"></a>


**Thank you, Please follow me**


[<img align="left" alt="linkedin.com/in/ifeanyi-thankgod-chima/" width="22px" src="https://cdn.jsdelivr.net/npm/simple-icons@v3/icons/linkedin.svg"/>][linkedin]
[<img align="left" alt="https://twitter.com/ifeanyiTchima" width="22px" src="https://cdn.jsdelivr.net/npm/simple-icons@3.13.0/icons/twitter.svg" />][twitter]


[linkedin]: https://www.linkedin.com/in/ifeanyi-thankgod-chima/
[twitter]: https://twitter.com/ifeanyiTchima
How can I update JSON API items when a new item is added?
Tags: android, java
Published: 2021-12-11 16:46:39



Is it possible to update JSON API when new data is added to the JSON? I tried to use Handler but the problem is that when I run the application the data is duplicated and they are shown up in the recyclerView more and more times as it runs. Here is what I did:

`handler.postDelayed( runnable = new Runnable() {
            public void run() {
                //do your function;
                ReadPosts();
                readSaves();
                postsAdapter.notifyDataSetChanged();
                postsAdapterS.notifyDataSetChanged();
                handler.postDelayed(runnable, apiDelayed);
            }
        }, apiDelayed);`

So, what I want is every time the handler refreshes to be added only the new data and not to duplicate the whole data every time it is refreshed. Is there a way to do that?
[Binary Search]First Missing Positive
Tags: programming, algorithms, 100daysofcode, java
Published: 2021-12-11 16:45:08


# [Description](https://binarysearch.com/problems/First-Missing-Positive/solutions/7030014)

Given a list of integers `nums`, find the first missing positive integer. In other words, find the lowest positive integer that does not exist in the list. The list can contain duplicates and negative numbers as well.

**Constraints:** 

- `n ≤ 100,000` where `n` is the length of `nums`.

## **Example 1**

### Input

```
nums = [1, 2, 3]
```

### Output

```
4
```

---

## **Example 2**

### Input

```
nums = [3, 4, -1, 1]
```

### Output

```
2
```

---

## **Example 3**

### Input

```
nums = [1, 2, 0]
```

### Output

```
3
```

---

## **Example 4**

### Input

```
nums = [-1, -2, -3]
```

### Output

```
1
```

---

# **Intuition**

1. sort your array;
2. store missing value as 1
3. loop array
    - if `arr[i]`<missing, just continue;
    - if `arr[i]`=missing, find next one, in another word, missing = missing + 1;
    - if `arr[i]`>missing, return answer

# **Implementation**

```java
import java.util.*;

class Solution {
    public int solve(int[] nums) {
        Arrays.sort(nums);
        int missing = 1;
        for (int i = 0; i < nums.length; i++) {
            if (nums[i] == missing) {
                missing++;
            } else if (nums[i] > missing) {
                return missing;
            }
        }
        return missing;
    }
}
```

## Time Complexity

- Time: array sort at least `O(nlogn)`
- Space: just only one variable number to store missing value
Develop Spring boot REST API in AWS - PART 1/4 (CodeBuild + ECR)
Published: 2021-12-11 16:43:04

This is a demo (part 1) of developing spring boot REST API in AWS. It involves the following steps: 

 (1) Coding of Spring Boot REST API. 

 (2) Creating Repository in AWS ECR. 

 (3) Building with AWS CodeBuild. 

 (4) Pushing docker image to AWS ECR.

{% youtube fhy67YpRi1c %}

In the next part, I will discuss about ECS cluster, ECS service and ECS task.


Source Code:
https://github.com/babysteps-topro/aws-springboot-pipeline1.git

Original source:
https://www.borislam.com/2021/12/spring-boot-rest-aws-cicd-part1.html
Cyberpunk 2077 (v1.3): „No fixers” bug
Published: 2021-12-11 16:25:50

## Mission:
Contract: No fixers

## Problem: 
Tanner won't enter the car

## Solution: 
- Drive through her so she will stand close to the place of passanger seat.
- Do a quick save (`F5`)
- Load game
- Tanner should be sitting in a car
#Kafka
Published: 2021-12-11 16:18:20

Hi all,
As i asked in morning here about kafka resources.So today i started kafka and learn about basics of kafka. 
Things which i have learnt today.
What is kafka?
Kafka is basically a message queue system.It actually solve the complex problem of communication between many to many.It reduces the number of connection. It creates a medium between producer and consumer.Producer will publish message in kafka cluster and consumer will consume the message from kafka cluster.
Components of kafka:
1. Producer
2. Consumer
3. Topic
4. Broker
5. Partition
I learnt about this and also install on system and publish messages and consume message.
If anything you might feel wrong please comment so that i can rectify.
Thanks .
Free Code formatter chrome extension
Tags: javascript, chrome, programming, opensource
Published: 2021-12-11 15:17:52

Hello Developers,
I have created a chrome plugin to format code quickly without going to any third-party site to format your precious code. This extension is developed in Javascript & can run offline as well so no need to worry about code getting stolen.
**Note: ** This extension will only format HTML, CSS, Javascript, JSON.

Link: [https://chrome.google.com/webstore/detail/code-formatter/njpgcnaadikbannefjibknjopmogeidm?utm_source=chrome-ntp-icon](https://chrome.google.com/webstore/detail/code-formatter/njpgcnaadikbannefjibknjopmogeidm?utm_source=chrome-ntp-icon)

Please do share your Ratings on the chrome store.
Thanks & Happy coding!🍻