teleren/devto huggingface dataset:
リーダブルコード 3 章 関数と引数編、誤解されない命名をするために
Published: 2022-03-21 02:56:34

## 参考文献

https://www.oreilly.co.jp/books/9784873115658/

オライリー公式ストア、電子版 PDF 2112 円

P.29 ~  第三章 誤解されない名前。

https://dart.dev/guides/language/effective-dart/design

こちらの Dart のガイドラインも参考になる

## 何をしているのか

上記の本を読んだ上で、理解できたところを自分の言葉でまとめています

## 3.1

result = objects.filter( year < 2022 ) 

２０２２年未満のデータをフィルターするコードがある

これは結果として
2022未満のデータが選択されて
2022未満のデータが返ってくるのか

2022未満のデータが除外されて
2022以降のデータが返ってくるのか

これがわかりにくいらしい。私は選択一択だと思ったが...
なので select か exclude をつかうべきらしい。

---

## 3.2

clip（"hoge12345", 5) は 
"hoge" の結果が返ってくる　
後ろから 5 文字削る remove と
"hoge1" の結果が返ってくる
5 文字になるまで削る truncate 
これらが 2 つ考えられる。

---

なので

## 3.3

cart_too_big_limit = 10

これは 10 が入るのか入らないのかわからない

なので

max_items_in_cart = 10

１０ まで入ると明確な max を使うべき

---

## 3.5

printEventInRange(begin, end) => {}

という期間内のイベントを表示する関数のスタート日時、エンド日時では
end に "Oct 17 12:00am" を持ってくると
10/17 00:00 が入るのか入らないのかわかりづらい問題がある

慣例的にこの場合に end の時刻は exclude されるが

open/close や start/expire もあるらしい。(リプライで教えてもらった)

---

## 3.6

read_password = true 
コレだと
パスワードを読み取るかどうか、必要とするかどうか（リード）
パスワードを既に読んだかどうか（レッド）
かどちらかわからない

なので
読み取る必要があることを表すときは need_password
既に読み取った、認証済みを表す時は user_is_authenticated
を使うべき。

また、否定系で変数を作るのは避けるべき。

---

## 3.7

get 系の関数名は中の値を返すだけで計算量が少ないことを表すべき
なので、計算が入るときは compute をつけるべき

---

## 3.8

実験の　id 100　の変数を再利用して 101, 102, 実験を行うときの命名。

template: 100 だと id 100 の実験が本当の実験ではないと思われる。

reuse: 100 だと 100 回再利用できると思われる
reuse_id : 100 だと id 100 を使えば 101 の実験の再利用ができると思われる

copy: 100 だと この実験を 100 回コピーしてると思われる
copy_experiment: 100 だと実験　id 100 をコピーしてるとちゃんと理解されるらしい。

inherit_from_experiment_id: 100 も明確でわかり易い。

---

## 3.9

filter, length, limit, コレらは曖昧だから使わないほうがいい
select, chars, max, に変えるべき

誤解されない名前かよく考えて命名するべき。

get や size は大きな計算を想定されていないので、大きな計算では使わないようにする。
Basic Find Query with Prisma
Tags: javascript, nextjs, postgres
Published: 2022-03-21 02:55:04

