Posts

c/c++を使うならcmake! を使えるようになろう 前提知識 c/c++をライブラリとして提供するときに必要な奴ら /include, /lib, だよね。 /includeにはヘッダーが入っていて、/libには、コンパイルによって生成されたライブラリが入ります。hogehoge.soとか、hogehoge.aとか。 で、こいつらは基本的に、/usr/local/いかに格納されます。 ヘッダーについても説明しておく。ヘッダーは簡単にいうと、関数の入出力を規定したファイルです。 プログラムをビルドする流れは、コンパイルー＞リンク　だけど、コンパイルの時点では、ライブラリとして読み込まれたファイルがどんな ヘッダーファイルの種類 ヘッダーファイルには２種類ある。 #include<stdio.h> #include "my_library.h" みたいな感じで、<>で囲まれているやつと、““で囲まれているやつ。<>は、システムのライブラリを読み込むときに使われます。システムライブラリのヘッダーは、/usr/local/includeとか、 /usr/include/に置かれます。ライブラリ (オブジェクトファイル) 本体は、/usr/libとか、/usr/lib64とかにおかれます。 一方、““はユーザが作ったライブラリを読み込むために使われます。““を使うと、コンパイラはカレントディレクトリの中で該当するヘッダーファイルを探します。 ライブラリとヘッダーは、一対一対応します。つまり、 プログラムからライブラリを読み出すときは必ず、ヘッダーでインクルードして、最後リンクする必要があります。 ユーザが定義したヘッダーでも同じです。まず、hogehoge.hppとhogehoge.cppを作って、コンパイルするときに g++ main.cpp hogehoge.cpp みたいな感じで、hogehoge.cppもコンパイルします。オブジェクトができて、最後にリンクしています。 コンパイルー＞リンクって流れを覚えておけば問題ないです。 サーチパスを追加したいときは、-Iで、ヘッダーのディレクトリ、-Lでライブラリのディレクトリをつけます。 ld (リンカー) がデフォルトで見に行くディレクトリパス LD_LIBRARY_PATH という環境変数で定義されています。これは変えられます。次のようにサーチパスを追加します。 export LD_LIBRARY_PATH=/usr/local/lib:$LD_LIBRARY_PATH ちなみに、ldっていうのは、 Origins of the name "ld" are "LoaDer" and "Link eDitor" らしいです。知らんけど。 共有ライブラリと静的ライブラリ 共有ライブラリは、実行時に動的に読まれるのに対して、静的ライブラリは、コンパイル時に実行ファイルに組み込まれる。 どちらがいいかはわからないけど、共有ライブラリは、実行ファイル (実行バイナリ) の大きさが小さくなるよね。 ちなみに、共有ライブラリはShared Objectだから、.soっていう拡張子が付きます。一方、静的ライブラリは、 a collection of object files bundled together into a single archive fileなので、arichveの.aが付きます。 つまり、hogehoge.soとhogehoge.aですね。 ...

