この投稿シリーズは NgateSystems.com にインデックスされています。とても便利なキーワード検索機(jī)能もあります。

最終レビュー日: 2024 年 11 月

1. はじめに

こんにちは、ようこそ！ここで探しているものが見(jiàn)つかることを願(yuàn)っています。

この投稿は完全な初心者を?qū)澫螭趣筏皮い蓼?。私が初め?Web サイトやデータベースをいじり始めたときに知りたかったすべてが網(wǎng)羅されています。おそらくあなたはまだ學(xué)生、あるいは年配で転職を考えている、あるいは退職して（心はまだ若いですが）ただ好奇心だけを持っているかもしれません。重要なことは、新しいアイデアを受け入れ、チャンスをすぐに認(rèn)識(shí)する若い心を持っていることです。吸収する必要がある新しいアイデアの數(shù)が膨大なので、これが必要になります。現(xiàn)代の情報(bào)システムの実踐は、ツールとテクニックの完璧なジャングルです。さらに悪いことに、このジャングルは目まぐるしい速度で進(jìn)化しています。一體どこから始めるべきでしょうか?

このシリーズは、このジャングルを通る特定のルートを提案することで、困難を最小限に抑えることを目的としています。このルートは、迅速で有益な結(jié)果が得られるだけでなく、その後獨(dú)自の道を進(jìn)むためのスキルとコンセプトも開(kāi)発します。

驚くべきことに (これには私も驚きが止まりませんが)、ここで説明するツールやテクノロジーのほとんどは無(wú)料です。投資する必要があるのは個(gè)人的な時(shí)間だけです。殘念ながら、これは重要な要素ではありませんが、よく言われるように、「痛みなくして利益なし!

」

しかし、さらなる勵(lì)ましとして、あなたには今、汎用のチャットボットという途方もない無(wú)料の味方がいるということも言っておきます。このシリーズには、退屈な手順が満載された、途方もなく長(zhǎng)い投稿がいくつか含まれています。それにもかかわらず、手順を詳細(xì)に説明しようとすると、さらに長(zhǎng)くなってしまうでしょう。私があなたを置き去りにしていると感じたとしても、ボットを呼び出して元の軌道に戻すことができると今では確信できます。 2022 年に chatGPT やその他のボットがリリースされるまでは、これが可能になるとは夢(mèng)にも思わなかったでしょう。今ではすべてが変わりました。 デジタル家庭教師の紹介については、投稿 4.1 を參照してください?，F(xiàn)時(shí)點(diǎn)では、無(wú)料枠で chatGPT40 を使用することをお?jiǎng)幛幛筏蓼埂?/p>

そうは言っても、このシリーズの全體的な目的と、このシリーズがたどることを提案するルートの概要を以下に示します。

2. 目的

前提として、コンピューターに情報(bào)を読み込み、それを何らかの目的のある方法で処理し、結(jié)果を畫面に表示するソフトウェアを開(kāi)発することを目的としているとします。ああ、さらに、世界中の誰(shuí)でも、どこにいても、自分の作品を使用できるようにしたいと考えています。これは確かに十分簡(jiǎn)単なはずです...

IT の世界では、この単純なタスクを達(dá)成する方法が無(wú)數(shù)にあります。しかし、私の経験では、最も簡(jiǎn)単なオプションは、Chrome や Safari などのインターネット ブラウザをアプリケーションの「起動(dòng)パッド」として使用することです。これは奇妙に思えるかもしれません。誰(shuí)もが攜帯電話で自立した「アプリ」を使用しているのではないでしょうか?

これが理由の 1 つです。ラップトップ、タブレット、デスクトップ コンピューターなど、考えられるすべてのデバイス で作業(yè)するユーザーがアプリケーションを利用できるようにしたいのです。ブラウザは、アプリケーションを差異から隔離することでこれを?qū)g現(xiàn)する優(yōu)れた方法を提供します。ハードウェアとオペレーティング システムにおいて。また、アプリケーションのロジックをサポートするための洗練された実用的な環(huán)境も提供します。一方、アプリは特定のハードウェア プラットフォームに関連付けられており、複雑さの中に陥っています。

