---
# System prepended metadata

title: シェアハウス

---

# シェアハウス
# <span style="color: red;">  桑原</span>

<h2>
    Bubbleデザイン系
</h2>

<h3>
    CSS系(書き方がいくつかある)   
</h3>

https://codepen.io/Grsmto/pen/RPQPPB
https://uxmilk.jp/7775
https://note.com/jansnap/n/n2f9185f71f8c
https://jajaaan.co.jp/css/button/
https://webukatu.com/wordpress/blog/5607/
https://saruwakakun.com/html-css/reference/buttons#section4
https://obatrip.jp/css-settings/

<h3>
    アニメーション系
</h3>

https://webpia.jp/bubble-animation/
https://app.lottiefiles.com/


ログイン機能はFirebaseの機能の匿名認証を利用予定
（どうしようもなくなったらメール＆パスワード認証）それをつくりかえられるならそれで
ver違い発生で、勉強中。

ひとまず実際に動くSNS制作、Webサービス、実際に動かす場合どうするか



エディタ　VSCode？　使いやすいのあったらそれで
言語など
知っている言語で行くか、比較的簡単といわれている言語で行くか
webアプリ想定なのでスマホ系の言語は検討するのか
フロント系　HTML/CSS、javascript、リアクト　（ここは任せる）
サーバ系　javascript、JSON、PHP、Java、
Python（+ Django、Flaskなど）、Ruby、
スマホ向けなら　Scala、swift、kotlin
サーバ　AWS想定　不都合があったら都度相談
データベース　MySQL　その他オラクルとか使える人がいるなら検討

既存のSNSサービスから学ぶ
どのSNSでも実装されている根幹部分は作りたい

ショッピングサイトを例としてやる
はじめの画面：ログイン画面
ログイン後：マイページor全部の投稿が見える画面
試作の際はデータベースの容量がやばそうなら投稿数をどうにかする？。
どちらにせよ、全体投稿のほうは実際の環境にしてみないとどう動くのかわからん
AWSでのいろいろ入力とかどうなるかわからん
サーバ関連がわからん
自分の投稿＆閲覧くらいなら今でもギリわかる。
デザイン、付け足しの機能については実装の想像ができてない

### 予定画面一覧

ログイン画面
マイページ画面
全体投稿画面
投稿画面
他者のマイページ画面
名前とかパスワード変更はSQLがわのやつが調べれば出そう
部屋を作って話す内容分けるとか


SNS制作
一旦、メインの機能を制作することを重視

- ログイン
- つぶやき、タイムライン
- マイページ、他者のマイページ
- 画像はぼやけるように
- いいねとか
これだけで独立して作品として提出できるくらいの感じで

DAO機能はグループ機能みたいなやつ
<h2>
    ひとまずSNS根幹を作るべき
</h2>

firebaseのリンク

https://console.firebase.google.com/project/react-post-apple/hosting/sites?hl=ja

### データベース参考サイト

https://tora-k.com/2022/08/29/javascript-chatapp/#toc2