事始め 再び、singularity環境でコンテナをビルドする必要が生じた。cuSZで圧縮を実現するために 去年の10月にsingularityを使ってpymgardを作った時に殴り書きしたメモ 1. まずは、ちゃんとネットワーク越しに動くようにしたいです。そのために、singularityのコンテナを作ろうと思います。頑張ってください。 いま、eclairでSingularityのSandboxを作っています。Dockerfile的なのが、singularityにもあるらしくね、Singularity.defってのが、それから今作っています。Sandboxを。 singularity build --fakeroot --sandbox pymgard.sandbox Singularity.def WARNING: The underlying filesystem on which resides "/home/gp.sc.cc.tohoku.ac.jp/aoyagir/new_research/The_Middleware/src/python/pymgard.sandbox" won't allow to set ownership, as a consequence the sandbox could not preserve image's files/directories ownerships >>> compressed = mgard.compress(original, 0.1, 0, mgard.ErrorBoundType.REL, config) GPUassert: CUDA driver version is insufficient for CUDA runtime version /MGARD/include/mgard-x/Hierarchy/../RuntimeX/DeviceAdapters/DeviceAdapterCuda.h 628 cuda (ランタイム) はドライバーより古くても大丈夫。つまり、 なので、もしかしてまたエラーが起こるかもしれないです。つまり、/tmpで作ってくださいって話です。 で、ドライバーが最新のmuffin2で実行したら、普通に行けました。ナイスです。めっちゃナイスです。 --> ナイスですねー。あとは、そうですね、monakaで今後実験していくことになるので、monakaのipでハードコーディングしちゃってください！ ここに来るまでに売ったコマンド、ちょっとまとめておきますか。 sudo singularity build --fakeroot --sandbox pymgard.sif Singularity.def # SingularityのDockerfile的なの -> sandboxの. ここ、pymgard.sifじゃなくて、pymgard.sanxboxのが正しいのではないかな？まあいいや。 sudo singularity config fakeroot -add aoyagir singularity shell --fakeroot -writable pymgard.sandbox singularity build --fakeroot pymgard.sif pymgard.sandbox # sandbox -> sif singularity shell --nv pymgard.sif ポイントとしては、 1. singualrityはホームディレクトリを共有するからファイルを移動させる必要がないこと 2. fakerootを使うには、上のコマンドでfakerootが使えるように設定する必要があること 3. sandoboxじゃないと新しいモジュールはダウンロードできないこと 4. sifじゃないとなんか知らんけど、cudaがうまく使えないってこと。だから、sandboxからsifに変換する必要があるってこと。 --> sharkでも同じことをしました。sharkのGPUを使って評価したいと思いますー－－。 singularityにおけるDockerfile的なの Bootstrap: docker From: nvidia/cuda:12.1.1-devel-ubuntu22.04 %post apt-get update && \ apt-get install -y curl cmake git g++ pkg-config protobuf-compiler libprotobuf-dev libzstd-dev python3 python3-dev python3-pip curl -sL https://developer.download.nvidia.com/compute/nvcomp/2.6.1/local_installers/nvcomp_2.6.1_x86_64_12.x.tgz | tar xzvf - --directory=/usr/local pip3 install numpy pip3 install tiledb pip3 install h5py git clone https://github.com/szcompressor/cuSZ.git cusz-latest cd cusz-latest && mkdir build && cd build cmake .. \ -DPSZ_BACKEND=cuda \ -DPSZ_BUILD_EXAMPLES=on \ -DCMAKE_CUDA_ARCHITECTURES="75;80;86" \ -DCMAKE_BUILD_TYPE=Release \ -DCMAKE_COLOR_DIAGNOSTICS=on \ -DCMAKE_INSTALL_PREFIX=[/path/to/install/dir] make -j make install %environment export PYTHONPATH=/MGARD/build/lib 拡張子は、.defです。この名前じゃないとだめなのかはわかりませんが。 ...

