teleren/devto huggingface dataset:
3# CSS Interview Topics
Tags: css, interview
Published: 2022-08-15 16:02:00

* [BEM CSS](#bem-css) 
 * [Block](#block) 
 * [Element](#element) 
 * [Modifier](#modifier) 




##What is BEM CSS? <a name="bem-css"></a>
BEM stands for **Block**, **Element**, and **Modifier**. It’s a CSS naming methodology to reduce the CSS footprint and maintain large CSS codebases.


```css
/* Block component */
.btn {}

/* Element that depends upon the block */ 
.btn__price {}

/* Modifier that changes the style of the block */
.btn--orange {} 
.btn--big {}
```

###Block <a name="block"></a>
A block holds every element inside and acts as a scope. Think of it as bigger structural chunks of your code.

```html
<div class="card">
 <img src="...">
 <h2>...</h2>
 <p>...</p>
 <a>...</a>
</div>
```


###Element <a name="element"></a>
An element is a component within the block that performs a particular function. It should only make sense in the context of its block.

```html
<div class="card">
 <img class="card__img" src="...">
 <h2 class="card__title" >...</h2>
 <p class="card__description" >...</p>
 <a class="card__button">...</a>
</div>
```


###Modifier <a name="modifier"></a>
A modifier adds additional styles to a specific element(s).

```html
<div class="card card--dark">
 <img src="...">
 <h2 class="card__title card__title--large">...</h2>
 <p>...</p>
 <a>...</a>
</div>
```
Version 2.10 of Foal is out!
Tags: node, typescript, javascript, foalts
Published: 2022-08-15 15:50:43

---
title: Version 2.10 of Foal is out! 
published: true
description: Version 2.10 of Foal is out!
tags: Node, TypeScript, JavaScript, FoalTS
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cod544instpg85x9kkb4.png
---

Version 2.10 of [Foal](https://foalts.org/) is out! This small release brings some tiny improvements.

> **What's [Foal](https://foalts.org/)?**
>
> It is a full-featured Node.js framework simple and easy to use, written in TypeScript and with a complete documentation.

## `@foal/cli` package included by default as dev dependency

Issue: [#1097](https://github.com/FoalTS/foal/issues/1097)

The `@foal/cli` package is now installed by default as dev dependency. In this way, all commands of `package.json` still work when deploying the application to a Cloud provider that does not have the CLI installed globally.

Contributor: [@scho-to](https://github.com/scho-to/)

## Preventing the `npm run develop` command to get stuck on some OS

Issues: [#1022](https://github.com/FoalTS/foal/issues/1022), [#1115](https://github.com/FoalTS/foal/issues/1115)

The `npm run develop` was getting stuck on some OS based on the configuration of the app. This issue is now fixed in new projects. For current applications, you will need to add a `-r` flag to the `package.json` commands using `concurrently`.

## Smaller `main` function

The `main` function that bootstraps the application is now smaller in new projects.

> Article originally published [here](https://foalts.org/blog/2022/08/11/version-2.10-release-notes)
Synchronizing WordPress posts with Github README.md
Tags: programming, github, wordpress, php
Published: 2022-08-15 15:44:02

---
title: Synchronizing WordPress posts with Github README.md
published: true
date: 2022-08-15 15:36:46 UTC
tags: Programming,Github,Wordpress,php
canonical_url: https://piszek.com/2022/08/15/wordpress-github-markdown/
---

I treat my WordPress blog as my “digital home” – THE place to collect my thoughts, describe projects, and [publish ideas](https://piszek.com/blog/).

It works very well for writing, but my coding projects feel better on Github. They also appreciate the documentation and descriptions I attach to them.

Over time, my projects would get out of sync with their WordPress counterparts. I would add new features, change behavior or describe new use cases and would have to manually change that in WordPress, which I naturally forgot to do.

I wrote this simple snippet to embed any Github .md file inside WordPress posts or pages. Content would be refreshed from Github every hour and displays inside the post like it was written on WordPress.

[Here is an example page](https://piszek.com/roam/wp-roam-block/). Almost the entire content is from the [associated README.md](https://github.com/artpi/wp-roam-block/blob/main/README.md)

## How to sync your WordPress posts with any markdown file on Github

1. Use the attached code to introduce the GitHub markdown handler to your WordPress blog. Remember to also attach Parsedown.php!
2. Create an amazing project solving the world’s most pressing problem, write a .md file describing it
3. Copy the URL to Github markdown file
4. Paste it to WordPress block editor, and see how it turns into the content from the file.

## Here is the code:

{% embed https://gist.github.com/artpi/6953662184d7e2cd915411fe9d0353dc %}
How to append contents to a file in Nodejs?
Tags: node, nodejstip, javascript
Published: 2022-08-15 15:43:38

How to append contents to a file in Nodejs?

I hope you like the new format, it's so much more readable!

![appendFile](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uv3cvfjdsiqb1bwnmqup.png)
Please help to find a Reliable Blockchain Payment Gateway from Fiat
Tags: blockchainpayment, paymentgateway, fiattochain
Published: 2022-08-15 15:37:43

How are you
Hope you're having a good summer.
I am managing Event Ticket Platform.
Customers visit site from ads or referral links and buy tickets on many events.
At the moment, site supports 3 payment types
- Stripe
- Paypal
- smart contract (etherum contract for sending from one to our wallet + organizaer's wallet)

Our site had some refunds, disputes on Stripe sides so stripe warned us they can't move forward with our business, they suggested to change to the other payment gateway.
So our team started to find proper payment gateway, but there's no proper payment gateway like stripe features.

In conclusion, we made decision to find block chain payment gateway to support fiat (credit/debit card payment).
so customers will pay by their credit cards and we will receive to our wallet like stable coin (USDT alternatives)
I found some platforms like circle.com but the reviews on trustpilot are so bad.
Does anyone know this blockchain payment gateway, but reliable 5 stars?

Thanks for reading my post.
Music Monday — What are you listening to? (90's edition!)
Tags: watercooler, discuss, music
Published: 2022-08-15 15:37:00

_cover image source: [Sleater-Kinney music video](https://www.youtube.com/watch?v=Kc1htX3q-F0)_

**Alrighty! I've been doing this series for a 🔥 minute and I think it's time we shake things up a bit. For this particular edition, I want you to limit your shares to tunes from the 1990's. Time to dust off the old CD album!**

![Person flipping open CD album](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tn2k5u7dwwt5s4u9lsjh.gif)

***

## How we do 

In this weekly series, folks can chime in and drop links to whatever it is they've been listening to recently + browse others suggestions.

If you like talking about music, consider following the org [#music discussions](https://dev.to/music-discussions) for more conversations about music!

{% embed https://dev.to/music-discussions %}

***

So, what 90's tunes do y'all feel up for sharing today? _Note: you can embed a link to your song on most platforms using the following syntax `{% embed https://... %}`._

I look forward to listening to y'all's suggestions! 👂 🎶
Master JavaScript Promises - Complete Series
Tags: javascript, webdev, tutorial, react
Published: 2022-08-15 15:31:00

Watch complete video series at: https://youtube.com/playlist?list=PLbXAYqhxhzxxenzSiFcTMpeJ_VqX5D7KH

Don't forget to subscribe to get awesome content in future as well. We are in process to upload dynamic course on React, and Next along with TypeScript.
Why your New year's resolution never works.
Tags: beginners, motivation, writing, productivity
Published: 2022-08-15 15:31:00


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/166e69b0c86elijffbay.jpeg)

 _For which of you, desiring to build a tower, does not first sit down and count the cost. Luke 14:28–30._

“I haven’t even done what I planned out for this year and it’s November already, argh!!!”

If this isn’t me then I don’t know what is. Struggling with maintaining balance and achieving my goals had always been my major setback. I only wrote goals on what I wanted to achieve by the end of the year and used my months to toil and toil till I saw the fruits.

Believe me, it isn’t wrong to stay up on the 31st of December writing the new year’s resolution, but it is vital to break those resolutions into months, weeks, and days.

The game changer in my life happened on a particular evening I had this conversation with my brother. Before then, I had always written goals like “by the end of the year I should have started working as a senior staff in Microsoft” — a girl can dream!

But my goal setting took a U-turn after that conversation. I started taking into consideration small daily tasks which I ticked off at the end of the day from a checklist I made at the beginning of the day. And at the end of each month while writing out things I achieved, I would compare them with what I set out to achieve at the beginning, and 80% of the time I had almost all greens than reds on the paper— this gave me a valid sense of direction and put me in check.



This led me to understand the importance and the huge role daily goal setting played in fulfilment of the New year's resolution.

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

**Steps to making the best out of your goals.**

- Write out your goal for the year.

- Break it down into monthly goals.  

- Break down the monthly goal into days; each day, write out what you’re set to achieve and strive towards it.

- Set realistic goals and stop low-key deceiving yourself.

- Don’t be too hard on yourself if you couldn’t check all the boxes. Instead, dwell on what you achieved, give yourself a pat on the back and prepare to take tomorrow by storm.

In all, don’t take life too seriously, plan out and also have breaks in between to maintain your sanity, because your riches cannot and will not be enjoyed in death.

You gat this!!!!
Distinct Subsequence Leetcode
Tags: java, dp, algorithms
Published: 2022-08-15 15:25:20


Given two strings s and t, return the number of distinct subsequences of s which equals t.

A string's subsequence is a new string formed from the original string by deleting some (can be none) of the characters without disturbing the remaining characters' relative positions. (i.e., "ACE" is a subsequence of "ABCDE" while "AEC" is not).

The test cases are generated so that the answer fits on a 32-bit signed integer.

 

**Example 1**:
```
Input: s = "rabbbit", t = "rabbit"
Output: 3
```
**Explanation**:
```
As shown below, there are 3 ways you can generate "rabbit" from S.
rabbbit
rabbbit
rabbbit
```

```java
class Solution {
    public int numDistinct(String s, String t) {
        // we will use little bit of backtracking here 
        int dp[][] = new int[s.length()][t.length()];
        for(int row[] : dp) Arrays.fill(row, -1);
        return distinctCount(s,t,s.length()-1,t.length()-1,dp);
    }
    public int distinctCount(String s, String t, int i,int j,int dp[][]){
        //base case
        if(i=0 && j=0 && s.charAt(i)==t.charAt(j)) return 1;
        if(j<0) return 1;
        if(i<0) return 0;
        if(dp[i][j]!=-1) return dp[i][j];
        if(s.charAt(i)==t.charAt(j)){
            // so basically if its a, match , we will either reduce s and t index both or we will just reduce the index of  s only.
            // in both the case we will return the sum of values that we get.
            return dp[i][j]= distinctCount(s,t,i-1,j-1,dp) + distinctCount(s,t,i-1,j,dp);
        }
        else{
            // else if its not a match we will have to reduce the s string index so 
            //as to reach to an index of s where s.charAt(i) == t.charAt(j);
            return dp[i][j] = distinctCount(s,t,i-1,j,dp);
        }
    }
}
```
Good (quick) Resources to Become a Better Developer
Published: 2022-08-15 15:18:00

In this article I will share some resources that I find great to become a better developer.

There will be no books or other time consuming resources in this article. I will only include resources that are relatively quick to consume.

If you can think of other good resources that are not included here, feel free to share them in the comments. I am always looking for good resources and would love to see them.
<br><br>
## Clean Code
<br>
### clean-code-javascript by Ryan McDermott

[clean-code-javascript](https://github.com/ryanmcdermott/clean-code-javascript), by Ryan McDermott, is a GitHub repository. It shows examples of the Clean Code principles of Uncle Bob written in JavaScript.

It is a sort of overview of what is in the book. It is a really good read for people that are not familiar with the book or who want a refresher.
<br><br>
## Programming Principles
<br>
### Programming Principles by Lars Kappert

[Programming Principles](https://github.com/webpro/programming-principles), by Lars Kappert, is a GitHub repository. It lists programming principles with a brief description and links to dig deeper.

It is a good introduction to programming principles. Or a good refresher for those who already know about them.
<br>
### patterns.dev website

[patterns.dev](https://www.patterns.dev/) website lists design patterns for the web. It is both a free book and a set pages by design pattern on the website.

It also includes links to other resources, like the clean-code-javascript above.

It is a good place filled with interesting resources.
<br><br>
## Testing Best Practices
<br>
### JavaScript Testing Best Practices by Yoni Goldberg

[JavaScript Testing Best Practices](https://github.com/goldbergyoni/javascript-testing-best-practices), by Yoni Goldberg is a GitHub repository. It gives good practices about testing.

I would recommend it for everyone because it is really complete. There are good chances that everyone will either learn or remember some good practices while reading it.
Naive Pattern Search Method
Tags: javascript
Published: 2022-08-15 15:12:42

```
const naiveSearchPatter = (searchPattern, string) => {
  const M = searchPattern.length;
  const N = string.length;

  const indexArray = [];
  for (let i = 0; i <= N-M; i++) {
    let j;
    for (j = 0; j < M; j++) {
      if (string[i+j] != searchPattern[j]) 
      break;
    }
      if (j == M) {
          indexArray.push(i)
      }
  }
  return indexArray;
};

console.log(naiveSearchPatter("bc", "abcd"));

```
How to Configure Prettier on VS Code and IntelliJ
Tags: prettier, plugin, vscode, intellij
Published: 2022-08-15 15:11:51

Bismillah.

**Prettier Configuration on VS Code**

1. **Install Prettier Plugin:**

- Open VS Code.
- Go to Extensions and search for "Prettier".
- Install the Prettier extension.

2. **Modify Setting**

- Navigate to Preferences > Settings.
- Search for @lang:javascript settings.
- Click "Edit in settings.json" and add:

```
{
    "[javascript]": {
        "editor.formatOnSave": true,
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[javascriptreact]": {
        "editor.formatOnSave": true,
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    }
}
```

**Prettier Configuration on IntelliJ IDEA**

1. **Install Prettier Globally:**

- Run `yarn global add prettier` in the command line.

2. **Install Prettier Plugin:**

- Open IntelliJ.
- Go to the Plugins section and search for "Prettier".
- Install the Prettier plugin.

3. **Modify Settings:**

- Navigate to Settings.
- Search for Prettier.
- Select the Prettier package.
- Enable "On Reformat Code" and "On Save" actions.
- Click Apply.

Now, both VS Code and IntelliJ will automatically format your code using Prettier on save.


[Buy Me A Coffee](https://buymeacoffee.com/nhisyamj)
Even if you fail, fail forward...
Tags: beginners, programming, career, productivity
Published: 2022-08-15 15:09:54

This space gives me so much joy, "I can barely contain myself!!!" Yea. I know you want to hit me with the "how come you didn't follow through on your last post?" question. But no worries, I beat myself up so much about it already. Nonetheless, I'll give you the gist of why I've been gone for so long and what's next.

Without a doubt, I did intend to follow up as I wrote in my last post, but somehow... life happened. I started looking at some projects I wanted to start but couldn't continue as I had some freelance blockchain writing to do. So then I decided to wait till I start the ALX program so I can document my progress, teaching you, my favourite buddy, how to do the things I'm learning.

Well, the "D-day" is here. The program kicked off today. Of course, as you know, it's the usual welcoming to the program and encouragement to participate and finish the course. It happens to be more like a computer programming course, though. The expected time input is 280 hours monthly, daily tasks, capstone projects, three sprints of fully loaded curriculum and a specialization sprint, 60k community and smaller groups to learn with, and technical mentors to guide us!

Phew!!! That seems like a lot, right? I said so too. 

Having studied Mechanical Engineering, for which I had no passion, and graduated well, this might be a walk in the park. Of course, that is if things like "providing for my family" do not get in the way. And guess what? I don't think it would! For one, I'm a technical writer. Working remotely gives me the advantage of managing my time properly. Although I am still trying to get a regular 9-5 job to improve my financial balance, I feel everything will fall into place in time, even as a freelancer.

I can't wait to dive into the deeper ends of this program for real. However, before I start to teach you all the core details of this program, the image below shows the curriculum of what we will learn together.


![Alx program course](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9e2sdfws03dsz5ej0psf.JPG)

Before the weekend, I will teach you what I know about git, GitHub and GitHub desktop. I'm already excited to be here. Are you?

Now, back to the caption. I failed to keep up with several programming courses I started. I was even unable to meet some writing milestones I set for myself. But I choose to fail forward. I never let my failures stop me from starting again or succeeding the next time. This has been the case in several aspects of my life.

So try. And if you fail, learn from it and try again (failing forward). Continue that process until you hit success. As you do, know that I am cheering you on from here.
Consensus algorithm for e-voting blockchain
Tags: programming, blockchain
Published: 2022-08-15 14:59:55

Hi, we are planning on implementing a blockchain based voting system as a personal project.
We are currently trying to find what consensus algorithm to use in our blockchain.
There is'nt enough resources online regarding consensus algorithms other than POW and POS.
We dont want to use proof of work because the user does not gain any money from our system - so it wouldn't be lucrative of him to invest resources in mining the new block.                                                                                                                                                                                                    Furthermore, Proof Of Stake is also not an option because our project has nothing to do with cryptocurrency so we cant put tokens on stake, but we think we could maybe use a modified version of Proof Of Stake yet we don't have an idea as to what alternative we should put on a stake.
We thought of using FBA (Federated Byzantine Agreement) but there isn't enough information online about how the algorithm works in depth...
What are your thoughts? do you have any suggestions about what consensus algorithm we should use?
Web3 Application Wallet Authentication and npm Package Solution
Tags: javascript, web3, opensource, beginners
Published: 2022-08-15 14:40:00

#### Knowledge Requirement

- nodejs
- npm

Wallet authentication and connection is an essential step in building a web3 application. Every web3 application (dApp) needs to connect to the blockchain using wallets like [metamask](https://docs.metamask.io/guide/getting-started.html#basic-considerations), [coinbase wallet](https://docs.cloud.coinbase.com/wallet-sdk/docs)..., in order to execute transactions.

There are two ways of handling the connection phase; writing pure javascript code or using an npm package solution.


![Screenshot of a JavaScript code screen](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qbgvrrfa0tge5pjp3nnp.jpg)

### Pure JavaScript Solution

I first learned to build a connection to the blockchain using the Metamask wallet, and I had to write javascript specific to connecting Metamask. The issue with this is that there are many wallets out there, and I knew it will be a pain to write and maintain javascript code for every wallet solution one choose to accommodate. 

### npm Package Solution 

npm packages enable developers to share and reuse code packages. For web3 authentication and connection solutions open source developers have built various npm packages to solve this issue.

Examples of such packages are:

1. [Web3modal](https://www.npmjs.com/package/web3modal)
2. [Rainbowkit](https://www.npmjs.com/package/@rainbow-me/rainbowkit)
3. [web3-react](https://github.com/Uniswap/web3-react)

### Takeaways

I recommend developers to look into both npm package solutions before trying to build their web3 wallet connection from scratch. Larger teams can dedicate resources to analyzing and supporting the codebase of their npm package solution of choice.

#### Aside
One thing to look out for when choosing a package is to look out for the community behind the project.
i am new in laravel
Published: 2022-08-15 14:26:11

hy guys can you help me for this issues i want to create more d'un model in this methode : 

**_<u>if (isset($segments[1])) {
                        return $this->resolveModel(Category::class, $segments[1], $locale);</u>_**
                }

i want to replace category::class by dynamic model 

**_this my method_** 

if (array_key_exists($locale, config('locales.languages'))){
            App::setLocale($locale);
            Lang::setLocale($locale);
            setlocale(LC_TIME, config('locales.languages')[$locale]['UNICODE']);
            Carbon::setLocale(config('locales.languages')[$locale]['lang']);
            Session::put('locale', $locale);

            if(config('locales.languages')[$locale]['rtl_support'] == 'rtl'){
                Session::put('lang-rtl', true);
            }   else {
                    Session::forget('lang-rtl');
                }

                if (isset($segments[1])) {
                        return $this->resolveModel(Category::class, $segments[1], $locale);
                }
                return redirect()->back();
        }

thanks for everyone
[Ruby][Sorbet] How to make a Rakefile typed
Tags: sorbet, ruby, rails
Published: 2022-08-21 04:15:25

---
title: [Ruby][Sorbet] How to make a Rakefile typed
published: true
date: 2022-08-15 14:22:36 UTC
tags: ["Sorbet", "Ruby", "Rails"]
canonical_url: https://note.hiko1129.com/posts/1660573211/
---

<a href="https://note-hiko1129-com.translate.goog/posts/1660573211/?_x_tr_sl=ja&_x_tr_tl=en&_x_tr_hl=ja&_x_tr_pto=wapp" target="_blank" rel=”noopener noreferrer”>Translate ja to en</a>

https://github.com/ruby/rake/blob/master/lib/rake/dsl_definition.rb#L195 にて
```
self.extend Rake::DSL
```
となっているのでそれを表現した`T.all(Rake::DSL, Object)`をselfとする(厳密には正しくない...)。

```ruby
# typed: true

T.bind(self, T.all(Rake::DSL, Object)) # ← selfは実行時エラーになるのでせいぜいObjectっぽい

namespace :hoge
  task hoge: :environment do
  end
end
```