もう 1 つの理由は、世界中のどこにいてもユーザーがアプリケーションの情報(bào)を利用できるようにしたいということです。ブラウザはすでにインターネット上に存在しており、その目的は情報(bào)共有を促進(jìn)することです。これが、Amazon や Facebook などの大手企業(yè)が自社システムのプラットフォームとして Web ブラウザーを喜んで使用する理由です。

つまり、私が提案するルートは、現(xiàn)在一般に「ウェブアプリ」として知られているもの、つまりウェブアプリの「アドレス」をウェブブラウザに入力するだけで起動(dòng)されるソフトウェアにつながります。この Web アプリは永続的なデータ ストア (「データベース」) を維持することができ、「サインオン」機(jī)能を介してこのデータにセキュリティを提供します。ブラウザベースのチャットボットは、Web アプリ テクノロジーの使用の優(yōu)れた例を提供します。

最新の Web アプリを構(gòu)築するために習(xí)得する必要があるツールとテクノロジーの概要を以下に示します。

1. HTML - ハイパーテキスト マークアップ言語(yǔ) - これは、コンピューター畫面上の Web アプリの出力をフォーマットする方法をブラウザーに伝えるために使用される「言語(yǔ)」です
2. IDE - インタラクティブな開(kāi)発環(huán)境 - これはコードの作成に使用する編集ツールです。ここで使用する IDE は Microsoft の VSCode です。
3. プログラミング言語(yǔ) - これはアプリケーションの「コンセプト」をデジタル実裝に変換します。このコースで使用する言語(yǔ)は JavaScript です
4. ブラウザ ツール - これらを使用すると、Web アプリの実行中に検査およびデバッグできます。 Google の Chrome ブラウザのツールセットを使用します。
5. 開(kāi)発フレームワーク - これは、Web アプリ開(kāi)発の特定の要件に JavaScript を効率的に適用できるようにするツールセットとして最もよく理解されています。私が使用するフレームワークは SvelteKit と呼ばれます。
6. サーバー - これは、Web アプリケーション コードをユーザーに配信するリモート ホストです。また、データ用のストレージも提供し、コードの選択された要素を?qū)g行することもあります。 App Engine サーバー上で Google の Firebase を使用します。他のプラットフォームも利用できますが、Google Cloud は特に寛大な「無(wú)料枠」を提供しています。

OK、バックルを締めて、さあ始めましょう... あなたはこの投稿をオンラインで読んでいるので、すでにオンラインの世界にある程度慣れていると仮定します。このコースでは、デスクトップ コンピューターにアクセスする必要があります。わかりやすくするために、これは Microsoft Windows ラップトップであると仮定します。そうでない場(chǎng)合でも、私の指示を適宜修正していただけると思います。

2.1 HTML (ハイパーテキスト マークアップ言語(yǔ))

あなたは、Web ブラウザにテキストを表示するソフトウェアを開(kāi)発しています。このテキストを、位置、色、サイズなどのさまざまな洗練された構(gòu)成で表示したいとします。Web ブラウザでは、コンテンツの表示方法を決定する「マークアップ」コードでテキスト コンテンツを囲むことで、これらの構(gòu)成を指定できます。このシンプルな配置により、驚くほど強(qiáng)力な結(jié)果が得られます。

Microsoft のメモ帳などの単純なエディタでテキスト ファイルに指示を入力してサンプルを作成できます。この簡(jiǎn)単な演習(xí)を試してください:

お?dú)荬巳毪辘违匹攻?エディタ (Windows のメモ帳ユーティリティなど) に次の行を入力し、HTML 拡張子 ("my-first-app.html" など) を付けてファイルとして保存します。

<h1>Hello there</h1>