これはなにか 西村めぐみさんが書いた「Linux + コマンド入門」 のまとめです。学んだことを箇条書きで書いていきます。 画面のクリア方法 clearってやるとクリアされるのはわかりますね。まあ、俺はあまりクリアすることはないんですけどね。。。。 これ以外に、ctrl + lでクリアできるってのを覚えておくといいかもね。lって、割とホームポジションの近くだし、覚えやすいのでは。 画面がフリーズした時の対処法 ctrl + sでターミナルへの出力が停止されます。 これは、ctrl + qで解除することができます。 uname周りについて unameはシステムの基本情報を出すコマンドだよね。 uname -a すべての情報。これだけ覚えておけばいいかな。あ、でもしたのも覚えておくといいかも uname -r これは、カーネルのリリース情報を出力するコマンドです。 よく、特定のカーネルパッケージをインストールしたいときとか、$(uname -r)って、シェル変数にしてコマンドを実行することがあるよね。 manコマンドを使いこなそうって話だ もうね、そろそろインターネットの情報ではなく、公式な情報から知識を得る方向にシフトしていった方がいい。情報の発信源ってのはすごく大事だからね。ってことで、 man <コマンド> で、そのコマンドの詳細を見られます。 chmodとパーミッションについて ls -laで、そのディレクトリのすべてのファイルの属性の詳細がみられますよね。 chmodでパーミッションを変更できます。 僕はいつも、数字で変更していますが、 chmod <対象> <操作> でも変更できます。 <対象> : u,g,o <操作> : + <r,w,x>, - <r,w,x>, = <r,w,x> って感じですね。 chownとchgrp chownで、ファイルの所有者とグループを変更できますよね。 実は、chgrpで、ファイルのグループだけを変更することができます。 ちなみに、自分が所属しているグループであれば、sudoが必要ありませんが、 それ以外のグループである場合は、sudoが必要であるということです。 また、自分が所属しているグループは、idとか、groupsで確認できるということです。 さらに、ちなみになんだけど、ユーザはデフォルトでプライマリグループっていう、自分一人のグループに強制的に加入させられているらしいです。 で、それ以外のグループをセカンダリグループっていいます。 findを使いこなせ まだ使いこなせていない。 find <場所>　-name <名前>　find / -name .bash* は、ルートディレクトリ以下で、.bashって名前が付くファイルを探せって意味だね。 いや、これ以外と使えるかもしれない。あのね、なんかね、findを使うといっつもめっちゃバーッて出てくるじゃない。あれって実は権限がないために出てくるエラーだったっていう、衝撃の事実。 findを使うときは、エラー出力を抑制する2>/dev/nullとセットで使おうって話です。 こんな感じです。 ...

ことはじめ Linux + コマンド入門って本を買いました。 今更入門！？って感じですが、やっぱりどんな本も学ぶべきものはあります。この本では、「いきなりLinuxの物理コンピュータを準備するのは初心者には難しいから、最初はVMでLinuxをいじってみよう！」って書いてあるんですね。で、vmは大学2年の時に触ったのですが、ちゃんと理解したことがなかったので、これを機にまとめてみようって感じですね。 前提知識 OSが起動されるまでの流れを改めておさらいしておきたいと思います。コンピュータが付きます。ROMに保存されているBIOSが起動されます。UEFIとも言いますね。BIOSがブートローダを起動します。GRUBっていうやつです。こいつは、カーネルをメインメモリにロードする役割を担います。ブートローダがカーネルをメインメモリにロードします。カーネルは、systemdを起動して、systemdがそれぞれのプロセスを順番に起動していきます。 さらに、仮想マシンが何かについて、改めておさらいしておきたいですね 仮想マシンですね。ハードウェアで実行される命令セットレベルでマシンの動きを再現しているので、Dockerとかのコンテナ仮想化に比べてかなり動きが遅いですね。 virtualboxのインストール方法 公式ホームページに富んで、インストーラからインストールしてください。 osのインストール方法 まずは物理サーバにインストールするときと同じように、ホストOSのストレージにインストールをしないといけません。 ちなみに、ホストOS (windows) 上で、ゲストosがインストールされるのは、C:/Users/hoge/VirtualBox Vmsってところです。ここに各vmごとにディレクトリが作られる感じです。 で、インストールの仕方ですが、まずはISOファイルってのを、各ディストリビューションプロバイダー？からダウンロードします。これがOSの元です。 余談ですが、「ISOイメージは、国際標準化機構 の定義した形式の光ディスク用アーカイブファイル」。ってかんじで、別にOSのために作られた専用のファイル形式とかではないって感じですね。わかりました。 で、virtualBox開いて、割り当てる資源量とかを設定して、起動するって感じですね。自動インストール設定がONになっていると、自動でインストールしようとしますが、大体失敗します。ですが、ここであきらめずにどのISOをマウントするか聞かれるので、マウントするISOを選択して再起動するとうまくマウントされます。 ネットワーク周りの設定 仮想化ソフトウェア (virtualBox) は、vm用に新しいネットワークを作ります。10.x.x.xとかだった気がしますが。 で、このネットワークのデフォルトゲートウェイが仮想化ソフトウェアってことです。ルータでもありますね。外界とインタラクションするには、NATをする必要があるってことです。 設定で変更が可能です。しかし、NATの設定は、基本的に内部ネットワークから外部への通信を可能にするだけで、外部から内部への通信はできませんよね。 それを可能にするためには、ネットワーク設定を「ブリッジモード」にする必要があります。これにすると、ipアドレスが割り振られますね。そのipアドレスにホストosからsshすると、ちゃんとつながるんですね。こりゃすごいことです。まあ、当たり前っちゃ当たり前なのかもしれませんが。僕は結構すごいと思っちゃいます。 ただね、ブリッジモードにした時の疑問なんですが、なんか知らんけど、ゲストOSと同じネットワークのIPをもらっちゃってるんですね。これ、どういうこっちゃと。 また、NATだけでは、vm同士の通信はできません。 vm同士を通信させたいときは、NATネットワークモードで動かしましょう。 centos上で、特定のuserにsudo権限を与える方法 centosではデフォルトでroot以外のユーザのsudo権限が与えられていません。いかにsudo権限の与え方を載せておきます。 rootでログインして、visudoをしてください。以下の方ナ行があると思うんで、 ## Allow root to run any commands anywhere root ALL=(ALL) ALL この下に、username ALL=(ALL) ALL を追記しましょう。 疑問 仮想マシンは命令セットレベルでコンピュータの動きを再現しているってのは理解しました。だから、ISOファイルをインストールするときは、armなのか、x86-64なのかを選んでインストールしないとだめなんですよね。ただですね、わからないのが、vmがいつどの段階で命令セットを理解しているのかって話。どの段階で命令セットアーキテクチャを理解するのだ？わからない。 x86_64上で動かしているから、x86_64じゃないと動かないのか、もしかして！そんな気がしてきた

