teleren/devto huggingface dataset:
CSS3 Clip-Path Property.
Tags: css, webdev, tutorial, programming
Published: 2021-07-06 15:18:54

I recently learned about the clip-path property in CSS3.

The clip-path creates a clipping region that sets what part of an element should be shown.

This can help in creating really cool slanted Hero sections. The following CSS code snippet will create a slanted hero background section.

```css
clip-path: polygon(0 0, 100% 0, 100% 75vh, 0 100%);
```

![clip-path-image](https://media-exp3.licdn.com/dms/image/C5612AQFA-ONWuU-jow/article-inline_image-shrink_1000_1488/0/1618950115948?e=1631145600&v=beta&t=0uSO8ScJiarrf6FUIxo6bRSEEcznXihYSbrK6iZv6v8)

The polygon shape takes 4 values in a pair of (x y) each for top-left, top-right, bottom-right, and bottom-left.

![clip-path-explanation](https://media-exp3.licdn.com/dms/image/C5612AQFpDe6iPFhlAw/article-inline_image-shrink_1500_2232/0/1618950367501?e=1631145600&v=beta&t=BZciS9FGUspGymZevpHaFwOQLUoRIvng13Y5eSgraYg)

But sometimes it can be very tricky to create a clipping path. So, here is a really cool tool for generating a CSS clip-path.

https://bennettfeely.com/clippy/

Now, go and create your own clip designs, shapes, and backgrounds.

---------------------------------

If you enjoyed reading this little CSS tip then, join my newsletter [here](https://swastikyadav.com/subscribe). There I share more amazing stuff on web-development.

Thanks a lot for reading.
Laravel: Easily Customize Email Verification URL
Tags: laravel, 100daysofcode, codenewbie, webdev
Published: 2021-07-06 15:12:03

---
title: "Laravel: Easily Customize Email Verification URL"
published: true
description: "This is not something you'd want to do if you're building an application the traditional laravel way––that is, a monolithic app. I've had to do this recently while working on a project that has the backend and frontend existing in different code bases."
tags: Laravel, 100daysofcode, codenewbie, webdev
cover_image: https://faruknasir.com//images/blog/2021/verification_url.png
---

This is not something you'd want to do if you're building an application the *traditional laravel way*––that is, a monolithic app. I've had to do this recently while working on a project that has the backend and frontend existing in different code bases.

Normally, when you setup a laravel project for new users to verify their email, a temporarily signed url is generated and sent to them. The url is generated based on the project's set `APP_URL` in the `.env` file and, subsequently, in the `/config/app.php` file.

The problem arises when you are building a SPA front end for a laravel backend api. In that case, you may have your frontend at, say, `http://cool-app.com` and the backend at `http://api.cool-app.com`. Because the user will not have a direct access to the api endpoints, it won't be ideal to generate a user-clickable link based on the api's base url. What you'd want is a url that is based on the frontend's base url. So, how can that be achieved? Easy.

Create a custom method for generating the URL and pass it to the `createUrlUsing` method of the `VerifyEmail` notification class.

```php
/**
* Set a callback that should be used when creating the email verification URL.
*
* @param  \Closure  $callback
* @return void
*/
public static function createUrlUsing($callback)
{
    static::$createUrlCallback = $callback;
}
```

The only other step that we have to take is to call this function inside the `AuthServiceProvider` passing the callback that returns our custom URL. The complete code is as below:

```php
/**
* Register any authentication / authorization services.
*
* @return void
*/
public function boot()
{
    ...

    VerifyEmail::createUrlUsing(function ($notifiable) {
        $frontendUrl = 'http://cool-app.com/auth/email/verify';

        $verifyUrl = URL::temporarySignedRoute(
            'verification.verify',
            Carbon::now()->addMinutes(Config::get('auth.verification.expire', 60)),
            [
                'id' => $notifiable->getKey(),
                'hash' => sha1($notifiable->getEmailForVerification()),
            ]
        );

        return $frontendUrl . '?verify_url=' . urlencode($verifyUrl);
    });
}
```

In the frontend, you can have a page with a logic that makes a `GET` http request to the `verify_url`. And, there you have it––a customized email verification url!
We build ceph from source
Published: 2021-07-06 15:07:30

---
title: We build ceph from source
published: true
description: We look into building Ceph from source. A build of Ceph is built from Github code using normal tooling. But I need to build my own packages as there is no new packages built for the Raspberry PI arm processor. There are quite some challenges and interesting things to keep in mind when building Ceph from source.
tags:
cover_image: https://i.ytimg.com/vi/yo2xVl3CD-s/maxresdefault.jpg
---

{% youtube yo2xVl3CD-s %}

We look into building Ceph from source. A build of Ceph is built from Github code using normal tooling. But I need to build my own packages as there is no new packages built for the Raspberry PI arm processor. There are quite some challenges and interesting things to keep in mind when building Ceph from source.
5 Reasons to Outsource Your QA
Tags: testing, qa, qatesting
Published: 2021-07-06 15:02:43

Access to a big pool of talents, low prices, and risk share push businesses to cooperate with third-party [testing services] (https://testfort.com/software-testing-services). Is there anything more to consider? Here are the main reasons why you should be outsourcing your [quality assurance and software testing] (https://testfort.com/)!

#1. Access to Innovation
When a company focuses on a single sphere, it gains experience and expertise. This lets the teams find and test innovative approaches in QA services. Third-party application testing companies have all means for educating each engineer and allowing them to invent new methodologies, use the latest stacks for work.

#2. Cost Reduction
You pay only for third party [testing services] (https://testfort.com/software-testing-services), and you don’t bother about administrative routine (office space, hardware, taxes, vacations, etc.). Another thing that makes the cost lower is the difference in hourly rates. If you hire QA engineers locally, you will probably may much more for the services than if you find a remote team from Eastern Europe.

#3. Short Time-to-market
Most third party software testing companies have a predefined workflow that makes their work efficient in a matter of time. There’s no need to educate the team or waste time until they plan their work – a remote team can dive into the testing routine right away. Therefore, the final release of the product can be sooner.

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jeh1392mrhw6cm0zg0dm.png)

#4. Access to Skilled Testers
A lack of QA engineers is a common problem for many regions. When you find third party application testing companies, you get a full team for your project. Even if there’s a need to find a few more people into the team, HRs usually have a list of candidates that can join the project on demand. This lets you access as many qualified and experienced engineers as you need for successful project deployment. 

#5. High Quality
Here we mean that engineers have a wide variety of tools and devices to run tests of the software. There’s no need to use emulators instead of real devices and operating systems. High quality of services is also possible thanks to a continuous self-education. Remote companies understand that they can keep a competitive edge for many years only if they take care of the team’s education and work-life balance. Other factors also influence the productivity of each team player.

The bottom line
Outsourcing is useful only if you consider this type of cooperation to be efficient for your business model. This rule refers to any kind of service. It’s not a panacea, and it’s not about getting rid of responsibilities – it’s about sharing the risk and getting a high quality of the final product.

Cooperation with a remote [QA team] (https://testfort.com/) will let you focus on your core business tasks and benefit from it. If you want to find out the name of the best testing company, we will tell you. Just drop us a message, and we’ll get back to you right away.
Toughs On Emacs After a Year of Pandemic
Tags: emacs, productivity
Published: 2021-07-06 15:01:28

---
title: Toughs On Emacs After a Year of Pandemic
published: true
description: My toughs about using Emacs for (almost) a year 
tags: emacs, productivity
//cover_image: https://direct_url_to_image.jpg
---


## Table of Contents

1.  [Configuration](#orgee26739)
2.  [TRAMP](#org92841df)
3.  [elisp](#org9a22707)
4.  [`org-mode`](#orged3bbd0)
5.  [Conclusions](#org70bc369)

Hello there! First of all - this isn&rsquo;t any form of review. I was using emacs just from time to time, so I won&rsquo;t call it whole year of using it. Nonetheless I&rsquo;ve got a lot more understanding to stuff behind it and I appreciate its extensibility even more than last year.


<a id="orgee26739"></a>

## Configuration

I&rsquo;m still using Doom Emacs - I still don&rsquo;t feel good enough at it and at elisp to create config from scratch, but there are some modifications, because I&rsquo;ve started to use org-mode more extensibly, especially when it comes to writing configuraion. It just makes sense to have my configs next to the documentation. I&rsquo;ve also switched my Linux distribution from Pop!_OS to NixOS - it feels so much better now. My `home-manager` config is now stored next to my emacs config, all in the same place (but I don&rsquo;t have git repository for it yet).


<a id="org92841df"></a>

## TRAMP

I also started to edit more files on my servers lately due to more self-hosted solutions. I love how TRAMP makes it easy to just edit remote file.


<a id="org9a22707"></a>

## elisp

It&rsquo;s a great tool! Thanks to it I&rsquo;m publishing this blog with almost no effort - just commit and push - other things just happen on it&rsquo;s own. I&rsquo;m using script by @to1ne and I&rsquo;m just loving it. His theme is base of mine with just minor tweaks such as color scheme changes (nord 💙). My [portfolio webiste](https://gronkiewi.cz) is also published with orgmode, but without such automation since it&rsquo;s just `<SPC>mehh`.


<a id="orged3bbd0"></a>

## `org-mode`

I&rsquo;ve said a bit about org-mode in the previous sections, but it just *should* have one on it&rsquo;s own. I&rsquo;ve started to use tangling a lot, write docs and my notes. It&rsquo;s great tool for writing and managing tasks since I can throw &rsquo;em around and just open org-agenda with filter or so.


<a id="org70bc369"></a>

## Conclusions

Emacs is even better tool than I tought at first. It just lacks good code editor, but since there&rsquo;s eVIl-mode - I&rsquo;m satisfied more than enough.
Can we build Micro VMs with Dockerfile? : Answer is Yes !!!
Tags: docker, devops, linux, beginners
Published: 2021-07-06 14:59:02

Answer is : ####Slim
Slim will build a micro-vm from a Dockerfile. Slim works by building and extracting a rootfs from a Dockerfile, and then merging that filesystem with a small minimal kernel that runs in RAM.

This results in a real VM that can boot instantly, while using very limited resources. If done properly, slim can allow you to design and build immutable unikernels for running services, or build tiny and embedded development environments.

Slim currently supports Virtualbox, KVM, and hyperkit (MacOS only) as providers for running VMs. Slim will discover all available providers, defaulting to virtualbox, if more than one provider is available. The -p flag can be used to force Slim to use a specific provider.

You can find repo here
{% github ottomatica/slim %}


##[Click here for joining my team](https://forms.gle/pSCALuEWHus3pg9F6)
How to add Magic Link to a Gatsby site
Tags: gatsby, javascript, react, graphql
Published: 2021-07-06 14:58:47

We have created a [pre-built template](https://github.com/magiclabs/gatsby-magic-starter) that helps you add a magic link to your Gatsby site.

This gatsby auth starter implements a passwordless authentication using email magic link provided by [Magic](https://magic.link).

If you want to follow the steps, head to this quick starter [guide](https://magic.link/posts/magic-gatsby).

Or, simple run `npx make-magic --template gatsby` on your terminal to get started in no time.

Check the live demo of the final application: https://gatsby-magic-starter.netlify.app

Let us know what you think of this starter template in the comments!
Glassmorphism Sign In Form Using HTML & CSS
Tags: html, css, webdev, beginners
Published: 2021-07-06 14:58:16

Hello,

Today I created a Glassmorphism Sign In form with HTML & CSS. this login form is very simple but looks good I use the Glassmorphism effect to create this Sign In. I hope you like this also comments about your thoughts.

{% post https://dev.to/nikhil27b/8-amazing-instant-button-hover-effect-2kf9 %}

For more content follow me on Instagram  [@developer_nikhil27](https://www.instagram.com/developer_nikhil27/).

Thank you!

{% codepen https://codepen.io/NikhilBobade/pen/dyWGxyP %}
Unfurling Asynchronous Microservices - Tech Talk
Tags: architecture, microservices, eventdriven, techtalks
Published: 2021-07-06 14:55:14

The talk compares the synchronous vs asynchronous communication approaches in Microservices and Distributed Systems. It highlights common patterns like Distributed Transactions, Distributed Queries, Orchestration vs Choreography and discusses pros and cons of each.

## Link to the timeline of each section/topic is as follows:

You may find the link to specific topics along with their timestamps in the video as follows: 

- [Agenda](https://www.youtube.com/watch?v=TsVPQCxIH18&t=544s)
- [Recap of Monolith & Microservices](https://www.youtube.com/watch?v=TsVPQCxIH18&t=799s)
- [Orchestration vs Choreography](https://www.youtube.com/watch?v=TsVPQCxIH18&t=1413s)
- [Commands vs Events](https://www.youtube.com/watch?v=TsVPQCxIH18&t=4311s)
- [Distributed Transactions (2PC | Saga)](https://www.youtube.com/watch?v=TsVPQCxIH18&t=5162s)
- [Distributed Queries (Replication | CQRS)](https://www.youtube.com/watch?v=TsVPQCxIH18&t=7321s)


{% youtube TsVPQCxIH18 %}
Day 133
Tags: 100daysofcode, programming
Published: 2021-07-06 14:54:07

Day 133/200 of #200DaysOfCode #100DaysOfCode 

- Solved two problems on Codewars.

1 -  Higher-Order Functions Series - Ask for missing details (6 kyu)
2 -  Higher-Order Functions Series - Order the food (7 kyu)
Tips for using Azure Static Web Apps
Tags: azure, serverless, staticwebapps
Published: 2021-07-06 14:48:57

I've recently converted two of my websites to Azure Static Web Apps and had a lot of fun not only learning how to use Hugo as the platform for these sites but also learning how easy and quick it is to get an Azure Static Web App set up and configured. 
I wanted to share some tips and things I've noticed during these deployments to help you all out. 😊

### Storage
With Azure Static Web Apps you have a limit to how big the website you are deploying can be.  This is no different to Azure Web Apps where you also have a file system storage quota.   
With the preview version of Azure Static Web Apps you were limited to 100MB but now with the Generally Available version you have **250MB** of space in the free tier or **500MB** if you are using the Standard (paid) tier. 

So this is one to watch, there is no view of how much storage you are using within the Azure Portal, you'll need to keep a check of the size on your machine when working on our source files. 
I have [git-sizer](https://github.com/github/git-sizer/#getting-started) installed on my machine so running git-sizer --verbose when working on my files can be a good checker. 

### Workflow
Azure Static Web Apps when used with GitHub can have only one GitHub Actions Workflow.  So be sure to remove any old yaml files created and that might be within your **.github\workflows** directory. 
Although they won't necessarily cause any issues GitHub Actions will still try and run those old workflows and it'll cause you an admin headache, easily if they fail and you think it's your production workflow. 😉

### Just HTML
Although Azure Static Web Apps is great for static web building and hosting, it can also handle just good old fashioned HTML websites. 

You just need to set up the workflow to point to the right locations.  If you are using GitHub as your source code repository, your yaml workflow will look like this:

![Azure Static Web App YAML Workflow](https://techielass.azureedge.net/images/githubyaml.PNG)

Assuming that the root directory of your GitHub repository is the root of the website. 

There is also a [skip app build](https://docs.microsoft.com/azure/static-web-apps/github-actions-workflow?WT.mc_id=modinfra-30818-salean#skip-building-front-end-app) functionality that you can use if you want full control of the build of your front end app. 


Do let me know how you are getting on with Azure Static Web Apps and what tips you've learned!
Rustで自作OS 5日目
Tags: rust
Published: 2021-07-06 14:40:48

昨日に引き続き第3章 boot loader。なんとか今日こそ起動したい。
昨日見たブログの次の章を読んでいく。
https://os.phil-opp.com/ja/minimal-rust-kernel/

> しかしながら、私達のターゲットシステムには、いくつか特殊な設定パラメータが必要になります（例えば、その下ではOSが走っていない、など）。なので、既存のtarget tripleはどれも当てはまりません。ありがたいことに、RustではJSONファイルを使って独自のターゲットを定義できます。

サンプルにあったJSONはカスタムターゲットの設定ファイルだった。どうりでtarget tripleに無いはずだ。
kernelにも同じJSONを配置して試してみる。

そもそもELFの知識が足りな気がするので、ブログと自作OS本を読み進める。

カスタムターゲットの指定方法がわからなかったんだけど、`--target`オプションに規定のtarget tripleではなく、JSONファイル名（おそらくパス）を設定すれば良いらしい。

```
cargo build --target x86_64-none-elf.json --package kernel --bin kernel
```

あんまり関係ないけど、SIMDのデメリットが載ってて参考になった。Apache ArrowとかSIMDちょっと興味あったので。
> しかし、大きなSIMDレジスタをOSカーネルで使うことは性能上の問題に繋がります。 その理由は、カーネルは、割り込まれたプログラムを再開する前に、すべてのレジスタを元に戻さないといけないためです。これは、カーネルがSIMDの状態のすべてを、システムコールやハードウェア割り込みがあるたびにメインメモリに保存しないといけないということを意味します。

話はkernelに戻って、やっとcore見つからないエラーが出たので、ブログの通りbuild-std設定を入れて進める。

ブログだとUEFIについて描いてないし、ELFじゃないので、ここを自作OS本と合わせる必要がありそう。
Building out a CRUD application
Tags: webdev, beginners, database, sql
Published: 2021-07-06 14:37:11

##What CRUD means?

So to create a CRUD application, let's first learn CRUD.

CRUD stands for Create, Read, Update, Delete.


C == Create
R == Read
U == Update
D == Delete

For every one of these verbs, There are equivalent SQL statements that match that verb for want to do to a database. 

####Create:

Whenever we want to create an object in our web application, We want to commit an insert statement in our relational database.


####Read:

When we want to read records from the user's perspective on a web application, We want to select certain records from our database so that we can feed them into the view that the client sees. 


####Update:

When we want to update something from the user's perspective, The user clicks a button, checks the checkbox, or submits a form.           

Changing something that already exists in that web application, we want to execute an update statement to our database. 

####Delete:

Finally, when a user chooses to remove something and delete that, we want to execute a delete statement on our database.
Cross-browser testing made easy with Comparium
Published: 2021-07-06 14:36:59

When building a website or web application, you need to test its compatibility with different browsers. The simplest and most convenient way is to use a cross-browser checking tool. If you need [old Firefox versions](https://comparium.app/blog/old-browsers-emulator/old-firefox-versions/) and other popular versions for cross-browser testing, you can use, Comparium.

Comparium is a web tool that allows you to test your websites effectively to ensure that they function as you intended across different browsers and operating systems. Using this service you will not need to spend lots of time wondering how it works, the service has a very intuitive interface and would be a cup of tea for users of different testing skills.
Introducing GoldFish : The minimalist Theme
Tags: javascript, webdev, programming, vscode
Published: 2021-07-06 14:25:48

I would like to thanks for all of you for the immense support you gave to the JellyFish Theme. As it was a success with 6,900 installs and counting. I would like to address some of it's limitations. Since it is a completely dark theme it might be not appealing for the matte loving audience and to address this issue I've came up with idea of GoldFish: The minimalist Theme for visual studio code.

*Some quick shots of it*

*GoldFish Installation Page*

![Installation Page GoldFish](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/k7wz0d4xjopro8ajpag4.png)
*Link:* https://marketplace.visualstudio.com/items?itemName=PawelBorkar.goldfish


![Preview](https://raw.githubusercontent.com/pawelborkar/vscode-goldfish/master/assets/preview1.png)

<br>
*Terminal Accent*
![Preview](https://raw.githubusercontent.com/pawelborkar/vscode-goldfish/master/assets/preview2.png)

<br>
*Highlighted Selection*
![Preview](https://raw.githubusercontent.com/pawelborkar/vscode-goldfish/master/assets/preview3.png)

<br>
*Using Multiple columns in vscode with the GoldFish Theme*
![Preview](https://raw.githubusercontent.com/pawelborkar/vscode-goldfish/master/assets/preview4.png)

<br>

![Preview](https://raw.githubusercontent.com/pawelborkar/vscode-goldfish/master/assets/preview5.png)
*Repository* [GoldFish](https://github.com/pawelborkar/vscode-goldfish)
{% github pawelborkar/vscode-goldfish %}


## Vote of Thanks

Thank you so much for reading this post and feel free to use the source code for your own projects and to publish your own theme. Create a PR suggesting any changes/improvements I would love to merge them.


> If you like my work then you can follow me on twitter [@pawelsb](https://twitter.com/pawelsb)
Venha ser uma pessoa Data Engineer na SumUp!
Tags: dataengineering, fintech, techdevelopment
Published: 2021-07-06 14:25:31

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mjuc6s7sqqanabyurfmg.jpg)

• VAGA DESTAQUE DO DIA •

Estamos buscando uma pessoa Data Engineering Specialist para a tribo de Lending!

O que a gente precisa:

➡️Experiência mínima de 3 anos como Data Engineer;
➡️Experiência com solução de messageria Kafka;
➡️Sólida experiência em conceitos de gestão de dados;
➡️Experiência com sistemas escaléveis;
➡️Fera no inglês;

Já trabalhou ou conhece alguém que traz esse conhecimento? Inscreva-se neste link https://bit.ly/2UanSGZ ou compartilhe essa oportunidade na sua rede.
Keeping up with programming and tech is tough. So I created an app that breaks down the concept and present as micro content.
Tags: javascript, react, kotlin, programming
Published: 2021-07-06 14:19:51

I used to follow different blogs, sites, and other resources for keeping up with the technology and always ended up spending more time reading the whole background instead of getting info on the crux of the matter.

This gave me the idea to create a community where the core concept / topic is presented as a short 30-second read called "ideation". Ideation is represented using images and rich text with emphasis and highlights on the relevant parts and may contain links to related content.

{% youtube H-FOnbYq36s %}

Content samples for different categories
https://www.microideation.com/programming.html

The microideation app has got more than 300+ ideations on *Kotlin, Java, ReactJS, Spring framework, Data structures, Algorigtms* and more ..

Download as free resource
https://play.google.com/store/apps/details?id=com.microideation.app