Windows エクスプローラーでそのエントリを「ダブルクリック」してファイルを「開(kāi)く」と、Windows はデフォルトのブラウザを開(kāi)いて「こんにちは」という言葉を表示する畫面を表示することで応答します。おめでとうございます。最初の Web アプリが作成されました (ただし、あなた以外には誰(shuí)も見(jiàn)ることができませんが、後で修正します)。

ここで期待どおりに物事がうまくいかない場(chǎng)合は、ChatGPT に問(wèn)題の解決を手伝ってもらうのに良い機(jī)會(huì)です。上記の手順はデバイスの構(gòu)成に依存します。理解できないこと、または特定のデバイスで動(dòng)作しないことを ChatGPT に伝えると、問(wèn)題を修正するために何をする必要があるかを正確に教えてくれます。

上の例のマークアップ「タグ」は、タグで囲まれたテキストを見(jiàn)出しとして表示することをブラウザーに指示する HTML 命令です。

については Google で検索してください。 HTML の學(xué)習(xí)に関するチュートリアルやアドバイスが山ほどあります。始めるのに最適な場(chǎng)所は、Mozilla.org の Web 入門です。もう 1 つの便利なサイトは、W3Schools HTML チュートリアルです。 W3schools サイトは対話型で、HTML 構(gòu)文を試すことができます。

重要なことに、これらのドキュメントでは、タグのアクションを変更するために多數(shù)の修飾子が使用できることがわかります。たとえば、

はタグは > で修飾できます。

2.2 IDE (対話型開(kāi)発環(huán)境)

Web アプリを作成するには、かなり大きなファイルを作成する必要があると感じているかもしれません。 Web アプリケーションのコードは冗長(zhǎng)であり、ファイルに數(shù)千行が含まれることも珍しくありません。

上記の例に示すように、これらの行を基本的なテキスト エディタに入力するだけでもできますが、これは悪い考えです。ブラウザは容赦のない猛獣であり、コード內(nèi)のスペルミスは意図を完全に裏切ることになります。理想的には、入力時(shí)にコードを監(jiān)視し、構(gòu)造の制御に役立つ方法でコードの書式設(shè)定や強(qiáng)調(diào)表示を行い、場(chǎng)合によってはコードを作成する専用テキスト エディターが必要です。

IDE は、これらのニーズだけでなく、それ以外にも多くのニーズを満たすように設(shè)計(jì)されています。

多數(shù)の IDE が利用可能ですが、私が推奨するのは Microsoft の VSCode です。無(wú)料でインストールでき、非常に広く使用されています。繰り返しますが、これは學(xué)習(xí)曲線が急峻ですが、Microsoft は優(yōu)れたオンライン ドキュメントを提供しています。

無(wú)料の VSCode パッケージ內(nèi)には、コードをフォーマットしたり、単純な自動(dòng)補(bǔ)完メカニズム (JavaScript 命令や変數(shù)名など) を提供したりするツールなど、自動(dòng)化された支援も多數(shù)含まれています。チェックメカニズムは構(gòu)文エラーを検出し、未定義の変數(shù)などを強(qiáng)調(diào)表示します。

IDE は他にも多くの便利なサービスを提供します。これまでのところ、アプリケーションは 1 つの .html ファイルで表されています。実際には、最新のコンピュータ システムにはおそらく數(shù)百のファイルが含まれており、完全なアセンブリを「プロジェクト」と呼びます。大規(guī)模なプロジェクトの管理には多くの困難なタスクが発生しますが、これらはすべて IDE の責(zé)任となります。

たとえば、あなたが変わりたいと思ったとします>

もう一度、ファイルに対する最近の変更を破棄し、編集履歴の以前の狀態(tài)にリセットするとします。 VSCode は、混亂を解消するために使用できるローカル ファイル履歴を保持します。さらに、VSCode は Github と呼ばれるバージョン管理システムとシームレスにリンクし、プロジェクトの安全な外部 Web ベースの「チェックポイント」コピーを作成します。これにより、ラップトップをバスに置き忘れた場(chǎng)合でも、ソースとその履歴は安全に保たれます。

