teleren/devto huggingface dataset:
How to use Password Reset API in Supabase Auth with the help of nextjs?
Tags: nextjs, supabase, authentication
Published: 2022-06-01 09:16:40

Hi 👋 brothers and sisters, in this blog, I would tell you how you can use the password reset in supabase auth API.

🌋🌋🌋Firstly, you need to implement the basic supabase in nextjs.

After you have implemented auth in your next js app.

Then you need to make a reset.jsx in your pages folder. This file will be the route for the user to submit the email and click the button to send a password recovery email. Then paste this 👇 code.
{% gist https://gist.github.com/studywithdesign/e9f6a548e4b70c521b09557dd325dbea.js %}
Now, we have to make our password-reset.jsx file in pages folder.
{% gist https://gist.github.com/studywithdesign/a72f29d7daa01db80d45d75c2a7dcba3.js %}
Now you can actually change your password by 👇:

 1. Go to[http://localhost:3000/reset#](http://localhost:3000/reset#)

 2. Then submit your email

 3. Then go to Gmail or where you will receive an email (from noreply)

 4. Then click on the link provided by supabase

 5. Then give your new password

If you have faced any error or difficulty, feel free to put questions here:
[**Join the Next Dev's server Discord Server!**](https://discord.gg/hN4Wc5VR4M)

Congratulations 🤓🤓!!!!
Dream Job vs. Tech Job?
Tags: discuss, career, help
Published: 2022-06-01 09:02:27

Hello Devs!

I have recently stumbled upon a dilemma which I would appreciate your input. 

Since I was a kid I had in mind a job which I would have liked to dedicate my life to. However the chances of getting that job were 15 out of 1000 people, so I gave up that dream because of the minimal odds of acceptance and followed my second passion which was technology. Now I have dedicated my entire studies and life to tech and managed to get a job in a FAANG company starting in **September**. It’s worth noting that I am very passionate and love tech, coding and the community. 

However, one day I decided to interview for my dream job as well. This interview process is very lengthy and is done once every 2 years. Without believing it I got an offer again starting in **September**. 

So I am asking what would you do. Would you take a job at FAANG which you know dedicated and studied for a long time or would you reject the FAANG offer and accept your dream job?


Any feedback is appreciated! 😀
Extending components, directives and services in Angular 14
Tags: angular, typescript, webdev
Published: 2022-06-01 08:40:59

First, avoid it as much as possible. Extending components by itself is bad practice because it’s confusing code and adds more issues than actually helps. However, sometimes it can be helpful to combine common logic of similar components or directives into abstract class that they all will extend.

Let’s say, we have two components like this:
{% embed https://gist.github.com/agroupp/b4ffa7e79cdf7a1e88fd41d0a18270c2.js %}

Of course, these components can be combined into one, but let’s assume that this is not the case and they have much more logic and templates specific to each.

Let’s modify our components and put shared logic into abstract base class that they will extend.
{% embed https://gist.github.com/agroupp/8962e038d844c24eadec044de570b77f.js %}
Much DRYer. The problem with this approach is dependencies. Since our base class has dependencies, it can’t inject it by itself because it doesn’t exist. Therefore, we must inject all those dependencies by ourselves in child classes and supply it to `super()`. 
    
##Inject function

Starting with version 14 of Angular we can use function `inject()` to obtain instances of injection tokens in other functions, components, services, almost everywhere. This opens us great possibility to avoid repeating of these injections in derived classes. From now on, we can add static method to our base class that will initialize its dependencies.
{% embed https://gist.github.com/agroupp/331ecd70b36e15f7ccb29c1fba6bb5dc.js %}
     
##Conclusion

I widely use abstractions and this feature excited me much. I was looking for the ability to avoid manual injections for a long time and now here it is.


Photo by Andrew Seaman on Unsplash
Failed to Install mariadb-server Fedora35?
Tags: linux, mysql, beginners
Published: 2022-06-01 08:36:34

I try to install mariadb-server following this [docs.fedoraproject.org](https://docs.fedoraproject.org/en-US/quick-docs/installing-mysql-mariadb/) and i have error
![mariadb instalation error](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cf8oh6dmgdr7ge5yq83n.png)
I asked the community for help..

So to install mariadb-server is very easy because it is already in the official repository fedora35 ehehe,, so use this code

```
sudo dnf install mariadb-server
```

Use this to start

```
sudo systemctl enable mariadb
```

And use this to enable on system startup

```
sudo systemctl enable mariadb
```
if you have already installed a third-party repository then delete the repository first ([use this](https://dev.to/bukanspot/remove-repository-linux-jed)) and then continue to install

---
### Reference
- [fedora discord community](https://discord.com/invite/fedora)
- [docs.fedoraproject.org](https://docs.fedoraproject.org/en-US/quick-docs/installing-mysql-mariadb/)
JavaScript Array Methods : Shift()
Tags: javascript, beginners, programming, array
Published: 2022-06-01 08:18:44

The shift() method removes the first element from an array and returns that removed element. This method changes the length of the array.

```
const array1 = [1, 2, 3];

const firstElement = array1.shift();

console.log(array1);
//output: Array [2, 3]

console.log(firstElement);
//output: 1

```

![Shift](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xevuswnq7tn6hc5wc5t6.png)
4 Helpful Javascript Array tricks you should know
Tags: javascript, react, webdev, programming
Published: 2022-06-01 08:17:54


An array is one of the most common concepts of Javascript, which gives us a lot of possibilities to work with data. Check these tricks which can be very helpful!

👉 𝗟𝗲𝘁’𝘀 𝗴𝗲𝘁 𝘀𝘁𝗮𝗿𝘁𝗲𝗱 🧑‍💻

🌶️ 𝗛𝗼𝘄 𝘁𝗼 𝗿𝗲𝗺𝗼𝘃𝗲 𝗳𝗮𝗹𝘀𝘆 𝘃𝗮𝗹𝘂𝗲𝘀 𝗳𝗿𝗼𝗺 𝗮𝗻 𝗮𝗿𝗿𝗮𝘆 𝗶𝗻 𝗝𝗮𝘃𝗮𝗦𝗰𝗿𝗶𝗽𝘁.
In #javascript falsy values are false, 0, ” ", null, NaN, undefined. Now we can find out how to remove this kind of value from our array. To achieve this, we are going to use the .filter().🚀

🌶️ 𝗛𝗼𝘄 𝘁𝗼 𝗴𝗲𝘁 𝗮 𝗿𝗮𝗻𝗱𝗼𝗺 𝗲𝗹𝗲𝗺𝗲𝗻𝘁 𝗳𝗿𝗼𝗺 𝗮𝗻 𝗮𝗿𝗿𝗮𝘆 𝗶𝗻 𝗝𝗮𝘃𝗮𝗦𝗰𝗿𝗶𝗽𝘁.
Sometimes we need to select a value from the array randomly. To create it, we can get a random index number according to the array length.🚀

🌶️ 𝗛𝗼𝘄 𝘁𝗼 𝗦𝗵𝘂𝗳𝗳𝗹𝗲 𝗮𝗻 𝗔𝗿𝗿𝗮𝘆 𝗶𝗻 𝗝𝗮𝘃𝗮𝗦𝗰𝗿𝗶𝗽𝘁
Shuffling is easy with the sort method. As long as it returns a random number, positive or negative, we can sort it with a random order.🚀

🌶️ 𝗛𝗼𝘄 𝘁𝗼 𝗙𝗶𝗻𝗱 𝘁𝗵𝗲 𝗶𝗻𝘁𝗲𝗿𝘀𝗲𝗰𝘁𝗶𝗼𝗻 𝗼𝗳 𝘁𝘄𝗼 𝗮𝗿𝗿𝗮𝘆𝘀 𝗶𝗻 𝗝𝗮𝘃𝗮𝗦𝗰𝗿𝗶𝗽𝘁.
We can use a Set() to ensure that values in the array we are checking are not duplicated, and we will use .filter and .includes methods. As a result, we will get the array with values that were presented in both arrays.🚀


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cx0157ri78ndf06kwl0i.jpeg)
How to horizontally center an element without Flex
Tags: css, html, webdev, jetthoughts
Published: 2022-06-01 08:10:19

Centered elements with Flex it is very easy to style, what about not use Flex?
```html
<div class="wrapper">
  <div class="inner">Centered</div>
</div>
```

## Table
It will make the inner element center horizontally and it works without setting a specific width.
```css
.wrapper {
  display: table;
  margin: 0 auto;
}
```

## Fixed width
Need to apply this CSS to the inner. You should set any width less than the containing wrapper will work. The `margin: 0` auto is what does the actual centering.
```css
.inner {
  max-width: 25%;
  margin: 0 auto;
}
```

## Display: Inline-Block
`display: inline-block` makes the inner element into an inline element that can be centered with `text-align: center`
```css
.wrapper {
  text-align: center;
}

.inner {
  display: inline-block;
}
```
Impostor Syndrome in software engineering and how to deal with it.
Tags: motivation, programming, devjournal, productivity
Published: 2022-06-01 08:04:09

Life has been a roller coaster since I started programming. One minute you feel like a god after solving a stupid type error the next you feel like a total idiot after not being able to solve a failed unit test caused by a typo. 24/7 you're a constant victim of the [Dunning–Kruger effect](https://en.wikipedia.org/wiki/Dunning%E2%80%93Kruger_effect).
It's really hard to understand how much you know about a subject. I've doubted myself countless times and was scared if I could even survive as a software engineer. But we always get by. Thats just the nature of learning and staying relevant in this industry. The key is to be humble but never doubt yourself. Keep on learning and never bottle up your problems. Ask someone about the problem you have and constantly ask for feedback, it will substantially help you grow. The more you grow the more you understand where you are and the path necessary to grow and succeed.
Today's Fun Joke For Developers - Daily Developer Jokes
Tags: jokes, dailydeveloperjokes
Published: 2022-06-01 08:00:25

---
title: "Today's Fun Joke For Developers - Daily Developer Jokes"
description: "Check out today's daily developer joke! (a project by Fred Adams at xtrp.io)"
series: "Daily Developer Jokes"
published: true
tags: #jokes, #dailydeveloperjokes
---

Hi there! Here's today's Daily Developer Joke. We hope you enjoy it; it's a good one.

![Joke Image](https://private.xtrp.io/projects/DailyDeveloperJokes/public_image_server/images/5e12588f481d4.png)

---

For more jokes, and to submit your own joke to get featured, check out the [Daily Developer Jokes Website](https://dailydeveloperjokes.github.io/). We're also open sourced, so feel free to view [our GitHub Profile](https://github.com/dailydeveloperjokes).

### Leave this post a ❤️ if you liked today's joke, and stay tuned for tomorrow's joke too!

_This joke comes from [Dad-Jokes GitHub Repo by Wes Bos](https://github.com/wesbos/dad-jokes) (thank you!), whose owner has given me permission to use this joke with credit._

<!--
Joke text:
___Q:___ How many Prolog programmers does it take to change a lightbulb?

___A:___ Yes.
 -->
Common Android Studio Project setups headaches
Tags: android, gradle, kotlin
Published: 2022-06-01 06:45:30

Red lines in gradle scripts 
* Simply restart AS first
* Delete the auto-generated .gradle and .idea folders, then invalidate and restart with clean cache checkbox checked. Don't forget that sub-modules also have their own .gradle directory. You should also delete those.
* Try to rebuild the sample project using a different AS version. As an android develooper, I suppose it is not uncommon to have more than one AS version

Toml dependency file not being detected
* Make sure your gradle version is greater than 7.2
* Manually create the toml file, then copy paste dependency into file. I have noticed that sometimes, copy pasting the actual file makes it not to be detected. (weird Android Studio things)

Unable to run test script due to green arrow not showing

For unmentioned errors, try invalidate and restart caches. I suppose I don't have to say to make sure your code is not the problem :-)
IT ASSET MANAGEMENT -bare basics
Tags: it, servicedesk
Published: 2022-06-01 06:45:22

IT assets, what are they, how do they end up in your organization/company and how do you manage them for better perfomance and produtivity? .-IT asset is a peae of software/hardware within an IT echo system.
As an IT custodian, it is your responsibility to ensure the existing assets are useful and valuable to the organization.

ITAM is a business process to ensure that IT assets are acounted for, intergrated, maintained/upgraded and desposed effectively.

ITAM process involves five key phases:
* planning
* Developing/Acquiring
* Integration
* Maintenance/upgrade
* Disposal

##**plannig**
This is the begining phase of introduing an asset to the echosystem. It involves strategic planning across the organization to determine what asset is needed, how to procure it, the specific way it will be used and how it will be funded. This often includes total cost of ownership estimates and a cost-benefit analysis of alternatives.

##**Developing/Acquiring**
After planning and knowing the right asset that is needed, the next phase is the procument in which the organization build, purchase, lease or license the asset they need.

##**Integration**
This follow the procurement phase. During which the asset is introduced into the ecosystem of the organization.It includes intergrating the asset with other components, establishing support and operations processes and specifying user access.

##**Maintenance/upgrade**
Once the asset is fully intergrated in the echosystem and is being utilised, to maximize its value and extend its life as well as mitigate risk and reduce support costs, maintenance, repair and extensive overhauls may be necessary.

##**Disposal**
When the asset reaches the end of its useful life, the last phase is disposal. This includes transitioning users to other resources, updating asset records, canceling support agreements, terminating licences renewals and initiating the planning for replacement asset.

proper understanding and utilization of this phases will enable a smooth running of the IT echosystem .
How to expect partial value in object with Jest
Tags: jest
Published: 2022-06-01 06:33:07

Bad 👎

```ts
expect(spyFunction).toReturn(expectReturn.id)
expect(spyFunction).toReturn(expectReturn.title)
expect(spyFunction).toHaveBeenCalledWith({ 
  ... /* very large object that I didn't care all of em */ 
})
```

Good 👍

```ts
expect(spyFunction).toReturn(expect.objectContain({
  id,
  title,
}))
expect(spyFunction).toHaveBeenCalledWith(
  expect.objectContain({ ... /* some meaningful value */ })
)
```
I made React with a faster Virtual DOM
Tags: react, javascript, webdev, showdev
Published: 2022-06-01 06:04:15

> _Plug: I help develop [`Million`](https://github.com/aidenybai/million): Virtual DOM into the future! 💥🦁✨_

Million is a lightweight (`<1kb`) Virtual DOM. It's [_**really fast**_](https://millionjs.org/benchmarks) and makes it easy to create user interfaces.

> Oh man... Another [`/virtual dom|javascript/gim`](https://regexr.com/6mr5f) library? I'm fine with [React](https://reactjs.org) already, why should I bother switching?

Million makes creating user interfaces as easy as [React](https://reactjs.org), but with faster performance and smaller bundle size for the end user. By computing the user interface beforehand with a compiler, Million reduces the overhead of traditional Virtual DOM.

> Okay cool... but why should I use Million if I can just use [Preact](https://preactjs.com/) if I need something a bit more lightweight?

While alternative libraries like [Preact](https://preactjs.com/) reduce bundle sizes by efficient code design, Million takes it a step further by **leveraging compilation** to make a quantum leap in improving bundle size **and** render speed.

Think of it as if [Preact](https://preactjs.com/) and [Svelte](https://svelte.dev/) had a baby. [A baby with _**super speed! 👶**_](https://millionjs.org/benchmarks)


## Using `million/react`

Here is an extremely simple implementation of a Counter app using Million.

```js
import { compat, createRoot, useState } from 'million/react';

function Counter({ init }) {
  const [value, setValue] = useState(init);

  return (
    <div>
      <div>Counter: {value}</div>
      <button onClick={() => setValue(value + 1)}>Increment</button>
      <button onClick={() => setValue(value - 1)}>Decrement</button>
    </div>
  );
}

const root = createRoot(document.querySelector('#app'));

// Million wraps render functions inside a compat function
compat(() => {
  root.render(<Counter init={0} />);
});
```

Here, you can write React code. Million will automagically optimize it during compile time, allowing for a super speedy Virtual DOM.

Open the project to start tinkering:

[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/aidenybai/million-react-compat)

Need help on using React? Check out the [React documentation](https://beta.reactjs.org/apis).

---

This is very, **VERY** early stage, so be prepared for weird bugs / plugin incompatibility / etc. If you have any suggestions, I'd be more than happy if you replied in a comment with it!
Bootcamp blogging
Published: 2022-05-18 02:51:54

I'm going to start by apologizing since it seems like all I'm doing is complaining or ranting.  Consider yourself warned.  Here goes....

So I'm in a bootcamp that requires the students(?) to make a blog post once per phase.  The blog is supposed to be technical in nature and stick to programming related topics.  "Pick a small topic that you're interested in exploring more, or a concept/technique/technology that you recently learned about that you'd like to cement for yourself."  The only thing is that I'm not sure how much I'm understanding in this bootcamp.  We've gone over so much and over so many concepts that I having trouble keeping them all straight.

So far we've covered JavaScript, HTML and CSS.  It feels like we spent 4 weeks covering a lot of ground on JavaScript and maybe that on HTML and CSS.  This phase has a mock code challenge where we made a webpage using JavaScript, HTML and CSS.  I've googled and YouTube-d everything trying to gain a better understanding but it's not the way I learn things well.  When I do get something it's a kick to actually get whatever it is.  It really excites me.

It's like this - programming is a foreign language.  Bouncing all over a foreign language doesn't help you understand it.  Starting with the basics does.  At no time has it felt like the basics have been taught.  I think this is supposed to be "immersive" but it feels like I'm failing all around.  It feels like I don't know how to use the alphabet or put together a simple sentence.

The thing that is getting to me is that we have a project due and then we have modules and blogs that need to be done as well.  I get that bootcamps are a fast pace way to learn.  I get that there will always be deadlines that have to be met.  However, we just finished week 11 of this bootcamp and some of us are still trying to cement in what we have learned and it doesn't feel like that's  happening or being allowed to happen.  

I'm not dumb by any stretch of the imagination.  I believe that I can learn this but not while drinking from a firehose.  I need that simple garden hose as silly as that sounds.  I'm tired of trying to drink from the firehouse and almost drowning.  It's a lot of money for a company to spend to have so many washout.

Again, my apology for the complaining/rant.  I'll get off the soapbox since someone probably needs the wood.
Raspberry PI Projects
Tags: raspberrypi, electronics, robotics, arduino
Published: 2022-06-01 05:48:35

Engineering student projects for B.Tech and M.Tech final year students. Takeoff Edu Group offers a wide range of projects best for [raspberry pi projects](https://takeoffprojects.com/raspberry-pi-projects) looking for magnificent final projects at low cost. 

We have successfully delivered wind energy projects to our engineering students. Our programs are specially designed by experts for best results of raspberry pi projects for engineering students. max of the B.Tech, M.Tech, PhD and Diploma scholars.
 
Takeoff Edu Group provides the most creative conceptions and ideas that can make very effective final year projects for scholars, experimenters, and engineers. So browse through our list of [raspberry pi projects](https://www.youtube.com/watch?v=_zyMd7Kia38) and choose the smart final year projects for your requirements.


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

Raspberry Pi is the name of a series of single-board computers created by the Raspberry Pi Foundation, a Britain charity that aims to teach folks in computing and make easier access to computing education.

The Raspberry Pi launched in 2012, and there are many iterations and variations discharged since then. the initial Pi had a single-core 700MHz CPU and simply 256MB RAM, and therefore the latest model contains a quad-core CPU continuance in at over 1.5GHz, and 4GB RAM. The worth purpose for Raspberry Pi has continuously been under $100 (usually around $35 USD), most notably the Pi Zero, that prices simply $5.

All over the globe, folks use the Raspberry Pi to be told programming skills, build hardware projects, do home automation, implement Kubernetes clusters and Edge computing, and even use them in industrial applications.
Acquisitions - [Jan - May 2022]
Tags: news, webdev, startup, discuss
Published: 2022-06-01 05:35:10

_Image Credits: [Corporate Finance Institute](https://cdn.corporatefinanceinstitute.com/assets/mergers-and-acquisitions.jpeg)_

Hi there! If you're curious what's happening in the tech world around the latest M&A as of **May 2022**, please continue reading.

### **January**
1. [Citrix acquired by private equity firms Vista Equity Partners & Evergreen Coast Capital for $16.5 billion](https://techcrunch.com/2022/01/31/citrix-to-be-acquired-by-vista-and-evergreen-elliott-in-a-16-5b-all-cash-deal-will-be-merged-with-tibco-to-create-saas-powerhouse/)

2. [Sony announced it’s buying Bungie for $3.6 bilion](https://blog.playstation.com/2022/01/31/bungie-is-joining-playstation/)

3. [Microsoft moves to takeover Activision Blizzard for $69 billion](https://news.microsoft.com/2022/01/18/microsoft-to-acquire-activision-blizzard-to-bring-the-joy-and-community-of-gaming-to-everyone-across-every-device/)

### **February**
1. [Intel does a $5.4bn acquisition of Tower Semiconductor](https://www.intel.com/content/www/us/en/newsroom/news/feb-2022-corporate-news.html)

2. [Akamai Technologies takes over Linode for $900 million](https://www.akamai.com/newsroom/press-release/akamai-to-acquire-linode)

### **March**
1. [HP acquires Poly for $3.3 billion](https://www.crn.com/slide-shows/components-peripherals/hp-s-3-3b-acquisition-of-poly-six-things-you-need-to-know)

2. [Google gets Mandiant for a massive $5.4 billion](https://techcrunch.com/2022/03/08/google-is-acquiring-security-intelligence-firm-mandiant-for-5-4b/)

### **April**
1. [Elon Musk buys out Twitter for $44 billion](https://www.prnewswire.com/news-releases/elon-musk-to-acquire-twitter-301532245.html)

2. [Kaseya does a $6.2 billion purchase of Datto](https://www.datto.com/uk/news/datto-to-be-acquired-by-kaseya-for-6-2-billion-with-funding-led-by-insight-partners)


### **May**
1. [Broadcom buys VMWare for a massive $61 Billion](https://techcrunch.com/2022/05/26/broadcom-to-acquire-vmware-in-massive-61b-deal/)

As most of the world now has been vaccinated against the Covid-19 virus but witnesses armed conflicts, faces economic hardships, layoffs & an existential crisis in some countries, it'd be interesting to notice how these acquisitions shape up. To understand more, I have the following questions for the Dev.to community:

----

- Which of these sides benefits more from these acquisitions & why?
- How is it sustainable in a post-pandemic era, especially now Venture Capital funding has reduced or dried up?
How to Customize the Toolbar in React Rich Text Editor Component
Tags: react, webdev
Published: 2022-06-01 04:59:46

See how easily you can customize a toolbar in the React [Rich Text Editor](https://www.syncfusion.com/react-ui-components/react-wysiwyg-rich-text-editor) component of Syncfusion. This video explains how to customize a toolbar in the Syncfusion React Rich Text Editor component. You will also learn about different types of toolbars and how to add a quick inline toolbar to the component. 

**Product Overview**: https://www.syncfusion.com/react-ui-components/react-wysiwyg-rich-text-editor

**Tutorial videos**: https://www.syncfusion.com/tutorial-videos

**Download a getting started example from GitHub**: https://github.com/SyncfusionExamples... 

{% youtube BklCh--sDms %}