Cursor AIで作りながら学ぶWeb & Javascript

🚨この講義は Cursor のバージョンが上がるたびに内容が更新されます。

📢継続的に更新される講義をご希望の場合は、この講義を選択することをお勧めします。

< AI Toolによるソフトウェア開発を夢見ていますか？ >

📢いつまでも基礎文法だけを学ぶことはできません！

ChatGPT以来、多くのソフトウェアコースのヒントと開発方法論が注目されています。

プロンプト数行でホームページやゲームを作成する、

でも、コードをひとつもタイピングせずに声にするバイブコーディングまで？

しかし、今までAIとする開発は限界があるという意見もあります。

開発をすべて任せれば、継続的なソフトウェアを開発することも容易ではありません。

このように様々な意見が先鋭に分かれる時代には、どのようにコードを学ぶべきでしょうか。

ソフトウェア開発開始を躊躇している方、非専攻者なのに自分だけのWebページを作ってみたい方、

Webページがどのように動作するのか知りたい方、LLMでコードは作ったのですが解釈をしてみたい方！

今この講義でWeb開発の基礎を始めましょう。 （Javascript、HTML / CSS）

直接Claude無料版で生成したコードを修正しながら、次々とWebの概念、Webブラウザの動作方法、その上で動作するJavascript言語の文法を説明します。

ただ文法だけを学ぶのではなく、自分だけのプロジェクトを直接開発してみますよ！

今後、AIを通じて生成するコードとソフトウェアはますます多くなるでしょう。

今も遅れませんでした。みんなが飛び込む世界に、私たちも一緒に第一歩を踏み出すのはどうでしょうか？

ChatGPT、Claude、Geminiで生成されたコード..解釈して修正したい場合は？

📌目の前で直接見せます！同じようにプロンプトで生成したコード、こう解釈するんですよ！

💻文法だけが一生懸命勉強したらどうしますか。何かを作って学ぶべきです！ 「本物の」プロジェクトを作成しながら学びます。

🛠LLMが生成したコードを修正しながら概念をつかみます。あ～こんなコードが動作するんだね！

❌先行知識？いいえ！コンピュータ専攻者だけが理解できる専門用語？いいえ！未来の私の子供にも見せてくれます。

❔コードを修正してもうまくいきません。すぐに答えてください！たくさん質問してください。

✅こんな方々に大いに役立つ講義です。

✅実際の講義で学ぶ資料を見て判断してください😀

👍この講義を聞くと一体何が残るのでしょうか。

このレッスンでは、LLMが生成するコードに基づいてcursorプロジェクトを作成しながら、Web開発を徐々に学びます。

しかし、単純なWeb開発だけでなく、以下のような悩みがある方にも役立ちます。

1. 一人でも創業できる方法はないでしょうか？ インディーハッカーになりたいです！

<一人が作った10億ドルの価値の会社>

ソース: https://every.to/napkin-math/the-one-person-billion-dollar-company

＜10の印象深い一人が作った会社＞

ソース: https://hackernoon.com/check-out-these-impressive-1-person-companies

1人企業として10億ドル（1.3兆ウォン）の価値を持つ企業が出ると予測する人がいます。

そのうちの一人がOpenAIのサム・アルトマンです！

逆に、一人ではそれほど大きく成功しにくいという人もいます。

そのようなことを考えたことがありますか？

「自分で世界に影響を与える方法は何ですか？」

「退勤してから、休職期間に、時間と場所に影響を受けにくい活動はないだろうか？」

創業コストはゼロに落ち、ソフトウェア開発は日々簡単になっています。

ソフトウェア開発がこのような悩みの答えになることができます。

今はLLMの時代です。

Grok、Claude、ChatGPT、Gemini、DeepSeekまで！

複数のLLMモデルを介してコードを自動生成し、修正し、解釈することを学びます。

2. 何かになるのに、なぜなるのか分からないです。

<今は自然言語の文章で簡単なWebページが出てくる世界です。