最後に、VSCode は、デバイスのオペレーティング システムに直接リンクするターミナル セッションを使用してプロジェクトを?qū)g行するためのプラットフォームを提供します。 VSCode 內(nèi)で多くの時(shí)間を費(fèi)やすことになるでしょう。

これは、デバイスに VSCode をインストールし、Visual Studio Code の入門にある Microsoft のチュートリアルを試してみる良い機(jī)會(huì)かもしれません

2.3 JavaScript

JavaScript は初心者にとって素晴らしい言語(yǔ)です。習(xí)得が簡(jiǎn)単で、多くの狀況でうまく機(jī)能します。その本來(lái)のホームはブラウザであり、Web アプリの HTML セクションで定義されたデータ構(gòu)造を読み書きできます。簡(jiǎn)単に言うと、畫面に対して直接読み書きすることができます。ただし、ブラウザ內(nèi)とサーバー上でリモート実行しているときの両方で、リモートのサーバーベースのデータ ストアの読み取りと書き込みを行う機(jī)能も獲得しました。つまり、これが非常に便利になったので、學(xué)習(xí)する必要がある唯一の言語(yǔ)になる可能性があります。

始めましょう。 JavaScript は「インタープリタ型」言語(yǔ)です。これは、コードを?qū)g行する準(zhǔn)備に特別な前処理が必要ないことを意味します。 「ランタイム エンジン」に直接起動(dòng)して、結(jié)果をすぐに確認(rèn)できます。あなたの素樸な Web ブラウザは、JavaScript ランタイム エンジンの一例です。 JavaScript を追加して、前に作成した my-first-app.html ファイルを「インテリジェントに」動(dòng)作させる方法を見(jiàn)てみましょう。

JavaScript は、HTML 構(gòu)文の厳密な性質(zhì)から、畫面に対して直接読み書きできる機(jī)能を獲得しています。これにより、ブラウザは畫面レイアウトの「モデル」、つまり「ドメイン オブジェクト モデル」（略して「DOM」）と呼ばれるツリー構(gòu)造を構(gòu)築できるようになります。 DOM 內(nèi)では、ツリーのさまざまな枝や葉はすべて JavaScript によって個(gè)別にアドレス指定できます。

これが例です。上記で紹介した my-first-app.html ファイルを次のように編集します:

<h1>



</h1><p>このコードは、コードの出力を時(shí)刻に依存させます。晝休み前 (具體的には、特定の日の正午 12 時(shí)前) にファイルを再実行すると、出力は青色で表示されます。晝食後、出力は赤で表示されます。おめでとうございます。最初の「インテリジェントな」Web アプリのコーディングが完了しました。 </p><p>HTML <script> 間の行</script>タグには、JavaScript コードの最初の部分が含まれています。 hourOfDay = で始まる行は、実行時(shí)の「日付」「オブジェクト」を含む「変數(shù)」を作成します。 Javascript の「オブジェクト」は複雑な概念であり、將來(lái)的には理解できるようになります。ただし、現(xiàn)時(shí)點(diǎn)で知っておく必要があるのは、コードの実行時(shí)に作成される「Date」オブジェクトのインスタンスのどこかに、ミリ秒?yún)g位の正確な時(shí)刻表現(xiàn)が含まれるということだけです。さらに、このオブジェクトには、ミリ秒データから「時(shí)刻」を表す 0 ～ 23 の整數(shù)を抽出する .getHours 「メソッド」も含まれています。コードの後続行の if および else JavaScript キーワードは、それらが參照する値に応じて適切に動(dòng)作するロジックを提供します。</p>

<p>色変更ロジックをテストするために晝休みまで待たなければならないのが不便な場(chǎng)合は、分が偶數(shù)のときに色を切り替えるようにコードを変更してみてください。その日の分を取得する「メソッド」は getMinutes() です。數(shù)値 num が偶數(shù)か奇數(shù)かをテストするための Javascript は if (num % 2 === 0) です。 my-first-app.html のコードを変更して、1 分経過(guò)後にページを更新したときにテキストの色を変更できるかどうかを確認(rèn)してください。</p>

