teleren/devto huggingface dataset:
Browser Mining for Charity
Tags: monero, webdev
Published: 2022-04-27 12:46:00

# Abstract

For Longhorn Hack for Humanity 2022, I came across an article on crypto mining in the browser. It was often regarded as an alterative to ads, but much more intrusive given that they were often hidden and obnoxiously slowed down your computer. Since then, browser mining is often blocked by adblockers making it basically non-existence though it still occasionally happens. It was a niche platform for mining anyways; you could really only mine coins that were efficient on CPUs. However, given the theme of the hackathon was for "humanity," I saw there was some potential in a crypto miner that users consented to use to mine for charity. It was to be non-invasive, controllable, and easy to use such users felt safe using it. Thus, Tab for Charity was born. 

## Design is Crucial

This is first and foremost a web app meant to look good. It was important that users felt safe using the app as if the app looked sketchy is would naturally seem like a scam. The design process for the app did not take long though. Inspired from Coinbase and donation page for Ukraine for crypto, I sketched out a simple hero which inspired the design of the other pages.

## Finding a Browser Miner

This was not easy. Most are rather sketchy, and I was not capable of building my own crypto miner for the web. I did eventually find Minero.cc. They took a small cut apparently, can never know actually how much they took, and had a decent API. The only issue was implementing this into a Next.js app which was the framework the project was using since the script was 3rd party vanilla JS and WASM. After some fidgeting I used the experimental `Script` from Next with the `onLoad` attribute with some state referring to the miner. 

## Back-end Pain

This was a learning experience. I used Mongoose, next-connect, @hapi/iron, and passport.js to implement the back-end for sign-in with Google OAuth2 and a MongoDB database. Sounds simple enough, but I painfully learnt that passport.js did not end the response after the redirect from Google OAuth leading to many hours of frustration that the session was not being saved. It eventually worked and was straight forward to implement the database afterwards. 

## End Product

