開発スタッフがアプリ関連の最新技術やニュースをご紹介します。

UUIDs, or Universally Unique Identifiers, are strings of characters used to uniquely identify information in computer systems. They play a crucial role in various applications, from databases to distributed systems. In this blog, we will explore the different versions of UUIDs, each designed for specific use cases and scenarios.

1. UUID Basics

Before delving into the versions, it’s essential to understand the basic structure of a UUID. A UUID is a 128-bit number typically represented as a 32-character hexadecimal string, separated by hyphens into five groups. The uniqueness of UUIDs is achieved by combining timestamps, node information, and random or pseudo-random numbers.

2. UUID Version 1: Time-based UUIDs

UUID version 1 is based on the current timestamp and the unique node (typically a MAC address) to ensure uniqueness. The timestamp component allows sorting and ordering of UUIDs based on their creation time. While effective, the reliance on a timestamp makes it less suitable for scenarios where privacy and security are top priorities.

3. UUID Version 2: DCE Security UUIDs

Version 2 is similar to Version 1 but includes additional information related to the POSIX UID/GID and POSIX timestamps. However, Version 2 is rarely used in practice, and Version 1 is more widely accepted.

4. UUID Version 3 and 5: Name-based UUIDs (MD5 and SHA-1)

These versions are generated by hashing a namespace identifier and a name using MD5 (Version 3) or SHA-1 (Version 5). The resulting hash is then combined with specific bits to form the UUID. While these versions ensure uniqueness within a given namespace, the use of MD5 and SHA-1 has raised security concerns due to vulnerabilities in these hashing algorithms.

5. UUID Version 4: Random UUIDs

Version 4 UUIDs are generated using random or pseudo-random numbers. This version prioritizes randomness over time-based information, making it suitable for scenarios where ordering is less critical, and privacy is a priority. The randomness is achieved through the use of a random number generator.

6. UUID Version 6: Modified Version 1

A newer addition, Version 6 combines the best of both Version 1 and Version 4. It includes timestamp information for ordering and randomness for improved security. This version is designed to address some of the privacy concerns associated with Version 1.

Conclusion

Understanding the different versions of UUIDs is essential for choosing the right type based on the specific requirements of your application. Whether you prioritize time-based ordering, security, or randomness, there’s a UUID version designed to meet your needs. As technology evolves, so do UUID specifications, ensuring that these unique identifiers continue to play a vital role in the ever-expanding digital landscape.

Asahi

NodeJSは、オープンソースのクロスプラットフォームツールで、基本的にブラウザ環境の外でJavaScriptが機能するための実行環境を構築するものです。非同期プログラミングを利用する。

基本的に、NodeJsはJavaScriptの機能の範囲を広げます。NodeJsは、コーディング言語とAPI、他の言語、およびいくつかの外部ライブラリとの統合を支援します。

クロスプラットフォームの互換性

NodeJSは、Windows、Unix、Linux、Mac OS X、モバイルプラットフォームなど、複数のプラットフォームに対応しています。正しいパッケージと一緒に、完全に自立した実行ファイルにバンドルすることができます。

V8エンジン

元々Chrome用に開発されたV8エンジンは、現在ではWebアプリ開発の目的に合うように改良されています。V8エンジンは、JavaScriptをC++の助けを借りて一般的な機械語コーディング言語に翻訳できる、最も優れたエンジンの一つです。したがって、V8エンジンは、最終的にサーバーやすべての機械語ベースの製品に役立つ。

シングルスレッド

Node.jsはシングルスレッドで動作します。これは、複数のクライアントからのリクエストを処理できる「シングルスレッド・イベント・ループ・モデル」アーキテクチャをベースにしています。メインのイベントループはシングルスレッドで実行されますが、バックグラウンドでは、イベントループに対応するためにNode APIの入出力操作は非同期（ノンブロッキング設計）であるため、入出力作業は別々のスレッドで実行されます。イベントループは、node.jsがすべてのノンブロッキング処理を実行できるようにするものです。

非同期

Node.jsはデフォルトで非同期です。つまり、ノンブロッキングで動作します。つまり、クライアントがサーバにリクエストすると、1つのスレッドがそのリクエストを処理し、リクエストがデータベースとのやりとりを伴うかどうかをチェックし、リクエストが処理され、サーバからクライアントに応答が返されます。このスレッドは次のリクエストを処理する準備ができています。

高いスケーラビリティ

Node.jsのアプリケーションは、非同期（ノンブロッキング）方式で動作するため、高いスケーラビリティがあります。Node.jsはシングルスレッドで動作し、1つのリクエストが到着すると、その処理を開始し、次のリクエストを処理できるようになります。また、応答が準備されると、それはクライアントに送り返されます。

ノードパッケージマネージャ(NPM)