- **~~データベース系で出来る可能性があるやつ~~**
    
    モックサーバー
    
    https://qiita.com/ryome/items/36da51f0f5973eab8720
    
    react+Node.js+Mysql
    
    https://qiita.com/nemutya/items/b4c606168aa5be610e1e
    
    crosっていうのを使えばで解決できそうなやつ
    
    [https://nakanishi-s.jp/react-x-db-【動作編】/](https://nakanishi-s.jp/react-x-db-%e3%80%90%e5%8b%95%e4%bd%9c%e7%b7%a8%e3%80%91/)
    
    長くて細かく書いてあるやつ
    
    https://tec.tecotec.co.jp/entry/2021/12/23/000000#1ReactNodejs
    
    モックサーバーとの通信についてのやつ
    
    https://zenn.dev/longbridge/articles/82194eb0eaf710
    
    書けても組み込めるかわからん奴
    
    https://www.fenet.jp/dotnet/column/language/5109/
    
    よくわからんのを使う
    
    https://programming-engineer.com/nodejs-database-acquisition/
    

VisualStudioCodeでReactNativeのデバッグ環境を構築する

https://qiita.com/t_okkan/items/2b6b94340b837189054c

公式

https://ja.react.dev/learn/start-a-new-react-project

使ったやつ

[https://yoheiko.com/blog/react-jsでwebサイト又はwebアプリを作成する方法（初動）/](https://yoheiko.com/blog/react-js%E3%81%A7web%E3%82%B5%E3%82%A4%E3%83%88%E5%8F%88%E3%81%AFweb%E3%82%A2%E3%83%97%E3%83%AA%E3%82%92%E4%BD%9C%E6%88%90%E3%81%99%E3%82%8B%E6%96%B9%E6%B3%95%EF%BC%88%E5%88%9D%E5%8B%95%EF%BC%89/)

v6バージョンとの違い

https://coders-shelf.com/react-router-v6-intro/

JavaとEthereum
[https://kauri.io/#communities/Java Ethereum/connecting-to-an-ethereum-client-with-java-eclips/](https://kauri.io/#communities/Java%20Ethereum/connecting-to-an-ethereum-client-with-java-eclips/)




























-----------------------------------------------------
# <span style="color: red;">  宮沢</span>
## 2023/7/20
**Dappsの基本アーキテクチャ**
[引用先](https://tech-lab.sios.jp/archives/34367)
フロントエンドは通常のブラウザ上で実行され、バックエンドに当たる部分がブロックチェーンの世界になる。
![](https://hackmd.io/_uploads/S1tspgs82.jpg)

**スマートコントラクトの開発について**
==Remix IDEで開発パターン==
[雰囲気掴み](https://tech-lab.sios.jp/archives/33787)
- 統合開発環境：Remix IDE (<span style="color: red;">ブラウザでセットアップ可能</span>)
- 開発言語：Solidity
- 手順
    1. Solidtyで.solファイルを作成
    2. .solファイル中でスマートコントラクトの処理を書く
    3. バージョンを選択して、実行(コンパイル)する
    4. テストネットにデプロイする
        - 意味：メインネットに展開する前にスマートコントラクトがどのように機能するかをシミュレーションする
        - Remixの場合は、GoerliまたはSepoliaテストネット
        - GoerliまたはSepoliaテストネットに接続するには、MetaMaskを使う
    6. メインネットにデプロイする

==Geth、Node.js、Truffle Suiteで開発パターン==
- Geth(イーサリアムクライアント)...イーサリアムノードを実行するためのソフトウェア
    - [ダウンロード先](https://geth.ethereum.org/downloads)
- Node.js...JavaScript実行環境
- Truffle Suite(Truffle、Ganache)...TruffleはDapp開発環境で、Ganachはパーソナルブロックチェーンを実現するソフトウェア
- Truffleのインストール方法
    - cmdを立ち上げ、`npm install -g truffle`と入力
- Ganacheのインストール方法
    - [ダウンロード先](https://trufflesuite.com/ganache/)

## 2023/10/16
==**Remix IDE**==...Ehereumの開発言語であるSolidityを使用するための開発環境。プログラミング、コンパイル、デプロイ、デバッグ可能

==**Geth**==...Ethereumが提供しているクライアントで、Go Ethereumの略称。
Ethereumノードを実行するためのソフトウェア。これにより、Ethereumネットワークに接続し、トランザクションを送信したり、スマートコントラクトをデプロイしたりすることができる。

==**Aragon**==...DAOの作成・管理機能を持ったツール
主な機能
- ガバナンストークンの発行・管理
- ガバナンストークンでの投票機能
- 資金のマネジメント

==**Node.js**==...非同期でイベント駆動型のJavaScript実行環境として設計されている。サーバサイドの開発に使用される

==**Truffle Suite**==...Ethereumの開発フレームワークで、スマートコントラクトの開発、テスト、デプロイができる。
<span style="color: blue;">Remix IDEと同様にSolidityで書かれたスマートコントラクトを扱うことができるが、より大規模なプロジェクトやチームワークに適している</span>

==**Django**==...PythonペースのWebフレームワークで、バックエンド開発に使用する。
データベースやユーザ認証などの一般的なWebアプリケーション機能を提供する

==**React**==...ユーザインタフェースを構築するために設計されている。主にフロントエンドの開発に使用される

==**Nostr**==...リレーサーバーという分散型（非中央集権型）ネットワークを制御する通信プロトコル。
各ユーザが自分自身のデータを管理し、他のユーザと直接通信することを可能にする


## 2023/10/18

### 組み合わせ
<span style="color: blue;"> **スマートコントラクト編** </span>

1. ==**Remix IDE**== または ==**Truffle Suite**== を使用してスマートコントラクト(DAO)を開発する
<span style="color:blue ;">今回は小規模の開発を行うため、==**Remix IDE**== を使用すると考えている</span>

2. ==**Geth**== を使用してEthereumノードを起動する。

3. ==**Remix IDE**== と ==**Geth**==　が接続されていることを確認したら、==**Remix IDE**==　で作成したスマートコントラクトを ==**Geth**== 経由でEhereumネットワークにデプロイする

4. スマートコントラクトがデプロイされたら、そのアドレスをコピーする

5. ==**Aragon**== に移動し、提案を作成しオプションのところに先ほどコピーしたスマートコントラクトのアドレスを貼り付ける 



<span style="color: blue;"> **リレーサーバ編** </span>

 ==**Node.js**== と ==**Nostr**== を使用してリレーサーバ(バックエンド)を構築する。
    - **クライアントから送信されたメッセージを受け取る**
    - **それらを他のリレーサーバに転送する**
    - **また、他のリレーサーバから受信したメッセージをクライアントに転送する**
    
   <span style="color: blue;">
    具体的使用例
    
    ユーザが新しい投稿を作成した場合、その投稿はNostrを介してリレーサーバに送信される。
    リレーサーバはその投稿を受け取り、他の接続されているNostrクライアントやリレーサーバに転送する。
    これにより、他のユーザがその投稿をリアルタイムで見ることができる
   </span>



<span style="color: blue;"> **バック、フロント編** </span>

1. ==**Django**== を使用してバックエンドシステムを構築する
- **このシステムはデータベースと連携し、ユーザ認証やデータ管理なの機能を提供する**
       <span style="color: blue;">
        - ユーザ情報の管理
        - 投稿データの保存と取得
        - ユーザ間の関係性を(フォロー/フォロワー)の管理
        などを担当する
       </span>
   
   <span style="color:red ;">
    
    **データベースエンジンの選択**
    - MySQL X
    - FireBase ○
   </span>

2. ==**React**== を使用してフロントエンド(ユーザインタフェース)を開発する。
- **開発したインタフェースはバックエンドサーバと通信し、必要なデータや操作をユーザに提供する**
   <span style="color: blue;"> 
    - 投稿の表示
    - ユーザプロフィールの表示
    - 投稿フォームの提供
    などを担当する
   </span>

### Q&A
Q：==投稿のデータはどこに保存されるのか？==
A：分散型SNSの場合は、各ユーザの投稿データは通常、そのユーザ自身のデバイスに保存される。
**一方、中央集権型のSNSでは、すべてのユーザデータ(投稿を含む)は中央のサーバ上に保存される。しかし、分散型SNSでは中央サーバは存在せず、代わりに各ユーザが自分自身のサーバまたは「ノード」を運用する**

Q：==なぜデータベースはMySqlじゃなくFireBaseなの？==
A：MySqlはCLI操作かつ大規模なデータ扱いが苦手のため、==**FireBase**== をすることにした。
==**FireBase**== はリアルタイムのデータ同期や大規模なデータセットの管理が優れていることろがある


## 2023/10/20
### 「Remix」の画面構成
![](https://hackmd.io/_uploads/ByeWPKyGT.png)


![](https://hackmd.io/_uploads/rk2iPFJG6.png)


## 2023/10/23
==**Solidity**==...Ethereumのブロックチェーン上で動作するスマートコントラクトを開発するためのオブジェクト指向言語
- EVM Codeに翻訳するためのコンパイラでもある

## 2023/10/25
**スマートコントラクトを開発手順**
コーディング→コンパイル→テスト環境へのデプロイ→テスト

![](https://hackmd.io/_uploads/HJccCyLz6.png)

## 2023/10/30
**Remix IDEのENVIRONMENT**
==ENVIRONMENT==...デプロイ先となるネットワークを選択します。
```
・Remix VM (London) : ブラウザでサンドボックスブロックチェーンに接続。「Remix VM」(旧「JavaScript VM」) は、独自のブロックチェーンであり、リロードするたびに古いチェーンがクリアされ、新しいものが開始される。古いものは保存されない。「London」は、EthereumのLondonフォークを指す。
・Remix VM (Berlin) : 「Remix VM (London)」と同樣。「Berlin」は、EthereumのBerlinフォークを指す。
・Injected Provider - MetaMask : 「injected web3 provider」にRemixを接続。
・Hardhat Provider : ローカルの「Hardhatテストチェーン」に接続。
・Ganache Provider : ローカルの「Truffle Ganacheテストチェーン」に接続。
・Foundry Provider : ローカルの「Foundry Anvilテストチェーン」に接続。
・WalletConnect : 「WalletConnect」を使用して、モバイルデバイスでトランザクションを承認。
・External HTTP Provider (旧「Web3 Provider」) : リモートノードに接続。選択したプロバイダー (geth、parity、その他のEthereumクライアント) にURLを提供する必要がある。
・L2 - Optimism Provider : 「Optimism Network」のメインネットの設定を使用して、「Injected Provider」 (通常は MetaMask) に接続。
・L2 - Arbitrum One Provider : 「Injected Provider」(通常はMetaMask) に「Arbitrum Oneネットワーク」の設定で接続。
```
## 2023/12/01
==Mastodon==...連合型のソーシャルネットワークサービス
Mastodonでサーバ構築するに必要なもの
- サーバ
- グローバルIPアドレス
- ドメイン名
- SSL証明書














----------------------------------------------------------
# <span style="color: red;">  鳥越</span>
## 2023/10/12
![](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F191114%2F922901ea-4d92-f67c-3f38-ac245a1413c5.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&w=1400&fit=max&s=fd26ea533ccfa64684fca23b12eeecb1)

サーバをリレーするのにアカウントが必要です
WebSocket：常時通信していてリアルタイムの接続に向いてる


<p>nostr内での定義</p>

```
npub` 公開鍵
`nsec` 秘密鍵
`note` テキストノート([テキスト投稿])のI
```
    
    
<p>したがnostr共通？の鍵ペア作成コード</p>
    
```
  "id": <32-bytes lowercase hex-encoded sha256 of the serialized event data>,
  "pubkey": <32-bytes lowercase hex-encoded public key of the event creator>,
  "created_at": <unix timestamp in seconds>,
  "kind": <integer between 0 and 65535>,
  "tags": [
    [<arbitrary string>...],
    ...
  ],
  "content": <arbitrary string>,
  "sig": <64-bytes lowercase hex of the signature of the sha256 hash of the serialized event data, which is the same as the "id" field>
}
```


## 2023/10/12
<p>今日やること</p>

1. 鍵発行
1. firebase接続


[これです](https://qiita.com/comware_terashi/items/d9e357b0330bb312a37d)

## 2023/10/20
<p>メモ</p><p>knit2→websocektの環境</p><p>testdディレクトリでnode index.jsで起動</p><p>testfire→firebaseの開発環境</p>
https://socket.io/get-started/chat


<h2>リーダーのありがたい言葉</h2>

<h3>これできるのかな？  
    </h3>
    <h1>
    よし
</h1>

<h3>####</p>
<h3>#終# </p>
<p>####</h3>

## 2023/10/20

<p>本番環境でやるならfirebaseのルールを設定する</p><p>テーブル定義</p>

```
tittle→ユーザID　　youser_id
content→ユーザーネーム  youser_name
```

<p>firebaseつながったら画面遷移作る</p>

`npm install react-router-dom`

[画面遷移](https://zenn.dev/macmeals/articles/2f1546f3354de4)

[firebaseの接続＋使い方みたいなやつ](https://qiita.com/Naoya_pro/items/a42f1ecae8acce249ef3)

<p>loginpostでやってるけど画面遷移できないなう</p><p>課題点</p>

* 鍵情報を分散して端末に保存できる？
* 鍵情報の発行ってどこでやってるん？
* 
## 2023/10/20

めも
まず、Nostrリレーサーバを使用するには、NostrのAPIを使用する必要があります。Nostr APIは、RESTful APIとして提供されています。ReactでAPIを使用するには、fetch APIを使用することができます。fetch APIは、JavaScriptのネイティブAPIであり、HTTPリクエストを送信し、レスポンスを受信するために使用されます。

次に、Nostrリレーサーバに接続して投稿を取得するためには、WebSocketプロトコルを使用する必要があります。WebSocketプロトコルは、双方向通信を可能にするプロトコルであり、サーバーとクライアント間でデータを送受信するために使用されます。ReactでWebSocketプロトコルを使用するには、WebSocket APIを使用することができます。

最後に、Nostrリレーサーバから投稿を取得するためには、NostrのAPIエンドポイントを呼び出す必要があります。APIエンドポイントは、HTTPリクエストを送信し、JSON形式のレスポンスを受信します。ReactでAPIエンドポイントを呼び出すには、fetch APIを使用し、JSON形式のレスポンスを解析する必要があります。

以上の手順に従ってReactでNostrリレーサーバに接続して投稿を取得することができます。もし何か質問があればお知らせください。


RESTful API
RESTとは
REpresentational State Transferの略で、分散型システムにおける複数のソフトウェアを連携させるのに適した設計原則の集合、考え方のこと
fetch API
HTTPリクエストを発行する API
リクエストやレスポンスといったプロトコルを操作する要素にアクセスするための JavaScript インターフェイスです



<p>息抜きで今までのポート開けられない問題かいけつした</p><p>ファイヤーウォールの設定で引っかかっていたのでＰＣ本体のポート8000を直接許可するとできたんご</p>

1. コントロールパネル
1. システムとセキュリティ
1. ファイヤーウォール
1. 詳細設定
1. 受信or送信の規則
1. 新規規則
1. ポートに8000
1. 命名を何でもいいので書く

<p>んでもって疑似的にサーバを二つ立てられましたとさちゃんちゃん</p><p>アイコンの表現認証したときにwebドキュメントみたいのにあらかじめ保存させてくっつけたらfireにデータ要らんくね？</p>

https://dev.classmethod.jp/articles/websocket-messagepack/


## 2023/11/1
<p>やること</p>
<p>新規dirに</p>
<p>nostrのAPI接続</p>
<p>websocet apiの実装</p>
   <p> nostrのAPIからたたいてhttpリクエストそうしんして受信</p><p>firebaseの接続</p>
   
## 2023/11/1
1. 2ポートでおんなじデータを格納
1. nostrせつぞくして投稿データ取得
## 2023/11/1
<p>nozokimado作業中200まで翻訳済み</p>
<p>
     npm run devで動く
</p><p>11/30追記（階層srcに移動しないと動かんぞ）</p>

## 2023/11/15

<p>ディレクトリの確認と最悪viewを消して同じ階層にする</p>

## 2023/11/15

<p>Homeのcssを回収するのだ明日の自分</p>



# <span style="color: blue;">  mastodonメモ</span>

knitmasu1\Knit_sample\live\config\themes.yml
テーマの格納先
履歴欄なかったからここにいったんおきます
classic-base-color: #282c37;みぎ$classic-base-color: #ffffff; 
C:\Users\torigie\Desktop\開発\knitmasu1\Knit_sample\live\app\javascript\images\mailer\wordmark.pngの画像差し替えた


Expiry Date: 2024-03-02 11:29:51+00:00 (VALID: 73 days)
証明書期限

----------------------------------------------------------
# <span style="color: red;">  風間</span>
react.jsを使ってフロントエンドの開発する
## Reactでできること
ReactとJavaScriptだけで
・Webアプリ開発
・モバイルアプリ開発
・VR開発
を行うのが可能

React.jsで可能なこと
コンテンツをそれぞれ別々の要素として配置できる
コンテンツが独立してることでSPAとして動くアプリを作ることができる。

SPA(シングルアプリケーション)
本来アプリの画面などの更新する際に、アプリ全体を更新する必要があるが、SPAはコンテンツが独立しているため一部の更新のみでOK 

## Reactの環境設定
### Reactとは
Javascriptのフロントエンドのフレームワークの一種

![](https://hackmd.io/_uploads/SJEDBmTv3.png)

## 仮想DOM
JavaScriptのHTMLはDOMを使って開発する
### メリット
画面表示の操作を簡単にする
Reactの中に仮想DOMがありプログラムで仮のDOMを構築し
それに対して操作しＤＯＭに反映する仕組みになっている
通常のDOMより処理速度が速くなる

![](https://hackmd.io/_uploads/B1Lzd7pDn.png)

[Reactのインストール方法](https://nodejs.org/ja/download/)
1. ようこそNode.jsインストーラーへ →　続ける
2. 使用許諾契約　→ 続ける　→ 同意する
3. インストール先の選択　→　続ける
5. "XXXXX"に標準インストール　→ インストール
6. インストールが完了しました　→ 閉じる

## node.jsとは

### できること、メリットデメリット

####  できること
本来ブラウザ上でのみ動作するJavascriptを、パソコン上で実行できる環境を作ることができる

・サーバーの構築・運用
・Webアプリやスマホアプリの開発
・IoT分野

###  メリット
・大量アクセスに強い
・C10K問題を解決できる
クライアントが10000以上に達した場合ハードウェアの性能に余裕があってもレスポンス性能が下がる問題を指す
・クライアントサイドとサーバーサイドでJavaScriptを使える

###  デメリット
・対応サーバが少ない
・定期的なアップデートが求められる
・開発の際に知識が必要になる

## Reactを使用するにあたって知っとくべき知識

### JSX
JSXとはJavaScriptの構文拡張
ファイル内にHTMLのようなコードを記述できるようにする
開閉タグ、属性、入れ子要素がある

JSXの仕組み
ブラウザで実行される前に、通常JavaScriptに変換される

`const element = <h1>Hello, world!</h1>;`

これが、次のように変換される

`const element = React.createElement("h1", null, "Hello, world!");`

## JSXとReact
JSXによりコンポーネントのマークアップとロジックを1つのファイルに記述することができる

``import React from 'react';

function Greet() {
  return ``<h1>Hello World!</h1>``;
}
export default Greeting;``

この例では、Greetという名前の関数コンポーネントがあり
h1よそを挨拶のメッセージとしてレンダリング(あるデータを処理することで画像表示すること)

JSXでCSSを使う
CSSは、インラインスタイル、個別のCSSファイル、CSSinJs
ライブラリなど、様々な方法でJSXコンポーネントに適用することができる。インラインスタイルは、JavaScriptオブジェクトを使用して
JSXマークアップ内で直接定義される。


***単方向データフロー***
単方向データフロー(UDF)は、状態が下方に流れ、イベントが上方に流れる設計パターンであり、単方向データフローに従うことでUIに状態を表示するコンポーザブルをアプリ内で状態を保存および変更する部分から分離できる。

・イベント：UIの一部がイベントを生成して情報に渡す
・更新の状態：イベント　ハンドラが状態を変更する
・状態の表示：状態ホルダーが状態を下方に渡しＵＩが状態をあらわす

![](https://hackmd.io/_uploads/rkf8EZWt2.png)

Jetpack　Compose
・テストの容易性
・状態のカプセル化
・UIの整合性

Reactの導入から活用まで↓

[google]
https://udemy.benesse.co.jp/development/app/react-beginner.html


# スマートコントラクト開発
## ENS
ドメインのようなもの
0xb8c2C29ee19D8307cb7255e1Cd9CbDE883A267d5のような長いものをnick.ethといものに簡略化できるため覚えやすく送信ミスも防げる

参考資料
https://tech.hashport.io/3277/

# Ethereum(Dapp)開発の全体像
Dappは大きく分ける次の三つの要素から成る

スマートコントラクトを動かすノードとそのネットワーク
ネットワークにデプロイされるスマートコントラクト
スマートコントラクトの実行をリクエストするフロントエンド
1.ノードとネットワークを主に扱うのがGanache、

2.スマートコントラクトの開発を扱うのがTruffle、

3.フロントエンドを扱うのがdrizzleとなる。

![reference link](https://hackmd.io/_uploads/BkYeamLWa.png)


### 参考資料
SnapShot
https://demo.snapshot.org/#/setup?step=1

## Remix IDE(統合開発環境)
* コードエディタ
* コンパイラ
* リンカ
* デバッガ
* テストツール
* バージョン管理ソフト

# リンカとは
ソフトウェア開発ツールの1つ
プログラムを連結、編集して実行可能ファイルを作成するソフトウェアまた、オブジェクトファイルが必要とするライブラリやモジュールを見つけそれを
プログラムに組み込むことを行う。

# Ethreumノード
* ライトノード
* フルノード
* アーカイブノード

ライトノード
**Block header**(ブロックヘッダー)のみ保持
トランザクションが必要な時はフルノードから取得

**Block header**とは
ブロックチェーン技術において重要な概念
前のブロックのへのリンク(ハッシュ)、タイムスタンプ
取引のルート(マークルツリーのルートハッシュ)、難易度ターゲット
ブロックの生成に必要な「ナンス」などの情報が含まれる

・ブロックチェーンを構成する一連のブロックが正しく接続されることを確認
するために使用される
・ハッシュ値はブロックを一意に識別するために使用される番号として
使われる。
この番号は単なる一連番号ではなくブロックヘッダーのハッシュ値であるため改変されていないことも保証する

**ナンス**
[一度だけ使われる数]という意味
主に暗号通信などで使われ使い捨ての32ビットの値のことを指す
マイニングの過程で条件を満たすハッシュ値を探すためにナンスをひたすら代入することが必要になる
つまり、ナンスが変わればハッシュ値も変わるため、
マイニングとは、ハッシュ値の条件を満たすナンスを誰が一番早く見つけるかを競う作業ともいえる。

**マークルツリー**
データの要約結果を格納するツリー状のデータ構造のことを指す
マークルツリーは主に大きなデータの要約と検証を行う際に使われる
具体的には、2つのデータがあるとき、まずＡのハッシュとＢのハッシュをそれぞれ計算する。そのハッシュ値を足し合わせた値のハッシュ値をとったものが頂点の値(マークルルートになる)
実際に使われる場合は複数段のツリー構造で構成されている。
2段3段と2個ずつハッシュを纏めていく。
そして最終的に得られた頂点のハッシュ値はマークルルートと呼ばれる。

どんな値を入力しても一定の長さの値を返すハッシュ関数を使用していることからどんなに大きなデータ、どんなに多くデータを入力しても最終的には得られる値は、一定のデータ帳になるという特徴があるこれにより大量のデータを効率的に要約し、その完全性を保証することができる。

**Solidityの構文解説**

## 関数
![](https://hackmd.io/_uploads/H1cddWAbT.png)

// 冒頭でsolidityのバージョンを指定する。
pragma solidity ^0.6.7;

// contractという大きな入れ物を定義。ここに関数や変数を指定する。
contract Hello {

    string public productname='Hello World';

    // 関数定義
    function setname (string memory name1) public {
        productname = name1;
    }

    // 関数定義
    function getname () public view returns (string memory) {
        return productname;
    }
}

解説

```pragma solidity ^0.6.7;```

この行は、コードが動作するSolidityのバージョンを指定している。
^記号は、0.6.7以上のバージョンであればどのバージョンでも良いことを示している

```contract Hello {```
この行は、新しいスマートコントラクトHelloを定義しています.

```string public productname='Hello World';```

この行は、公開された文字列型の変数productnameを定義し、初期値として'Hello World'を設定している。publicキーワードにより、この変数はコントラクト外部からアクセス可能である

```
function setname (string memory name1) public {
    productname = name1;
}
```

この関数setnameは、引数として文字列name1を受け取り、それをproductnameという変数に設定。この関数はpublicと宣言されているため、このスマートコントラクトの外部から呼び出すことができる
publicのほかに3つの修飾子がある
* private
    関数がそのコントラクト内からのみアクセス可能であることを意味する
* internal
    関数がそのコントラクトおよび継承したコントラクトからアクセス可能であることを意味する
* external
    関数がトランザクションやコントラクトの外部からのみ呼び出すことができることを意味する。



```
function getname () public view returns (string memory) {
    return productname;
}
```

この関数getnameは、現在のproductnameの値を返す。この関数もまたpublicと宣言されているため、コントラクト外部から呼び出すことができる。 viewキーワードは、この関数が状態を変更しないこと（つまり、ブロックチェーン上のデータを読み取るだけで、書き込みや変更を行わないこと）を示している

データの保存場所
memoryとstorage
明示しない場合デフォルトの保存場所に保存されるが
明示することでオーバライドできる。
関数の戻り値のデフォルトはmemory
ローカル変数として宣言した場合はstorage

memoryの場合は処理中だけ保持され終わったら保持されない
storageの場合は、処理後ブロックチェーンに保持される

# Remix IDEのコンパイル方法

![](https://hackmd.io/_uploads/BJA4nY1za.png)
１左上のメニューから上から3番目を開く
(実行したいファイルをあらかじめ選択しておく)
準備が完了したら青く光っているCompile ファイル名をクリック
ここでエラーがあると赤く表示される
完了すると右上にチェックマークがつく




## スマートコントラクトのデプロイ・動作確認
![](https://hackmd.io/_uploads/rJ9TaYJzT.png)

https://qiita.com/abenben/items/e8b12b183de59b781283

【図表2】投票システムを実装したEthereum

![](https://hackmd.io/_uploads/BylgHs3Ga.png)