I did not finish this project in-time for the hackathon. Which was sad because I think this was a very solid concept, but I struggled too much to implement the back-end and front-end with the miner. I eventually finished this project in my freetime which you can see [here](https://tabforcharity.vercel.app/).
Top 10 free icon libraries for Web Developers
Tags: webdev, frontend, icons, libraries
Published: 2022-04-27 12:45:04

If you are a frontend developer you need icons for your projects, here are the best 10 free icon libraries for your apps:

1️⃣ AWERSOME FONT: https://fontawesome.com/
2️⃣ ICON8: https://icons8.com
3️⃣ THE SUBSTANTIVE PROJECT: https://lnkd.in/d8Jg-PGr
4️⃣ ICONMONSTR: https://iconmonstr.com/
5️⃣ ORION: https://lnkd.in/d8T5g9dS
6️⃣ ICON FILE: https://iconarchive.com/
7️⃣ FEATHER: https://feathericons.com/
8️⃣ FLATICON: https://www.flaticon.com/
9️⃣ GOOGLE STUFF: https://lnkd.in/d4hrfcFs
🔟 ICONFINDER: https://lnkd.in/dQPmVdS4
#3 React Coding - Show/Hide An Element (Exercise)
Tags: codepen
Published: 2022-04-27 12:36:13

```
/**
  Challenge: Make the button functional
  A click on button should toggle (show/hide) the string `Toggle Challenge` each time it is pressed
  
  Solution: https://codepen.io/angelo_jin/pen/abLwyrL
  Video for reference: https://youtu.be/VzNNjNmbXpY
**/
function App() {
  const [visible,setVisible] = React.useState(true);

  return (
    <>
      <button onClick={()=>setVisible(!visible)}>{visible?"Hide Element Below":"show Element Below"}</button>

      {visible&&(<div>Toggle Challenge</div>)}
    </>
  );
}

ReactDOM.render(<App />, document.getElementById("root"));
```
{% codepen https://codepen.io/angelo_jin/pen/zYERZZL %}
LESSON 0:WEB DEV CODING- where to start(Code Editor)
Tags: webdev, beginners, tutorial, html
Published: 2022-04-27 12:13:53

**What you need (to Download)**


## 1. A code Editor

-A software that is designed specifically to help developers with coding. These are text editors with additional functionalities to manage and edit code.
-Like a Canvas to a painter, Photoshop/Illustrator to a Graphic designer.

- _**visual studio code**_

This is the most common code editor on the market, so I'd recommend this. Download **[here](https://code.visualstudio.com/)** according to your type of OS i.e-Windows

-After Downloading Visual Studio Code, and Setting it up...open it and lets do some further Config. Let's look at Extensions...

- **_extensions_**

-Think of  Extensions as a feature that  let you add languages, debuggers, and tools that _support your development workflow._



![code_editor_extension_example_clara_situma](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3zrmb4c4njyhndtkqh89.JPG)

Search for an Icon that looks like Tetris on your Visual Studio Code, that's your Extensions tab!

Search for the following extensions and press install.

-_ **Settings Sync**_ ( allows you to sync pretty much everything you customize on VSCode to Github- Github is a provider of version control using Git/Think of it as a platform where you can store your source code remotely)

- _**IntelliSense**_-(Auto completes code for you)

- _**Live Server**_-(will enable you to Launch a development local Server by a single click and watch live changes with some extra functionality.)

-_**Remote-SSH**_-( This makes it much easier to develop and/or troubleshoot in a wide variety of scenarios.)

- **_Prettier_**-(code formatter)

- **_Bracket Pair Colorizer_**-(gives the opening and closing brackets matching colors, making it much easier to know which brackets belong together.)

- **_Auto Rename Tag_**-(automatically renames tags that you change.)

-**_ GitLens_**-( allows you to see who, why, and how lines of code have changed over time)

- **_Git History_**-(Another Git extension. Allows you to compare branches, commits, and files across commits.)

To understand Further what each extension does read **[this](https://x-team.com/blog/best-vscode-extensions/)** article

_Up-to this point, Don't think too much about anything, Install the extensions, They will start to make better sense once you begin development



You are now Set to begin practicing on your PC, I'd suggest to start a class at [freecodecamp](https://www.freecodecamp.org/learn/responsive-web-design/) or [codecademy](https://www.codecademy.com/learn). 

Good luck!!!
What is /usr/lib/systemd/system-shutdown ?
Tags: linux, kcdchennai
Published: 2022-04-27 11:59:23

Everyone probably has heard of startup scripts such as `Cloud-init` or `user-data` which is passed as a startup script even libvirt has this feature.

Running a shutdown script is however not mentioned much, now why would you need a shutdown script, sometimes, a shutdown script is needed to do various things such as collect diagnosis etc.

The path `/usr/lib/systemd/system-shutdown/` runs these scripts, however they are run quite late hence the system is mostly in read-only mode, for example to create a log file one would have to do
```
cat /usr/lib/systemd/system-shutdown/debug.sh                                                                                                    
#!/bin/sh
mount -o remount,rw /
dmesg > /home/leon/shutdown-log
mount -o remount,ro /
```
The other way is to use a systemd script:
```
cat /etc/systemd/system/demo.service
[Unit]
Description=Run my custom task at shutdown only
DefaultDependencies=no
Conflicts=reboot.target
Before=poweroff.target halt.target shutdown.target
Requires=poweroff.target

[Service]
Type=oneshot
ExecStart=/tmp/script.sh start
RemainAfterExit=yes

[Install]
WantedBy=shutdown.target
```
This example is taken from [here](https://www.golinuxcloud.com/run-script-with-systemd-at-shutdown-only-rhel/).

This is a pretty neat way to run shutdown scripts.
What to Consider While Developing an Android Application?
Tags: mobile, apps, android, applications
Published: 2022-04-27 11:55:04

<p>Only developing an Android application will not help your business in any way. The reason is a plethora of mobile applications are developed regularly. But, only a few percent of these applications become successful. The actual reasons for app failure could be several things.</p>
<p>So, you just need to consider various crucial factors while developing a mobile application. Once your developers keep in mind these factors and create your application accordingly, maximize the success rate of your application. So, take a look at all of these factors.</p>
<ul>
<li><strong> User Engagement</strong></li>
</ul>
<p>The major purpose to develop an Android application for your business is not only to highlight your products and services online but also to push your marketing effort. And marketing effort is something that you can&rsquo;t push without user engagement. The major advantage of customer engagement is that it helps you in getting good reviews, making an in-app purchase, and more.</p>
<p>For this, you can also organize campaigns with the help of SMS, email, push notifications, and more.</p>
<ul>
<li><strong> Re-evaluate your App</strong></li>
</ul>
<p>If your app is static, there&rsquo;s indeed less chance of its success. Android <a href="https://www.webomindapps.com/mobile-app-development-company.html">mobile application developers</a> need to work to enhance the application to help it render an outstanding experience. When it comes to the behavior of users, tends to change with time. So, you need to implement certain changes in your application based on the changing behavior of your applications. It helps your business by letting you find new paths, re-create flow, target new audiences, and more. All you need to do is think out of the box to make your app unique and grow.</p>
<ul>
<li><strong> Optimize Apps to Provide Value to Customers</strong></li>
</ul>
<p>Once you launch your business applications successfully, you need to make a detailed analysis. You need to just get details about the app usage patterns and also learn in terms of how frequently customers interact with the applications which helps you gain vast knowledge and make changes in your application accordingly. Your developers should make enough effort to optimize your application properly to get a high customer lifetime value.</p>
<ul>
<li><strong> Determine Success</strong></li>
</ul>
<p>Once your app gets used by the public, it&rsquo;s crucial to measure whether your application is successful or not. You can also consider some previous parameters such as numbers of active users, downloads, less popular features, and more. It, on the other hand, gives you a complete idea related to the demand, market reception, etc. of the application.</p>
Cara Mudah Menukar Nilai Variabel Dengan Javascript
Tags: javascript, beginners, programming
Published: 2022-04-27 11:44:26

Hai teman-teman 👋

Kali ini saya akan membagikan cara mudah untuk menukar nilai variabel dengan bahasa javascript. Biasanya, untuk menukar nilai variabel maka kita membutuhkan variabel bantuan seperti contoh berikut:

```javascript
let value1 = 10;
let value2 = 20;

let temp = value1;
value1 = value2;
value2 = temp;

console.log(value1);
console.log(value2);
```

Contoh di atas sudah benar, akan tetapi dapat lebih ringkas lagi juga tidak perlu membuat variabel tambahan. Berikut kode pemrogramannya:

```javascript
let value1 = 10;
let value2 = 20;

[value1, value2] = [value2, value1];

console.log(value1);
console.log(value2);
```

Lebih ringkas bukan? Contoh tersebut juga bisa digunakan untuk lebih dari 2 variabel, tinggal sesuaikan saja urutan variabel yang akan ditukar.

Demikian yang dapat saya bagikan, apabila ada yang perlu dikoreksi silahkan share di kolom komentar. 😁
Simulated Annealing for Continuous Distribution Parameter Estimation in R
Tags: r, statistics
Published: 2022-04-27 11:43:16

This was a fun one!

I've been trying to find a distribution that described [HbA1c](https://www.diabetes.org.uk/guide-to-diabetes/managing-your-diabetes/hba1c) in the general population. After a few hours of digging, the best I could find was this research from [NIH](https://www.ncbi.nlm.nih.gov/pmc/articles/PMC3946694/). In this article, all we are given is a few quantiles.

|  5% | 10% | 25% | 50% | 75% | 90% | 95% |
| :-: | :-: | :-: | :-: | :-: | :-: | :-: |
| 4.7 | 4.8 | 5.1 | 5.4 | 5.7 | 6.1 | 6.8 |

I want to try to fit a continuous distribution to these points. Simulated annealing lets us search the problem space for a global optimum. I know from the text of the research that the data is skewed (mean = 5.6, mode = 5.3). We need a distribution that allows for skewness. Let’s go with the [gamma distribution](https://en.wikipedia.org/wiki/Gamma_distribution).

The first thing we need to do is create a data frame of our known data set.

```r
df <- data.frame(quantile = c(0.05, 0.1, 0.25, 0.50, 0.75, 0.9, 0.95),
                 value = c(4.7, 4.8, 5.1, 5.4, 5.7, 6.1, 6.8))
```

Next, we need to write a function that we want our SA algorithm to minimize.

```r
fun <- function (x) {
    shape <- x[1]
    scale <- x[2]
    df$est <- qgamma(df$quantile, shape, scale)
    df$sq_err <- (df$est - df$value) ^ 2
    error <- sum(df$sq_err)
    error
}
```

We will use the GenSA package for the simulated annealing.

```r
library(GenSA)

lower_bound <- 1e-6
upper_bound <- 100

fit <- GenSA(par = c(1, 1), 
             fn = fun, 
             lower = c(lower_bound, lower_bound), 
             upper = c(upper_bound, upper_bound))
```

This gives us gamma distribution parameters of shape = 89.4837 and scale = 16.2514. The SSE for this fit is 0.1747.

Lets see how this looks when plotted against the original data.

```r
library(ggplot2)

df2 <- data.frame(x = seq(from = 3.0, to = 10.0, by = 0.01))
df2$y = pgamma(df2$x, fit$par[1], fit$par[2])

ggplot() +
    geom_line(aes(x, y), df2, color = "red") +
    geom_point(aes(value, quantile), df, size = 2, color = "blue")
```

![Simulated data vs fit](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/iomvgypj5d6nlklygckw.png)

There you go! If you only have a few data points and their quantiles, you can make a guess about their distribution. You can try this with multiple distributions and compare their resulting SSEs.
Keyboard Handling In Jetpack Compose — All You Need To Know
Tags: android, kotlin, programming, handling
Published: 2022-04-27 11:40:54

Keyboard Handling In [Jetpack Compose](https://blog.canopas.com/intro-showcase-view-in-jetpack-compose-ac044cd3bf28) — All You Need To Know

Here's an important [guide](https://blog.canopas.com/android-development-best-practices-2022-203682a440f5) of manage the Keyboard in Jetpack compose

In this article, we’ll learn the important use-cases to manage keyboards in Jetpack compose.

1. How to hide & show a soft keyboard.
2. How to adjust the layout when the keyboard appears.
3. Keyboard actions
4. Keyboard options
5. How to detect the keyboard?

To read more about Keyboard Handling in Android, visit our website [blog.canopas.com](https://blog.canopas.com/keyboard-handling-in-jetpack-compose-all-you-need-to-know-3e6fddd30d9a)
My solo developer stack to make a SaaS
Tags: saas, maker, solo
Published: 2022-04-27 11:39:01

Six month ago, I started working on [monse.app](https://get.monse.app), a simple and automated personal finances for normal people.

I'm a solo maker and I want to build this SaaS faster but also, making a good product that I can scale and work on in the future.

With that in mind, [this is the stack that I choose](https://get.monse.app/page/stack), what do you think?
Cherrybomb v0.6
Tags: rust, opensource, openapi, api
Published: 2022-04-27 11:29:30

**We just released Cherrybomb v0.6!🎉🎉🎉**
Go to our GitHub repo and try it out: [https://github.com/blst-security/cherrybomb](https://github.com/blst-security/cherrybomb)
# Release notes:
## What's Changed
### CLI
* Added the command ep-table
* Separated param-table into it's own command
* Added configuration options
* Rebuilt the CLI main using structopt in clap
* Added the option to present only 1 parameter or 1 endpoint in their respective tables
* Added the option for a JSON output - cherrybomb oas --file <PATH> --format json

### OAS
* Created the EpTable module - it's meant to build the same kind of table as the param-table but with a different key(endpoint/path) and with some different related fields.

### General
* Deprecated the Decider module.
* Some minor bug fixes
* Now taking  yaml OAS files as input as well🎉

## New Contributors
* @dret made their first contribution in https://github.com/blst-security/cherrybomb/pull/18

**Full Changelog**: https://github.com/blst-security/cherrybomb/compare/v0.5.2...v0.6.0
How Will You Resolve The Error "ModuleNotFoundError: No module named ‘tensorflow.python.saved_model.model_utils’"?
Tags: modulenotfounderror, python
Published: 2022-04-27 10:44:41

Python is one of the most popular tools over the last few years. It consists of numerous components, ranging from the Web application to the data. It's strewn about the place.
Nonetheless, like us, a few of you may encounter a few issues while using this application. When you try to install seaborn, you get the message  "ModuleNotFoundError: No module named ‘tensorflow.python.saved_model.model_utils’".
This is one famous error made by programmers. But what causes it, and what can be done about it right now? We'll work together to find the best solutions.

## Why Did The Error “ModuleNotFoundError: No module named ‘tensorflow.python.saved_model.model_utils’” Occur?
You are attempting to use Tensorflow in your code, but you get the following error.
File “/Library/Frameworks/Python.framework/Versions/3.7/lib/python3.7/site-packages/tensorflow_estimator/python/estimator/export/export_lib.py”, line 25, in from tensorflow.python.saved_model.model_utils import build_all_signature_defs ModuleNotFoundError: No module named ‘tensorflow.python.saved_model.model_utils’

## Two Fundamental Solutions
And you might be capable of solving it with several simple techniques.

**Technique 1: Install the tf_slim**
The first solution is very simple for everyone. Slim requires the installation of tf slim. To insert tf slim, run this command.
`pip install --upgrade tf_slim`
And then you can use it in this way.
`import tf_slim as slim`

**Technique 2: Downgrade the tensorflow 2.X to 1.X**
The problem here is Tensorflow's default installation is currently 2.x, whereas the code is for 1.x. The contrib component is no longer available in tf 2.x. Examine the warnings.
TensorFlow 2.0 would not include the TensorFlow contrib unit. You need to remove Tensorflow and then use that command to set up the 1.x variant.
`pip install tensorflow==1.15`

## Conclusion
Python is one high-level programming for general-purpose programming, created by Guido van Rossum and first released in 1991.
The solutions introduced here are the best for anyone perplexed by the error "ModuleNotFoundError: No module named 'tensorflow.python.saved_model.model_utils'".
If you still need help or have frequent Python questions, you have a massive system where almost everyone is willing to help.
Why Is A Full Body Screening Test Necessary?
Published: 2022-04-27 10:40:48

There are many people who avoid going for a full body screening test. By doing this, they are ignoring the potential health problems. They don’t realise that a regular full body health check-up will be able to protect them from an unanticipated health crisis.

[https://www.vipposts.com/why-is-a-full-body-screening-test-necessary/](https://www.vipposts.com/why-is-a-full-body-screening-test-necessary/)
How to Convert PSD to a WordPress Website?
Tags: psd, wordpress, website, conversion
Published: 2022-04-27 10:39:40

With the changing technology, the demand for WordPress is increasing. Many customers are inclined to convert PSD to WordPress websites, as it is an easy option to use. Across the globe, all blogging and e-commerce sites are personalized 

using WordPress templates. WordPress has popular themes with multiple plug-ins. This can change the entire look of the website and improve the functionality of your website. Read this blog to know how to [convert PSD to WordPress](https://www.technoscore.com/blog/how-to-convert-psd-to-wordpress-website/), time and cost will it take to get the website live?
Have you recently started your first job in tech? How is it so far?
Tags: discuss, watercooler, beginners
Published: 2022-04-27 10:39:21

I've seen a lot of people who started their first jobs in tech and can't help but feel pride for these people. They've finally made it into a field I love so much. So I'll be interested to know how are people finding their first tech jobs so far!
Umbraco 10 - Sort those crops out!
Tags: umbraco, css, image, cropper
Published: 2022-04-27 10:39:03

I've always though that the image cropper in Umbraco, looked a little messy and the view for the main image wasn't large enough. 

![Default Cropper](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/si4o2973m96j1wuu0si7.jpeg)
 
So I decided to tweak the CSS and see if I can tidy it up:

![Improved Cropper](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/odyut3f5e50wk4ny1i27.jpeg) 

I think this looks better and it gives the main image 100% of the area to use!

It's fairly straightforward to achieve this, just follow these steps:

1 - Create the following structure in your site under app_plugins

![Folder](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/65syjwqhaa84peto5g5s.png) 

2 - Add a package.manifest with this code:

```javascript
{
  "css": [
    "~/app_plugins/tweaks/cropper.css"
  ]
}
```

3 - Add this CSS in a file called: cropper.css

```css
.imagecropper {
  display: block;
}

.imagecropper .umb-sortable-thumbnails {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  width: 100%;
  overflow: auto;
  max-height: 300px;
}

.imagecropper .umb-sortable-thumbnails li {
  display: flex;
  flex-wrap: wrap;
  width: 10%;
  align-items: flex-start;
}

.imagecropper .umb-sortable-thumbnails li .crop-information {
  align-items: flex-start;
}
```

4 - Restart the Umbraco website, and the image cropper should be updated :)

---

Nuget Package: 
```
Install-Package punkCropperStyles
```

https://www.nuget.org/packages/punkCropperStyles/

---


If you need any help, give me a shout on [twitter](https://twitter.com/garpunkal).
C++ Variables
Tags: ok
Published: 2022-04-27 10:35:49

Variables are containers for storing data values.

In C++, there are different types of variables (defined with different keywords), for example:

    int - stores integers (whole numbers), without decimals, such as 123 or -123
    double - stores floating point numbers, with decimals, such as 19.99 or -19.99
    char - stores single characters, such as 'a' or 'B'. Char values are surrounded by single quotes
    string - stores text, such as "Hello World". String values are surrounded by double quotes

The setfill() method of Iomanip library in C++ is used to set the ios library fill character based on the character specified as the parameter to this method.

Setw function is a C++ manipulator which stands for set width. The manipulator sets the ios library field width or specifies the minimum number of character positions a variable will consume.