おなじみ、Nodeパッケージマネージャは、Node JavaScript実行環境用のパッケージマネージャで、Node.jsインストーラの推奨機能です。これは世界最大のオンラインリポジトリです。また、私たちのプロジェクトのローカル依存関係の管理も行っています。

キャッシング

Node.jsは、キャッシュという点でかなり有利です。Node.jsはモジュールのキャッシュをサポートしています。Node.jsのモジュールが初めてリクエストされたとき、アプリケーションのメモリにキャッシュされます。キャッシュにより、アプリケーションはウェブページをより速くロードし、ユーザーに簡単に応答できるようになるので、コードを再実行する必要はありません。

高速データストリーミング

データが異なるストリームとして移動する場合、その処理には多くの時間が消費されます。そこで、NodeJSは、アップロード中のファイルを同時に処理することで、データ処理にかかる時間を短縮します。そのため、NodeJsは全体的にデータや動画のストリーミング速度を速めることができます。

By Tsuki

WhatFont

WhatFontは、Webページで使用されているフォントを知りたい開発者のための非常に便利なChrome拡張機能です。高速で効果的で、フォントファミリ、サイズ、太さ、色を識別します。

ColorPick Eyedropper

ColorPick Eyedropperは、あらゆるウェブページから色値を選択することができるシンプルなカラーピッカーツールです。

CSSViewer

CSS Viewerは、ウェブ開発者のためのシンプルで非常に効果的なChrome拡張機能です。その名前が示すように、このアドオンは、マウスがポイントされた場所ならどこでも、与えられたページのCSSプロパティを表示します。小さなポップアップウィンドウが表示され、ポイントされている要素を構成するCSSデータが表示されます。

Lorem Ipsum Generator

lorem ipsum ジェネレーターは、その名の通り、デフォルトのテキストを簡単に素早く作成することができます。デフォルトのテキストを簡単かつ迅速に作成する方法を提供します。プレースホルダーとしてデフォルトのテキストが必要な場合、間違いなく、これは手っ取り早い方法です。

Cookie Remover

このエクステンションは、開発者にとっても最高のエクステンションの1つになるでしょう。それは現在のサイトのためのすべてのクッキーを削除することができます。
壊れたクッキーをクリックすると、現在のサイトのすべてのクッキーが削除されます。

Window Resizer

Window Resizerは、ウェブ開発者向けの非常に便利なChrome拡張機能です。シンプルですが、特にレスポンシブデザインやアプリで作業するときに非常に効果的です。Chromeにインストールすると、作業中の画面を一般的な画面サイズの範囲にリサイズしてくれます。

By Tsuki

CSS Design Awards

このサイトは、クリエイティビティ、機能性、ユーザビリティのバランスを特に重視したデザイナーやウェブエージェンシーを表彰するサイトです。

Designspiration

このサイトには、ウェブデザイナーのための素晴らしいデザインがたくさんあります。

Dribbble

Dribbble には、ウェブデザインのほか、アニメーション、ブランディング、イラスト、モバイル、印刷、プロダクトデザイン、タイポグラフィのカテゴリがあります。

 Pinterest

Pinterestでは、Webデザインだけでなく、さまざまな種類のデザインを提供しています。

Instagram

インスタグラムは、あらゆる種類のビジュアルコンテンツを10億人のアクティブユーザーに届けることができるNo.1プラットフォームとなりました。

Codepen

HTML、CSS、JavaScriptのコードエディターで必需品です。”ブラウザにコードを入れる”

CSS NECTAR

CSSnectarでは、トリプルベットされたインスピレーション溢れるウェブサイトを紹介しています。 訪問者は、国、特徴、カテゴリー、カラータグなどのフィルターやタグを使って、サイトを見て回ることができます。

Niice

優れたデザインコンセプトのアイデアを提供するサイトです。

By Tsuki

Packages

パッケージは独立したソースコードで、開発者は composer などのパッケージ管理ツールを使って自分のプロジェクトに取り込むことができます。これらのソースコードは、メインのソースコードとは別にバージョン管理することができ、独自のテストを持ち、独自の依存関係を管理することができます。

多くのプロジェクトがあり、いくつかの機能や特徴が似ている場合、これらの機能をパッケージで実装し始めるとよいでしょう。

Composerは、PHPパッケージの依存関係管理ツールです。各パッケージが必要とするすべての依存関係をベンダディレクトリに 重複させることなく取り込み、パッケージの管理を支援します。

Laravelパッケージの作成

1.新しいLaravelプロジェクトを作成する

Laravelのプロジェクトを作成するために、コマンドラインでComposerを使用します。

composer create-project — prefer-dist laravel/laravel custom-message

2.ファイル構造

新規Laravelプロジェクトのデフォルトフォルダ構造上で、以下のようなファイル構造を作成します。