カーネルモジュールとドライバーについて Driver: A driver is a software component that allows an operating system to communicate with and control a specific piece of hardware, such as a graphics card, network adapter, or printer. Drivers are typically provided by the hardware manufacturer and are loaded into the operating system to enable it to interact with and manage the hardware device properly. Drivers can be part of the kernel (built-in) or loadable as kernel modules. Kernel Module: A kernel module, also known as a loadable kernel module or LKM, is a piece of code that can be dynamically loaded into the running kernel of an operating system to add or extend its functionality. Kernel modules are often used to support new hardware devices or add additional features to the kernel without having to rebuild the entire kernel. While drivers are one type of kernel module (specifically, those that handle hardware), kernel modules can serve other purposes beyond hardware support, such as adding file systems, networking protocols, or other kernel-level services. In summary, a driver is a specific type of kernel module responsible for hardware device interaction, but not all kernel modules are drivers. Kernel modules can serve various purposes within the operating system, extending its functionality in different ways.

pythonのマルツスレッドに関するメモ In Python, when you create threads within a class, the scope of the class itself does not affect the lifetime of tthoe threads. threads will continue to run until they complete their tasks or are expicitly terminated. The scope of the code block where the class is defined or instantiated does not affect the threads in side the class. ということなので、スレッドをどうにかして停止する必要があるということです。どうやって停止するか？ なるほど、スレッドを停止されるには、joinメソッドを使えばいいんだな。なるほどなるほど。 joinに到達した瞬間、そのスレッドは停止される。理解した。