<p>もうお?dú)荬扭人激い蓼工?lt;h1>ファイルの元のバージョンの最初の行にあるタグは、「id=」句を取得しました。これにより、タグに一意の文字列 (この例では「test」) が「ラベル」付けされます。賢い部分は、JavaScript が「test」<h1> の「スタイル」を変更できるようにする document.getElementById('test') 命令です。タグ。 </p>

<p><em>document.getElementById('test') 命令をいじるのに一生を費(fèi)やすのではないかと恐れる前に、これは必要ないことを保証させてください。ソフトウェア エンジニアリングにおける最近の開(kāi)発全體は、<b>意味のある</b>言語(yǔ)パターンを通じて畫面レイアウトを制御できるように設(shè)計(jì)されています。これらによりタスクが大幅に簡(jiǎn)素化されます。この投稿シリーズでは、前に示したように、SvelteKit と呼ばれる「コード フレームワーク」を使用してシステムを作成します。この例はポスト 2.1 でご覧いただけます。</em></p>

<p>では、JavaScript を流暢に話せるようにするにはどうすればよいでしょうか?ここで必要なのは良い本です。私がお?jiǎng)幛幛工毪韦?、Marijn Haverbeke の「Eloquent JavaScript」です。 </p>

<p>必要に応じて、これをオンラインで読んでください (最新版は https://JavaScript .net/ で見(jiàn)つけることができます)。ただし、走り書きできる物理的なページを備えた、きちんと書かれた本ほど便利なものはありません?，F(xiàn)段階では中古品 (および初期版) で問(wèn)題ありません。おそらく、しばらくの間行う必要がある最良の (そして唯一の) 初期投資となるでしょう。 Haverbeke は、上で紹介した「オブジェクト」、「メソッド」、「機(jī)能」、「スタイル」の概念を、私が期待できるものよりもはるかにうまく説明してくれるでしょう。 </p><p>それでもオンラインで學(xué)習(xí)することを決意している場(chǎng)合は、Mozilla の JavaScript の基礎(chǔ)に関するチュートリアルが優(yōu)れていると思います。</p>

<p>自分の仕事のテストプロジェクトについて考え始めるのも良いでしょう。このシリーズの後の投稿では、人工的な例をいくつか紹介しますが、個(gè)人的な観點(diǎn)から再解釈できた場(chǎng)合にのみ、物事は意味をなします。このプロジェクトに必要なデータの種類について今から考え始めてください。これはどのように表現(xiàn)されるでしょうか?ユーザーはそれをどのように操作するでしょうか?</p>

<h4>
  
  
  2.4 ブラウザツール
</h4>

<p>コーディングの試みが最初から適切に機(jī)能する可能性はほとんどありません。  おそらく、畫面レイアウトが意図したものと異なっているか、Web アプリのロジックに問(wèn)題がある可能性があります。ブラウザーはエラー メッセージを表示する場(chǎng)合もありますが、ただ座って不機(jī)嫌になるだけの場(chǎng)合もあります。これをどうやって整理しますか?</p>

<p>幸いなことに、すべての主流ブラウザには、これらの問(wèn)題を調(diào)査できる「検査ツール」が組み込まれています。 「インスペクター」は、ブラウザによる畫面レイアウト定義の解釈に関する內(nèi)部情報(bào)を提供し、クライアント側(cè)の JavaScript 命令の実行を監(jiān)視できます。 Google Chromeの場(chǎng)合、ブラウザ畫面を右クリックして表示されるポップアップから「検査」を選択するだけで、この検査ツールにアクセスできます。 </p>

<p>悪いニュースは、この検査ツールが初めて知ると、メニュー バーとサイズ変更可能なウィンドウを備えた憂慮すべき複合體であることが明らかになることです。ただし、一度コツを摑めば、このツールは楽しく作業(yè)でき、問(wèn)題を追跡して修正する上で貴重なリソースであることがわかるでしょう。完全なドキュメントは Google devtools で見(jiàn)つけることができます。</p>

<p>レイアウトの問(wèn)題に関しては、インスペクタは、表示要素の位置を決定するさまざまな「マージン」、「パディング」、「幅」パラメータがブラウザによってどのように適用されるかをグラフィックでデモンストレーションします。これに加えて、適切な調(diào)整を試すためのツールも提供されます。</p>

<p>ロジックの問(wèn)題に関しては、インスペクターを使用すると、JavaScript ソース コードに「ブレークポイント」を設(shè)定できます。これらを配置すると、Web アプリを更新すると最初のブレークポイントで実行が停止し、その時(shí)點(diǎn)でのプログラム変數(shù)の値を表示できるようになります。その後、後続のコードを 1 行ずつステップ実行するか、次のブレークポイントまでスキップするかを選択できます</p>

<p>プログラムが「クラッシュ」した場(chǎng)合、インスペクターは何が問(wèn)題なのかを教えてくれます。</p><p>以前は、ロジックの問(wèn)題の原因を突き止める通常の方法は、「ログ」命令を追加することでした。これらは、プログラム全體の「制御フロー」を追跡し、検査ポイントでプログラム変數(shù)の値を表示します。ご想像のとおり、これは面倒な手順でした。さて、ブラウザーで Web アプリを「検査」すると、まるでスイスの時(shí)計(jì)の裏蓋を開(kāi)けて、そのすべての複雑な機(jī)能が検査のために並べられているのを見(jiàn)つけたかのような気分になります。デバッグがとても楽しくなったので、コードでエラーが発生するのが楽しみになりました!</p>

<h4>
  
  
  2.5 スヴェルテキット
</h4>

<p>上記のセクション 2.3 で紹介した Javascript の例では、醜い document.getElementById("idName") メソッドを使用して Web アプリの DOM にアクセスし、要素 "idName" のプロパティを変更しました。 Sveltekit のようなフレームワークは、よりフレンドリーで効率的な DOM インターフェイスを提供します。これらを使用すると、ポップアップの表示と非表示、リストの表示、ブラウザーのタブ履歴の作成などの一般的なタスク用の「意味のある」コードを作成できます。たとえば、「if PopUpVisible displayPopup()」という Svelte ステートメントは (構(gòu)文が少し厳密ですが)、displayPopup 変數(shù)が true に変更されたときにポップアップを表示します。</p>

<p>初期開(kāi)発中、フレームワークは、IDE ターミナル セッションで起動(dòng)する「ローカル サーバー」を通じて動(dòng)作します。これには、基礎(chǔ)となる Web アプリ コードを変更するたびにブラウザ ウィンドウが自動(dòng)的に更新され、更新されるという魔法のような効果があります。 </p>

<p>フレームワークを使用すると、Web アプリ コードを?qū)g行する場(chǎng)所を指定することもできます。たとえば、リモート ストレージに読み書きするステートメントは、狀況に応じて、ユーザーのブラウザでローカルに実行するか、サーバーでリモートで実行するのが最適な場(chǎng)合があります。今はこれに興味がないかもしれませんが、本格的なコードを書くようになると重要になります。ブラウザ上で実行されるコードはデバッグが簡(jiǎn)単ですが、効率とセキュリティの問(wèn)題に対処する必要がある場(chǎng)合は、「サーバー側(cè)」で実行できる機(jī)會(huì)が嬉しいかもしれません。 Sveltekit を使用すると、このようなアレンジメントを特にエレガントな方法で提供できます。</p>

