目次 第
1章 はじめに
1.1 開発背景
1.2 選択したテーマの意味と目的
1.3 研究状況
1.4 本論文の研究内容
第 2 章 主要技術の紹介
2.1 NODE.JS
2.2 MYSQL
2.3 VUE
2.4 HTML
2.5 JS
2.6 CSS
2.7 小規模プログラム開発ツール
3 章 システム分析
3.1 小さなプログラム設計のアイデア
3.2 データシート
第 4 章 システムの実装
4.1 ショッピングプロセス
4.2 開店プロセス
4.3 モールのホームページ 4.4
ディスカバリーページ
4.5 ショッピングカート
4.6 私の
4.7 製品の詳細
4.8 注文確認ページ
4.9 住所の追加、住所の選択
4.10 アドレスリスト
4.11 注文の支払いとパスワードの入力
4.12 私の注文
4.14 ストアメニューとストア情報の表示
4.15 製品の公開
4.16 サーバー
第 5 章 システムテスト
5.1 WeChat 認証と WeChat ID バインド
5.2 製品リストと詳細テスト
5.3 ショッピングカートのテスト
5.4 ショッピング カートの単一アイテムと複数アイテムの決済
5.5 アドレスとアドレス選択の追加
5.6 注文テスト 参考文献 謝辞
第1 章 はじめに1.1 開発の背景 オンライン ショッピングの急速な発展により、多くの電子商取引プラットフォームが誕生しました。クラウドのタオバオ、劉強東のJD.com、張金東のSuning.com、黄正のPinduoduoなど。その中で、Pinduoduo は最も急速に成長しており、急速に成長しています。WeChat の巨大なユーザー グループに依存して、Pinduoduo はユーザー数を急速に拡大しています。そのグループ交渉戦略により、ユーザーの共有と拡散が促進されます。共有して、最終的に Pinduoduo ミニ プログラムを開きます。小規模プログラムには、「使用後すぐに消える」「手の届く範囲にある」「インストールやアンインストールが不要」という 3 つの大きな特徴があり、この 3 つの特徴が小規模プログラムの迅速な開発をサポートします。中小企業にとって、WeChat ミニ プログラムの開発コストは低く、特にミニ プログラムの開発に特化している企業は、ミニ プログラムの開発に熟練しており、パッケージ化する必要がないフレームワークを利用できます。さらに、企業は WeChat プラットフォームを使用して大量のトラフィックを獲得できます。ミニ プログラムでは、APP のプロモーション、運用、開発を個別に行う必要はありません。ミニ プログラムは、誰もが日常的に使用するスキャン機能、写真機能、支払い機能など、WeChat の使用でよく使用される多くのインターフェイスを提供します。開発時間とコストを削減しながら、ユーザーの使用習慣を変えることもできません。これは他のプログラムでは簡単に実現できません。変わりやすい気候や不安定な環境により、人々は外出することにある程度の抵抗を感じます。世界中でのオンラインショッピング、商品の真正性、道路の消費、商品の返品の難しさなどにより、電子商取引の発展はボトルネックの時期に達しています。偽造品や粗悪品の増加も電子商取引に対する抵抗感を生み出しています。商品がすぐに見られなかったり、返品・交換の対応がうまくできなかったりして、ネットショッピングに対する人々の気持ちは非常に冷たく感じられました。これは危機でもありますが、ビジネスチャンスでもあります。
これは単なるビジネスチャンスであり、実店舗が電子商取引に対抗する大きなビジネスチャンスだと思います。もちろん、これには依然としてインターネットが必要ですが、インターネットのプロパガンダ効果は自明のことであり、現代社会ではインターネットなしでは誰も生きていけません。インターネットのない世界から切り離された苦しみは、今日の多くの若者の心の反映です。オンラインショッピングは便利ですが、差し迫った問題を解決することはできません。
このため、私は周囲の地域へのサービスを優先し、その後外側に拡張する WeChat アプレットベースのショートカット プログラムを開発したいと考えています。小規模なプログラムの開発には、WeChatが独自に開発した開発ツール「WeChat Developer Tools」を利用するほか、Hbuilderなどのサードパーティ開発ツールを利用して開発することも可能です。プログラムをアップロードするだけです。主流の開発フレームワークであるVueに似た前回開発時と同じ言語を使用しており、開発者が利用できる豊富なAPIを備えているため、開発者の負担と開発難易度が大幅に軽減されます。
1.2 選定テーマの意義と目的
社会の発展に伴い、インターネット時代の到来、携帯電話の普及、交通機関の発達。オンライン取引は、従来の取引に比べて利便性が高く、スワイプするだけで全国の商品を閲覧でき、欲しい商品があれば、直接「購入」ボタンをクリックして注文することができます。注文と支払い、あとは物流にお任せください。配達員のお兄さんからの電話を家で辛抱強く待つだけです。
当初は大変好評でしたが、ネット通販の商品数は倍増する一方、不良品も増え、季節や天候、お祭りなどの影響で、入手までに長時間お待ちいただくことも多くなりました。商品まで。待った後、商品を手に入れた後、注文したときに感じていた愛情や衝動は長い間失われていました。電子商取引の解決策は、より多くの倉庫と物流拠点を配置し、物流車両を増やして移動に費やす時間を解決することであり、これによりコストも増加します。
そこで、販売業者が周辺地域へのサービスを優先し、サービス サークルを設定し、サークル内でリアルタイムに配送し、サークル外で物流を迅速に行えるようにするソフトウェアを開発してはいかがでしょうか。ユーザーが近くの加盟店や商品を優先的に表示することで、ユーザーが最短時間で商品を手に入れることができ、住所に応じて店舗まで足を運んで選択することも可能です。一方で、店舗は人の流れを増やすことを推進しており、インターネット上ではどこに出店しても人の流れは同じなので、出店コストを削減することができます。利益が増加し、増加した利益はユーザーにフィードバックされるため、双方にメリットが得られます。
1.3 研究状況
2018 年 3 月のデータによると、WeChat ユーザー数は 10 億人を超えています。2017 年にミニ プログラムが開始されてから、その月のユーザー数はわずか 200 万人でした。その後、ミニプログラムの継続的なアップデートに伴い、友達やモーメントとの共有、公式アカウントのジャンプなどの複数の入り口が追加され、ミニプログラムのユーザー数は増加し始めました。2017 年 12 月、「ジャンプ」に代表される WeChat ミニプログラムが正式に開始されてから、このミニプログラムは急速に人々の視野に入り、ユーザー数も急増し始めました。 WeChat ミニプログラムはその月に 4 億人以上に達しました。ミニプログラムの継続的な更新に伴い、ミニプログラムの使用シナリオも継続的に増加し始め、カバーエリアはますます広くなり、ミニプログラムのユーザー人口も傾向を形成しています。
小規模なプログラムの開発とユーザー数の増加に伴い、多くの電子商取引プラットフォームも小規模なプログラムのバージョンを次々と開発しており、Pinduoduo は最も成功した事例の 1 つです。小規模なプログラムを簡単に広めることができたおかげで、Pinduoduo は WeChat グループですぐに人気になり、どのグループを開いても Pinduoduo の存在の痕跡を見つけることができます。WeChatプラットフォームの継続的な更新と反復のおかげで、新しい機能が次々に開発され、機能が増えるたびに人々にさまざまな驚きをもたらします。つまり、前バージョンとの互換性と新機能の追加が行われ、最近ではライブブロードキャスト機能も開始されました。コードを書いて独自に開発する必要はなく、管理プラットフォームのグラフィカルインターフェイスを操作するだけで、アプレットでライブブロードキャスト機能を実現します。これにより、開発コストと保守コストが大幅に削減されます。
1.4 この論文の研究内容
この論文は主に、WeChat アプレットを使用して多加盟店マイクロモールを開発する方法を研究します。研究のアイデアは次のとおりです。
(1) ニーズを特定します。全体的な要件は、1 つの WeChat アカウントが 1 人のユーザーであり、各ユーザーは同じアカウントを使用して買い物をしたりストアを開くことができるということです。ユーザーになった後は引き続き出店者申請を行い、審査を通過すると自社商品をモールに掲載することができます
（２）機能を決定します。このモールの主な機能は、加盟店による商品の出品と利用者の商品購入であり、各商品の取引プロセスは加盟店と利用者の共同運営によって完了する必要があります。販売者が商品を棚に並べ、ユーザーが商品を閲覧して購入し、販売者が商品を配達し、ユーザーが商品を受け取って評価するという商品取引のプロセスです。
(3) 実施計画を検討する。WeChat の一意の識別子を使用して、各ユーザーの一意性とデータの関連付けを判断します。ユーザー ID と店舗 ID を使用してユーザーと商品の関連付けを実現します。店舗 ID と製品 ID によって店舗情報と商品情報の関連付けを実現します。ユーザー ID、注文 ID、およびユーザー情報、注文情報と製品情報の関連付けを実現します。製品 ID; アドレス ID とユーザー ID を使用して、ユーザー情報と住所情報の関連付けを実現します; ユーザー ID、製品 ID、ショッピング カート ID を使用して、ショッピング カート、ユーザー、製品の関連付けを実現します。
(4) ページのレイアウトと機能。ホームページには、デフォルトで販売数量順に製品が表示されますが、価格、距離、好感度による並べ替えを追加できます。ディスカバリーページは、製品タイプ、製品ブランド、製品名、製品説明などの製品を検索するために使用されます。ショッピングページでは、ユーザーがショッピングカートに追加した製品を保存し、注文や注文を行うことができます。複数の商品を同時に支払う; マイページは、注文、お気に入りの商品、お気に入りのストア、マイストア、掲載商品、個人情報などのデータを管理するために使用されます。
(5) ページ書き込み。このページは、テンセントが提供する「WeChat Developer Tools」を使用し、「WeChat Mini Program Development Documentation」を参照して作成されており、フレームワークが提供する API を使用して、写真の共有、写真の選択、アップロード、写真の閲覧などの機能を実現しています。そしてページジャンプ。
(6) データドッキング。フレームワークの組み込み API を使用して、データを非同期的にロードし、ローカルでデータを更新します。ユーザー操作をリアルタイムで記録し、ユーザーのニーズをフィードバックします。ユーザー ID、ストア ID、ユーザーの支払いパスワードなどの重要な情報を非表示にし、表示します。製品情報、注文情報、店舗情報などのページ情報
(7) 機能テスト。注文の際、決済ページに到達しても決済が行われていない場合、その注文を未決注文に変更するなど、ユーザーのさまざまな操作に対応して各機能が正常に動作するかどうかをテストします。製品を購入する際、ユーザーは購入数量を 0 に設定しますが、これは許可されていません。ユーザーの残高が不足している場合、支払いは失敗し、ユーザーに「残高不足のため支払いに失敗しました。」というメッセージが表示されます。 第 2 章 主要なテクノロジーの概要
2.1
Node.Js
Node.js は JavaScript 環境で動作するフレームワークです。JavaScript でバックエンドプログラムを開発できるようになり、他のバックエンド言語で実現される機能のほとんどを実現できます。PHP、Java、Python、NET、Ruby などのバックエンド言語と同等の立場に立つことができます。
3.3.2 Node.js のメリット
Node.js の文法は js とほぼ同じであるため、JavaScript を学習して使用したことがある人であれば非常に簡単に node.js の開発を学習できると言えます。Node.js は Javascript の適用範囲を広げ、ブラウザからサーバーまで大きな進歩を遂げました。フロントエンドとバックエンドのプログラミング環境の一元化を実現し、開発時間と開発コストを大幅に削減します。Node.js は、シングルスレッドのノンブロッキング I/O とイベント駆動型メカニズムを使用する超高度な同時実行機能を備えているため、Node.js プログラムはマクロ レベルでも並列処理されます。
2.2 mysql
MySQL はオープン ソースのリレーショナル データベース システムであり、最も人気のあるデータベース システムの 1 つとなり、オリジナルの商用データベース市場にも徐々に参入しつつあります。Yahoo、Google、Facebook、NetEase などの多くの大企業が、MySQL データベースを主要なデータベースとして使用しており、コア アプリケーション データベース システムとしても MySQL を使用していることがわかります。
2.3 Vue
過去 10 年間で、JavaScript のおかげで、私たちの Web ページはより動的かつ強力になりました。私たちは、従来のサーバーサイド コードをブラウザに大量に組み込み、数千行の JavaScript コードを生成しました。 HTML ファイルと CSS ファイル [4] は存在しますが、正式な組織形態が欠けているため、JavaScript フレームワークを使用する開発者が増えており、vue は現在最も人気のあるフレームワークの 1 つです。Vue フレームワークは、ユーザー インターフェイスを構築するための進歩的なフレームワークです。Vue[2] のコア ライブラリはビュー レイヤーのみに焦点を当てており、使いやすいだけでなく、サードパーティのライブラリや既存のプロジェクトとの統合も簡単です。Vue は js を使って HTML を書くため、多くの繰り返しコードがある程度減り、コードを書く速度が大幅に向上しますが、その中でも v-for はループでコードを生成するために使用され、 v-if は表示するかどうかの判断に使用されます。要素、および v -show と比較すると、1 つは存在しますが、表示されずスペースも占有しません、もう 1 つはまったく存在しません、v-model マルチユーザーは入力で入力コンテンツを取得します、2.4 HTML HTML は
ブリック
ですおよび Web サイト構築の基礎、Web サイト構築の基礎、および一般的に使用されるタグがあります。 <div></div> 要素はブロックレベルの要素を表します。つまり、デフォルトで 1 行を占め、前後の要素と同じ行; <span></span> 要素は、行内の原色を表します。つまり、前後に 1 つある場合、それはインライン要素要素でもあり、折り返しなしで 1 行で表示され、インライン要素の幅と高さの設定は反映されませんが、表示属性を使用して変更できます。ユーザー ページのジャンプである <a></a> 要素には、トリガー スタイル、必要なのは 1 つだけです。 アドレス、インターネット上の任意のページにジャンプでき、非常に使いやすいです。
2.
JavaScript は、クロスプラットフォームのオブジェクト指向スクリプト言語です。これは Web ページのインタラクションに不可欠なものです。JavaScript のない Web サイトは死んだもので魂がありません。JavaScript を追加することによってのみ、Web サイトに柔軟性、生命力、さまざまなアクションやインタラクションを与えることができます。HTML タグを動的に変更したり、HTML タグを動的に変更したりすることもできます。ユーザーの操作に応じてCSSのスタイルを変更します。つまり、JavaScript は HTML の魂です。
Javascript は、Web サイトの実行中に HTML では実行できない多くのことを実行できます。たとえば、ユーザー入力を取得してバックグラウンドに渡し、バックグラウンドから返されたものをユーザーに表示します。2.6 CSS CSS はカスケード スタイルです
。
シート (英語の正式名: Cascading Style Sheets)。ユーザーがHTML内のタグを好きなように配置するためのツールであり、HTMLを素材に例えるなら、CSSはHTMLの表示を指定する型であり、強力な機能を持ち、アニメーションを使用して予期せぬ効果を与えることができます; シンプルで実用的であることが大きな特徴の 1 つ;
2.7 ミニ プログラム開発者ツール
WeChat ミニ プログラムは、ミニ プログラムの一種で、英語名は Mini Program です。APP よりも小さくて高速なアプリケーションであり、ダウンロードせずにインストールして使用できます。プログラムが「すぐに使える」という夢を実現し、ユーザーは WeChat を使用してスキャンまたは検索し、対応するアプリケーションを開くことができます。また、友達や公式アカウントのジャンプ、アプリのジャンプをシェアすることで、ミニプログラムにエントリーし、ミニプログラムの指定ページに到達することもできます。これは、すべてのアプレットを 1 つのプロジェクトに統合し、ページ間を移動することと同じです。それは一人の個人であるだけでなく、全体でもあります。
WeChat ミニ プログラム開発者ツールは、シンプルで効率的、習得しやすく、使いやすいアプリケーション開発フレームワークと豊富なコンポーネントと API を提供します。これにより、開発の難易度が大幅に軽減され、開発効率が向上します。
ミニ プログラムで使用される開発言語は主に JavaScript であり、ミニ プログラムの開発プロセスは通常の Web 開発と似ています。長年フロントエンド開発に携わってきた人にとって、Web開発から小規模プログラム開発へ移行する敷居は高くありませんが、両者にはいくつかの違いがあります。
