ページの作成と編集
概要
**ページ(Page)**は、記事、ノート、ドキュメントなどの長文コンテンツを作成するためのコンテンツタイプです。Markdownテキストエリアに直接記述することで、見出し、リスト、画像、リンクなどを含む高度な文章を作成できます。
ページの作成
手順1: コンテンツ作成画面を開く
- 画面右下の**作成ボタン(+)**をタップ
- コンテンツタイプ選択画面が表示されます
- **「ページ」**を選択
手順2: 基本情報を入力
以下の情報を入力します:
必須項目
- タイトル: ページのタイトル(例: 「Reactのカスタムフック入門」)
- 公開範囲: PRIVATE / TEAM / PUBLIC から選択
任意項目
- 説明: ページの概要(検索結果やカード表示で使用されます)
- カテゴリ: ページを分類するカテゴリを選択
- 親フォルダ: ページを配置するフォルダを選択
例:
タイトル: Reactのカスタムフック入門
説明: カスタムフックの基本的な実装パターンと活用例
カテゴリ: プログラミング
公開範囲: PUBLIC
手順3: 本文を執筆
Markdownテキストエリアに本文を直接入力します。デスクトップでは右側にリアルタイムプレビューが表示されます。モバイルでは「プレビュー」タブに切り替えて確認できます。
Markdown記法の基本
テキスト装飾:
- 太字: 重要な箇所を強調
- 斜体: 補足情報や引用
取り消し線: 削除された内容の表示コード: プログラムコードやコマンドの記述
見出し:
# 見出し1(最大)
## 見出し2
### 見出し3
リスト:
箇条書きリスト:
- 項目1
- 項目2
- サブ項目2-1
- サブ項目2-2
番号付きリスト:
1. 項目1
2. 項目2
3. 項目3
リンク:
[リンクテキスト](https://example.com)
画像の挿入:

コードブロック:
```javascript
function greet(name) {
return `Hello, ${name}!`;
}
```
テーブル(表):
| 項目 | 説明 |
|-----|------|
| A | 内容A |
| B | 内容B |
引用:
> これは引用文です。
> 他の文献やコメントを引用するときに使います。
水平線:
---
手順4: プレビュー
エディタの表示は画面サイズによって異なります。
- デスクトップ(PC): 常に分割表示。左側にMarkdownテキストエリア、右側にリアルタイムプレビューが並んで表示されます。タブ切り替えはありません。
- モバイル(スマートフォン): 「入力」と「プレビュー」の2つのタブが表示されます。タブをタップして表示を切り替えてください。
手順5: 保存
すべての入力が完了したら、**「作成」**ボタンをクリックしてページを保存します。
ページの編集
編集画面を開く
- 編集したいページを開く
- ページ右上の**「編集」**ボタンをクリック
- 編集画面が表示されます
編集内容の保存
- 編集が完了したら、**「保存」**ボタンをクリック
- 変更内容が即座に反映されます
編集のキャンセル
- **「キャンセル」**ボタンをクリックすると、変更を破棄して詳細画面に戻ります
ページの実用例
例1: 技術記事の執筆
# Reactのカスタムフック入門
## カスタムフックとは
カスタムフックは、Reactのロジックを再利用可能な形で抽出する仕組みです。
## 基本的な実装パターン
以下は、フォーム入力を管理するカスタムフックの例です:
```javascript
function useFormInput(initialValue) {
const [value, setValue] = useState(initialValue);
const handleChange = (e) => {
setValue(e.target.value);
};
return { value, onChange: handleChange };
}
```
## 使用例
```javascript
function LoginForm() {
const email = useFormInput('');
const password = useFormInput('');
return (
<form>
<input type="email" {...email} />
<input type="password" {...password} />
</form>
);
}
```
## まとめ
- カスタムフックは状態ロジックの再利用に便利
- `use`プレフィックスを付けることが慣例
- Hooksのルールを守る必要がある例2: 学習ノート
# 線形代数 - 第3回講義
**日時**: 2025-11-14
**トピック**: 行列の演算と性質
## 今日の学習内容
### 1. 行列の積
行列の積は、左の行列の行と右の行列の列を掛け合わせて計算します。
重要なポイント:
- 積の計算には順序がある(AB ≠ BA)
- (m×n行列) × (n×p行列) = (m×p行列)
### 2. 単位行列
単位行列Iは、任意の行列Aに対して以下が成り立ちます:
- AI = IA = A
### 3. 逆行列
正則行列Aに対して、以下を満たす行列A⁻¹を逆行列と呼びます:
- AA⁻¹ = A⁻¹A = I
## 理解できなかった点
- 逆行列の計算方法(掃き出し法)
- 次回確認する
## 参考資料
- 教科書 pp.45-52
- [線形代数の基礎(Web教材)](https://example.com)
## 次回の予習
- 行列式の計算方法
- 教科書 pp.53-60を読む例3: 議事録
# プロジェクトA 週次ミーティング
**日時**: 2025-11-14 10:00-11:00
**場所**: 会議室B
**参加者**: 田中、佐藤、鈴木、高橋
## アジェンダ
1. 先週の進捗確認
2. 今週のタスク確認
3. 課題の共有と対応策検討
## 議事内容
### 1. 先週の進捗確認
**完了したタスク**:
- ログイン機能の実装(田中)✓
- データベース設計の完成(佐藤)✓
- デザインモックの作成(鈴木)✓
**未完了のタスク**:
- API仕様書の作成(高橋)→ 今週中に完了予定
### 2. 今週のタスク
| 担当者 | タスク | 期限 |
|-------|--------|------|
| 田中 | ユーザー登録機能 | 11/18 |
| 佐藤 | データベースマイグレーション | 11/16 |
| 鈴木 | トップページのコーディング | 11/20 |
| 高橋 | API仕様書 + API実装開始 | 11/17 |
### 3. 課題と対応策
**課題**: テスト環境のセットアップが遅れている
**対応策**:
- 佐藤がテスト環境構築を優先的に実施
- 完了次第、全員でテスト環境の動作確認を実施
## 次回ミーティング
**日時**: 2025-11-21 10:00-11:00
**場所**: 会議室Bマークダウン記法クイックリファレンス
| 記法 | 結果 |
|---|---|
# 見出し1 | <h1>見出し1</h1> |
## 見出し2 | <h2>見出し2</h2> |
**太字** | 太字 |
*斜体* | 斜体 |
`コード` | コード |
[リンク](URL) | リンク |
 | 画像 |
- リスト | • リスト |
1. 番号付きリスト | 1. 番号付きリスト |
> 引用 | > 引用 |
--- | 水平線 |
ヒントとコツ
1. 見出しを活用して構造化する
長文の記事は、見出しを使って階層構造を明確にしましょう。
# メインタイトル
## 大見出し
### 中見出し
#### 小見出し2. リストで情報を整理する
箇条書きや番号付きリストを使うと、情報が整理されて読みやすくなります。
3. コードブロックで技術情報を記述する
プログラムコードやコマンドは、コードブロックで記述すると見やすくなります。
```javascript
// JavaScriptコード
```
```python
# Pythonコード
```
```bash
# シェルコマンド
```
4. 画像を効果的に使う
- スクリーンショットや図表を挿入すると、理解しやすくなります
- 画像サイズは自動調整されます
5. リンクで関連コンテンツをつなぐ
- 他のページへのリンクを貼ることで、知識のネットワークを構築できます
- 外部サイトへのリンクも自由に貼れます
よくある質問
Q1: 下書き保存はできますか?
A: はい、ページを下書きとして保存できます。作成画面でステータスを「下書き」に設定して保存すると、公開せずに内容を保存できます。また、エディタ内でのオートセーブにも対応しており、編集内容は自動的に保持されます。
Q2: ページの削除はできますか?
A: ページ詳細画面の右上にある「...」メニューから「削除」を選択できます。
Q3: 画像のサイズ変更はできますか?
A: 画像は自動的に適切なサイズに調整されます。個別のサイズ指定は今後追加予定です。
Q4: 他のユーザーと共同編集できますか?
A: 共同編集機能は今後追加予定です。現在はコメント機能を使って、フィードバックを共有することができます。
0
0
0
0
投稿0
フォロワー0
いいねプロパティ
ページ
DOCS