packages –> custom-simple-package -> custom-message –> src

packages フォルダ内には、ベンダー名 custom-simple-package の後に、パッケージ名 custom-message を記述することに留意してください。src フォルダには、パッケージのすべてのソースコードが格納されます。 

3.パッケージcomposer.json

コマンドで、packages/custom-simple-package/custom-message ディレクトリに移動します。次に、以下のコマンドを実行して、このフォルダをcomposerパッケージとして初期化する必要があります。

composer init

初期化が終わったら、composer.json ファイルを編集します。

{
    "name": "custom-simple-package/custom-message",
    "description": "CustomMessage - A simple Laravel package.",
    "type": "project",
    "license": "MIT",
    "authors": [
        {
            "name": "Mary Blury",
            "email": "maryblury@gmail.com"
        }
    ],
    "minimum-stability": "dev",
    "autoload": {
        "psr-4": {
            "CustomSimplePackage\\CustomMessage\\": "src/"
        }
    },
    "require": {}
}

ここで追加されたもので注意すべきは、autoloadオブジェクトプロパティだけです。これは、与えられた名前空間CustomSimplePackgeのCustomMessageで自動的にあなたのパッケージをロードします。

4.プロジェクトcomposer.json

CustomSimplePackageの行を追加して、パッケージの名前空間をオートロードします。”packages/custom-simple-package/custom-message/src” という行を、プロジェクトの composer.json ファイルの autoload->psr-4 プロパティに追加してください。

"autoload": {
    "psr-4": {
        "App\\": "app/",
        "CustomSimplePackage\\CustomMessage\\": "packages/custom-simple-package/custom-message/src"
    },
    "classmap": [
        "database/seeds",
        "database/factories"
    ]
},

プロジェクトの composer.json ファイルを編集したので、プロジェクトのルートディレクトリで次のコマンドを実行して、再読み込みします。

 composer dump-autoload

5.CustomMessage.php Class

<?php

namespace CustomSimplePackage\CustomMessage;

class CustomMessage
{
    public function greet(String $name)
    {
        return 'Hello ' . $name . '! How are you doing today?';
    }
}

このクラスの名前空間は、プロジェクトの composer.json ファイルで指定した名前空間と同じものを指定して、オートロードされるようにします。

6.パッケージのテスト

これで、シンプルなパッケージがテストできるようになりました。その前に、ルートを作成して、とりあえずこのルートからパッケージのCustomMessageクラスを呼び出してみましょう。

<?php

use CustomSimplePackage\CustomMessage\CustomMessage;

Route::get('/custom-message/{name}', function($name) {
    $cMessage = new CustomMessage();
    return $cMessage->greet($name);
});

CustomMessage クラスをパッケージからインポートするには、use キーワードで最初に名前空間を指定します。そして、プロジェクトのルートファイル内で、そのクラスのインスタンスを作成し、そのメンバ関数を呼び出すことができます。

プロジェクトのルートディレクトリで、以下のコマンドを実行して、開発サーバーを実行します。

php artisan serve
Laravel development server started: <http://127.0.0.1:8000>

ブラウザを起動し、次のURLを入力します。http://127.0.0.1:8000/custom-message/Mary

ブラウザで見ると、

Hi Mary ! How are you doing today?

7. GitLabへのパッケージの公開

まず、GitLabで新しいプロジェクトを作成しましょう。可視性のレベルが public になっていることを確認しましょう。

パッケージディレクトリpackages/custom-simple-package/custom-messageに移動します。以下のコマンドを実行して、git を初期化し、変更をコミットし、チェンジセットにセマンティックバージョニングのタグを付けます。

// packages/custom-simple-package/custom-message
$ git init
$ git checkout -b master
$ git add .
$ git commit -m "Initial commit"
$ git tag 1.0.0

ローカルのソースコードを新しく作成したGitLabプロジェクトにプッシュするために、次のコマンドを実行します。

// packages/custom-simple-package/custom-message
$ git remote add origin https://gitlab.com/tsuki/custom-message.git
$ git push -u origin --all
$ git push -u origin --tags

これで、準備は万端です。

8.Laravelパッケージのインポート

これで、Composerを使ってGitLabサーバーから新しいLaravelプロジェクトにパッケージをインポートすることができます。ローカルマシンで別の Laravel プロジェクトを作成します。

新しいプロジェクトの composer.json ファイルを編集して、このパッケージを require するようにします。また、GitLab のリポジトリを指定して、Composer がデフォルトの packagist リポジトリ以外にパッケージを取得する場所をわかるようにします。

以下のコマンドを実行し、プロジェクトの composer.json ファイルに加えた変更を読み込み、パッケージをインストールします。

composer update

これで、プロジェクトの vendor ディレクトリにパッケージが見つかるはずです。 

By Tsuki