事始め タイトルの通りです。 OSはね、頻繁にアクセスされるファイルをメモリ上に載せておくんですね。ディスクアクセスは基本的に遅くなってしまうからね。その辺をいい感じにまとめておきたいのよね。 参考文献 [この方の記事] (https://qiita.com/ryuichi1208/items/bbf221ab66562e1426ca) [Linuxとメモリの基礎＆vmstatの詳しい使い方] (https://qiita.com/kunihirotanaka/items/70d43d48757aea79de2d) カーネルは、ディスク上のデータへのアクセスを高速に行うため、 read/writeの際にメモリ上にデータをキャッシュします。 キャッシュするメモリ上の領域を「ディスクキャッシュ」と 呼びます。 ディスクキャッシュには種類が2種類があります。それが「バッファキャッシュ」と「ページキャッシュ」です。 それぞれの概要は下記へ記します。 ちなみに、空きメモリがある限り、基本的にキャッシュはどんどん増加します。 ページというのは Linux の仮想メモリの最小単位。 ページキャッシュは、ディスク上のデータをページ単位で一時的に 保存するために使用されるメモリでファイルの読み書きの高速化に 使用されます。 バッファキャッシュは、プロセスがディスク上のデータに アクセスする際、アクセスすべきデータのブロックを高速に見つけるために使用されるメモリ メモリの状態を確認する方法 メモリの使用状況はfrreeコマンド、もしくはvmstatコマンドで確認することができる。 それを使う前に まず、基礎として覚えておきたいのが、osのメモリ構造だよね。 実メモリがあって、メモリには3つの領域がある。 1つ目が、使用中のメモリ。 2つめが、キャッシュ。 3つ目が、空きメモリ。」 さらに、HDD等に、スワップ領域があるんだよね。 使用中のメモリは、カーネルとアプリケーションなどのプロセスによって使用されているメモリのこと。 キャッシュとは、HDDやSSDアクセスなど、I/Oの高速化を行うためのキャッシュとして利用されるメモリのこと。空きメモリは、使用中のメモリとキャッシュに使われなかったメモリ。 使用中のメモリが増えると、空きメモリが減る。 空きメモリがある限り、基本的にキャッシュはどんどん増加する。 空きメモリがなくなれば、使用中のメモリの増加に応じて、キャッシュが減る。 キャッシュに割り当てられるメモリがなくなると、I/Oのパフォーマンスは低下する 使用中のメモリが実メモリより多くくなりそうになると、あふれる部分をスワップへ書き出す。 vmstatの結果 procs -----------memory---------- ---swap-- -----io---- -system-- ------cpu----- r b swpd free buff cache si so bi bo in cs us sy id wa st 1 0 1560 157622480 336252 333521088 0 0 0 3 0 0 9 0 91 0 0 freeの結果 total used free shared buff/cache available Mem: 494649720 3144036 157647192 53880 333858492 488291996 Swap: 4194300 1560 4192740 freeの方がわかりやすいよね。だから、freeを使うことにしよう。 total：合計メモリ量 used:メモリ使用量 free:全く使われていない未割当のメモリ量 shared:共有メモリで使用しているメモリ量 buff/cacheファイルバッファ＋キャッシュメモリに使われているメモリ量 available:プロセスが利用できるメモリ量 ...

ことはじめ いやー、研究でね、1プロセスからマルチスレッドで、ストレージから多次元配列データのサブセットを並列読み出しをする必要があってね。 HDF5っていうライブラリは、全配列データを一つのファイルで管理する一方で、 TileDBは配列データを複数のファイルに分けて管理しているんですね。 で、ですよ。前にも説明した通り、HDF5を使ってPararell readをしようとすると、 なんと性能がスケールしないんですよね。で、HDF5の公式サイトを見ると、HDF5はマルチスレッドをサポートしていないって書いてあったんですよ。 ただね、「マルチスレッドをサポートしていない」っていうのは、OSとのやり取り、具体的には、ファイルシステムとか、スレッドとか、その辺でインタラクションが生じて、 「マルチスレッドをサポートできない」んだと思うんですよね。 というのもね、chatGPTに聞いた話によると、 POSIX I/O operations, by default, do not provide built-in support for parallel reading of a single file from multiple threads. When multiple threads attempt to read from a single file concurrently using POSIX I/O functions, there is a potential for race conditions and data corruption because POSIX I/O operations do not provide automatic synchronization between threads for file access. ってことなんですよね。でね、システムがどのファイルシステムを使っていたかっていうとね、ext4なんですよね。でね、ext4はPOSIX互換なんですよね。 つまり、どうやら、HDF5がマルチスレッドをサポートしていないのではなく、 ext4が単一ファイルの並列読み書きをサポートしていない可能性が高くなってきた。 まだ確証は得られていないのですが。ということで、今からファクトチェックをしていきたいと思っています。 ...

ことはじめ 事情があってね、Mysqlではなく、Postgresを使わないといけないのですよ。 でね、PostgreSQL徹底入門手本を買ったので、それのまとめとか、読んでて気づいたこととか思ったこととか、そういうのまとめておきましょう。 全体を読んでの感想 やはり、Mysqlを使ってきたのでmysqlとの違いに目が行くわけですね。そうね、postgresは並列処理をスレッド並列ではなく、プロセス並列でやっているのが特徴的。Mysqlがスレッド並列だけどね。あと、プロセス単位でのコマンドが多い。つまり、プロセス内のコマンドではなく、プロセスとしてのコマンドね。これも結構違和感あるというか、一般的には、○○ーctlとかで一つのフロントエンドコマンドと、バックエンドで動いているデーモンプロセスの二つでエコシステムが構成されているが、postgresはなんかめっちゃ多い。 全体的にモダンな感じがしない。どちらかというと無骨だな。個人的にははやりMysqlがいいのではないかと思う。Mysqlであればストレージエンジンもプラがブルなのでinnodbとかほかのに変えることもできるし。しかし、俺にはPostgresを使わないといけない理由があるのだ！！ということで、使っていきたいと思う。しかし、何度も言うように、パフォーマンスはmysqlの方が断然上だし、 ほかのソフトとの親和性もmysqlの方が上だってことは伝えておきたい。apache igniteもmysqlとは接続性があるけど、postgresは聞いたことがないし。 あと、現在のpostgresの最新版は12だけど、これは11についてです。まあ、比較的新しいので気にする必要はないでしょう。 余談だが、この本を読んで知識が体系的にまとめられた気がする。 postgresはバークレイで作られた。結構歴史についても詳しくなったし、知識の精緻化が進んだよ。 ACIDとCRUDもネットワークに組み込まれたので、忘れることはないだろうし、ジムグレイ (1998念チューリング賞受賞者) がACIDを提唱して、実装した人だってのももうわかった。あと、Michael stonebreaker (2014念チューリング賞受賞者) ね。この人がpostgresを作った人で、まさに巨人だ。ありがたい。 めっちゃ余談だが、2016年は、www,ブラウザ、webのプロトコルの発明者、ティムバーナーずりー。2017年のチューリング賞受賞者はあのへねぱた本で有名なジョンヘネシーとデイビットパターそん。 2018年のチューリング賞受賞者の一人はヤンルカンだし、2020年のチューリング賞受賞者はジャックどんがら先生です。 Ubuntuへのインストール手順 パッケージをインストール もうパッケージが何かはわかるよね。あるソフトってのは様々なライブラリに依存して作られているんだ。我々は巨人の方に乗っからせていただいているんだ。で、依存ライブラリも含めて提供してくれるのがパッケージな。いいか？ sudo sh -c 'echo "deb https://apt.postgresql.org/pub/repos/apt $(lsb_release -cs)-pgdg main" > /etc/apt/sources.list.d/pgdg.list' wget --quiet -O - https://www.postgresql.org/media/keys/ACCC4CF8.asc | sudo apt-key add - sudo apt-get update sudo apt-get -y install postgresql サーバ起動手順 んー、本にはinitdbでデータベースクラスタ (データの保存先のディレクトリ) を作ってから起動する必要があるって書いてあったけど、今回はもう自動的に/var/lib/postgresql/12/mainに作られていたね。これはパッケージでインストールしたからかな。まあ、やってくれているなら問題ない。がinitdbちょっと使ってみたいんだよね。 あー、pg_ctlも使えないね。ちょっとこれはどうなのかな。 これがインストールの際の出力結果だね。 Creating new PostgreSQL cluster 12/main ... /usr/lib/postgresql/12/bin/initdb -D /var/lib/postgresql/12/main --auth-local peer --auth-host md5 The files belonging to this database system will be owned by user "postgres". This user must also own the server process. The database cluster will be initialized with locale "en_US.UTF-8". The default database encoding has accordingly been set to "UTF8". The default text search configuration will be set to "english". Data page checksums are disabled. fixing permissions on existing directory /var/lib/postgresql/12/main ... ok creating subdirectories ... ok selecting dynamic shared memory implementation ... posix selecting default max_connections ... 100 selecting default shared_buffers ... 128MB selecting default time zone ... Asia/Tokyo creating configuration files ... ok running bootstrap script ... ok performing post-bootstrap initialization ... ok syncing data to disk ... ok Success. You can now start the database server using: pg_ctlcluster 12 main start initdbもあるけど、パスが通っていないんだね。 でね、もうすでに起動しちゃってるんだわ。だから、気にせずに行ってくれ。マジで。 ...

事始め いやね、何回もreactを勉強しなきゃな！と思いつつも、実際に始めると、結局はhtml + css + vanila jsでやってることの管理を容易にするだけのもの、っていう感が否めなくてね。しかもフレームワークだからブラックボックス化されてい持ち悪いしね。 始めるはいいものの、途中で投げ出してしまうことがもう3回くらいあった。 正直、vanilaでもよくね？と思っている節はある。 htmlでid属性を使って名前を付けて、class名をつけることで、bootstrapを使えば一瞬できれいになる。しかしだ。やはりreactが使われているにはそれなりの理由があるのだろう。 ということで、まじめにやってみることにした。 ホワイトボックス化 ってことでね、結局中で何が実行されているかがわかればええやんってことなんだよね。 最終的にブラウザに届くのはhtml + css + jsであることには変わりない。 これはブラウザ側でhtmlを見ればわかる。 index.htmlが呼ばれているんだよね。 で、index.htmlからは、/static/bundle.jsが読み出されている。この/static/bundle.js が唯一のjavascriptファイルになっている。 reactプロジェクトの方では/src/いかにいろいろなコンポーネントを入れることになると思うんだけど、ビルド時にbundle.jsにまとめ上げられるってことなんだよね。それをまずは理解しよう。 開発　ー＞　ビルド　ー＞　一つのスタティックファイルができるって話。そうだそうだ。 /src以下の話 /srcいかにはいろいろなコンポーネントが入っているって話をしたけど、親玉がいるって話なんよ。それが、index.jsな。こいつがすべてのコンポーネントの生みの親ってこと。 親玉の中身を見てみよう。 import React from 'react'; import ReactDOM from 'react-dom/client'; import './index.css'; import App from './App'; import reportWebVitals from './reportWebVitals'; const root = ReactDOM.createRoot(document.getElementById('root')); root.render( <React.StrictMode> <App /> </React.StrictMode> ); うん。document.getElementByIdでidがrootのやつを召喚している。index.htmlには確かにrootというidを持つタグがいる。 で、ReactDOMってやつにコピーしているのか？わからんが。で、root.renderで何かを作っているな。で呼び出しているぞ。。なるほど。ここに次々にコンポーネントを追加していく感じだな。なるほど。ちなみに、root.render()に渡すのが import React from ‘react’; import ReactDOM from ‘react-dom/client’; import ‘./index.css’; import App from ‘./App’; import reportWebVitals from ‘./reportWebVitals’; ...