ふと、プログラミングに対する興味が湧く
ブログを始めてから、webサイトの仕組みに興味が少しずつ出てきていました。
スマホアプリ、自動化ツール、いろいろありますが、
まずは、現在自分が使っている「WordPress」がどのような仕組みで動いているのか。
そもそも、プログラミングによりwebサイトが機能していることさえ、これまで特に意識していなかった。
プログラミングを知りたい、それを生かして自分のサイトに変化を起こしてみたい。ひょっとしたら、ブログ記事のネタにもなるのでは？備忘録として復習にも使ったりとか。
いろいろ、想像が膨らみ、学習を始めてみようと考えました。
学習の方法は？
手始めに、まずは専門書籍か？と思い、書店の該当コーナーを眺めてみたのですが、まあ、様々な参考書がありますね。初心者向けから難解なものまで。
どの分野でも独学の大変なところですが、疑問点を解消しながら少しずつ進むしかありません。
そういった点において、書籍による学習は不安がありました。
そこで、AIをパートナーとして始めることにしたのです。
幸い、世の流れに押される形でAIを日常的に使い始めていたので、全く抵抗はありません。しかも、始めてみると、こちらの依頼に応じて丁寧に教えてくれるし、何度でもどんな内容でも質問できます
最初にAIに聞いてみたこと
まずはそもそもから。驚くほど、素朴な質問を投げかけています。AIの学習モードで聞いてみた事と、回答はこんな感じです。
「」内が実際にAIに問うてみた言葉、→以降はAIによる回答の概要です。
念のため、事前にAIの役割や進め方、目標などは指示しておきました。
- プログラミング学習の心構え
「とりあえずプログラミングに興味があるんだけど」
→ 何を作ってみたいか、から逆算するといいよ。webサイト？了解。
いきなり難しい本など使わない。ゲーム感覚でコードを書いてみよう。
お手本コードを真似して写し、変化を体感してみよう。
完璧に暗記しようとせず、わからなかった場合の「調べ方」を身につけることが大切だよ。 - WordPressとプログラミングの関係
「Webサイトはワードプレス使ってるんだけど、プログラミングとの関連は？」
→ WordPressはプログラミング言語を使った完成品。入り口としては適切ですね。
「PHP・SQL・HTML/CSS・JavaScript」という4つの言語で構成されているよ。
1.PHP（エンジンの役割）
ワードプレスの心臓部です。「投稿を表示する」「ログインを確認する」といった裏側の処理を担当しています。
2.SQL（倉庫番の役割）
データベースに保存された記事や画像を取り出すための言語です。
3.HTML / CSS（外装の役割）
サイトの骨組み（HTML）とデザイン（CSS）です。ワードプレスで「テーマ」をいじるのは、主にこの部分を操作することになります。
4.JavaScript（ギミックの役割）
画像がスライドしたり、ボタンを押した時に動きが出たりする、アニメーション部分を担います。 - 何ができるのか
「プログラミングができるとWordPressで何ができるの？」
→今は管理画面の設定（ノーコード）でサイトを作っていると思いますが、コードが分かるとこんなことができるようになります。 - 「あと少し」のこだわりを実現できる
「このボタンの色だけ変えたい」「ここにだけ余白を入れたい」といった、テーマの設定項目にはない細かい調整が CSS で自由自在になります。 - 独自の機能を追加できる
プラグインに頼らなくても、PHP を少し書くだけで「特定の条件の時だけメッセージを出す」といったオリジナルの仕組みを作れます。 - サイトの高速化
不要なプラグインを減らしてコードで解決することで、サイトがサクサク動くようになります。 - まずは何を
「おすすめの始め方は？」
→ワードプレスに繋げるという明確な目標があるなら、
学ぶ順番は「外側（見た目）から内側（仕組み）」へ進むのが最も効率的で、挫折もしにくいです。以下のステップで進めるのが王道です！
〇ステップ1：HTML & CSS（まずはここから！）
ワードプレスの「見た目」を自由自在にするための基礎です。
HTML： サイトの骨組み（見出し、段落、画像など）を作ります。
CSS： デザイン（色、サイズ、配置）を整えます。
ワードプレスへの恩恵： 「追加CSS」を使って、既存テーマのデザインを自分好みに微調整できるようになります。
〇ステップ2：JavaScript（動きをつける）
サイトに「アニメーション」や「インタラクティブな動き」を加えます。
できること： スライドショー、クリックすると開くメニュー、ふわっと浮き出るボタンなど。
ワードプレスへの恩恵： ユーザーにとって「使いやすい、かっこいいサイト」にアップグレードできます。
〇ステップ3：PHP（ワードプレスの核心）
ワードプレスそのものを動かしている言語です。
できること： 「記事の一覧を表示する」「条件によって表示を変える」といったプログラム。
ワードプレスへの恩恵： 既存のテーマを改造（カスタマイズ）したり、自作のテーマを作ったりできるようになります。
「わかったこと」
Webの大まかな構成が大づかみで把握できました。また、コードが分かると、テーマの設定（ノーコード）では届かない「こだわり」や「独自の機能」などを、CSSやPHPで自力で解決できるようになるという展望が見えました。
とにかく、私にとって得体の知れなかったプログラミング、特にWebについて大づかみができ、これから先の習得に意欲が湧いてきます。
最初の具体的なアクション
WordPressのカスタマイズで最も頻繁に利用するのは「CSS（スタイルシート）」であるということのようです。
この後、続けてAIから提案があったのは、
「まずはプログラミング専用の「テキストエディタ（コードを書くソフト）」をパソコンに入れて、小さなファイルを1つ作ってみることから始めましょう。」
だそうです・・・。丁寧に教えてください。
所感など
WordPressを構成している言語が4つ（PHP、SQL、HTML/CSS、JavaScript）もあり、それぞれ役割が違うということです。当面は、HTML/CSSの訓練ですが、いずれはあれやこれやと、色々と考えてしまうと同時に、気が遠くなりそうです。まあ、でも、知らないことを探求していくのはいつ何時でも、心が躍ります。
「プログラミングは暗記ではなく調べ方が大切である」という言葉が一番の収穫。すべてを覚えようとせず、まずはプログラミングの外装？と言っていいんでしょうか？「HTML/CSS」から少しずつ触れていこうと思います。
次回はテキストエディタを導入してみる
テキストエディタというコードを書くソフトとやらを導入してみようと思います。
想像するに、お手本のコードを示してもらい、入力してみてその結果というか、変化を実際に確認してみる感じでしょうか？早く試してみたい！
コメント