<p>コードを?qū)g裝する準(zhǔn)備ができたら、フレームワークの最後の動(dòng)作は、アプリケーションの「パッケージ化された」バージョンを「ビルド」することです。これにより、アプリケーションをコンパイル、バンドル、最適化して展開(kāi)可能な「パッケージ」にするための一連の手順が実行されます。これにより、デプロイされた Web アプリが可能な限り小さく、高速で、効率的になることが保証されます。</p>

<p>現(xiàn)在、最も人気のあるフレームワークはおそらく Meta の React システムです。これは Facebook の開(kāi)発をサポートするために 2010 年頃に作成されました。このアイデアは非常にうまく機(jī)能したため、Vue、Angular、Next.js などのライバルがすぐに現(xiàn)れました。 Sveltekit は最近登場(chǎng)したものの 1 つで、特に使いやすいのでここで使用しています。 Stack Overflow の 2024 年の開(kāi)発者アンケートでの支持率の高さに注目してみてはいかがでしょうか。</p><p><em>余談ですが、私が時(shí)々 Svelteki について話した後、Svelte と呼ばれる別のものに切り替えようとするひねくれたように見(jiàn)えることに気づいたかもしれません。 Svelte は、JavaScript を「拡張」し、効率的な Web アプリを簡(jiǎn)単に作成できるようにするために svelte.dev エンジニアによって作成された「言語(yǔ)」です。 Sveltekit は、Svelte Web アプリが実行される環(huán)境を作成するフレームワークです。</em></p>

