teleren/devto huggingface dataset:
Adding opacity to hex colors
Tags: themes, opacity, hexcolors, reactjss
Published: 2023-08-04 14:01:23

We usually use `rgba` to add opacity to colors.
But recently I was working on a project which all the colors were defined in a theme object with in hex format.
like this:
```ts
export type ThemeItem = {
  loader:string;
}

 const darkTheme = {
  loader: "#ffffff",
};

 const lightTheme = {
  loader: "#000000",
};
```
After a short talk with designer I figured out that every color in the theme object can have different opacity like 10% or 20% ...

For adding this functionality to our design system I added this function according to [this stack overflow answer](https://stackoverflow.com/a/68398236/9611909):
```ts
export function addOpacityToColor(color: string, opacity: number) {
  const _opacity = Math.round(Math.min(Math.max(opacity || 1, 0), 1) * 255);
  return color + _opacity.toString(16).toUpperCase();
}
```
and we can use it this way:
```ts
addOpacityToColor(theme.green, 0.3)
```

[Here](https://www.digitalocean.com/community/tutorials/css-hex-code-colors-alpha-values#adding-an-alpha-value-to-css-hex-codes) you can read more about adding alpha value to css hex codes
Kemudahan yang didapat saat menggunakan Laravel ORM
Published: 2023-08-04 13:58:57

Laravel adalah salah satu framework PHP yang paling populer dan banyak digunakan di dunia web development. Salah satu fitur paling powerful yang ditawarkan oleh Laravel adalah ORM (Object-Relational Mapping). ORM memungkinkan pengembang untuk berinteraksi dengan basis data menggunakan objek dan bahasa pemrograman yang familiar, tanpa perlu menulis kueri SQL secara manual. Dalam artikel ini, kita akan membahas tentang kemudahan yang didapat saat menggunakan Laravel ORM.

1. Simplicity (Kesederhanaan)

Salah satu aspek utama dari Laravel ORM adalah kesederhanaan penggunaannya. Laravel menyediakan Eloquent, ORM bawaan yang memungkinkan kita untuk berinteraksi dengan basis data menggunakan model dan metode ORM. Proses pembuatan model dan mendefinisikan relasi basis data menjadi sangat mudah dengan sintaks yang sederhana dan mudah dimengerti.

Contoh sederhana penggunaan Eloquent di Laravel:
Most commonly used Git commands
Tags: webdev, beginners, tutorial, github
Published: 2023-08-04 13:52:05

Hey fellow developers!

If you're looking to level up your Git game, I've got you covered! I've written a blog on "Most commonly used Git commands" that I believe will be incredibly helpful for you.

In this blog, I've compiled a list of essential Git commands that you'll be using frequently in your everyday development tasks. Whether you're a beginner or an experienced developer, mastering these commands will make your version control workflows a breeze.

Check it out here: [Most commonly used Git commands](https://gaurav-shrivastava.hashnode.dev/most-commonly-used-git-commands)

I hope you find it valuable and that it helps streamline your Git workflow. Happy coding !😊😊
End-to-end No-Code SaaS solutions
Tags: webdev, javascript, beginners, programming
Published: 2023-08-04 13:30:00

## End-to-End No-Code SaaS Solutions: Empowering Your Enterprise System

**Introduction:**

[Value On Board](https://www.aiforme.wiki/ai/tools/value%20on%20board) offers comprehensive no-code SaaS solutions, swiftly and efficiently creating tailored enterprise systems based on your specific needs. With a focus on customer-centricity, flexibility, and scalability, our platform addresses the common challenges faced during custom enterprise system development, ensuring a seamless and user-friendly experience for all.

**Addressing Common Challenges:**

**Lack of Technical Knowledge:**
Our flexible platform eliminates the need for complex technical expertise. You can effortlessly create your business application with ChatGPT AI support, revolutionizing information analysis and decision-making.

**Achieving Results in a Short Time:**
With our no-code platform, you witness quick results, eliminating the long waiting time for your system's readiness. This time and energy can be redirected to fueling your business growth.

**Flexibility and Scalability:**
We automate your enterprise system to be fully flexible and scalable. Customize processes to align with your needs, promoting efficiency, resource optimization, and rapid adaptability to business challenges.

**Our Solution:** 
Large-Company Precision, Startup-Like Flexibility

**Funnel Automation:**
Transparently automate complex processes, streamlining task assignment, status management, CRM, and more.

**Integrated ChatGPT:**
Accelerate business decision-making with effective analysis, providing enhanced efficiency and accuracy through easy integration.

**Email Automations:**
Optimize sales opportunities with automated quote sending, follow-ups, and satisfaction measurement.

**Intelligent Chatbot:**
Enhance customer engagement with over 1 million conducted chat conversations, embedded into websites and optimized for mobile devices.

**Analytics:**
Data-driven insights facilitate decision-making, automatically generating Sales & Marketing KPIs, forecasts, and profit calculations.

**Integrated & Customizable:**
Seamlessly connect with your existing systems via API, and enjoy the benefits of no-code customization.

**Conclusion:**

[Value On Board](https://www.aiforme.wiki/ai/tools/value%20on%20board)'s end-to-end no-code SaaS solutions empower your enterprise system with precision and flexibility. Overcome technical challenges, achieve quick results, and adapt to changing business needs effortlessly. 

Experience the power of intelligent automation, enhanced analytics, and seamless integration, all tailored to your unique requirements. Embrace our innovative platform to unleash the full potential of your enterprise and drive business growth with ease.
Day 19: Retry
Tags: day19, 100daysofcode, javascript
Published: 2023-08-04 13:30:00

# Question
Write a function `retryAsyncOperation` that takes an asynchronous operation represented as a Promise and retries it a certain number of times before rejecting the Promise.

```javascript
function retryAsyncOperation(asyncFunction, retries, delay) {
    // Your code here
}

// Example usage
function simulateAsyncOperation() {
    return new Promise((resolve, reject) => {
        const success = Math.random() < 0.5; // Simulating success half of the time
        setTimeout(() => {
            if (success) {
                resolve("Success");
            } else {
                reject("Error");
            }
        }, 1000);
    });
}

retryAsyncOperation(simulateAsyncOperation, 3, 1000)
    .then(result => console.log("Result:", result))
    .catch(error => console.error("All attempts failed:", error));
```
#Genesis Resurgence
Tags: opensource, typescript, security, github
Published: 2023-08-04 12:42:42

https://github.com/xowlpost #Genesis Resurgence Collection

Welcome to the Genesis Resurgence Collection, a unique project that combines the world of NFTs with engaging and strategic gameplay.

## Project Overview

The Genesis Resurgence Collection is an NFT collection featuring unique artworks and gameplay.

But these aren't just any NFTs. Each one also plays a role in our community-developed game, which challenges players to think strategically and solve problems as they complete a series of missions. Win the game, and you could even earn unique prizes like rare NFTs and other rewards.

This project has a few key goals:

- Showcase the capabilities of the Elrond blockchain and 
  NFTony's test environment for minting and distributing 
  NFTs
- Engage our community with a fun and challenging gaming 
  experience
- Inspire others to explore the possibilities of NFTs and 
  _****_blockchain technology

## Gameplay

In the game, each mission is a new opportunity to test your skills and earn rewards. Use your NFTs' unique attributes to your advantage as you navigate challenges and try to outsmart your opponents. More details on gameplay and how to participate will be released soon.
Why I failed to launch on Appsumo
Published: 2023-08-08 11:01:18

---
title: Why I failed to launch on Appsumo
published: true
date: 2023-08-04 12:41:19 UTC
tags: 
canonical_url: https://blog.arbaaz.io/p/why-we-failed-to-launch-on-appsumo
---

From my experience, Appsumo is a good platform for driving traffic.

I attempted to submit [neetoCal](https://neeto.com/neetocal), to Appsumo. 

Unfortunately, after waiting for several weeks, my submission was not approved. When we inquired with the Business Development Team, they explained that since 95% of the features of neetoCal are in the free plan, it did not meet the requirements for a deal on Appsumo. They suggested pricing it at $29, similar to Tidycal (by Appsumo), and launching it on the platform. 

I understand where Appsumo is coming from. However, neetoCal’s pricing reflects our belief that scheduling software is a commodity and thus should be [priced as a commodity](https://blog.neeto.com/p/neetocal-a-calendly-alternative-is).

If you're interested, here's the deal that you missed [https://www.neeto.com/neetocal](https://www.neeto.com/neetocal).
Headless CMSs go head to head: Strapi vs DatoCMS
Tags: headlesscms, opensource, webdev
Published: 2023-08-04 12:31:12

Strapi is an open source headless CMS. Its main benefits are solid migrations, option to self host and excellent extensibility. In this blog post, we compare Strapi to DatoCMS, our favourite headless CMS (and in our humble opinion, the best).

Our verdict is that Strapi is the best choice if you want to bring your own database and hosting or need severe UI customisation. For most straightforward projects without specific requirements, DatoCMS is the way. Let’s dive in!

https://www.voorhoede.nl/en/blog/headless-cmss-go-head-to-head-strapi-vs-datocms/
Managing UDFs in dbt
Tags: dbt, sql, bigquery, gcp
Published: 2023-08-04 11:53:15

TLDR; 
I used dbt's `macro` and `on-run-end` hook to create UDFs in BigQuery.

I rencetly had a uses case where we were migrating a customer warehouse to dbt. UDFs were widely used and we wanted to preserve them to make the migration easier. 

However dbt does not have any special way of managing UDFs. This mean that you need to write the DDL (data definition language) to`CREATE` and`DROP` the UDFs yourself 😱

Here is a solution that I borrowed and adjusted from dbt's [forum](https://discourse.getdbt.com/t/using-dbt-to-manage-user-defined-functions/18):

## The code

`dbt/macros/udfs/clean_dates.sql`:
```sql
{% macro create_clean_dates() %}
    CREATE OR REPLACE FUNCTION 
    {{ target.schema }}.clean_dates(d STRING) 
    RETURNS DATE AS (
    SAFE.PARSE_DATE(
    "%Y/%m/%d",
    REGEXP_REPLACE(d, r"\-", "/")
    )
    )
{% endmacro %}
```
* one file per UDF makes it easier for a developer to quickly find the code when they need to make changes

`dbt/macros/create_udfs.sql`:
```sql
{% macro create_udfs() %}

create schema if not exists {{target.schema}};
{{create_clean_dates()}};
...
{% endmacro %}
```
* I use PyCharm's `Edit-> Sort Lines` to keep UDFs sorted alphabetically
* I add the semicolon `;` here but you can do that in the macro as well, doesn't matter, as long as you are consistent.

`dbt/dbt_project.yml`:
```yaml
...
on-run-start:
  - '{{ create_udfs() }}'
```
* These two lines make sure that the UDFs are created before any dbt models are run/built. The only downside is that it adds some time to your dbt build. 

## Naming conventions

We have implemented the following naming conventions to make support easier:

For the example in our UDF `clean_dates` we do the following:

1. File has the same name as the UDF: `clean_dates.sql` 
2. The macro is called `create_clean_dates` as it makes it easier to distinguish the UDF from the macro
3. All UDFs are created in the same dataset `target.schema`, which will default to `dbt`. This makes it easier to 

References:
https://discourse.getdbt.com/t/using-dbt-to-manage-user-defined-functions/18
🌟An open source solution in React to create a control panel in project quickly🌟
Tags: webdev, frontend, opensource, react
Published: 2023-08-04 12:29:07

Hi! We, as an outsourced company, have released an open source solution in React for developers that allows you to quickly create a beautiful control panel in the project and CRUD in it, but if you want you can make completely custom interfaces as well. 

For whom:
- For those who need to frequently create a control panel in projects
- Those who want custom solutions, but don't want to use box solutions, but don't have money/time to develop them from scratch.
- Those who don't have time to deal with existing solutions, which require a lot of time and effort to study

If you're already interested, check out the link https://github.com/dev-family/admiral 
If you still don't understand anything, read the text below.

The features:
📀 Out-of-the-box React components used.
⚙️ It doesn't matter what the back-end is written on, only the REST API is needed from it.
🛡 It is written in TypeScript and has built-in typing.
👨‍💻 Adaptive design: The library interface scales to any screen size. This is convenient when used on mobile devices.
🌍 Localization: we support different languages.
👨‍🎨 An interface that is intuitively easy to work with.
🎨 Different design themes: you can change the color scheme of the interface to suit your needs.

If you liked it, we'd love a star on GitHub and a recommendation to those who have similar pains. I'd be happy to get feedback.
Migrations in Django
Tags: django, python, beginners, programming
Published: 2023-08-04 12:22:38


Migrations are Django’s way of propagating changes you make to your models (adding a field, deleting a model, etc.) into your database schema. They’re designed to be mostly automatic, but you’ll need to know when to make migrations, when to run them, and the common problems you might run into.

**The Commands¶**
There are several commands which you will use to interact with migrations and Django’s handling of database schema:

**migrate**, which is responsible for applying and unapplying migrations.
**makemigrations,** which is responsible for creating new migrations based on the changes you have made to your models.
**sqlmigrate**, which displays the SQL statements for a migration.
**showmigrations**, which lists a project’s migrations and their status.
You should think of migrations as a version control system for your database schema. **makemigrations **is responsible for packaging up your model changes into individual migration files - analogous to commits - and migrate is responsible for applying those to your database.

The migration files for each app live in a “migrations” directory inside of that app, and are designed to be committed to, and distributed as part of, its codebase. You should be making them once on your development machine and then running the same migrations on your colleagues’ machines, your staging machines, and eventually your production machines.

Migrations will run the same way on the same dataset and produce consistent results, meaning that what you see in development and staging is, under the same circumstances, exactly what will happen in production.

Django will make migrations for any change to your models or fields - even options that don’t affect the database - as the only way it can reconstruct a field correctly is to have all the changes in the history, and you might need those options in some data migrations later on (for example, if you’ve set custom validators).

Happy Coding!!
Make your own Artisan script
Tags: php, laravel, tutorial
Published: 2023-08-04 12:19:42

TL;DR : How to use the `php artisan` command line without using the word `artisan`.
 
&nbsp;
&nbsp;

You can find a Laravel Project example on our [Github Repository.](https://github.com/capsulescodes/articles)

&nbsp;
&nbsp;

Every Laravel artisan will recognize the `php artisan inspire` command. But not everyone might realize that this command can be customized.

&nbsp;
&nbsp;

The unspeakable secret: modifying the artisan file at the root of the project.

&nbsp;

```
mv ./artisan ./is-dead
```

&nbsp;
&nbsp;

Incredible! The command `php is-dead inspire` will from now on work just as well as the initial `php artisan inspire` command.

&nbsp;
&nbsp;

We could put a stop to this drama right here, you might say, but we will go further.

&nbsp;
&nbsp;

Some of you may already know, but it's also possible to call the Artisan command via the `Facade\Artisan` as shown below in the `console.php` routes file

&nbsp;

```php
Artisan::command( 'inspire', function () {
    $this->comment( Inspiring::quote() );
})->purpose( 'Display an inspiring quote' );
```

&nbsp;
&nbsp;

All that would then be needed is to copy the `/vendor/laravel/framework/Illuminate/Support/Facades/Artisan.php` file.

&nbsp;

```php
<?php

namespace Illuminate\Support\Facades;

use Illuminate\Contracts\Console\Kernel as ConsoleKernelContract;

class Artisan extends Facade
{
    protected static function getFacadeAccessor()
    {
        return ConsoleKernelContract::class;
    }
}
```

&nbsp;
&nbsp;

And then modify the relevant information in a new file [ and folder ] in `app/Facades/IsDead.php`.

&nbsp;

```php
<?php

namespace App\Facades;

use Illuminate\Support\Facades\Facade;
use Illuminate\Contracts\Console\Kernel;

class IsDead extends Facade
{
    protected static function getFacadeAccessor() : string
    {
        return Kernel::class;
    }
}

```

&nbsp;
&nbsp;

To then be able to use it in your code, you need to inject the alias into the list of aliases in the configuration file `config/app.php`.

&nbsp;

```php
'aliases' => Facade::defaultAliases()->merge( [
        'IsDead' => App\Facades\IsDead::class
    ] )->toArray(),
```

&nbsp;
&nbsp;

Let's modify the inspire method in `routes/console.php` so we can read it in tinker.

&nbsp;

```php
use Illuminate\Foundation\Inspiring;
use App\\Facades\IsDead;

IsDead::command( 'inspire', function () {
   echo Inspiring::quotes()->random();
})->purpose( 'Display an inspiring quote' );
```

&nbsp;
&nbsp;

Now, all that's left is to use it in `php is-dead tinker`.

&nbsp;

```
IsDead::call( 'inspire' );
```

&nbsp;
&nbsp;

Glad this helped.

&nbsp;
&nbsp;

Find out more on [Capsules](https://capsules.codes) or [X](https://x.com/capsulescodes)
Azure active directory SSO
Tags: aad, azure, sso, oauth
Published: 2023-08-04 12:01:24

Hi all, I am trying to authenticate jwt token using single sign on in azure active directory. So i am able to login in frontend using angular msal2 package and i am able to get the token but when i try to integrate with the nodejs application(backend) to authorize the protected api it's saying unauthorized.

This is the tutorial which i was watching

https://fluentjs.medium.com/angular-spa-and-node-js-api-with-azure-ad-for-authentication-in-2021-b2974666c2eb
Open-Source Flutter Passkeys Package
Tags: flutter, opensource, passkeys, authentication
Published: 2023-08-04 12:00:54

In the evolving landscape of digital security, passkeys are emerging as a robust and user-friendly authentication method. Our recent blog post delves into the architecture of our open-source Flutter passkeys package, designed to streamline the integration of passkeys into your Flutter apps.

[GitHub repository](https://github.com/corbado/flutter-passkeys)
[pub.dev](https://pub.dev/packages/passkeys)


## Understanding Passkeys

Passkeys offer a departure from traditional password-based authentication systems. With passkeys, the user creates a public/private key pair during the sign-up process. The public key is stored on a backend server, known as the “relying party server”, while the private key is securely kept on the user’s device.

During each login, the client app requests a cryptographic challenge from the relying party server. This challenge can only be solved using the private key, which is protected by the user’s biometrics, such as Face ID or Touch ID. Once the user’s identity is verified, the device signs the challenge and sends it back to the server.


## The Flutter Passkeys Package

Our Flutter passkeys package simplifies the process of integrating passkey authentication into your Flutter apps. It abstracts and connects two key components: the authenticator and the relying party server. The authenticator leverages OS functionalities to create a passkey and sign passkey challenges, while the relying party server manages the storage and retrieval of public keys.


## Implementing Passkeys in Flutter

The package includes an [example project](https://github.com/corbado/flutter-passkeys/tree/main/packages/passkeys/passkeys/example) that you can clone to your machine. This project demonstrates how to set up a UI for login, sign-up, and logged-in states, and how to perform passkey authentication. When the user clicks on the login or sign-up button, the respective action is performed, and the widget is updated once the result is available.

## Customizing the Package

The package is designed to be flexible and customizable. You can add native plugins for making Flutter passkeys available e.g. for macOS, Windows or web app. Besides that, you can also integrate your own passkey backend or use hosted one (e.g. from [Corbado](https://www.corbado.com/)) giving you maximum flexibility.

To learn more about the detailed implementation and to explore the full capabilities of our Flutter passkeys package, check out [pub.dev](https://pub.dev/packages/passkeys). Discover how passkeys can enhance the security and user experience of your Flutter apps.
Who's looking for open source contributors? (week 53)
Tags: discuss, opensource, contributorswanted, codenewbie
Published: 2023-08-04 12:00:00

---
title: Who's looking for open source contributors? (week 53)
series: Looking for Contributors
published: true
description: Discover which open source projects are actively seeking contributors. Learn how you can make a meaningful contribution to the open source community and gain valuable experience. Find out who's looking for open source contributors now.
tags: discuss, opensource, contributorswanted, codenewbie
# cover_image: https://direct_url_to_image.jpg
# Use a ratio of 100:42 for best results.
published_at: 2023-08-04 12:00 +0000
---
Open Source thrives through shared efforts. Whether you're a newcomer or a veteran, we're here to encourage your contributions, motivate your endeavors, and provide valuable assistance to maintainers. Together, we are building amazing things!

## Tell us about your project
_Promote your project by providing a link to the repo. Everyone who posted in previous weeks is welcome back this week, as always 😄_

Open Source should be a welcoming space for contributors. The README is the front door of your project. If you'd like to check out an example of a README, here's our [OpenSauced/insights README](https://github.com/open-sauced/insights).

If you submit please have the following in your repo to make it welcoming and helpful for contributors:

1. README.md
2. CONTRIBUTING.md

Feel free to drop your issues and repos in the [OpenSauced Discord](https://discord.gg/opensauced) #:eyes:-looking-for-contributors channel at any time! 

If you're new to open source, and you're not sure where to start, check out our [Intro to Open Source course](https://github.com/open-sauced/intro). 

Finally, consider reading the [Best Practices for Maintainers](https://opensource.guide/best-practices/).

Just a note to say, we've restarted this post from something Ben was doing for a while :star-struck: 

Happy coding!
Is a Degree worth it?
Tags: webdev, motivation
Published: 2023-08-04 11:34:00

We come from two different backgrounds. One has a degree while the other is self taught. It was interesting to talk about how our backgrounds really impacted breaking into and staying in the field.

https://youtu.be/HgEk6spgSFc

{% youtube https://youtu.be/HgEk6spgSFc %}