teleren/devto huggingface dataset:
Writing a Technical Blog
Tags: tutorial, writing, beginners
Published: 2022-12-01 02:10:47

I wrote about [how I structure my writing in general](https://dev.to/abbeyperini/how-i-structure-my-writing-55ha) last November, as part of the 14,584 words I wrote for [Virtual Coffee](https://virtualcoffee.io/)'s blogging monthly challenge. This will be my 14th blog this November, and I found myself reflecting on how I get my ideas and turn them into published technical blogs.

## Ideas

Anytime you solve a problem or learn something new is great time for a blog. Write a blog when you:

- Explain something to a coworker
- Finish a big feature at work 
- Dive down a research rabbit hole
- Want to research something so you understand it a little better
- Build something just for fun
- Want to take detailed notes on something you just figured out

Once you have your idea, decide if you're making a guide or reference.

## Guide

A guide takes the reader through building or doing something step by step. If you want to make a guide, there a few questions to ask yourself:

- What skill level am I writing for?
- What knowledge does the reader need to understand this?

You want to open the blog by declaring any prerequisites. This prevents you from having to explain every single concept you use. For example, if you're building something in React, say "This blog assumes you are familiar with React."

Next, ask yourself, what is square 1? What is a completely blank slate? Start the instructions there.

Blocks of code visually break up text, which is good for moving the eye along. However, don't expect your code to explain itself. It's like explaining a problem and its solution to a coworker - you need to give context. This includes names of files, if your code spans multiple files.

## Reference

A reference article explains or teaches a concept. Rather than step by step instructions, you want to focus on summarizing an idea. I start by making an outline with headings. 

As I start to describe a concept, I usually realize there's more I have to explain. That means adding headings to my outline or even breaking it out into a whole new blog.

The opposite of a guide, reference blogs quickly get dense, so it's important to break up the text. I use headings and memes.

## Editing

Leave it sitting for a day or two and come back and read the whole thing, out loud. You'll be surprised what typos you find. If you can get someone else to read it for you and give feedback, even better.

In rereading, I often find I've used a word a lot and have to reword sentences. "Often" has been one of them recently. 

I'll fine-tune explanations and be more explicit about how concepts relate to each other. With guides, I'll follow the steps myself. 

## Conclusion

Anytime you want to understand a concept a little better, explain it to someone else. Technical blogs are a great way to help yourself and others learn at the same time.
JavaScript: Asynchronous
Tags: javascript
Published: 2022-12-01 02:02:39

_"I will finish later!"_

**Asynchronous** is <u>functions running in parallel with other functions</u>

> In the real world, **callbacks** are most often used with **asynchronous functions.**

```javascript
function myFunction( text, callback ) {

	console.log( text )

	/* --- */

	/* 
		call callback function
  	*/
  	callback( 'text from myDisplayer (as callback function)' )	
	
}

function myDisplayer( text ) {
	
	console.log( text ) 

}

/*
	call myFunction
	myDisplayer passed into myFunction as an argument function
*/
myFunction( 'text from myFunction', myDisplayer )

/* --- */

// text from myFunction
// text from myDisplayer (as callback function)
```

---

## Example

{% embed https://replit.com/@antelove19/NodeJS-Callback#index.js %}

# Note
When you pass a function as an argument, remember not to use parenthesis.

Right: myFunction( 'text from myFunction', myDisplayer )

Wrong: ~~myFunction( 'text from myFunction', myDisplayer() )~~

---

# Waiting for a Timeout

{% embed https://replit.com/@antelove19/NodeJS-Asynchronous-Settimeout#index.js %}

---

# Waiting for Intervals

{% embed https://replit.com/@antelove19/NodeJS-Asynchronous-Setinterval#index.js %}

---

# Waiting for a file

{% embed https://replit.com/@antelove19/NodeJS-XMLHttpRequest-Callback#index.js %}
The meaning of Imposter Syndrome
Tags: react, javascript
Published: 2022-12-01 01:09:51

In this week's learning, I've learned of Imposter Syndrome. Imposter Syndrome is not considered a mental illness, it can affect anyone but is commonly found in high achievers. You can experience imposter syndrome for a few weeks to a lifetime. For example, having a sense of becoming a fraud, the fear of being found out, and the difficulty of keeping your accomplishments. Overall, having a difficult time accepting your success. In my opinion, I do believe that someone has experienced this type of syndrome at one point time in their life.
forEach VS Map.
Tags: javascript, beginners, tutorial, array
Published: 2022-12-01 00:58:24

Let's keep it on point. JS has few methods for the Array to find or search or iterate items through particular Array. Here we want to discuss 2 mostly and widely used methods, 
1. forEach 
2. Map

## Basic definition and example 
forEach method can be used to iterate through an Array. This method will be provided with a callback function, which will be called for each and every item available in Array. An Important point to remember is that, forEach does not return an array, in fact it returns 'undefined'. So if you my man working on some logging or processing which does require every item of an array and does not required anything in return you should consider this method as your to-go tool. let's take an example. 


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/i964cavskkrcrq0ru5j1.png)

let's now see what's that returnedValue is holding. any guess ? 


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wylcsjb9t3l4cw14zp5b.png)

Now, map method works same as the forEach but the major difference is that it returns the same length of the newly created array as on array it is being called. Means it does not return 'undefined' as forEach do,  but it returns modified array according to the callback function of the same length. In addition to that, the callback is invoked for every items available in an element. You can always use this method when you want to do some processing or modification on every item of an array and use that newly created array further. example is given below. 



![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/w3jln3vvgamb0aup1arg.png)



## Chaining ability.

wait wait wait, what the heck is that? well, in simple terms as you are now absolutely clear that forEach does not return anything and returning just 'undefined', it is not able to perform chaining operations like reduce, sort and etc. But but but, map is returning an array based on the callback modifications, we can chain methods on it. See it is that simple


## When to use what ?

I will say you will encounter an 'Anti-Pattern' if using map and getting array in return, and for serveral reason you stupid dev does not want to use it further. So if you really do not need to use returned value please please go for forEach. 
vice versa is also fine. 

## Performance ?

Well, depends on the several factors I do not want to dig into it.
Javascript: Callback
Published: 2022-12-01 00:53:13

_"I will call back later!"_

**Callback** is <u>a function passed as an argument to another function</u>

This technique allows <u>a function to call another function</u>. A callback function can run after another function has finished

```javascript
function myFunction( text, callback ) {

	console.log( text )

	/* --- */

	/* 
		call callback function
  	*/
  	callback( 'text from myDisplayer (as callback function)' )	
	
}

function myDisplayer( text ) {
	
	console.log( text ) 

}

/*
	call myFunction
	myDisplayer passed into myFunction as an argument function
*/
myFunction( 'text from myFunction', myDisplayer )

/* --- */

// text from myFunction
// text from myDisplayer (as callback function)
```

---

## Example

{% embed https://replit.com/@antelove19/NodeJS-Callback#index.js %}

# Note
When you pass a function as an argument, remember not to use parenthesis.

Right: myFunction( 'text from myFunction', myDisplayer )

Wrong: ~~myFunction( 'text from myFunction', myDisplayer() )~~

---

# Waiting for a file

{% embed https://replit.com/@antelove19/NodeJS-XMLHttpRequest-Callback#index.js %}
Aspectual Opinion of Java Script
Tags: javascript, beginners, programming
Published: 2022-12-01 00:33:34

Today, I was reading an article from A List Apart [](https://alistapart.com/article/the-design-of-code-organizing-javascript/), the article explains that there are 3 high-level language-agnostic aspects. System Architecture, Maintainability, and Reusability. I do believe that new-beginning developers should start getting to know these 3 aspects, from reading the article, this is something that'll help out developers in general. It also explains how to build the basic layout, improve and extend the code you're building or working on, and how reusable the components are. Taking away from this, I've learned that these 3 aspects could be very useful not only for myself but for everyone that's a developer or who wants to become a developer should learn these 3 aspects from this article.
🎄JS Advent #1 - Truthy and Falsy values🎄
Tags: javascript, programming, beginners, webdev
Published: 2022-12-01 00:32:03

#### For the month of December I have challenged myself to write 24 articles about some JS concepts up until Xmas.
#### The first installment in this series is around Truthy and Falsy values in Javascript.

##### __What is a Truthy or Falsy value?__
A truthy value is any value in Javascript thatr returns true when converted to a Boolean and a falsy value is any value in Javascript which is false when converted to a Boolean.

For example, a non-empty string is a truthy value as it returns `true` when comverted with the double NOT, whereas an empty string evaluates to `false` so it is a falsy value.

```javascript
!!"test" === true;
``` 

```javascript
!!"" === false;
```

And a slightly confusing example, even if the string contains a falsy value it will return __true__:
```javascript
console.log(!!"0") // true
console.log(!!"false") // true
```

There are only a select few falsy values in Javascript. They are:
```javascript
"", '', `` // empty strings
0 // zero (also minus 0)
null
NaN
false
undefined
```

- All other values in Javascript are truthy. Including empty arrays and objects.


##### __The double NOT operator (!!)__
- The double NOT operator will convert the value to a Boolean context and return a boolean value as in the examples above but can also be confusing. 

For example then using on a Boolean value initially:

```javascript
console.log(!!true);
```

This statement will negate `true` first to give us `false` and then negate false to give us `true` and then log that to the console. 

So:

 __`!!bVal === bVal`__

As an alternative you can also use the Boolean constructor: 
```javascript
const truthy = new Boolean("string");
console.log(truthy); // true
```
```javascript
const falsy = new Boolean(0);
console.log(falsy); // false
```

##### __AND and OR operators__
- You can also use the AND and OR operators with truthy and falsy values, as they will be converted upon evaluation.

```javascript
!!({} && "") // returns false
```

```javascript
!!({} || "") // returns true
```

[JS Advent #2 >](https://dev.to/jtlavs/js-advent-2-mutable-and-immutable-methods-2c29)
Programming Update: Nov 2022
Tags: programming, python, extralifedonationtra, lastfm
Published: 2022-12-11 01:39:18

---
title: Programming Update: Nov 2022
published: true
date: 2022-12-01 00:21:34 UTC
tags: programming,python,ExtraLifeDonationTra,lastfm
canonical_url: https://www.ericsbinaryworld.com/2022/11/30/programming-update-nov-2022/
---

November was not a huge programming month for me. On the weekends I was a little more focused with family stuff and videogames. But I did manage work on a couple projects.

Ever since 2010,[I’ve been been using Python to automatically post my top 3 artists to Twitter](https://www.ericsbinaryworld.com/2010/12/20/automatically-posting-your-top-3-artists-from-last-fm-onto-twitter-with-python/). In 2020, [it even became my first package on Pypi](https://www.ericsbinaryworld.com/2020/02/23/my-first-pypi-package/). With activity picking up on Mastodon, I [ported the code over to that site](https://github.com/djotaku/lastfm-mastodon). I also used the opportunity to clean up the code bit to my more modern coding standards. I haven’t created a package yet, but may soon enough.  
I also did some work on my [Extra Life Donation Tracker](https://github.com/djotaku/ELDonationTracker). I’d pulled out the API so that others could build on it, but, as a result, I was creating a Team object from the API rather than the inheritance version. I did a workaround to make it work, but I’m going to have to work at the code a bit more to make it less clunky.

Next month – Advent of Code!!
Declutter your CSS selection
Tags: css, beginners, webdev, productivity
Published: 2022-12-01 00:06:10

We often requrie to apply same styling to many different parts of the application. The selection list becomes overwhleming with different tags, classes, ids and actions.

See below for details on how we could simplify your CSS.

Before
```css
input:focus, 
input:hover {
    color: blue;
}
```

After
```css
input:is(:focus, :hover) {
    color: blue;
}
```

-----

Before
```css
table tr:hover,
.main-table tr:hover,
.stats-table tr:hover {
    font-weight: bold,
    background-color: #CCC
}
```

After
```css
:is(table, .main-table, .stats-table) tr:hover {
    font-weight: bold,
    background-color: #CCC
}
```

-----

Does `:is()` make your CSS looks neater? Comment below







Photo by <a href="https://unsplash.com/@ricardoviana?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Ricardo Viana</a> on <a href="https://unsplash.com/s/photos/messy?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>
Day 658: Cross Town
Tags: hiphop, code, coding, lifelongdev
Published: 2022-11-30 23:42:28

_liner notes_:
- Professional : Pretty chill day. No meetings or anything. Just 8 hours to get stuff done. I was able to record, edit and submit a video. Reviewed some edits suggested to my blog post. Worked on a Web Component. Not a bad day.

- Personal : Last night, I got to attend a virtual Google Developers Group meet up. It was good talk with those folks again. Also did some research on my side project and making sure it's ready to be demoed at the meetup. Tested my livestream setup and updated some code. I then watched the new episode of "Chainsaw Man". Holy crap!

![A large stone mass coming out of a very calm sea at sunset in Hvítserkur, Iceland](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ncwggddc9tbd8iqa4kz6.jpg)

Almost forgot to do this blog post. I left my spot early to make sure I didn't hit too much traffic on my way to the meetup. It's cross town and took like an hour to get here. I finished up my slides and about to go in and see if we can stream the lightning talks. I'm out!

Have a great night!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube 1syJaTq6O5c %}
Release 0.4 - Planning Rework
Tags: opensource, github, programming, react
Published: 2022-11-30 23:36:33

Due to some unexpected circumstances that in my previous post for **Release 0.4**, the author of the repository no longer wanted the test dummy gallery.

It was quite unfortunate because, when he said this, I had just finished the react component of the code and all it needed was a review from him. But I didn't commit on time and I saw that he had closed the issue stating that it was no longer needed. So I just have one semi-finished product without the review.

So I opted for a different repo, or rather, two in particular:
 
- One was to create Continuous Integration for a repository called [github-writer](https://github.com/ckeditor/github-writer). 

This one is what we have done in a previous lab, but instead of relying on node and `npm`, this time it also relies on the use of `yarn`. So somehow I would have to integrate yarn instead of `npm` like in my previous lab to create this integration.

- The second one is to create a timer that would take  set amount of seconds from a parent state and displays those seconds as minutes and seconds. It will then start counting down to zero in the repository called [scrambled](https://github.com/Ewager1/scrambled). (It is a relatively new project)

Scrambled is based of the use of react and since I previously tried to do something in react but couldn't (rather they canceled on me). So this would be another chance for me to give it another go at using `React`. I'd have to somehow figure out how to get the system to take a parent amount and then figure out how to convert the numbers into minutes and seconds. After that somehow set a loop for it to countdown until it reaches and stops at zero.
SPVM 0.9664 is released
Tags: perl, spvm, language
Published: 2022-11-30 23:07:37

<a href="https://metacpan.org/pod/SPVM">SPVM</a> 0.9664 is released.

## New Features and Enhancement

<a href="https://github.com/yuki-kimoto/SPVM/blob/master/Changes">Changes</a>

```
0.9664 2022-12-01
  [Internal Compatible Changes]
    * Added spvm_inline_api.h and use it in spvm_api.c, spvm_api_vm.c, spvm_precompile.c
  [New Features]
    * Added the new syntax of the octal escape character and 3digit is allowed.
      \1, \2, \3, \4, \5, \6, \7, \8, \9
      \377
      \o{377}
      
  [Imcompatible New Features and Changes]
    * \1, \2, \3, \4, \5, \6, \7, \8, \9 is not raw escape character.
      This becomes the part of the octal escape character.

```
Hivemind Node Added and Configured
Tags: steem, hivemind, blockchain
Published: 2022-11-30 22:58:46

Thanks to @rexthetech 's help at [here](https://steemit.com/hive-102132/@rexthetech/rm27b8)

My hivemind node has quickly been sync-ed and you can see below - the left is hivemind node, and the right is the RPC node (two different servers)

![image.png](https://cdn.steemitimages.com/DQmQ1ZNUsC3bf5SM1WPKwiApH25h2xtj2fTbmG4vRp1sVgF/image.png)

I have changed the [config.json](https://gist.github.com/ety001/c518743253042a4a216d43a5d8b699db) in docker-compose, so that it points to the hivemind node.

And here are some logs from Jussi:

![image.png](https://cdn.steemitimages.com/DQmVFfPwZm5hjDx4mCu7rNuYG7fNowgtPfNiPtvJEgZH7X4/image.png)

`docker-compose down && docker-compose up -d` to restart the container
![image.png](https://cdn.steemitimages.com/DQmX8kqxxN4GgrrpNUs35uVr9agkXyizADeeEpAK5SaUMq3/image.png)

Prove it works!
> $ curl --data '{"jsonrpc":"2.0","id":0,"method":"hive.db_head_state","params":{}}' https://api.justyy.com
{"jsonrpc":"2.0","result":{"db_head_block":69899830,"db_head_time":"2022-11-30 22:38:06","db_head_age":9},"id":0}

The [Node](https://steemyy.com/witness-nodes.php) Specs:


![image.png](https://cdn.steemitimages.com/DQmd4DQDJqZiRf8pEafsiEB89renKdxf12kPquA3vTMoncq/image.png)


<hr/>

## [Steem](https://steemyy.com) to the Moon!


https://justyy.com/png/whale.png

<hr/>

Follow me at [https://steemyy.com](https://steemyy.com)
And, don't forget, you can swap your STEEM to USDT (TRC-20) via [Super Easy/Handy Service to Convert your STEEM or SBD to USDT (TRC-20)](https://steemyy.com/steem2usdt.php)


Here is a [more detail screenshot](https://steemyy.com/images/steemit-hivemind.jpg) - the hivemind has a few blocks behind - but I guess this is normal.

![](https://steemyy.com/images/steemit-hivemind.jpg)
Makefiles can be helpful in your CI Workflow
Tags: cpp, tutorial, beginners, programming
Published: 2022-11-30 22:47:44

While developing [palpatine](https://github.com/batunpc/palpatine), I used Makefile to automate the process of building and running the project.

Currently, it looks something like this:

```makefile
setup: 
	@if [ "$(shell uname)" = "Darwin" ]; then \
		brew install gcovr; \
		brew install lcov; \
	fi
	@if [ "$(shell uname)" = "Linux" ]; then \
		pip install gcovr; \
	fi

dependency:
	cd build && cmake .. --graphviz=dependency.dot && dot -Tpng dependency.dot -o dependency.png

prepare:
	@echo ">>> Building palpatine ...";
	@if [ -d ./build ]; then rm -rf ./build; fi
	@mkdir build; 
	@cd build; \
	cmake -S .. -B .; \
	make; \
	
	@echo ">>> Done";
	@echo ">>> Run ./palpatine [options] to start the application";


test:
	@echo ">>> Running tests ...";
	@cd build; \
	cmake --build . --target unit_tests ;
	@cd build/tests; \
	./unit_tests;

codecov:
	@echo ">>> Running tests ...";
	@cd build; \
	cmake --build . --target unit_tests ;
	gcovr --html -o build/index.html ;
```

Most of the set of rules of this Makefile are self-explanatory, also the `echo` logs I've set makes it easier to understand. I’m going to explain the ones that are not that obvious.

- `dependency` rule is a interesting one. It initially changes the directory to `build` and then runs `cmake` with `--graphviz=dependency.dot` flag. This flag generates a `dependency.dot` file which is a [graphviz file](https://graphviz.readthedocs.io/en/stable/manual.html). Then, it runs `dot` command with `-Tpng` flag to generate a `dependency.png` file in build directory. This png file is a [dependency graph of palpatine](https://github.com/batunpc/palpatine/blob/main/CONTRIBUTING.md#dependencies).

- `codecov` rule builds unit_tests target just like `test` rule. Then, it runs [gcovr command](https://gcovr.com/en/stable/) with `--html` flag to generate a `index.html` file in build directory. It helps to visualize the code coverage of the project.

Few weeks ago, I have added [CI workflow to palpatine](https://github.com/batunpc/palpatine/blob/main/.github/workflows/macos.yml). 
```yaml
jobs:
  build:
    runs-on: macos-latest
    steps:
    - uses: actions/checkout@v2
    - name: setup
      run: |
        make setup
    - name: configure
      run: |
        cmake -H. -Bbuild -G "Unix Makefiles" -DCMAKE_BUILD_TYPE="Debug"
    - name: building
      run: |
        cmake --build build --config Debug --target unit_tests -j4
    - name: testing
      run: |
        cd build/tests && ./unit_tests
        bash <(curl -s https://codecov.io/bash)
```

This workflow runs on macOS and it does the following:

- It checks out the code from the repository.
- It runs `make setup` to install gcovr and lcov.
- It runs `cmake` to configure the project.
- It builds the project.
- It runs the tests.
- It uploads the code coverage report to codecov.

In the next releases, I am planning to automate the CI workflow with Makefile commands. I will update this post when I do that.