For my [Breeze Lakes Point project](https://breeze-lakes-point-2.vercel.app/signin), I am using [Prisma](https://www.prisma.io/) as the [ORM](https://en.wikipedia.org/wiki/Object%E2%80%93relational_mapping) to handle data in my PostgreSQL database. This is the ORM that we used with the sample app from the Frontend Masters workshop I attended, and I found it straightforward with great documentation.

I am working on a feature to find a specific user in the database and return the data for display in a registration form for editing. The basic `findUnique` syntax is quite compact:

```Javascript
const data = await prisma.<model>.findUnique({
    where: {
        <lookupField>: <lookupValue>,
    },
    select: {
        returnField1: true,
        returnField2: true
    },
});
```

Since I am still expanding my `user` model, I implemented a simple return object:

```Javascript
const qry = <GUID value>

const data = await prisma.user.findUnique({
    where: {
        id: qry,
    },
    select: {
        id: true,
        username: true,
        email: true,
        firstName: true,
        lastName: true
    },
});
```

For the final returned object, I spread the data object to include a message to confirm the data returned to my route, since this is currently the same data that the session contains:

```Javascript
return { ...data, msg: "Found" };
```

With the basic framework in place to look up and return data via Prisma, I can work to expand both my `user` model and the models planned to hold related data.
Writing about Spring Boot – #1
Tags: springboo, java, devjournal
Published: 2022-03-21 02:05:38

Hi, if you end up here by some reason keep in my that this is my first blog post **_ever_** and also that I suck at writing, for real.


![Spring Boot logo](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zsxysubei5b5z6s8mbn6.png)

So what's Spring Boot anyways? I don't know for sure to be honest either, so I'm just gonna research for a bit and will be back in a jiff. So, it turns out that Spring Boot is something called a _micro framework_, and it's built on top of something called Spring (that's also a framework) used to help build Spring Applications.

So, enough with introductions, how do I go about building stuff with it? 

## Hello World

So, first go to src > main > java > maindomainfolder > mainApplication.java

You should see something along these lines:

![Standard mainApplication.java](https://i.imgur.com/NvcJwd1.png)

When we run this code you're going to open a new localhost Apache Server (Apache is one of the Spring Framework applications, just like Spring Boot) you'll be most likely be using either port 8080 or 8888. So just go to your browser and type localhost:8080 on the address bar and you'll be greeted with this:

![Whielabel initial homepage in Spring boot](https://i.imgur.com/FchWtXs.png)

That's good, that means that everything is running a-ok. So, about that Hello World stuff, to do this we need first to create a **Controller Class**, and well, what is a controller? I'm not sure, but it's something that makes stuff work – So I just looked up what controllers are: they're a Java Class responsible for handling REST API requests, they must contain the following annotation: `@RestController` – so we first create a controller and inside that controller we must map a URI to a function, and that function will be the output for that URI. So, we'll have something like this:

![Hello Maria Helena](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/f2ccpsfr7ecr5kdz7ska.png)

As you can see we have this thing called a controller and inside the controller we're mapping a URI to an output, in that case the URI is "/test/", so, when we access `localhost:8080/test/` we'll be greeted with this lovely page:

![/test/](https://i.imgur.com/BhgeTbD.png)



And there we have it, that's our `hello world`. I guess this will be it for today, hopefully this journal we'll become a bi-weekly habit, I feel like I retain much more information if I start typing it out.


<center>-- **🅴🅽🅳** --</center>
Mission Success . Zero to mern stack developer
Published: 2022-03-21 02:24:16

To Day Is a Importent day in my life becuce To day iam started in mission That mission Name is Mission Success.
It Means 160 Days challenge in Zero to Mearn Stack developer.
In this day Another one importends are there becuace in my life First Tyme Are In Self Learning .
becuace iam Not satisfy In scool and college Education
Tanks .
SPO600 Lab06 - sve2
Published: 2022-03-21 02:14:44


## Hi there,
This lab build up on top of the past lab, this time we need to make a new volume function that will use [SVE2]( https://developer.arm.com/documentation/102340/0001/Introducing-SVE2?lang=en) syntax.

Even though it looks simple, it is really hard to understand inline assembler and intrinsic code.

For this lab, I decided to change one of the previous functions to use `sve2`.

### My Approach

The one function I decided to change was vol4(remembering that vol4.c was made by the professor, not by me):

First things I had to change was adding the sve header file:
 ![header](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bj3fhkjt0femq1mf2xyg.png)
 

After that, instead of using the `v` registers, I used `z` as instructed in the sve2 instructions:
 ![registers](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/amch3mvh3geazdghi0uk.png)
 
(Image from: https://developer.arm.com/documentation/102340/0001/SVE2-architecture-fundamentals?lang=en)
 
![code](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/s9044br8f74ejh27g3in.png)
 
 The change was not huge, but without the sve2 instructions on the Makefile it could not compile:
 
![Makefile](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/z9z5wds3d92twjb6udth.png)
 
And to run it we need to to use `qemu-aarch64`: 
 
![qemu](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1260kal1aiibrny5q4az.png)
 

Without it we have a illegal instruction error:
Core dumped:
 ![coredump](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d53613owfnkzc6o192ij.png)
 

On object dump, we can see that `sqrdmulh` is using the `z` registers.
`Objdump -d` 
 ![objdump](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/32y4akpo99zoc7dkmekf.png)
 

Thank you for your reading!
Do you know unstable_batchedUpdates in React ? (enforce batching state update)
Tags: react, javascript
Published: 2022-03-21 01:59:03

It is ok if this is your first time to read about it, because it is one of the **not documented** APIs in React, Yes you can not find it in the react's official documentation, although it is a part of the library.

First we need to know **What is batching state update?**

According to [Dan Abramov](www.twitter.com/dan_abramov) -co-authored the Create React App

> Batching is when React groups multiple state updates into a single re-render for better performance.

```
function App() {
  const [count, setCount] = useState(0);
  const [isEven, setIsEven] = useState(false);

  function handleClick() {
    setCount(c => c + 1); // Does not re-render yet
    setIsEven(f => !f); // Does not re-render yet
    // React will only re-render once at the end (that's batching!)
  }

  return (
    <div>
      <button onClick={handleClick}>counter{count}</button>
    </div>
  );
}
```

In earlier React versions (17 and earlier) there was batching only in browser event (like click), and it wasn't available in 

- Native DOM event listeners (e.g., el.addEventListener())
- Async callbacks (e.g., promises, timeouts, intervals)

and to make it available you had to use `unstable_batchedUpdates` to enforce batching

How to use it `unstable_batchedUpdates` ?

```
import {unstable_batchedUpdates} from 'react-dom';

const batchUpdate = unstable_batchedUpdates(() => {
  setName('Moustafa');
  setAge(25);
});


batchUpdate() //this will group all state changes inside and apply it in one re-render 
```
**Good News**
if you're using React 18 and above, you do not need it anymore because React 18 now support automatic batching.

This means that updates inside of timeouts, promises, native event handlers or any other event will batch the same way as updates inside of React events

you can read more about it [here](https://dev.to/jackbuchananconroy/react-18-what-s-changed-automatic-batching-13ec)

## Warning ⚠️
**Since React 18 now supports automatic batching and it is 
a not documented API and it might get removed in a future major version of React after popular libraries no longer depend on its existence.**
Web Topup Games, Voucher PPOB Blackexpo Topup
Tags: script, web, store, platform
Published: 2022-07-21 22:44:44

---
title: Web Topup Games, Voucher   PPOB Blackexpo Topup
published: true
date: 2022-03-21 01:57:51 UTC
tags: Script,Web,Store,Platform
canonical_url: https://mycoding.id/item/104/web-topup-games-voucher-ppob-blackexpo-topup
---

Script Aplikasi Web Topup ini adalah Platform produk PPOB, Voucher dan Games. Semua produk disediakan dengan koneksi API dari Produk Digiflazz, dan konfirmasi otomatis menggunakan Payment Gateway Tripay... Selengkapnya https://mycoding.id/item/104/web-topup-games-voucher-ppob-blackexpo-topup Web Topup Games, Voucher PPOB Blackexpo Topup - by MC Project - Produk Digital dan Jasa Freelance
Devise Gem
Tags: ruby
Published: 2022-03-21 01:48:36

In my previous post, I mentioned the [Devise](https://rubygems.org/gems/devise) gem, which handles the user authentication process in Rails. It simplifies the process in several ways: it generates the necessary controllers for user login and sessions, creates forms for user sign up/log in, and handles the encryption process with bcrypt, eliminating the need to salt and hash passwords yourself. The Devise gem also provides compatibility with other user authentication methods like OAuth, so the user would have the option to log in through a third party. This gem is great for streamlining the user authentication process and ensuring app security. 

In this post, I want to go through set up with the gem! 

**Setting up:**
Add `gem devise` to your Gemfile and run `bundle install`

Run `rails g devise:install`


**Creating the User Model**
Run `rails g devise user` and `rake db:migrate`

Voila! This gem will generate the controller for user log in. 

To generate views run `rails g devise:views`

To work with Devise routes, add to routes.rb: `devise_for :MODELNAME` where MODELNAME is the name of the model you want to create the route for.
First Fullstack Project: Tixxly
Tags: javascript, node, webdev, database
Published: 2022-03-21 01:27:15

I'm now 10 weeks into my bootcamp and was assigned to make a fullstack project with a partner. My partner [Rayleigh](https://dev.to/rayleighrozier) came up with the idea to create a movie theatre website. We created this project using various means like Node, ElephantSQL, EJS, Seuquelize and more. Much of our design and functionality were based off other theatre apps/websites. All of the movies displayed on our homepage are from [The Movie Database](https://www.themoviedb.org/) API.
![Home Page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sgwlsh5c2jnfu5p2gj5l.png)

From the front page, users can choose the movie they want to reserve a ticket for from the available time. All of these times are gathered from a database we created. Our API is set to gather recent releases from their database, so our homepage will change every few days with what movies are shown. Although because we have to manually insert times and movies to our own database to be displayed on the reservation page, some may end up having no showtimes.
![Reservations](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qjymmsiiu9mg88jxmmpv.png)

After that, we allow the user to select some concessions which also come from one of the tables in our database.
![Concessions](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8w0jzs5ydrsxm401p20o.png)

Once the user chooses their concessions, they just have to fill out a form with their name and will be redirected to a page with their ticket information.
![Ticket](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/74bdkngmmp7pjv2f0ofv.png)

This was the first time our bootcamp had an assignment involving a partner, so we had to figure out how to split the work. Rayleigh was a powerhouse through this whole project. Major props to her for putting together so much of this project and designing the website. Some of the challenges we faced at the start was figuring out how our database and tables would be setup and connected. Another slight hurdle was getting the information from our database to show up on certain pages. 
Here's our projects [github](https://github.com/San-toast/raytoast) if you want to see the code.
100days code challenge
Tags: day1, 100daysofcode, java, recursion
Published: 2022-03-21 01:19:31

**Recursion
**
Recursion is the process in which the function call itself until some condition(the condition is called the base case) is reached.

## the key points in recursion are:-
* Recursive Function call.
* Base case.

**Base case :-** it is stopping condition of the recursive call.

**syntax :- `static int fact(int n)
           {
            if(n==0)
                return 1
             return n*fact(n-1)
            }`**

**Example:- Palindrome check using Recursion**
Palindrome is a number, which viewed from both sides is same.
```
import java.util.Scanner;

//Palindrome check with recursion
public class Palli {
    public int temp = 0;

    static int getReverse(int n, int temp) {
        if (n == 0)
            return temp;
        temp = temp * 10 + n % 10;
        return getReverse(n / 10, temp);
    }

    public static void main(String[] args) {
        Scanner sc = new Scanner(System.in);
        int n, temp = 0;
        System.out.println("Enter the Number");
        n = sc.nextInt();
        int cnum = getReverse(n, temp);
        System.out.println(cnum);
        if (n == cnum)
            System.out.println("The Number is a pallindrome");
        else
            System.out.println("The Number is not pallindrome");
    }
}
```

**Example 2:- Sum of Digits**
The sum of digits is problem where a number is given and sum of each digit in the number must be calculated.
ex: 253 = 2+5+3 = 10

```
import java.util.Scanner;

public class SOD {
    static int soD(int n) {
        if (n == 0)
            return 0;
        return soD(n / 10) + n % 10;
    }

    public static void main(String[] args) {
        Scanner sc = new Scanner(System.in);
        int n = sc.nextInt();
        System.out.println(soD(n));
    }
}
```
Linked List - Basics
Tags: javascript, algorithms
Published: 2022-03-21 00:18:18

Linked List Brief Intro: 

- **Linear** collection data structure 
- Chain of nodes ⛓ - "each node contains a **value** and a **pointer to the next node** in the chain." 

```
Singly Linked List (one direction only)

1 -> 2 -> 3 -> 4 -> null (when the pointer gets to null, it has reached the end of the linked list) 
^
Head: beginning of the linked list 
```

```js
//Linked List Node Class Declaration
class ListNode { 
   constructor(value = 0, next = null) { 
      this.value = value; 
      this.next = next; 
   }
}
```

In this Linked List series, I will be using `curr` (stands for current) as the main pointer to move through a Linked List. 

```js
//Using curr allows us to remember the head to return it at the end of the function

let curr = head; 
```

```
1 -> 2 -> 3 -> 4 -> null
^
curr

curr = ListNode { 
          value: 1, 
           next: ListNode { 
                   value: 2, 
                    next: ListNode { 
                             value: 3, 
                              next: ListNode {
                                     value: 4, 
                                      next: null
                                   }
                          }
                 }
       }
curr.value = 1
```
```
1 -> 2 -> 3 -> 4 -> null
^ ->
curr.next (the next node based on the current node) 
   
curr.next = ListNode{2, ListNode{3, ListNode{4}}}
curr.next.value = 2
```

**How to move to the next node in a Linked List?** 

```js
//assigning curr to the next node 
curr = curr.next; 
```
Here is an example: 
```js
while(curr) { //keep iterating as long as curr is not null
   curr = curr.next; 
}
```
```
While 'curr' is not null: 

1 -> 2 -> 3 -> 4 -> null
^ ->
curr.value = 1
curr.next.value = 2

curr = curr.next;

__

While 'curr' is not null: 

1 -> 2 -> 3 -> 4 -> null
     ^ ->
curr.value = 2
curr.next.value = 3

curr = curr.next;

__

While 'curr' is not null: 

1 -> 2 -> 3 -> 4 -> null
          ^ ->
curr.value = 3
curr.next.value = 4

curr = curr.next;

__

While 'curr' is not null: 

1 -> 2 -> 3 -> 4 -> null
               ^ ->
curr.value = 4
curr.next = null

curr = curr.next; 

__

1 -> 2 -> 3 -> 4 -> null
                     ^ ->
'curr' is null, stop the iteration. 
The pointer has now moved through the entire Linked List. 
```

____ 

References & Additional Resources: 
- https://www.educative.io/edpresso/what-is-a-linked-list
- https://www.geeksforgeeks.org/data-structures/linked-list/
- https://www.geeksforgeeks.org/applications-of-linked-list-data-structure/
- What is class? -> https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes
Linked List - Core Algos Overview
Tags: javascript, algorithms
Published: 2022-03-21 00:17:56

Based on my learnings at [Formation](https://formation.dev/), I have learned 11 core algorithms for this Linked List data structure. I have grouped them up by similarities: 

**Group #1: [Accumulating elements in a Linked List](https://github.com/ngl4/formation_journey/tree/main/CoreAlgos/LinkedList/1_Accumulating)**
- Count Elements in a Linked List
- Sum Element Values in a Linked List 

**Group #2: [Finding without the need of a pointer](https://github.com/ngl4/formation_journey/tree/main/CoreAlgos/LinkedList/2_Finding_NoPointerNeeded)**
- Find a Highest/Max Element Value in a Linked List 
- Find an Element in a sorted Linked List 

**Group #3: [Finding with 2 pointers](https://github.com/ngl4/formation_journey/tree/main/CoreAlgos/LinkedList/3_Finding_TwoPointers)**
- Find a Middle Element in a Linked List in One Pass
- Find Kth Element from the End of a Linked List in One Pass

**Group #4: [Adding element(s)](https://github.com/ngl4/formation_journey/tree/main/CoreAlgos/LinkedList/4_Adding)**  
- Append an element with a target value to a Linked list
- Insert a target element in a sorted Linked List (_with sentinel*_)

**Group #5: [Removing element(s)](https://github.com/ngl4/formation_journey/tree/main/CoreAlgos/LinkedList/5_Removing)** 
- Remove a target element in a sorted Linked List (_with sentinel*_)
- Remove all elements with a target value in a Linked List (_with sentinel*_)

**Group #6: [Reversing elements](https://github.com/ngl4/formation_journey/tree/main/CoreAlgos/LinkedList/6_Reversing)**
- Reverse a Linked List 

**Group #7: [Summing Linked Lists](https://github.com/ngl4/formation_journey/tree/main/CoreAlgos/LinkedList/7_Summing_LinkedLists)**
- Sum Two Linked Lists of Equal Length (_with sentinel*_)

_*Sentinel node = It is a node that does not hold any reference/data to a Linked List (can be any value). We will have the pointer points to this node first. This is especially commonly used for inserting and removing Linked List problems_
Core Algos
Published: 2022-03-21 00:17:28

I have recently started my journey at [Formation](https://formation.dev/) as a Frontend Engineering Fellow. I have decided to document down what I have learned and shared with my future me and whoever who is in the DSA learning journey. 

Learning Core Algos is the first round in my Formation journey. There are 30+ basic algos are given to me to learn and an assessment to complete within a time limit of 45 mins. It has been intensive, but I have recently passed the assessment and super glad to be able to document down what I have learned. Based on these basic algos, here are the 3 data structures that will be focusing on in this Core Algos series:

- Linked List
- Binary Tree (and Binary Search Tree)
- Array