これで何かを作ることはできませんか？

複数ページの企業型ランディングページ、私を知らせるポートフォリオホームページ、簡単なクイズを出して常識を知らせる情報性ページやブログは？

何かを作れる世界でもう少しツールを知れば「本物の製品」を作ることができますよ！

このレッスンを通じて、自分で作成したWebページを無料のホスティングサービスにアップロードし、実際のユーザーを集めてください。

3. Webページを作った！

タイトル：「一人でSaaSを創業する人に良いツール？」出典：ハッカーニュース

ウェブページは誰でも作れますか？

デプロイは何ですか？メンテナンスは何ですか？

最初のハードルを越えたら、次のハードルを越えなければなりません。

データ収集、バックエンド開発、DB管理...

まで行く前に！

まず、適切なWebをアップロードし、配布しながらどのようにWebページが動作するかを学ぶ必要があります。

このレッスンでは、Webページを作成するプロセスとそれ以降に何が必要なのかを簡単に学びます。

👋講義を作った理由＆講師紹介

こんにちは、 YouTubeで@weekendcodeとして活動している週末コーディングといいます。

Java開発者として働いて、現在はプログラミングトレーニング関連のコンテンツを作成しています。

コンピュータを専攻していない方、コンピュータに関心のある老年層の方、他の業をして引退した方を課外で教えた経験があります。

今回はウェブ開発です！

初めて自分だけのWebページを開発してみたい方のためにAからZまで準備してみたかったです。

一汗一汗製作したクオリティ発表資料スライドと、誰も知らせないウェブやインターネットの歴史まで！

「最初からどのように誕生したのか」、「なぜこのように使うことになったのか」を知ると、はるかに理解しやすくなりますから😃

⭐他の講義は難しかったです。

私が最初にWeb開発を学んだ日をまだ覚えています。

数多くの講義を聞いて、学校で授業も聞いて、学園も通いました。

ところが、一体なぜこう書くのか、こういうものはどのように生じたのか説明してくれる人が誰もいませんでした。

しかし、現場で直接開発をするので、思ったより簡単なものが多く、

そのようなものを一つ一つ集めて一つの講義でまとめて提供しようとします。

⭐学習理解度を高めるために最善を尽くします。

この講義は私の最初の講義ではありません。

他の映像と講座でのレビューをお見せします。

ホツル作った講座ではなく、一つ一つ理解できるまで説明いたします。

わからない場合は、すぐに質問してください！

⭐時代が急速に変わっていますが…知っておくべきことは学ばなければなりません。

今は誰もがAIを話しています。生成型AI、LLM、プログラミング...

数多くのキーワードの中で「漢方に！自動化！」を叫ぶ前に基礎を知る必要があります。

そうすれば、より大きなウェブページ、よく整頓されたコード、メンテナンスしやすいソフトウェアを書くことができます。

私たちは製品も作成しながらJavascript文法とWebブラウザの動作を学びます。

✅ボーナス学習資料！で構成したホームページコード全て提供！

Webブラウザ（クライアント）Web API、サーバー側の機能資料すべて提供します！

フロントエンド、バックエンドの開発者であれば、無条件に知っておくべきAPIの概念と実践の両方を教えてください。

例1：Webブラウザでアクセスしたクライアントを確認するフロントエンドコード

• クライアント情報を学ぶ

• オペレーティングシステム情報、通信の有無、Webブラウザ機能のサポートの確認

例2：クライアントURL解析（現在のページ、ポート、パラメータ、パスなど）

WebブラウザでアクセスするURLごとに異なる機能を入れたい場合は？

JavascriptでAPIを介してどのように値を取得するかを直接ソースコードで確認してください。

例3：小さな保管エリア、クッキーで遊ぶ

WebブラウザでCookieとは何ですか？ Cookieをどのように操作できますか？

自分で作成、削除、確認してみてください！

作成されたソースコードファイル、まとめられたPDFファイルともにまとめてお届けします！

🤔受講前の注意