<h4>
  
  
  2.6 Firebase と App Engine
</h4>

<p>Web アプリ プロジェクトの開(kāi)発段階を完了するために必要なものはすべて、適度に指定されたデスクトップ コンピューターで提供できます。しかし、期待される世界にプロジェクトを立ち上げたい段階に達(dá)すると、専門の「バックエンド」Web サーバーのサービスが必要になります。これにより:</p>

• プロジェクトの実行可能ファイルをブラウザーでローカルに実行するためにデプロイできる「エンドポイント」(つまり、Web 上の URL) を提供します。
• プロジェクトのデータのための中央の Web ベースのストレージを提供します。おそらく、これは構(gòu)造化データベースに保持されるでしょう。
• 機(jī)密性の高いアプリケーション要素を?qū)g行するための高速かつ安全な環(huán)境を提供します。

このコースでは、以下を使用します:

• シンプルで構(gòu)造化されたデータベースを使用できるようにする「Firestore」ツールにアクセスするための Google の「Firebase」アプリケーション開(kāi)発環(huán)境
• Web アプリケーション コードをデプロイし、SvelteKit プロジェクトの「サーバー側(cè)」要素の実行をホストする Google の「App Engine」環(huán)境。

最初から Firestore を使用するため、まず Firebase アカウントを作成する必要があります。

これまでは、クラウド サービスを提供するために GoDaddy や HostPapa などの「インターネット サービス プロバイダー」を頼っていたかもしれません。これらのサービスにはまだ果たすべき役割があり、確かにヘルプ デスクを通じて個(gè)別に優(yōu)れたサポートを提供しますが、クラウド プラットフォームは現(xiàn)在の目的に適した、より優(yōu)れた包括的なパッケージを提供します。

3. 今すぐ読み続けてください

このコースは 2 つの主要な段階で進(jìn)行します。 1 つ目は、HTML、JavaScript、Firebase、Firestore の基本を理解できるように設(shè)計(jì)されています。このゲームをまったく初めて使用する場(chǎng)合は、ここで學(xué)ぶべきことがたくさんあり、混亂する可能性がたくさんあります。これにはしばらく時(shí)間がかかることが予想されます。時(shí)間をかけてチャットボット チューターを多用してください。

これを完了すると、第 2 段階では、Sveltekit Web アプリ設(shè)計(jì)のより高度な要素をいくつか紹介します。これを正常に完了すると、便利な Web アプリを開(kāi)発するために必要なもののほとんどがわかります。

それでは、行きましょう。最初のステップは、SvelteKit をローカル マシンにインストールし、Web アプリ開(kāi)発テクニックに慣れることです。手順については、投稿 2.1 を參照してください。

以上がNgSysV.A 若者向け AI 時(shí)代のシステム開(kāi)発ガイドの詳細(xì)內(nèi)容です。詳細(xì)については、PHP 中國(guó)語(yǔ) Web サイトの他の関連記事を參照してください。