---
title: AIコーディング初心者勉強会#1 ClaudeCodeで始めよう！
tags:  #aiコーディング #初心者 #claude code  
author: [Quatrex](https://www.docswell.com/user/Quatrex)
site: [Docswell](https://www.docswell.com/)
thumbnail: https://bcdn.docswell.com/page/G75M8PMX74.jpg?width=480
description: 初心者向けのClaude Codeの勉強会です。 概要、インストールから、簡単な使い方まで。
published: July 19, 26
canonical: https://www.docswell.com/s/Quatrex/KMQGJL-2026-07-19
---
# Page. 1

![Page Image](https://bcdn.docswell.com/page/G75M8PMX74.jpg)

AIコーディング初心者勉強会 #1
Claude Codeで 始めよう！
これから始める人・非エンジニア歓迎。今日、いっしょに「最
初の一歩」を。
2026.07.19（日）20:00〜21:00
オンライン開催
システムエンジニア友の会


# Page. 2

![Page Image](https://bcdn.docswell.com/page/9J29K69QER.jpg)

今日の流れ
タイムテーブル（60分）
説明 → 実演 → ディスカッション。主役はディスカッションです。
20:00 – 20:05
オープニング 会の説明・約束ごと
5分
20:05 – 20:20
説明 AIコーディング／Claude Codeとは
15分
20:20 – 20:45
実演 環境構築〜はじめての起動
25分
20:45 – 21:00
ディスカッション 詰まり共有・質問（主役）
15分


# Page. 3

![Page Image](https://bcdn.docswell.com/page/DEY4N94YJM.jpg)

主催コミュニティ
システムエンジニア友の会とは？
SEの、SEによる、SEのための友の会です
SEやIT業界の人たち、老若男女問わず、みんなで幸せになる ことを目指しま
す
SEのための学びのネタを幅広に取り扱う、そういう場をつくっていきます


# Page. 4

![Page Image](https://bcdn.docswell.com/page/VJNYXLYR78.jpg)

この会について
「使う側」のための、やさしいユーザー会
● これから始める人に全振り。 環境構築でつまず
いた人こそ歓迎
● ツールは色々あるけど、今日は Claude Code に
集中
● 非エンジニアも大歓迎。見学だけでもOK
今日のアジェンダ
1
説明 AIコーディング／Claude Codeとは
2
実演 環境構築〜起動、使い方の例
3
ディスカッション 質問・感想


# Page. 5

![Page Image](https://bcdn.docswell.com/page/YE9P84PZJ3.jpg)

Goal
今日のゴール
全部やりきる会ではありません。最初の一歩を一緒に踏むのが目的です。
ざっくりわかる
はじめて起動できる
地図を持ち帰る
「AIコーディングって何？」の全
自分の環境で Claude Code を起
見学の人も「雰囲気」と「始め
体像をつかむ
動（有料プランがある人）
方の地図」を持ち帰れる


# Page. 6

![Page Image](https://bcdn.docswell.com/page/GE8D8QXYED.jpg)

01
PA R T 1 ／ 説 明
AIコーディングと Claude Code とは？


# Page. 7

![Page Image](https://bcdn.docswell.com/page/LELMRX897R.jpg)

説明
AIコーディングって？
ざっくり言うと、AIに手伝ってもらいながらコードを書く・動かすこと。
自然言語（日本語）で「こうしたい」を伝
バイブコーディング ＝細部より雰囲気で、
えると、AIが 書く・直す・調べる
AIと対話しながら作るスタイル


# Page. 8

![Page Image](https://bcdn.docswell.com/page/4JMYRL6VJW.jpg)

説明
AIコーディングツールはいろいろある
2026年7月時点・代表例／順不同
今日の主役
① 補完・チャット型
② 自律エージェント型
エディタに組み込んで使う
指示すると自分で書いて動かす
GitHub Copilot
Claude Code
OpenAI Codex
Kiro
③ AI統合エディタ／IDE型
④ ブラウザで作る型
エディタごとAIになったもの
URLを開くだけ・バイブコーディング向き
Cursor
Google Antigravity
Devin Desktop
Replit
v0
Bolt.new
Lovable
どれが正解でもない。合うものを選べばいい。今日はそのうちの1つ、Claude Code を触ってみる。


# Page. 9

![Page Image](https://bcdn.docswell.com/page/PJR9RKPW79.jpg)

説明
Claude Code って？
Anthropic（Claudeを作る会社）公式 のAIコーディングツール。 「指示 → AIが自分で手を動かして進め
る」エージェント型です。
コードを
書く・直す
ファイルを
読む・作る
コマンドを
実行する
調べもの・
説明


# Page. 10

![Page Image](https://bcdn.docswell.com/page/PEXQRL3VJX.jpg)

説明
どこで動く？（形がいろいろある）
中身は同じ Claude Code、入口が違うだけ。今日は ターミナル版 が主役。
ターミナル版 / CLI 今日はコレ
デスクトップアプリ
claude で起動する一番基本の形。軽量でフル
Mac / Windows の専用アプリ。会話やセッション
機能。
を管理しやすい。
Webアプリ
エディタ拡張
ブラウザで開くだけ（claude.ai/code）。処理は
VS Code / JetBrains に組み込み。変更点（差分
クラウド側で動く。
）が見やすい。


# Page. 11

![Page Image](https://bcdn.docswell.com/page/3EK9RLY5ED.jpg)

事前にご確認ください ／ 超重要
手元で動かすには有料プランが必要
契約がない人は見学だけでOK。画面共有で雰囲気を見て、後から始めても全然いい。
Claude Pro / Max
API の従量課金
無料プラン
月20ドル〜。今日の実演もこれ。
APIキーを設定して使う方法でも
手元では動きません。
可。
合は見学でOK。
その場


# Page. 12

![Page Image](https://bcdn.docswell.com/page/L73W839175.jpg)

02
PA R T 2 ／ 実 演
環境構築から はじめての起動まで


# Page. 13

![Page Image](https://bcdn.docswell.com/page/87DKM4GKJG.jpg)

実演①
対応環境とインストール（各OS 1行）
対応OS: macOS 13+ ／ Windows 10(1809)+ ／ Linux。メモリ 4GB+。推奨はネイティブ版（Node.js 不要）。
Windows
(PowerShell)
irm https://claude.ai/install.ps1 | iex
macOS / Linux /
WSL
curl -fsSL https://claude.ai/install.sh | bash
Homebrew 派
brew install --cask claude-code
Node.js 派 (22+)
npm install -g @anthropic-ai/claude-code
入ったか確認: claude --version


# Page. 14

![Page Image](https://bcdn.docswell.com/page/VJPKRM33E8.jpg)

実演②
起動して、はじめの一歩
1
ターミナルで claude と入力して起動
2
初回はログイン: Pro / Max はブラウザが開く、API の人はキーを設定
3
詰まったら遠慮なく声かけを（詰まりは次のディスカッションのネタ）
目標は「起動できた！」の成功体験。指示は普通の日本語でOKです。


# Page. 15

![Page Image](https://bcdn.docswell.com/page/2EVVR94NEQ.jpg)

使い方の例 1 ／ ウォームアップ
まずは簡単な質問から
普通の日本語でお願いするだけ。まず手応えを1つ。
「このフォルダに何がある？」
「hello.txt を作って、自己紹介を書いて」
「かんたんな電卓プログラムを作って動かして」
AIがファイルを作る／コマンドを動かす様子を、一緒に見てみましょう。


# Page. 16

![Page Image](https://bcdn.docswell.com/page/57GLMZ15EL.jpg)

使い方の例 2
ステキなトップページづくり
お題: 遊園地風のわくわくするランディングページ（架空・デモ用）
STEP 1
STEP 2
STEP 3
お願い
プレビュー＆微調整
仕上げ
「遊園地風の1枚もののLPを
ブラウザで開いて確認 →「色をもっ
「画像はプレースホルダでOK、スマ
HTML/CSS で作って。ヒーロー画像
と明るく」「見出しを大きく」など
ホで崩れないように」→
・キャッチ・アトラクション紹介・
日本語で直す
index.html を開いて完成を確認
アクセス、スマホ対応で」
コードを一行も書かずに、見た目のあるものが出てくる驚きを。


# Page. 17

![Page Image](https://bcdn.docswell.com/page/4EQYRLDLJP.jpg)

使い方の例 3
論文（レポート）を書く
お題: 「AI時代の人間のコミュニケーション」 — 開発以外にも使える例。
STEP 1
STEP 2
STEP 3
事前調査
構成づくり
執筆＆保存
「このテーマの最近の論点・事例を
「序論・本論・結論の章立てとアウ
「本文を書いて paper.md に保存。
調べて、要点を箇条書きでまとめて
トラインを作って」
参考にした情報源も添えて」
」
調べる → 構成 → 書く。知的作業もまるごと任せられる。


# Page. 18

![Page Image](https://bcdn.docswell.com/page/KJ4W8DZ571.jpg)

03
PA R T 3 ／ デ ィ ス カ ッ シ ョ ン
質問・感想を、 気軽に話しましょう


# Page. 19

![Page Image](https://bcdn.docswell.com/page/LE1Y2ZR27G.jpg)

ディスカッション
質問・感想・ディスカッション
今日やってみて
話のタネ（迷ったらここから）
何に使ってみたい？（仕事／趣味／勉強）
詰まったところ／うまくいったところ（ど
ちらも大歓迎）
「ここがわからなかった」は次回のネタ に
AIコーディングで不安なこと・こわいことは
？
なる
次回どんなテーマがいい？（もくもく会 など
）


# Page. 20

![Page Image](https://bcdn.docswell.com/page/GEWGR912J2.jpg)

Wrap up
今日のまとめ
AIコーディングは「使う側」でも十分たのしめる。ツールは色々、今日は Claude Code
Claude Code は Anthropic 公式のエージェント型 。手元で動かすには有料プラン（Pro／Max）か API
課金
実演: インストール → 起動（claude）→ はじめての対話
指示は普通の日本語でOK。詰まって当たり前。今日の一歩が大事。またゆるく集まりましょう


# Page. 21

![Page Image](https://bcdn.docswell.com/page/47ZLR9P4J3.jpg)

おみやげ ／ 先着3名様
Claude Code 1週間無料ゲストパス
Claude Pro 相当を 7日間無料 で試せるゲストパス。今日は先着3名様に、運営の枠からそ
の場でご案内します。
対象は Claude 有料プランを使ったことがない 新
ここだけ注意
規ユーザー のみ
有効化にクレジットカードの登録が必要
気に入ったら、そのまま Pro／Max に移行してOK
続けない場合は7日以内に解約 すれば料金はかかり
ません


# Page. 22

![Page Image](https://bcdn.docswell.com/page/YJ6WRKMGJV.jpg)

お知らせ
友の会でハッカソンに参加します！
都知事杯オープンデータ・ハッカソン 2026（東京都主催）に、システムエンジニア友の会として参戦。
オープンデータで社会課題を解決。 非エンジニアも
大歓迎
生成AI開発ツールも提供。 AIコーディングの実戦の
場
メイン開催 8/22〜23 （オンライン参加・作品提出の
みもOK）
8/8（土） にテーマへご意見をいただく場を予定。
アイデア出しから歓迎
odhackathon.metro.tokyo.lg.jp
odhackathon.metro.tokyo.lg.jp
／ 詳しくは Discord で