teleren/devto huggingface dataset:
playing with brightness on screensaver
Tags: i3, tooling, tutorial, devjournal
Published: 2022-08-10 12:33:00

I wanted to decrease the brightness of the screen when my screen was locked.

here is the script I used to lock my screen with xautolock.

It calls i3lock, but it could be anything.

I'm using xrandr to get the screen name and decrease the brightness, then restore it on exit.

```
#!/bin/sh

set -e

primary=$(xrandr | grep " primary" | cut -f1 -d " " | head -n 1)

on_exit() {
  xrandr --output $primary --gamma 1 --brightness 1
}
trap on_exit EXIT

xrandr --output $primary --brightness 0.8 --gamma 0.8

# enable the lock screen
i3lock --nofork -c 272d2d -i ~Documents/wallpaper-lockscreen.png
```

Here again it's important to use `--nofork` parameter with `i3lock`
lock screen notifier
Tags: i3, tooling, devjournal, tutorial
Published: 2022-08-10 12:16:00

This article is about how I tried to notify I was

Please read the article about [`xautolock`](https://dev.to/ccoveille/xautolock-corners-5161) corners from the i3-screensaver-tips series

So here is my xautolock configuration

```
xautolock -time 5 -locker "~/bin/lockscreen.sh" -detectsleep -corners '++--' -cornerdelay 5 -notify 5 -notifier ~/bin/lockscreen-notify.sh
```

Here is the content of my `~/bin/lockscreen-notify.sh`

```shell
#!/bin/sh

set -e

notify-send --urgency=critical --icon preferences-desktop-screensaver --expire-time=5000 "about to lock screen ..." "move or use corners"
```

I'm using [dunst](https://dunst-project.org/), but this is syntax is compatible with all notifiers.

### Alternative #1: progress bar

Please note, you will need `dunst` 1.7.0

```shell
dunst --version
Dunst - A customizable and lightweight notification-daemon 1.8.1 (2022-03-02)
```

highlight aka progress bar is only available with 1.7.0 , it's the `int:value:10` hint in the next command

To test if your dunst or notifier is able to support it, just try this

```shell
dunstify -h int:value:42 "Working ..."
```

if you see a progress bar, you can use this technique.

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

The following script uses the `x-dunst-stack-tag` hint that allows me to reuse an existing message.

To test it, you can try this

```shell
notify-send $(date) -h 'string:x-dunst-stack-tag:whatever'
notify-send $(date) -h 'string:x-dunst-stack-tag:whatever'
```

If you see 2 messages, then it doesn't work.

I'm not sure if other notifier supports such kind tag, but `dunst` does.

So here is the script I made, and I'm using right now as a notifier.

```
#!/bin/bash

set -e

for p in $(seq 0 2 100); do
	dunstify --icon preferences-desktop-screensaver \
		-h int:value:$p \
		-h 'string:hlcolor:#ff4444' \
		-h string:x-dunst-stack-tag:progress-lock \
		--timeout=500 "about to lock screen ..." "move or use corners"
	sleep 0.05
done
```

The step in `seq` and `sleep` setting were adapted to render completely in a 5s loop.

Here is the result

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


### Alternative #2: brightness

I initially tried to play with brightness and so my `lockscreen-notify.sh` script was like this, creating a wave of brightness to force me to react.

```shell
#!/bin/sh

set -e

primary=$(xrandr | grep " primary" | cut -f1 -d " " | head -n 1)

# decreasing brightness
trap "xrandr --output $primary --gamma 1" EXIT
for g in $(LANG=C seq 1 -0.02 0.4) ; do
	xrandr --output $primary --brightness $g
	sleep 0.01
done

# increasing brightness
for g in $(LANG=C seq 0.4 +0.02 1) ; do
	xrandr --output $primary --brightness $g
	sleep 0.01
done
```

Please note the `trap` here to reset the brightness even if you CTRL+C the script.
Quick Note on Jetpack Compose Recomposition
Tags: android, programming, kotlin, jetpackcompose
Published: 2022-08-10 12:01:22

In this article, you will learn some of the useful things you should know about Jetpack compose recomposition.

But, what is recomposition in Jetpack Compose?

Recomposition is the process of calling composable again and again on input changes. In the legacy Android View system, we use invalidate() to do the same.

Compose always tries to complete recomposition before it needs to recompose again. If the state change before the previous recomposition finishes, Compose might cancel the ongoing composition and restart it with the new state. A composable function might be run quite frequently, as often as every frame of an animation. Jetpack compose does smart recomposition, which means it skips the composition if the input hasn't changed unlike invalidate() which redraws everything even if it’s not changed.

For detailed list, navigate to our blog to read Jetpack Compose Recomposition.
Cannot read properties of undefined (reading 'length')
Tags: javascript, beginners, webdev, react
Published: 2022-08-10 11:57:05

Why are error show in react js this error show Cannot read properties of undefined (reading 'length').

`export function Stricks1_(props){
  const Healthcares = props.names
  return (
  <>
 <h3> There Waiting List {Healthcares.length} </h3>
  </>
  )
}
const Healthcare = [1,2,3]
const root=reactDom.createRoot(document.getElementById("root"));
root.render(<Stricks1_  names={Healthcare}/>)`
Creating Custom CMS In Django | Django CMS Building By shriekdj
Tags: python, django, blog, shriekdj
Published: 2022-08-10 11:47:00

So I Thought about creating the Custom CMS and Update it's feature day by day as per need.

For Example Firstly I just added `blog` app in django project named `dj_admin`.
And Created Very Simple Model LIke

```python
from django.db import models

# Create your models here.
class Post(models.Model):
	title = models.CharField(verbose_name='title', max_length=255, null=False)
	content = models.TextField(verbose_name='content', null=False, blank=True)
```

after some time I added 3 fields like `created_at`, `published_at` and `updated_at` where `created_at` is mandatory and auto created Model Then updated like this.

```python
from django.db import models

# Create your models here.
class Post(models.Model):
	title = models.CharField(verbose_name='title', max_length=255, null=False)
	content = models.TextField(verbose_name='content', null=False, blank=True)
	created_on = models.DateTimeField(auto_now=True, auto_created=True, null=False, blank=False)
	published_on = models.DateTimeField(null=True)
	updated_on = models.DateTimeField(null=True)
```

I Created The GitHub Repo for the Project And It's Django Project Code Will Be Under `src` directory.

{% github shriekdj/shriekdj_cms %}

I will be adding features to it day by day to make it blog.
I Wrote A Lo-Fi Player, Loofi with Typescript
Tags: javascript, showdev, node, loofi
Published: 2022-08-10 11:37:00

After working for a quite long period of time, I am glad to introduce [Loofi](https://loofi.vercel.app/), a Lo-Fi player which is aimed to create a chill atmosphere for developers while coding, students while studying, and more 🥳

## Features:
- Fluent UI
- Open Source Project
- Small App Size (~ 5mb)
- Have a collection of 50+ Lo-Fi Music
- Multiple themes
- Available in Web and App (Currently Support for Windows Platform)

## About:
Loofi is an open source programs built using React, Typescript (for a more secure environment), CSS, and Firebase.

## Links:
GitHub: https://github.com/stanleyowen/loofi
App: https://loofi.vercel.app/

Happy coding! 🎉
Flutter multiplatform navigation sidebar / drawer widget
Tags: flutter, webdev, macos, windows
Published: 2022-08-10 11:37:00

**[SidebarX](https://github.com/Frezyx/sidebarx)** - package to create beautiful and convenient sidebar navigation widgets easy 🔥

| Mobile | Desktop | Web |
| :------------: | :------------: | :------------: |
| ![Mobile](https://github.com/Frezyx/sidebarx/blob/main/example/repo/example_mobile_small.gif?raw=true) | ![Web](https://github.com/Frezyx/sidebarx/blob/main/example/repo/example.gif?raw=true) | ![Desktop](https://github.com/Frezyx/sidebarx/blob/main/example/repo/example_web.gif?raw=true) |

The package is designed with maximum adaptation to large screens.
Therefore, adding a widget to your screen will be very simple.

```dart
Scaffold(
  body: Row(
    children: [
      SidebarX(
        controller: SidebarXController(selectedIndex: 0),
        items: const [
          SidebarXItem(icon: Icons.home, label: 'Home'),
          SidebarXItem(icon: Icons.search, label: 'Search'),
        ],
      ),
      // Your app screen body
    ],
  ),
)
```

## Customization 
Package have huge customization fields list and by default can adjust to the theme of your application. 

For example - you can change colors, textStyles, add your custom builders for sidebar items and all what you need.


😎 Go to the [GitHub repository page](https://github.com/Frezyx/sidebarx)! 
🥵 Here you can see beautiful examples of usage and code snippets. 

Show some ❤️ and star the repo to support the project!
www.routerlogin.net
Tags: router
Published: 2022-08-10 11:35:50

Netgear [routerlogin.net](https://router-logn.com/) is the default web address used for Netgear wireless router login. In case [www://routerlogin.net](https://router-logn.com/) Netgear URL doesn’t work, users generally switch to routerlogin.com. You can use one of these two web addresses for router login Netgear. Here's how to login Netgear router:
Build Client Payment Reminders using Twilio, Notion, and Python
Tags: generalprogramming, automation, python, twilio
Published: 2022-08-10 11:08:09

Running a business requires payment handling. It doesn't matter whether you are a freelancer or a big corporation, sometimes clients forget to pay their pending dues. If you have a huge list of clients, it makes for a tedious experience to go through the records daily and send them reminders. To solve this issue, you can automate the entire reminder workflow.

In this tutorial, you’ll learn to use Twilio’s WhatsApp API with the Notion API and Python to send payment reminders to your clients at regular intervals. You will use Notion for storing data, Twilio for sending WhatsApp messages, and Python to implement the business logic. We will create three reminders that will be sent 7 days before, 3 days before, 1 day before, and each day after the payment is due.

Read the full blog on [Twilio](https://www.twilio.com/blog/payment-reminders-twilio-notion-python).

Thanks for reading 💜

---

I publish a [monthly newsletter](https://www.ravsam.in/newsletter/) in which I share personal stories, things that I am working on, what is happening in the world of tech, and some interesting dev-related posts which I come across while surfing the web.

Connect with me through [Twitter](https://twitter.com/ravgeetdhillon) • [LinkedIn](https://linkedin.com/in/ravgeetdhillon) • [Github](https://github.com/ravgeetdhillon) or send me an [Email](mailto:ravgeetdhillon@gmail.com).

— [Ravgeet](https://www.ravgeet.in/), *Full Stack Developer and Technical Content Writer*
Using log in Substrate
Tags: rust, log, substrate
Published: 2022-08-10 10:57:00

How to log in substrate pallets and how to see logs when running node (can be useful to see existing logs in polkadot when debugging).

Import log crate in Cargo.toml of pallets/template
```toml
[dependencies]
log = "0.4"
```
Add some logging to extrinsic `do_something` in pallet-template (gibberish in my case) 
```rust
log::trace!(target: "lalala", "do_something is working!");
log::trace!(target: "ononono", "do_something is working!");
log::trace!(target: "test::werr", "do_something is working!");
...
log::trace!(target: "lalala", "do_something is done!");
log::trace!(target: "ononono", "do_something is done!");
log::trace!(target: "test::werr", "do_something is done!");
```
Build node, and run with log filtering (filters only `target: "lalala"` trace logs):
```sh
./target/release/node-template --dev --tmp --log lalala=trace
```
when execute extrinsics, trace log is in output:

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

different filtering (notice that `target: "test::werr"` can be filtered like that `test=trace`)
```sh
./target/release/node-template --dev --tmp --log lalala=trace ononono=trace test=trace
```
--different output

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

For example to trace xcm messages in parachains/relay chain filter can be used: `--log xcm=trace`
Companies with the most talks submissions for Devoxx Morocco 2022! :D
Tags: techtalks, webdev, java, programming
Published: 2022-08-10 10:37:36

This year's edition is set to be an exciting one, with the submission of top-notch speakers coming from leading tech companies 🔥 Stay tuned, the first batch of speakers will be announced🔜https://devoxx.ma/
Octopus Builds
Tags: octopusdeploy, devops, beginners
Published: 2022-08-10 10:35:00

## What is Octopus Deploy?
[Octopus Deploy](http://octopus.com/?utm_campaign=octopusbuilds&utm_medium=blog&utm_source=devto) can help you with a number of things:

- Release management
- Deployment Automation
- Operations Runbooks

When we think about the DevOps pipeline, Octopus sits on the Continuous Integration (CI) part of things.  Octopus works in conjunction with existing tools you might have, Azure DevOps, GitHub Actions, TeamCity, etc. 

## Octopus Builds

In this new video series the Octopus Deploy Technical Director, [Bob Walker,
](https://www.linkedin.com/in/bobjwalker/) will take you through the process of starting with a blank Octopus Deploy deployment and building that up.  He's going to walk you through all the touch points and features within Octopus so you can really get to know the product.

The first few videos have been released and we'll be releasing a new video every Tuesday.  So check out the current videos and [subscribe to the channel](https://www.youtube.com/octopusdeploy/?sub_confirmation=1) to get notified of the new ones that are coming. 

- [Start a new project in Octopus Deploy](https://youtu.be/vYL7xtgmRHk)
- [Deploying a package & configure email notifications](https://youtu.be/t8Eg8NicQ5A)
- [Variable creation & replacing entries in configuration files](https://youtu.be/pdTXUt6oKJk)
- [Configure rolling deployments](https://youtu.be/qZ_HOIowVz4)

## Join our community
If you'd like to chat with Octopus employees and other Octopus users come and join our [Slack Community](https://www.octopus.com/slack/?utm_campaign=octopusbuilds&utm_medium=blog&utm_source=devto), we'd love to see you there!
How to Work with Appointments in Vue Scheduler
Tags: vue, webdev
Published: 2022-08-10 10:20:29

Learn how easily you can work with appointments in Syncfusion’s [Vue Scheduler](https://www.syncfusion.com/vue-ui-components/vue-scheduler). In this video, you will learn how to make appointments all-day and recurring. You will also learn how to make appointments read-only and block specific time slots. This video also covers additional customizations, like how to enable tooltips for appointments and change the titles of the field labels in the editor window. 

**Product overview**: https://www.syncfusion.com/vue-ui-components/vue-scheduler

**Download example from GitHub**: https://github.com/SyncfusionExamples/how-to-work-with-appointments-in-vue-scheduler

{% youtube MlRNsYaug48 %}
IP Visualizer live demo & redis bulk loading with node.
Tags: redishackathon, webdev, redis, node
Published: 2022-08-10 10:02:00

Soo.. demo is live, woohoo.. 🙂
Head over to [ipv.karate.monster](https://ipv.karate.monster) and try it out. And yeah, don't run it on chrome mobile browser, the touch stuff is dodgy and not working like it should. Seems to work on firefox mobile though, but well, it was never really developed for mobile so your mileage my vary with that, just use a computer 😉.

How to use? press the crosshair button, click and drag on the map to make a circle.
Visualize the stuff, change layers and settings as you like. In some layers can click on the drawn items to get data for it.

Let's talk about redis bulk loading.
So for my project I need to parse a csv-file and add the data to redis.

So at first i was just parsing a csv-file, shoveled promises with commands into an array and then sending it regularly with the node redis client. This approach is slooooow and i do not recommend it.

I needed a better way, so started googling around and reading.
Stumbled upon [a github repository](https://github.com/eugeneiiim/node-redis-pipe) showing how to pipe commands from node to redis-cli.

Implemented the pipeline in my code and also [the protocol needed for bulkloading](https://redis.io/docs/reference/patterns/bulk-loading/)

Below is the code, maybe it will be useful for someone trying to do something similar.

```JAVASCRIPT
const spawn = require('child_process').spawn;
const fs = require('fs');
const CsvReadableStream = require('csv-reader');
const redisPipe = spawn('redis-cli', ['--pipe']);

redisPipe.stdout.setEncoding('utf8');
redisPipe.stdout.pipe(process.stdout);
redisPipe.stderr.pipe(process.stderr);

const file = 'my.csv';
const BUFFER_SIZE = 524288; // 512KB
let buffer = '';

async function run() {
	let inputStream = fs.createReadStream(file, 'utf8');
	console.log('Let the piping commence!');

	inputStream
		.pipe(new CsvReadableStream({ asObject: true })) //reads in every row of file as object with keys being taken from csv header
		.on('data', async function (row) {
			//check that the row acutally have coordinates, if not i dont want it
			if (row.longitude && row.latitude) {
				//encode the string with the redis command and add it to the buffer
				buffer += encodeRedis(`geoadd ips ${row.longitude} ${row.latitude} "${row.network}"`);
				
				//when buffer is filled then write it and then empty buffer.
				if (buffer.length > BUFFER_SIZE) {
					redisPipe.stdin.write(buffer);
					buffer = '';
				}
			}
		})
		.on('end', async function () {
			redisPipe.stdin.write(buffer); //write the remaining buffer if any left
			redisPipe.stdin.end(); //end the pipe
			console.log('Update complete');
			process.exit();
		});
}

function encodeRedis(dataString) {
	const dataArr = dataString.split(' '); //split data into array
	let msg = '*' + dataArr.length + '\r\n'; //create start of message with amount of args

	for (let i = 0; i < dataArr.length; i++) {
		msg += '$' + dataArr[i].length + '\r\n' + dataArr[i] + '\r\n'; //encode the data
	}
	return msg; //return the encoded message
}

run();

```
Introduction to JavaScript
Tags: javascript, beginners, webdev, codenewbie
Published: 2022-08-10 10:00:00

These days, it is difficult to find sites that do not allow visitors to interact with them. Think sliders, web galleries, animations and whatever other interactive events that pop out when you press some button. The processing of user input, the ability to send/receive data from servers and other interactive behavior are provided by **JavaScript.**

## What is JavaScript

**JavaScript (JS)** is one of the most used programming langauges. It was created by _Brendan Eich_ in 1995, and it took him ten days. You read it right: JavaScript was really developed in just ten days!

![JavaScript Logo](https://ucarecdn.com/541cca3b-6668-401c-9e88-ed9ed42a61a3/)

According to [GitHub 2018](https://github.blog/2018-11-15-state-of-the-octoverse-top-programming-languages/), JS top the list of the most popular programming languages. It is used for both front-end and back-end development.

```plain
JavaScript is not Java. These are different programming languages. Their similar names were are marketing move to draw attention to the new language and take advantage of the popularity of Java.
```

JavaScript is based on the **ECMAScript** standard (often shortened to **ES**). The latest version of the standard is **ES11.**

## The first Program

Programs written in the language are called **scripts.** Here is an example of a simple JS script that prints `I am starting to learn JavaScript!`:

```javascript
console.log("I am starting to learn JavaScript!");
```

All modern browsers have a built-in program that allows you to execute JS directly in them. Let's look at the result of our first program in browser. To do this, press

```bash
Ctrl + Shfit + J/Ctrl + Shfit + K on windows

OR

Cmd+Opt+J/Cmd+Opt+C on Mac
```

write the JS code in the opened console, the press Enter.

![Console](https://ucarecdn.com/f2749cf6-98ef-47e3-b92f-4172b07f8264/-/crop/366x37/0,3/-/preview/)

As you can see, the result of our first script was the line `I am starting to learn JavaScript!`.

The browser console is not always easy to use, so you can also run this code [on this site](https://replit.com/languages/javascript).

## Conclusion

JavaScript has a huge community of developers all over the world. This programming language is easy to learn and pleasant to write programs in. You will still come across difficulties, but when you do, you can always asks other programmers for help or even find [a ready-made answer!](https://stackoverflow.com/questions/tagged/javascript)

---

### Let's connect 🤝

You can connect with me on [Twitter](https://twitter.com/MrDanishSaleem), [LinkedIn](https://linkedin.com/in/mrdanishsaleem), [GitHub](https://github.com/mrdanishsaleem/), [Discord](https://discord.com/users/890596597610737774/)

---

### Support me ☕

You can support me on [Buy Me a Coffee](https://www.buymeacoffee.com/mrdanishsaleem)
What are quotes searched by word?
Published: 2022-08-10 09:50:25

Quote search by words can find quotes by classes like Quotations, Authors, Topics, Keywords, Contributors, and so on. Then, at that point, you will read the rundown of quotes by well-known creators. Then, at that point, it shows every one of the axioms. The catchphrase index can likewise assist you with tracking down the best citations.
Read More: [https://quotessearchengine.com/](https://quotessearchengine.com/)