コース紹介#
Vue3+Uni+Node+MySQL ゼロからクロスプラットフォームの小プログラムのフルスタックアプリケーションを実現するビデオチュートリアルで、優庫 it リソースネットワークによって整理・公開されています。このコースでは、初心者から上級者まで、体系的に WeChat 小プログラム、Vue3、Uni-APP、NodeJs、MySQL の最新フルスタック技術を学び、最終的にはクロスプラットフォームで複雑かつ完全な、すでにオンラインのフルスタック小プログラムアプリケーションを開発し、商業レベルの小プログラムのクロスプラットフォーム実装能力を身につけます。
あなたが得られるもの#
新しい 300 以上のフルスタック技術ポイントを取得
小プログラムの 12 の典型的なビジネスシーンを実現
実際にオンラインの商業レベルのフルスタック能力を身につける
パッケージ化して複数のプラットフォームでクロスプラットフォームアプリケーションを実現
複雑なプロジェクトの設計と開発プロセスをマスター
全過程をわかりやすい言葉で学び、各知識点を習得
リソース目次#
.
├── 1 - 開期準備 - コースの内容を理解し、コース学習に対する初歩的な認識を持つ /
│ └── [28M] 1-1 導入
├── 2-【入門】WeChat 小プログラムの概念とディレクトリ構造の詳細 - 設定の中で最初の小プログラムアプリケーションを実現 /
│ ├── [1.8M] 2-1 クラス紹介
│ ├── [1.2M] 2-2 WeChat 小プログラムとは
│ ├── [4.3M] 2-3 WeChat 小プログラムの特徴
│ ├── [2.8M] 2-4 WeChat 小プログラムを学ぶ理由
│ ├── [23M] 2-5 WeChat 小プログラムアカウントの登録
│ ├── [40M] 2-6 WeChat 開発者ツールのダウンロードとプロジェクト作成
│ ├── [31M] 2-7 json 設定 project.config.json と project.private.config.json の学習
│ ├── [57M] 2-8 json 設定 - app.json
│ ├── [29M] 2-9 json 設定 - sitemap.json
│ ├── [12M] 2-10 app.js の役割と使用
│ ├── [5.2M] 2-11 app.wxss の役割と使用
│ ├── [6.5M] 2-12 ページ構造 - .wxml ファイルの役割
│ ├── [16M] 2-13 ページ構造 - .wxss の役割
│ ├── [12M] 2-14 ページ構造 - .js の使用
│ ├── [17M] 2-15 ページ構造 - .json の使用
│ └── [20M] 2-16 コースまとめ
├── 3-【基礎】WeChat 小プログラムの基礎文法とよく使うコンポーネント - WeChat 小プログラムを構成する基本単位 /
│ ├── [1.7M] 3-1 コース紹介
│ ├── [25M] 3-2 データバインディング
│ ├── [56M] 3-3 リストレンダリング
│ ├── [52M] 3-4 リストの key の詳細
│ ├── [37M] 3-5 条件レンダリングと hidden 属性の違い
│ ├── [3.5M] 3-6 小プログラムコンポーネントの概念と特徴
│ ├── [35M] 3-7 ビューコンポーネント - view
│ ├── [35M] 3-8 テキストコンポーネント - text
│ ├── [17M] 3-9 アイコンコンポーネント - icon
│ ├── [50M] 3-10 ボタンコンポーネント - button
│ ├── [53M] 3-11 フォームコンポーネント - input
│ ├── [19M] 3-12 フォームコンポーネント - radio
│ ├── [17M] 3-13 フォームコンポーネント - checkbox
│ ├── [27M] 3-14 フォームコンポーネント - textarea
│ ├── [13M] 3-15 フォームコンポーネント - switch
│ ├── [26M] 3-16 フォームコンポーネント - form
│ ├── [48M] 3-17 フォーム実戦 - ユーザー登録
│ ├── [30M] 3-18 template の基本使用
│ ├── [8.9M] 3-19 include インポートの基本使用
│ ├── [7.4M] 3-20 コンポーネントの公共属性と属性のタイプ
│ └── [13M] 3-21 クラスまとめ
├── 4-【基礎】WeChat 小プログラムのスクリプトとスタイル、Flex レイアウトの詳細 - より多彩な小プログラムアプリケーションを作成する /
│ ├── [3.0M] 4-1 コース紹介
│ ├── [8.2M] 4-2 wxs とは
│ ├── [28M] 4-3 小プログラムのモジュール化
│ ├── [37M] 4-4 wxs 変数宣言と wxs の 2 つの使用方法
│ ├── [12M] 4-5 wxs のコメントの使い方
│ ├── [2.0M] 4-6 wxs がサポートする演算子の種類
│ ├── [2.2M] 4-7 wxs がサポートするフロー制御文
│ ├── [15M] 4-8 wxs がサポートするデータ型
│ ├── [8.8M] 4-9 wxs がサポートする基本ライブラリ
│ ├── [3.5M] 4-10 wxss の基本概念
│ ├── [17M] 4-11 rpx の概念と換算ルール
│ ├── [1.9M] 4-12 wxss がサポートするセレクタ
│ ├── [12M] 4-13 style の使用と動的 style
│ ├── [14M] 4-14 wxss のスタイルインポート
│ ├── [8.9M] 4-15 flex の詳細 - 概念
│ ├── [18M] 4-16 flex レイアウトを有効にする 2 つの方法
│ ├── [14M] 4-17 flex レイアウトの方向を設定
│ ├── [12M] 4-18 flex レイアウトの折り返しを設定
│ ├── [7.9M] 4-19 flex レイアウトの方向と折り返しを同時に設定
│ ├── [22M] 4-20 flex レイアウトの分布と整列方法を設定
│ ├── [21M] 4-21 flex レイアウトの交差軸上の子要素の整列方法を設定
│ ├── [18M] 4-22 flex レイアウトの交差軸の複数行子要素の分布を設定
│ ├── [8.3M] 4-23 flex 子要素の配置順序を設定
│ ├── [15M] 4-24 flex レイアウト子要素の幅の拡張を設定
│ ├── [13M] 4-25 flex レイアウト子要素の収縮を設定
│ ├── [11M] 4-26 flex レイアウトの基本サイズを設定
│ ├── [41M] 4-27 flex レイアウト子要素の幅の拡張、収縮、基本サイズを設定
│ ├── [13M] 4-28 flex レイアウトの単一子要素の交差軸上の整列方法を設定
│ └── [28M] 4-29 クラスまとめ
├── 5-【基礎】WeChat 小プログラムのイベントシステムとインタラクションフィードバック - 極上の小プログラムインタラクション体験 /
│ ├── [3.0M] 5-1 クラス紹介
│ ├── [5.1M] 5-2 イベントシステムとは
│ ├── [18M] 5-3 イベント登録の異なる方法
│ ├── [26M] 5-4 キャプチャ段階とバブリング段階
│ ├── [23M] 5-5 イベントオブジェクト （上）
│ ├── [18M] 5-7 インタラクションフィードバック - Toast
│ ├── [36M] 5-8 インタラクションフィードバック - Modal
│ ├── [29M] 5-9 インタラクションフィードバック - loading
│ ├── [20M] 5-10 インタラクションフィードバック - actionsheet
│ └── [32M] 5-11 クラスまとめ
├── 6-【中級】小プログラムのルーティング遷移、ライフサイクルとデータストレージ - より豊富な機能を持つ小プログラムアプリケーションを構築する /
│ ├── [2.3M] 6-1 クラス紹介
│ ├── [26M] 6-2 ルーティング遷移 - navigateTo
│ ├── [43M] 6-3 ルーティング遷移 - navigateTo の events と url パラメータの渡し方
│ ├── [41M] 6-4 ルーティング遷移 - navigateBack
│ ├── [19M] 6-5 ルーティング遷移 - redirect
│ ├── [20M] 6-6 ルーティング遷移 - switchTab
│ ├── [13M] 6-7 ルーティング遷移 - reLaunch
│ ├── [4.6M] 6-8 ライフサイクルの概念
│ ├── [80M] 6-9 App のライフサイクル
│ ├── [80M] 6-10 Page のライフサイクル
│ ├── [2.4M] 6-11 データストレージの概念
│ ├── [38M] 6-12 グローバルデータのストレージ（増改查）
│ ├── [33M] 6-13 ページデータのストレージ（増改查）
│ ├── [41M] 6-14 キャッシュデータのストレージ（増删改查）
│ └── [29M] 6-15 クラスまとめ
├── 7-【中級】WeChat 小プログラムのネットワークリクエストのラッピング - 現代アプリケーションに欠かせない重要な環 /
│ ├── @優庫 it リソースネットワーク ukoou.com
│ ├── [2.4M] 7-1 クラス紹介
│ ├── [6.0M] 7-2 ネットワークリクエストの概念
│ ├── [57M] 7-3 小プログラムでのネットワークリクエストの発起方法
│ ├── [4.3M] 7-4 ラッピングの意義
│ ├── [39M] 7-5 ネットワークリクエストのラッピング
│ ├── [26M] 7-6 バックエンドインターフェースのラッピング
│ ├── [26M] 7-7 フォーム実戦 - UI 構築
│ ├── [60M] 7-8 フォーム実戦 - ロジックインターフェースの充実
│ └── [1.5M] 7-9 クラスまとめ
├── 8-【基礎】Vue3 の概念とリアクティブデータの作成、動的なページレンダリング - Vue3 の特徴と基礎文法 /
│ ├── [3.2M] 8-1 クラス紹介
│ ├── [18M] 8-2 Vue3 の特徴
│ ├── [29M] 8-3 Vue3 プロジェクトの作成方法
│ ├── [32M] 8-4 Vue3 のテンプレート文法
│ ├── [44M] 8-5 Vue3 リアクティブデータ - ref
│ ├── [35M] 8-6 Vue3 リアクティブデータ - reactive
│ ├── [35M] 8-7 Vue3 ソースコード解読 ref と reactive の違い
│ ├── [25M] 8-10 Vue3 ディレクティブ v-on-
│ ├── [43M] 8-11 Vue3 イベント修飾子
│ ├── [39M] 8-12 Vue3 条件レンダリング
│ ├── [72M] 8-13 Vue3 リストレンダリング
│ ├── [67M] 8-14 Vue3 配列のリアクティブ変化
│ └── [29M] 8-15 クラスまとめ
├── 9-【入門】Vue3 のよく使うコンポーネントとデータ監視、ライフサイクルの使用 - Vue3 の核心 /
│ ├── [12M] 9-1 クラス紹介
│ ├── [50M] 9-2 フォームコントロール - input
│ ├── [35M] 9-3 フォームコントロール - textarea
│ ├── [64M] 9-4 双方向バインディング v-model
│ ├── [31M] 9-5 フォームコントロール - radio
│ ├── [34M] 9-6 フォームコントロール - checkbox
│ ├── [34M] 9-7 フォームコントロール select
│ ├── [57M] 9-8 フォーム修飾子
│ ├── [110M] 9-9 計算プロパティ - computed
│ ├── [107M] 9-10 監視器 - watch
│ ├── [63M] 9-11 ライフサイクル - マウント段階
│ ├── [51M] 9-12 ライフサイクル - 更新段階
│ ├── [52M] 9-13 ライフサイクル - アンマウント段階
│ └── [44M] 9-14 クラスまとめ
├── 10-【中級】Vue3 のコンポーネント化開発とコンポーネント間の通信方法 - 大規模で複雑なアプリケーションの主流開発モデル /
│ ├── [2.2M] 10-1 クラス紹介
│ ├── [4.0M] 10-2 コンポーネント化開発の概念
│ ├── [32M] 10-3 グローバルコンポーネントとローカルコンポーネントの登録
│ ├── [14M] 10-4 動的コンポーネント - component
│ ├── [14M] 10-5 props の概念とデータの渡し方
│ ├── [13M] 10-6 snippet generator を利用して vscode コードスニペットを生成
│ ├── [44M] 10-7 props 渡しの注意点
│ ├── [54M] 10-8 props の検証
│ ├── [52M] 10-9 一方向データフロー - 親コンポーネント内のデータを更新
│ ├── [20M] 10-10 slot - スロットの基本使用
│ ├── [24M] 10-11 slot - 名前付きスロット
│ ├── [31M] 10-12 slot - スコープスロット
│ └── [29M] 10-13 クラスまとめ
├── 11-【上級】Vue3 のルーティング管理と状態管理 - Vue3 大規模アプリケーションの基礎 /
│ ├── [2.4M] 11-1 クラス紹介
│ ├── [52M] 11-2 Vue Router のよく使う登録方法
│ ├── [68M] 11-3 Vue Router RouterLink と RouterView の関連使用
│ ├── [38M] 11-4 Vue Router ネストルーティング
│ ├── [14M] 11-5 Vue Router センシティブモードと厳格モード
│ ├── [44M] 11-6 Vue Router 動的ルーティングと 404 ページの設定
│ ├── [42M] 11-7 Vue Router 名前付きルーティングとプログラムナビゲーション
│ ├── [16M] 11-8 Vue Router におけるリダイレクトの 2 つのよく使う方法
│ ├── [8.6M] 11-9 Vue Router ナビゲーションガードの概念
│ ├── [45M] 11-10 Vue Router ナビゲーションガードの詳細
│ ├── [38M] 11-11 KeepAlive コンポーネントの詳細とアクティブ段階のライフサイクル
│ ├── [7.1M] 11-12 Pinia の概念
│ ├── [43M] 11-13 Pinia のインストールと統合
│ ├── [55M] 11-14 Pinia State の関連使用
│ ├── [16M] 11-15 Pinia Getters の関連使用
│ ├── [39M] 11-16 Pinia Actions の関連使用
│ ├── [28M] 11-17 Pinia Plugins の関連使用
│ └── [40M] 11-18 クラスまとめ
├── 12-【上級】Uni の概念とプロジェクト作成、関連ファイルの役割 - クロスプラットフォームフレームワークの第一選択 /
│ ├── [2.4M] 12-1 クラス紹介
│ ├── [14M] 12-2 uni の概念、由来と使用理由
│ ├── [6.4M] 12-3 uni の言語的特徴
│ ├── [10M] 12-4 uni コンパイラとランタイム
│ ├── [50M] 12-5 uni 公式サイトパネルの紹介と HBuilderX を使用したプロジェクト作成
│ ├── [45M] 12-6 uni vue-cli を使用したプロジェクト作成
│ ├── [35M] 12-7 uni の 2 つの方法でのプロジェクト作成の違い
│ ├── [29M] 12-8 uni main.js の役割
│ ├── [34M] 12-9 uni App.vue の役割
│ ├── [25M] 12-10 uni manifest.json の役割
│ ├── [42M] 12-11 uni pages.json の役割とコードスニペットの設定
│ └── [11M] 12-12 クラスまとめ
├── 13-【基礎】Uni の複数の複雑なケース実現 - Vue3 と小プログラムの知識点を深める /
│ ├── [2.5M] 13-1 クラス紹介
│ ├── [53M] 13-2 TabBar ケース
│ ├── [22M] 13-3 Counter ケース（1）
│ ├── [29M] 13-4 Counter ケース（2）
│ ├── [36M] 13-5 Router ケース（1）
│ ├── [38M] 13-6 Router ケース（2）
│ ├── [38M] 13-7 Form ケース
│ ├── [42M] 13-8 Request ケース（1）
│ ├── [60M] 13-9 Request ケース（2）
│ ├── [59M] 13-10 List ケース
│ └── [5.4M] 13-11 クラスまとめ
├── 14-【上級】「共有サッカー」プロジェクト実戦（フロントエンド）- 学んだ知識を柔軟に活用する /
│ ├── [19M] 14-1 クラス紹介
│ ├── [26M] 14-2 ホームページ機能分析とコードフォーマット
│ ├── [62M] 14-3 ホームページ地図機能構築
│ ├── [63M] 14-4 ホームページ QR コード貸出と会場概要構築
│ ├── [52M] 14-5 ホームページ QR コード貸出と会場概要イベント処理
│ ├── [61M] 14-6 ホームページ右側アイコン機能構築
│ ├── [67M] 14-7 会場詳細開発構築
│ ├── [68M] 14-8 会場詳細機能充実
│ ├── [57M] 14-9 カスタマーサービスセンターページ構築
│ ├── [38M] 14-10 カスタマーサービスセンターページイベント処理
│ ├── [70M] 14-11 問題詳細ページ開発
│ ├── [86M] 14-12 個人センターページ開発 - 上
│ ├── [48M] 14-13 個人センターページ開発 - 下
│ ├── [61M] 14-14 ユーザー登録ログインページ
│ ├── [37M] 14-15 私の財布ページ構築
│ ├── [53M] 14-16 会員チャージページ構築
│ ├── [35M] 14-17 注文リスト構築
│ ├── [24M] 14-18 賞品交換構築
│ ├── [55M] 14-19 私たちについてページ構築
│ └── [5.0M] 14-20 クラスまとめ
├── 15-【上級】NodeJs の概念と NPM の関連使用 - サーバーサイドの基礎スキルを構築する /
│ ├── 【認められた一手の完全 www.ukoou.com】
│ ├── [3.1M] 15-1 クラス紹介
│ ├── [15M] 15-2 NodeJs の概念と役割
│ ├── [13M] 15-3 NodeJs のインストールと初体験
│ ├── [16M] 15-4 NodeJs の REPL
│ ├── [53M] 15-5 NodeJs のバージョン管理ツール
│ ├── [55M] 15-6 Npm の役割と使用
│ ├── [50M] 15-7 Npm よく使うコマンドと Npm パッケージの公開
│ ├── [26M] 15-8 Npm ソース管理ツール - Nrm
│ ├── [5.6M] 15-9 モジュール化開発の概念紹介
│ ├── [70M] 15-10 CommonJs モジュール化規範
│ ├── [42M] 15-11 EsModule モジュール化規範
│ └── [13M] 15-12 クラスまとめ
├── 16-【上級】NodeJs のイベントループ、非同期 IO、よく使う内蔵モジュール - NodeJs の核心 /
│ ├── [2.0M] 16-1 クラス紹介
│ ├── [20M] 16-2 NodeJs の底層アーキテクチャ
│ ├── [60M] 16-3 NodeJs イベントループの詳細
│ ├── [35M] 16-4 NodeJs イベントループ練習問題
│ ├── [31M] 16-5 NodeJs 内蔵モジュール fs の紹介
│ ├── [47M] 16-6 NodeJs 内蔵モジュール fs のよく使う操作
│ ├── [35M] 16-7 NodeJs ファイルディスクリプタ
│ ├── [37M] 16-8 NodeJs 内蔵モジュール path の紹介
│ ├── [69M] 16-9 NodeJs 内蔵モジュール http の紹介
│ └── [12M] 16-10 クラスまとめ
├── 17-【上級】NodeJs のよく使うフレームワーク Express と Koa-NodeJs 開発効率を向上させる /
│ ├── [3.5M] 17-1 クラス紹介
│ ├── [29M] 17-2 Express の概念とインストール
│ ├── [37M] 17-3 -1 Express の req と res オブジェクト
│ ├── [49M] 17-4 -2 Express の req と res オブジェクト_Sub_01
│ ├── [51M] 17-5 Express のミドルウェア
│ ├── [29M] 17-6 Express ルーティング
│ ├── [31M] 17-7 Express 静的リソースの保存
│ ├── [86M] 17-8 Express ファイルアップロード
│ ├── [31M] 17-9 Express 静的リソースの保存
│ ├── [31M] 17-10 Express ログ記録
│ ├── [42M] 17-11 Express エラーハンドリング
│ ├── [13M] 17-12 Koa の紹介
│ ├── [39M] 17-13 Koa のリクエストとレスポンスオブジェクト
│ ├── [53M] 17-14 Koa のミドルウェア
│ ├── [36M] 17-15 Koa のルーティング使用
│ ├── [45M] 17-16 Koa のファイルアップロード
│ ├── [16M] 17-17 Koa の静的リソース
│ ├── [13M] 17-18 Koa のログ収集
│ ├── [30M] 17-19 Koa のエラーハンドリング
│ └── [8.0M] 17-20 クラスまとめ
├── 18-【上級】MySQL の概念とよく使うデータ型 - MySQL を理解し、初体験 /
│ ├── [2.1M] 18-1 クラス紹介
│ ├── [8.2M] 18-2 MySQL の概念
│ ├── [53M] 18-3 MySQL のインストール
│ ├── [15M] 18-4 MySQL デフォルトデータベースと関連概念
│ ├── [35M] 18-5 MySQL ケース初体験
│ ├── [9.7M] 18-6 MySQL 文の分類
│ ├── [29M] 18-7 MySQL よく使うデータ型
│ └── [17M] 18-8 クラスまとめ
├── 19-【上級】データベース操作学習と使用 - CRUD エンジニアになる /
│ ├── [1.7M] 19-1 クラス紹介
│ ├── [28M] 19-2 データベースの増删改查
│ ├── [52M] 19-3 表の増删改查
│ ├── [46M] 19-4 データの増删改查
│ ├── [37M] 19-5 MySQL クエリ解説 - 1
│ ├── [39M] 19-6 MySQL クエリ解説 - 2
│ ├── [38M] 19-7 MySQL SQL JOIN 解説 - 1
│ ├── [51M] 19-8 MySQL SQL JOIN 解説 - 2
│ ├── [51M] 19-9 mysql2 の使用方法
│ └── [5.9M] 19-10 クラスまとめ
├── 20-【上級】「共有サッカー」プロジェクト実戦（バックエンド）- 学んだ知識を柔軟に使用する /
│ ├── [2.8M] 20-1 クラス紹介
│ ├── [71M] 20-2 プロジェクト環境構築
│ ├── [73M] 20-3 会場設備インターフェース実現
│ ├── [47M] 20-4 ログインプロセスの詳細
│ ├── [73M] 20-5 登録インターフェース実現
│ ├── [38M] 20-6 -1 ログインインターフェース実現
│ ├── [36M] 20-7 -2 ログインインターフェース実現
│ ├── [42M] 20-8 WeChat 決済プロセスの詳細
│ ├── [65M] 20-9 -1 ログイン認証とチャージインターフェース実現
│ ├── [61M] 20-10 -2 ログイン認証とチャージインターフェース実現
│ ├── [67M] 20-11 賞品交換インターフェース実現
│ ├── [65M] 20-12 注文作成インターフェース実現
│ ├── [53M] 20-13 注文終了インターフェース実現
│ ├── [52M] 20-14 注文リストインターフェース実現
│ ├── [46M] 20-15 カスタマーサービス問題インターフェース実現
│ ├── [74M] 20-16 アバターアップロードインターフェース実現
│ ├── [58M] 20-17 ユーザーアバターアクセス実現
│ ├── [29M] 20-18 インターフェースデータ構造の処理
│ └── [9.4M] 20-19 クラスまとめ
├── 21 - フロントエンドとバックエンドのプロジェクトインターフェース調整 - プロジェクトの円滑な実現を保証する /
│ ├── [2.7M] 21-1 クラス紹介
│ ├── [88M] 21-2 会場インターフェース調整
│ ├── [51M] 21-3 カスタマーサービス問題調整
│ ├── [84M] 21-4 登録ログイン改造
│ ├── [28M] 21-5 登録ログインインターフェース調整
│ ├── [53M] 21-6 アバターアップロードインターフェースデバッグ
│ ├── [30M] 21-7 チャージインターフェース調整
│ ├── [17M] 21-8 cdkey 交換調整
│ ├── [39M] 21-9 注文の作成と終了
│ ├── [38M] 21-10 注文リストインターフェース調整
│ └── [12M] 21-11 クラスまとめ
├── 22 - プロジェクトのオンラインとデプロイ - あなたのアプリケーションを公開して全世界の人々に使ってもらいましょう！/
│ ├── [2.2M] 22-1 クラス紹介
│ ├── [6.4M] 22-2 クラウドサーバーの概念と役割
│ ├── [54M] 22-3 クラウドサーバーの選択と購入
│ ├── [70M] 22-4 centos 7.9 プロジェクト環境構築とデプロイ
│ ├── [59M] 22-5 pm2 の使用と自動デプロイ
│ └── [16M] 22-6 クラスまとめ