https://note.com/hayamamasami/n/nfc7e2fba742c?app_launch=false
「AIを『手足』にして、自分は『監督』になる。これからのプログラミング勉強法」
AI時代のエンジニアにとって、「何を学び、何をAIに任せるべきか」
一言でいうと、「暗記や作業」の価値が下がり、「考えることと決めること」の価値が上がったということです。
1. 頑張って覚えなくていいこと（AIが得意なこと）
これらはAIがすぐに答えを出してくれるため、時間をかけて暗記したり練習したりする必要がなくなりました。
細かい書き方の暗記：プログラミングの命令（メソッド名）や、スペルを完璧に覚える必要はありません。
HTMLやCSSの作成：見た目を作る作業はAIが非常に得意です。「こんなデザインにして」と頼めば一瞬で作ってくれます。
テストコードの作成：プログラムが正しく動くか確認するためのコードも、AIが書いてくれます。
難しい計算（アルゴリズム）：複雑な計算手順をゼロから自力で書く力は、以前ほど重要ではなくなりました。
2. これからもっと重要になること（人間にしかできないこと）
これらは「全体のバランス」や「ビジネスのルール」を理解する必要があるため、AIには任せきれない領域です。
設計（アーキテクチャ）：バラバラの部品を組み合わせて、大きなシステム全体をどう作るか考える力です。
データモデリング：情報をどう整理して保存するか、データの「入れ物」を設計することです。
要件定義（問題を見つける力）：お客さんが「何に困っているのか」を話し合い、それを解決するために「何を作るべきか」を具体的に決めることです。
非機能要件（安全と安心）：
パフォーマンス：どれくらいの速さで動かすか。
セキュリティ：個人情報をどう守るか。
信頼性：システムが止まらないようにどう対策するか。
判断と責任：AIは「これで行きましょう！」という決断をしてくれませんし、失敗しても責任を取れません。最後に「これでOK」と判断するのは人間です。
3. これからの学習戦略
これからプログラミングを学ぶなら、以下の2点を意識してみてください。
�� 「なぜ？」という仕組みを理解する
細かい書き方はAIに聞けばいいですが、「なぜこの仕組みが必要なのか？」「どんな構造で動いているのか？」
という「概念（考え方）」を知らないと、AIに正しい指示が出せません。
�� AIを「手足」として使いこなす
AIに全部任せるのではなく、AIを自分の優秀なアシスタントとして使いましょう。
自分は「監督（考える人）」
AIは「選手（作業する人）」 という役割分担ができる人が、これからの時代に最も活躍できるエンジニアです。
AIを使って簡単なWebサイトの「設計図」
AIを使ってWebサイトを作る際、いきなりコードを書くのではなく、
まずは「どんな仕組みにするか」という設計図をAIと一緒に作ることが大切です。
イメージしやすいように、Webサイトの設計図に必要な3つのステップをまとめました。
ステップ1：サイトの「構成」を決める（サイトマップ）
まず、サイトの中にどんなページが必要かを書き出します。
トップページ：サイトの顔。最新情報や全体図。
紹介ページ：自分やサービスについて詳しく書く場所。
お問い合わせページ：メッセージを送るフォーム。
ステップ2：ページごとの「見た目」を決める（ワイヤーフレーム）
次に、1つのページの中のどこに何を置くかを決めます。これは「家の間取り図」のようなものです。
ヘッダー：一番上のタイトル部分。
メイン画像：一番目立つ大きな写真。
ボタン：クリックしてほしい場所。
ステップ3：AIへの「指示書」を作る（プロンプト）
設計図ができたら、AI（ChatGPTなど）にこう伝えてみましょう。
AIへの指示例： 「中学生が使う、部活動の紹介サイトを作りたいです。 トップページには『部活紹介』『活動日誌』『入部はこちら』という3つのメニューをヘッダーに置いてください。 青色をベースにした、清潔感のあるHTMLとCSSのコードを書いてください。」
AIと設計図を作るメリット
迷わない：最初に設計図を作ることで、AIに「思っていたのと違うもの」を作られるのを防げます。
相談できる：AIに「このサイトに足りない機能はあるかな？」と聞くと、自分では気づかなかったアイデアをくれます。
プロの考え方が身につく：設計の仕組みを学ぶことで、将来どんなプログラミング言語が登場しても対応できる力がつきます。
麻雀の趣味サイト
麻雀は「点数計算」「役の紹介」「戦術」「自分の対局記録」など、
コンテンツがたくさん考えられるので、設計しがいがあります。
「どんなページが必要か」と「AIにどう頼むか」をまとめた最初の設計図を提案。
1. サイトの全体図（構成案）
まずは、サイトにどんな内容を載せるか整理しましょう。
�� トップページ：サイトのタイトルと、最新の対局結果（日記）へのリンク。
�� 役一覧ページ：初心者の友達にも教えられるような、役の一覧。
�� 点数計算ツール（または表）：対局中にサッと確認できるもの。
�� 自分の対局成績：自分が何位を何回取ったかなどの記録。
�� おすすめの戦術：自分が気をつけている打ち方のコツ。
2. 見た目のイメージ（レイアウト）
麻雀らしいデザインにするためのポイントです。
色使い：雀卓（マージャンたく）をイメージした「深い緑色」をベースに、牌の色の「白」や、点棒のイメージを取り入れるとかっこよくなります。
配置：スマホでも見やすいように、ボタンを大きく作るのがコツです。
3. AI（ChatGPTなど）に渡す「魔法の指示書」
設計図ができたら、次はAIにコードを作ってもらいます。以下の文章をコピーしてAIに送ってみてください。
AIへの指示（プロンプト）： 麻雀が趣味の人のための、個人サイトを作りたいです。まずは「トップページ」のHTMLとCSSを書いてください。
【設計の希望】 ・デザイン：雀卓のような「深い緑色（ダークグリーン）」を背景にして、文字は読みやすい「白」にしてください。 ・ヘッダー：サイト名「私の麻雀ノート」と、メニュー（ホーム、役一覧、成績表、戦術）を横並びにしてください。 ・メインコンテンツ： 1. 「今日の最高スコア」を大きく表示するカード 2. 「最近の対局日記」のタイトルが並ぶリスト ・雰囲気：シンプルで、かっこいい「和風モダン」な感じにしてください。
次のステップ：さらに「エンジニアらしく」考えるなら
「重要になった領域」を意識して、こんなことも考えてみましょう。
データの設計（データモデリング）： 「対局記録」を保存するなら、日付、順位、点数、一緒に打った人の名前など、どんな項目が必要かな？と書き出してみる。
AI活用設計： 「麻雀の専門用語をAIに教えて、自分の打牌（牌の切り方）を診断してくれる機能を作れるかな？」とAIに相談してみる。
まずは、上記の指示書を使ってトップページの見た目をAIに作らせてみることから始めてみませんか？
#デザイン#中学生#プログラミング#エンジニア#ビジネス#部活動#プロンプト#暗記#CSS#設計図
#自分
#ビジネス
#デザイン
#プログラミング
#エンジニア
#必要
#プロンプト
#中学生
#サイト
#部活動
#css
#暗記
#ページ
ログインしてコメントを確認・投稿する