teleren/devto huggingface dataset:
Leaving electron.js to the past. pt-2
Tags: javascript, webdev, electron, wails
Published: 2022-10-22 17:49:41

Hey there everyone 👋!

If you have seen the part 1 of this article, you are gonna love this one. Take a look at the first article before proceeding with this.

{% embed https://dev.to/akashpattnaik/leaving-electronjs-to-the-past-3mkl %}

---

So, I recently started using [`wails`](https://wails.io/) because electron.js was no good on for my pc... I was amazed to see the release build size and speed of the `wails` app.
It was way smaller and faster than expected.

## 🦄 Size Comparison

| Electron.JS   | Wails         |
| ------------- |:-------------:|
| `62.5`mb      | `14.9`mb      |

> These are the sized of installers for windows. The project was just a basic `hello world` displaying page.

So as you can see, `Wails` is the next desktop framework for webdevs... `Electron.JS` is nothing compared to `Wails`.
`Wails` by default provides various templates for new projects like `vanilla.js`, `react`, `svelte.js`, `vue.js` and a lot more in the future. The V2 of `wails` had some ground-breaking changes in it.

Wails works on the go runtime making is way more easier to build and faster to work with.

## 🐲 Getting started with `Wails`
> This is for windows only, get your OS instructions on [**_wails.io_**](https://wails.io/)

- Install `GOlang` [From Here](https://go.dev/dl/)
- Install [`Node.JS`](https://nodejs.org/en/download/)
- Install [`WebView2`](https://developer.microsoft.com/en-us/microsoft-edge/webview2/)

> Finally, use this command to install the `wails-cli` globally on your shell.
```powershell
go install github.com/wailsapp/wails/v2/cmd/wails@latest
```

> This will make your ready for developing in **_wails_**...

## 🙍 Connect with me
- **Mail** - `akashpattnaik.github@gamil.com`
- **Github** - `BLUE-DEVIL1134`
- **Twitter** - `akash_am1`
I'm not ready to give up Atom
Tags: opinion, frontend, webdev
Published: 2022-10-22 17:37:01

Hi y'all! This one's a break from my usual content, but maybe something you'll relate to quite a bit.

You ever have a favourite editor, that you come back to over and over, no matter what? I mean, sure - other editors do it better (ostensibly), but this one does it *right!*

For me, that editor is none other than Github's Atom. While everyone and their mom's given up on Atom and slid on over to VSCode, I'm having a hard time breaking free.

I mean, don't get me wrong, VSCode is great, and I've used it quite a bit. It's just... Atom is perfect (_stop that! I see that eyebrow rising!_) - it has the right layout, the right themes, the right packages (sort of). It's just... right.

Now that it's being taken away, and the community seems not to be picking up the slack much, I don't know how to let go.

###Do any of you feel the same way?
What's an app that lost support and reached its EOL (End Of Life) but you couldn't give it up?
PseudoEditor V3 is LIVE!
Tags: programming, productivity
Published: 2022-10-22 17:35:34

It has been a long time coming but [PseudoEditor](https://pseudoeditor.com) V3 went live today! 

In short, PseudoEditor is a way to write pseudocode (used to scaffold algorithms in plain English) within a designated code editor. This makes it so much nicer to write pseudocode (better than using notepad!).

Real-time collaborative sessions went live today, allowing users to write pseudocode together, teachers to share the code they're writing in real-time, and much more! 

The editor become more powerful, and the new "Pro" plan was released - offering perks such as live help with pseudocode and ad-free editing (a $9.99 one-time payment).

This is my website so ask me a question if you have one!

Thank you :D
Lazy ass SuperUsering
Published: 2022-10-22 17:30:49

- Security matters if you have something to lose
- if you have nothing to hide, just put everything in the open and save the CPU overhead DUDE

`sudo visudo`
this is going to load up 
`/etc/sudoers`
 add this to the bottom of it:
`username ALL=(ALL) NOPASSWD:ALL`

this is going to get read of need for password
How to increase website performance?
Tags: javascript, programming, wordpress
Published: 2022-10-22 16:29:49

Did you know, a 1-second delay in page loading makes conversion drop by almost 7%?
No think if your page is taking 10 seconds to load that means you are losing a great amount lot of clients or customers.

There are also bad impacts on:
✔️ Conversion
✔️ User experience 
✔️ SEO
✔️ Page views drop


I am sharing some best practices to decrease the page load time of your website.

➡️ First thing first, choose a great Hosting platform for your business. If you Invest in hosting you will never regret it.

You can choose some hosting platform like:
🔹 Hostinger
🔹 Godaddy
🔹 Hostgator
🔹 Bluehost
🔹 Siteground
 
➡️ Optimize the images of the website. Make sure you are using high-quality images with low sizes. Because high image size will take time to load and also impact on disk space of hosting. 
Some image optimization sites:
🔹 Tinypng (My Favourite)
🔹 Imagecompressor
🔹 Imagify


➡️ Minify CSS and JavaScript. Make sure you are using minified version of CSS and js files. It will help you to load your site faster. But it's a little bit risky. Make sure you are working with a professional developer who can do this job for you.

➡️ Use a content delivery network. What is CDN? According to Cloudflare, “A content delivery network (CDN) refers to a geographically distributed group of servers which work together to provide fast delivery of Internet content.” That means user requests are redirected to the nearest server. As a result, the content is delivered to a user quicker and the website works faster.

➡️ Use less animation. I know animations on the website will give attraction and a good user experience. But somewhere it affects our website speed. Because animations use CSS and JS. 

➡️ Try to load fonts and icons from your local server. Web fonts add extra HTTP requests to external resources.

➡️ Use fewer cookies on your site. Cookies let websites remember you, your website logins, shopping carts and more. Now gain they impact on website speed. You can read more about cookies on the site [Kaspersky](https://www.kaspersky.com/resource-center/definitions/cookies)


-----

Hope you find this article useful.  Connect with me:

Linkedin: [Rafi Kadir](https://www.linkedin.com/in/rafikadir/)
Instagram: [Rafi Kadir](https://www.instagram.com/i_am_rafikadir/)
YouTube: [Rafi Kadir](https://www.youtube.com/channel/UCIscq0goMZT6_rcXKQy7WOA)
Hacktoberfest - PR#3
Tags: javascript, opensource, hacktoberfest, webdev
Published: 2022-10-22 16:24:27

Hi!

I hope you are enjoying Hacktoberfest with lots of different projects.

### Project

This week I contributed to [React JS project](https://github.com/ashavijit/Meetify). In this project you can create a meeting via Calendly and join other meetings as well.

### Issue

For my [Issue](https://github.com/ashavijit/Meetify/issues/41), I had to add dynamic background image to the app, so that background image is changing every 10 seconds.

### Solution

For my [PR](https://github.com/ashavijit/Meetify/pull/44) I added a function that would change the background image:

```
const [counter, setCounter] = useState(0);
  const [backgroundClass, setBackgroundClass] = useState("");
  const backgroundImages = [
    "backgroundImage1",
    "backgroundImage2",
    "backgroundImage3",
    "backgroundImage4",
    "backgroundImage5",
  ];

function changeBackgroundImage() {
    if (counter === 4) {
      setCounter(0);
    } else {
      setBackgroundClass(backgroundImages[counter]);
      setCounter(counter + 1);
    }
  }

  useEffect(() => {
    setTimeout(() => {
      changeBackgroundImage();
    }, 10000);
  }, [counter]);
```

### Summary

It took some time for me to find the way to implement that feature, but it was a great experience!
What is Web3?
Tags: webdev, web3, writing, news
Published: 2022-10-22 15:47:46

Web3 has become a catch-all term for the vision of a new, better internet. At its core, Web3 uses blockchains, cryptocurrencies, and NFTs to give power back to the users in the form of ownership.

Web3 is freedom, democracy, and ownership — an idealistic version of the web built for users. Web3 is still in development, a few years away from being usable. Web3 could be a massive overhaul of how we engage with the web and each other. It could just as well be a hyped platform for decentralized finance and trading NFTs.  

**How does Web3 work?**

1. _Ownership of data_
When you use a platform like Facebook or Youtube, your data is collected, owned, and monetized by these companies. In web3, your data is stored on your crypto wallet. You'll engage with apps and communities on web3 through your wallet, and you'll take your data with you when you log off. Theoretically, since you own this data, you'll also be able to decide if you want to monetize it.

2. _Identity_
When it comes to identity, you are used to changing the display name or profile picture across every account. In certain circumstances, social sign-ins are an option, although censoring is a well-known issue that arises. Making an account on numerous sites, you must provide them with your personally identifying information. Luckily, Web3 solves these issues by enabling you to manage your online identity using blockchain technology. Web3 focuses on technology that runs in the background and is generally hidden from the user. 

**How is Web3 different from the previous forms of web?**

The first version of the Web(Web1) was formed by creating web pages and material for a big audience of readers, enabling them to find the information they need. Most websites were read-only web pages.

Platforms like Instagram, Twitter, TikTok, and other social media platforms represent Web2. Users began to communicate with other users, and the center of gravity of content production shifted from the platform to humans. Unlike Web1 portals that users only consume, Web2 relies heavily on user-generated content.

**Conclusion**

Web3 is young but quickly evolving. As a result, it currently depends mainly on centralized infrastructure (GitHub, Twitter, Discord, etc.). Many Web3 companies are rushing to fill these gaps, but building high-quality, reliable infrastructure takes time. As the the infrastracture used to support it is continuously being improved, the future of web looks bright.
React component library Concis, looking for interested small partners in the community to join...
Tags: react, javascript, opensource
Published: 2022-10-22 15:28:08

# What is Concis?

A brief introduction for those who are not familiar with this project. Concis is a lightweight component library developed based on React+TypeScript. It fully embraces the React ecosystem and supports new React features (hooks/redux) to pursue lightweight components. Component volume, simple use, minimal thinking burden.




![image.png](https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/efba7348d75b40e4b1b4ce22d9d79eed~tplv-k3u1fbpfcp-watermark.image?)

[Github](https://github.com/fengxinhhh/Concis)

[Official Documentation](http://react-view-ui.com:92/)

# Why are you looking for teammates?

From the commit record of github, we can know that from Concis init commit to the present, only the bloggers are doing iterative development by themselves, and they use the time outside work to maintain and develop this warehouse. In fact, there are still many places to improve Concis as follows. Bloggers hope to find friends who like toss and study in the community to develop together to create an ecology and community.

# next plan

At present, the component library blogger has sorted out some points that can be started, as follows:

- The number of components is relatively small, and it is expected to expand to 50~60;
- Mobile terminal series components;
- vscode smart prompt support and some peripheral ecosystems expanded by Concis;
- Component styles require users to provide opinions. If you can make changes based on your own aesthetics, it would be better to mention pr on git;
- some global configuration, such as the overall color of the component library (currently in progress), internationalization, writing unit tests, etc.;
- Some new ideas and new ideas can be raised in the git issue and discussed together;

At present, nearly ten small partners have joined and contributed to Concis. I also hope that Concis can get better and better. After the react direction is improved, it will develop towards the new framework Svelte. If you are interested, please support and contact me. Thank you.

# write at the end
In fact, the blogger was also an inactive user of github before. Since the idea of ​​writing a component library, he has become more and more enthusiastic about the sharing and creation of open source.

I hope that the small partners in the community who are interested can leave me a message through the [issue](https://github.com/fengxinhhh/Concis/issues) of [github](https://github.com/fengxinhhh/Concis). I Will take the initiative and actively contact. If you think this repository is not bad, you can give me a star or tell your friends, I need it to be seen by more people. Work devoutly and be grateful. Thank you.
Day30 of #100DaysOfCode
Tags: 100daysofcode, nextjs, github, javascript
Published: 2022-10-22 15:26:46

🥳🥳🥳

I managed to merged the minor bug issue branch into the production branch and now you can see the changes live! At [Hashing.energy](hashing.energy)

There is still one glaring issue that I still couldn’t manage to fix: the mobile hamburger not working. I did some research and I think I just need add a js script for Flowbite for it to work.

And once that’s done I’ll be ready to work on the company pages and the energy pages! 🥳 Excited to get back to frontend dev lol
How to install the Java JDK on Linux (Debian and Ubuntu)
Tags: java, programming, linux, beginners
Published: 2022-10-22 15:11:47

**To be able to compile your Java code, you'll need the JDK (Java Development Kit) installed on your computer. Follow along to find out how to install the OpenJDK using only two simple commands!**

---

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

---


## Check whether a JDK is already installed
Sometimes, the Java Development Kit is already installed on some systems. To check whether you've already got it, run the following command in your terminal (**CTRL+ALT+T**):

```
javac -version
```
If this command doesn't return an error but something like "javac <some version>", you've already got the JDK.

---


## Installing OpenJDK 💻
_The OpenJDK is a very popular open-source third-party version of the official OracleJDK. It offers the same functionalities as the official one._
Before starting to install it, you should make sure that your system is up to date:

```
sudo apt-get update && sudo apt-get upgrade -y
```
Once you've done that, you can start installing OpenJDK by running the following two commands:

```
sudo apt-get install openjdk-18-jre
sudo apt-get install openjdk-18-jdk
```
As you probably noticed, we're also installing the JRE (Java Runtime Environment) to be able to execute Java programs.
**That's it!**

---

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0yke614tarxg3qskgz20.jpg)

---


## Hint
If you want to read more on this topic and find out how to install the official Oracle JDK on Linux and on Windows, you can have a look at my [complete guide](https://coolplaydev.com/how-to-install-java-jdk).
I created the FASTEST slider library - Blaze Slider
Published: 2022-10-22 15:07:05

Blaze slider is a high-performance JavaScript UI library for creating sliders.

Website: [blaze-slider.dev](https://blaze-slider.dev/)

## The Problem

Existing slider libraries are not designed with performance in mind. They block the main thread for a long time when initializing a slider which results in poor UX and poor [FID](https://web.dev/fid/) metric for your website.

They also create layout shifts that negatively impact the UX and [CLS](https://web.dev/cls/) metric of your website. These libraries don't provide any idiomatic way to reduce the layout shifts.

## The Solution

Blaze slider is built to fix these issues. It can initialize the slider incredibly fast. It initializes the slider **30x faster** than the Slick slider, and **15x faster** than the Swiper slider.

Blaze Slider allows you to specify the layout configuration via CSS variables which enable slider initialization with <span className='wow'>zero layout shifts!</span> - so that your slider will look exactly the same before and after javascript runs.

## Benchmark

| Rank | Library   | Time    | Speed              |
| ---- | --------- | ------- | ------------------ |
| 1    | Blaze ⚡️ | 2.1ms   | **1**x             |
| 2    | Glide     | 12.2ms  | **5.8**x _slower_  |
| 3    | Flickity  | 13.29ms | **6.32**x _slower_ |
| 4    | Swiper    | 29.8ms  | **14.2**x _slower_ |
| 5    | Slick     | 60.0ms  | **28.5**x _slower_ |

Benchmark measures the time taken to create a slider with 10 slides by each slider. Benchmark is measured on Apple M1 Pro CPU with 6X slowdown on Google Chrome 103

See [Benchmark Repo](https://github.com/blaze-slider/blaze-slider/tree/main/benchmark) to see how these libraries are tested

<br/>

## Highlights

- Fastest Slider Library
- Packed with Features
- Zero Layout Shifts
- Full TypeScript support
- CSS Media-Query-based Responsive configuration
- No slide cloning
- Extremely small bundle size (2kB)

<br/>

## Documentation

You can check out the documentation on the website [blaze-slider.dev](https://blaze-slider.dev/)

The documentation is divided into several sections:

- [Getting Start](https://blaze-slider.dev/docs/intro)
- [Installation](http://blaze-slider.dev/docs/installation)
- [Tutorial](https://blaze-slider.dev/docs/category/tutorial)
- [API Reference](https://blaze-slider.dev/docs/category/api)

<br/>

## Framework Integrations

Blaze Slider is framework agnostic - it can work with all frameworks, all it requires is the DOM element on which you want to initialize the slider and configuration object. [Learn More](https://blaze-slider.dev/docs/framework)

Here are some prebuilt integrations:

- React - [react-blaze-slider](https://github.com/blaze-slider/blaze-slider/tree/main/blaze-slider-react)

## License

Blaze-slider is MIT licensed.
Outsourcing V/s ODC
Tags: outsourcing, odc
Published: 2022-10-19 06:31:58

An organization's decision to outsource or set up an offshore development centre (ODC) is usually based on a variety of factors, including cost, capability, capacity, and time-to-market. However, it is important to understand the key differences between these two models before making a decision.

Outsourcing is the process of contracting with a third-party provider to handle all or part of a company's business processes. This can include anything from manufacturing and assembly to customer service and data entry. The key advantage of outsourcing is that it allows organizations to focus on their core competencies while leaving non-core functions to specialists.

ODCs, on the other hand, are built by partnering with a partner in a foreign country. The purpose of an ODC is to provide a cost-effective way to tap into a global talent pool and deliver high-quality software products and services. ODCs typically have their own staff and infrastructure, which can offer a number of advantages, including greater control and flexibility.

So, which model is right for your organization? The answer depends on your specific needs and objectives. If cost is your primary concern, outsourcing may be the way to go. But if you need more control over the quality and delivery of your software products and services, an ODC may be a better option.

Accoty.com will be your partner in not just building the ODC but also managing it daily.
Change Data Capture - PostgreSQL
Tags: debezium, postgres, cdc, systemdesign
Published: 2022-10-22 14:58:18

**Change Data Capture** is the concept of recording the changes in the database table fields.

- It is very helpful in use cases where we want to track creation, updation, deletion of records in the table.

- We might want to use this information to make changes in other databases or notify customers or notify other services.

- Example: 
   1. Save a copy of this data in a warehouse post transform.
   2. Trigger notification service to notify users about this change.
   3. Cache the data.

## CDC In Postgres
- Using **Notify/Listen**
   - `NOTIFY` provides a mechanism for interprocess communication between the database and the service that is `LISTEN`ing to this notification channel.
   - One or more services could be listening to this notification channel.
   - Name of this channel is usually the name of the database. However the user is free to set suitable names for these channels.
   - Any change in the table is captured by the DB and a trigger is initiated, which calls a function that formats the message to notify.
   - This usually contains the table name and the payload string.
   - The listening server registers to the channel and gets the message from the DB.
   - The service can then use this message and perform operations on it.

#### Pros:
- Simple to implement. Use a trigger and a function to notify. Implement a listen service.

#### Cons:
- Weak reliability. There is always a risk of loss of message especially when the listening service is down. Messages in the queue do not persist.

____________________________________________________________

- Using **Debezium**
   - Debezium is an open source tool used for capturing changes in the database tables based on the WAL (write ahead log).

   - The tool provides connectors to connect to a variety of databases.

   - The _source connector_ is used to capture changes in the source database.

   - The _sync connector_ is used to sync data directly in the destination database. 

#### Pros:
- The changes are persistent as they can be streamed to kafka. Hence highly reliable.

#### Cons:
- Debezium does not take into account changes in the schema, users need to update the schema changes. Otherwise there would be data loss.

____________________________________________________________

Thank you
Aniketh Deshpande
Sending ideas into Google Sheets by emoji reaction from Slack channel
Tags: productivity, beginners
Published: 2022-10-22 14:39:22

Slack is one of the favorite messaging apps for businesses.
It gives us a chatroom shared among all members of an organization.

Have you ever wanted to save good ideas posted in Slack channel into Google Sheets?

Zapier makes it possible.

[📖 Learn more Zapier](https://zapier.com/)

## 1. Sign up for Zapier
Open this link and create your account.
[Zapier | sign up](https://zapier.com/sign-up)

## 2. Create a workflow
You can use this workflow have been already set up.

[Create a row in Google Sheets from Slack messages with new reactions](https://zapier.com/apps/google-sheets/integrations/slack/237182/create-a-row-in-google-sheets-from-slack-messages-with-new-reactions)

Connect Slack and Google Sheets by following the guide Zapier shows.

![Zapier slack reaction](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uo9sp99vetbv2h0rqt0j.png)

Create a new sheet in Google Sheets when you see the bellow screen.

![Zapier Google sheets](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7p9irf30d2u5l7p8z3f7.png)

You need to add header items like this and delete rows after the second row.

| Contributor    |   Idea    |
| ----------- | :---------: | 
| Message user name | Message text | 

![Google Sheets](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kbntu0jyufnn8c24racw.png)

Set `Message user name` and `Message text` received from slack into the input fields of Zapier.

![Zapier message fields](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ovqlgjf9dmtuz9leh3j0.png)

## 3. Test workflow action
Let's test your workflow action!

## 4. Publish your workflow
Publish your workflow after the workflow test.

![Zapier publish](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5vkqqaayyyp55rhrtwu5.png)

## Conclusion
I hope this tutorial will help your team to collect ideas and issues.