8 次代码提交 0e8819f155 ... 769ce8ab6e

作者 SHA1 备注 提交日期
  kiboky 769ce8ab6e JWT 플러그인 설치 5 年之前
  kiboky 58176aa48d improve 5 年之前
  kiboky d74aa4cc54 array map data populate 처리 5 年之前
  kiboky 2273fec88c improve 5 年之前
  kiboky 7b58b6ba8e SearchBox 추가 5 年之前
  kiboky d4be364612 Footer추가 5 年之前
  kiboky 08e8c5d6a9 네비게이션 컴포넌트 5 年之前
  kiboky b1c49893c7 클라이언트 초기화 5 年之前
共有 82 个文件被更改,包括 58554 次插入2 次删除
  1. 13 0
      client/.editorconfig
  2. 92 0
      client/.gitignore
  3. 22 0
      client/README.md
  4. 7 0
      client/assets/README.md
  5. 39 0
      client/components/FeatureProduct.vue
  6. 576 0
      client/components/Footer.vue
  7. 33 0
      client/components/Logo.vue
  8. 122 0
      client/components/Navbar.vue
  9. 7 0
      client/components/README.md
  10. 30 0
      client/components/Search.vue
  11. 12 0
      client/jsconfig.json
  12. 7 0
      client/layouts/README.md
  13. 26 0
      client/layouts/default.vue
  14. 8 0
      client/middleware/README.md
  15. 69 0
      client/nuxt.config.js
  16. 9530 0
      client/package-lock.json
  17. 21 0
      client/package.json
  18. 6 0
      client/pages/README.md
  19. 135 0
      client/pages/index.vue
  20. 366 0
      client/pages/products/_id.vue
  21. 7 0
      client/plugins/README.md
  22. 11 0
      client/static/README.md
  23. 6205 0
      client/static/css/all.css
  24. 4723 0
      client/static/css/default.css
  25. 6205 0
      client/static/css/font-awesome/css/all.css
  26. 二进制
      client/static/css/font-awesome/webfonts/fa-brands-400.eot
  27. 3459 0
      client/static/css/font-awesome/webfonts/fa-brands-400.svg
  28. 二进制
      client/static/css/font-awesome/webfonts/fa-brands-400.ttf
  29. 二进制
      client/static/css/font-awesome/webfonts/fa-brands-400.woff
  30. 二进制
      client/static/css/font-awesome/webfonts/fa-brands-400.woff2
  31. 二进制
      client/static/css/font-awesome/webfonts/fa-light-300.eot
  32. 9901 0
      client/static/css/font-awesome/webfonts/fa-light-300.svg
  33. 二进制
      client/static/css/font-awesome/webfonts/fa-light-300.ttf
  34. 二进制
      client/static/css/font-awesome/webfonts/fa-light-300.woff
  35. 二进制
      client/static/css/font-awesome/webfonts/fa-light-300.woff2
  36. 二进制
      client/static/css/font-awesome/webfonts/fa-regular-400.eot
  37. 9103 0
      client/static/css/font-awesome/webfonts/fa-regular-400.svg
  38. 二进制
      client/static/css/font-awesome/webfonts/fa-regular-400.ttf
  39. 二进制
      client/static/css/font-awesome/webfonts/fa-regular-400.woff
  40. 二进制
      client/static/css/font-awesome/webfonts/fa-regular-400.woff2
  41. 二进制
      client/static/css/font-awesome/webfonts/fa-solid-900.eot
  42. 7709 0
      client/static/css/font-awesome/webfonts/fa-solid-900.svg
  43. 二进制
      client/static/css/font-awesome/webfonts/fa-solid-900.ttf
  44. 二进制
      client/static/css/font-awesome/webfonts/fa-solid-900.woff
  45. 二进制
      client/static/css/font-awesome/webfonts/fa-solid-900.woff2
  46. 二进制
      client/static/favicon.ico
  47. 二进制
      client/static/font/amazon-ember-regular-webfont.eot
  48. 二进制
      client/static/font/amazon-ember-regular-webfont.ttf
  49. 二进制
      client/static/font/amazon-ember-regular-webfont.woff
  50. 二进制
      client/static/font/amazon-ember-regular-webfont.woff2
  51. 二进制
      client/static/icon.png
  52. 二进制
      client/static/img/amazonImg.jpg
  53. 二进制
      client/static/img/arrow.gif
  54. 二进制
      client/static/img/audiblelogo.png
  55. 二进制
      client/static/img/avatar.png
  56. 二进制
      client/static/img/cart.png
  57. 二进制
      client/static/img/cartRecent4.png
  58. 二进制
      client/static/img/cart_06.png
  59. 二进制
      client/static/img/featuredProduct.jpeg
  60. 二进制
      client/static/img/gift.png
  61. 二进制
      client/static/img/globalImg.png
  62. 二进制
      client/static/img/icons.png
  63. 二进制
      client/static/img/icons2.png
  64. 二进制
      client/static/img/icons3.png
  65. 二进制
      client/static/img/icons4.png
  66. 二进制
      client/static/img/imageUpload.png
  67. 二进制
      client/static/img/logo-black.png
  68. 二进制
      client/static/img/logo-black1.png
  69. 二进制
      client/static/img/logo.png
  70. 二进制
      client/static/img/logo1.png
  71. 二进制
      client/static/img/logo2.png
  72. 二进制
      client/static/img/navShipping.gif
  73. 二进制
      client/static/img/placeHeadernav.gif
  74. 二进制
      client/static/img/readyondevice.png
  75. 二进制
      client/static/img/search.png
  76. 二进制
      client/static/img/socialshare.png
  77. 二进制
      client/static/img/spcBody.jpg
  78. 二进制
      client/static/img/visa.gif
  79. 10 0
      client/store/README.md
  80. 96 0
      server/package-lock.json
  81. 2 0
      server/package.json
  82. 2 2
      server/routes/products.js

+ 13 - 0
client/.editorconfig

@@ -0,0 +1,13 @@
+# editorconfig.org
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false

+ 92 - 0
client/.gitignore

@@ -0,0 +1,92 @@
+# Created by .ignore support plugin (hsz.mobi)
+### Node template
+# Logs
+/logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+# TypeScript v1 declaration files
+typings/
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variables file
+.env
+
+# parcel-bundler cache (https://parceljs.org/)
+.cache
+
+# next.js build output
+.next
+
+# nuxt.js build output
+.nuxt
+
+# Nuxt generate
+dist
+
+# vuepress build output
+.vuepress/dist
+
+# Serverless directories
+.serverless
+
+# IDE / Editor
+.idea
+
+# Service worker
+sw.*
+
+# Mac OSX
+.DS_Store
+
+# Vim swap files
+*.swp
+
+.history

+ 22 - 0
client/README.md

@@ -0,0 +1,22 @@
+# client
+
+> My top-notch Nuxt.js project
+
+## Build Setup
+
+``` bash
+# install dependencies
+$ npm run install
+
+# serve with hot reload at localhost:3000
+$ npm run dev
+
+# build for production and launch server
+$ npm run build
+$ npm run start
+
+# generate static project
+$ npm run generate
+```
+
+For detailed explanation on how things work, check out [Nuxt.js docs](https://nuxtjs.org).

+ 7 - 0
client/assets/README.md

@@ -0,0 +1,7 @@
+# ASSETS
+
+**This directory is not required, you can delete it if you don't want to use it.**
+
+This directory contains your un-compiled assets such as LESS, SASS, or JavaScript.
+
+More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/assets#webpacked).

+ 39 - 0
client/components/FeatureProduct.vue

@@ -0,0 +1,39 @@
+<template>
+  <div class="mainContent">
+    <div class="unified_widget pageBanner">
+      <h1>Book</h1>
+      <p>
+        <b>
+          Browse for more Book
+          <a href="#">leader of people</a>,or
+          <a href="#">leader of people</a>, like heaary thjrowns
+          <a href="#">leader of people</a>
+        </b>
+      </p>
+    </div>
+    <div class="bx-root">
+      <div class="row">
+        <div class="col-sm-5 text-center">
+          <div class="bx-root-image">
+            <img src="/img/amazonImg.jpg" alt="img-fluid">
+          </div>
+        </div>
+        <div class="col-sm-7 m-auto">
+          <div class="bx-root-dtls">
+            <div class="bx-root-heading">The Program</div>
+          </div>
+          <div class="bx-root-subtext">Lorem ipsum dolor sit amet consectetur</div>
+          <div class="bx-root-link">
+            <span>Order Now</span>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+
+}
+</script>

+ 576 - 0
client/components/Footer.vue

@@ -0,0 +1,576 @@
+<template>
+  <!--FOOTER-->
+  <footer>
+    <div class="navLeftFooter">
+      <a href="#" id="navBackToTop">
+        <div class="navFooterBackToTop">
+          <span class="navFooterBackToTopText">Back to top</span>
+        </div>
+      </a>
+      <div class="container-fluid">
+        <div class="container">
+          <div class="row">
+            <div class="col-md-3 col-sm-6">
+              <div class="navFooterCol">
+                <div class="navFooterColHead">Get to Know Us</div>
+                <ul>
+                  <li>
+                    <a href="#">Careers</a>
+                  </li>
+                  <li>
+                    <a href="#">Blog</a>
+                  </li>
+                  <li>
+                    <a href="#">About Amazon</a>
+                  </li>
+                  <li>
+                    <a href="#">Investor Relations</a>
+                  </li>
+                  <li>
+                    <a href="#">Amazon Devices</a>
+                  </li>
+                  <li>
+                    <a href="#">Amazon Tours</a>
+                  </li>
+                </ul>
+              </div>
+            </div>
+            <div class="col-md-3 col-sm-6">
+              <div class="navFooterCol">
+                <div class="navFooterColHead">Make Money with Us</div>
+                <ul>
+                  <li>
+                    <a href="#">Sell on Amazon</a>
+                  </li>
+                  <li>
+                    <a href="#">Blog</a>
+                  </li>
+                  <li>
+                    <a href="#">About Amazon</a>
+                  </li>
+                  <li>
+                    <a href="#">Investor Relations</a>
+                  </li>
+                  <li>
+                    <a href="#">Amazon Devices</a>
+                  </li>
+                  <li>
+                    <a href="#">Amazon Tours</a>
+                  </li>
+                </ul>
+              </div>
+            </div>
+            <div class="col-md-3 col-sm-6">
+              <div class="navFooterCol">
+                <div class="navFooterColHead">Amazon Payment Products</div>
+                <ul>
+                  <li>
+                    <a href="#">Sell on Amazon</a>
+                  </li>
+                  <li>
+                    <a href="#">Blog</a>
+                  </li>
+                  <li>
+                    <a href="#">About Amazon</a>
+                  </li>
+                  <li>
+                    <a href="#">Investor Relations</a>
+                  </li>
+                  <li>
+                    <a href="#">Amazon Devices</a>
+                  </li>
+                  <li>
+                    <a href="#">Amazon Tours</a>
+                  </li>
+                </ul>
+              </div>
+            </div>
+            <div class="col-md-3 col-sm-6">
+              <div class="navFooterCol">
+                <div class="navFooterColHead">Let Us Help You</div>
+                <ul>
+                  <li>
+                    <a href="#">Sell on Amazon</a>
+                  </li>
+                  <li>
+                    <a href="#">Blog</a>
+                  </li>
+                  <li>
+                    <a href="#">About Amazon</a>
+                  </li>
+                  <li>
+                    <a href="#">Investor Relations</a>
+                  </li>
+                  <li>
+                    <a href="#">Amazon Devices</a>
+                  </li>
+                  <li>
+                    <a href="#">Amazon Tours</a>
+                  </li>
+                </ul>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="nav-footer-line"></div>
+        <div class="container">
+          <div class="navFooterPadItem row">
+            <div class="col-md-4 col-sm-12 text-right">
+              <div class="navFooterLogoLine">
+                <a href="#">
+                  <div class="nav-logo-base nav-sprite"></div>
+                </a>
+              </div>
+            </div>
+            <div class="col-md-8 col-sm-12">
+              <span class="icp-container-desktop">
+                <div class="navFooterLine">
+                  <a href="#" class="icp-button">
+                    <div class="icp-nav-globe-img-2 icp-button-globe-2 icp-nav-globe-curr-fix">​</div>
+                    <span class="icp-color-base">English</span>
+                    <span class="nav-arrow icp-up-down-arrow"></span>
+                  </a>
+                  <a href="#" class="icp-button">
+                    <span class="icp-currency-symbol">$</span>
+                    <span class="icp-color-base">USD - U.S. Dollar</span>
+                  </a>
+                  <a href="#" class="icp-button">
+                    <span class="icp-currency-symbol">$</span>
+                    <span class="icp-color-base">United States</span>
+                  </a>
+                </div>
+              </span>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="navFooterDescLine">
+        <div class="container-fluid">
+          <div class="container">
+            <table>
+              <tbody>
+                <tr>
+                  <td class="navFooterDescItem">
+                    <a href="#" class="nav_a">
+                      Amazon Music
+                      <br />
+                      <span class="navFooterDescText">
+                        Stream millions
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer" style="width: 4%"></td>
+                  <td class="navFooterDescItem">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer third" style="width: 4%"></td>
+                  <td class="navFooterDescItem third">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer forth" style="width: 4%"></td>
+                  <td class="navFooterDescItem forth">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer fivth" style="width: 4%"></td>
+                  <td class="navFooterDescItem fivth">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer sixth" style="width: 4%"></td>
+                  <td class="navFooterDescItem sixth">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer svnth" style="width: 4%"></td>
+                  <td class="navFooterDescItem svnth">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                </tr>
+                <tr>
+                  <td>&nbsp;</td>
+                </tr>
+                <tr>
+                  <td class="navFooterDescItem">
+                    <a href="#" class="nav_a">
+                      Amazon Music
+                      <br />
+                      <span class="navFooterDescText">
+                        Stream millions
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer" style="width: 4%"></td>
+                  <td class="navFooterDescItem">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer third" style="width: 4%"></td>
+                  <td class="navFooterDescItem third">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer forth" style="width: 4%"></td>
+                  <td class="navFooterDescItem forth">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer fivth" style="width: 4%"></td>
+                  <td class="navFooterDescItem fivth">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer sixth" style="width: 4%"></td>
+                  <td class="navFooterDescItem sixth">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer svnth" style="width: 4%"></td>
+                  <td class="navFooterDescItem svnth">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                </tr>
+                <tr>
+                  <td>&nbsp;</td>
+                </tr>
+                <tr>
+                  <td class="navFooterDescItem">
+                    <a href="#" class="nav_a">
+                      Amazon Music
+                      <br />
+                      <span class="navFooterDescText">
+                        Stream millions
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer" style="width: 4%"></td>
+                  <td class="navFooterDescItem">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer third" style="width: 4%"></td>
+                  <td class="navFooterDescItem third">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer forth" style="width: 4%"></td>
+                  <td class="navFooterDescItem forth">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer fivth" style="width: 4%"></td>
+                  <td class="navFooterDescItem fivth">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer sixth" style="width: 4%"></td>
+                  <td class="navFooterDescItem sixth">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer svnth" style="width: 4%"></td>
+                  <td class="navFooterDescItem svnth">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                </tr>
+                <tr>
+                  <td>&nbsp;</td>
+                </tr>
+                <tr>
+                  <td class="navFooterDescItem">
+                    <a href="#" class="nav_a">
+                      Amazon Music
+                      <br />
+                      <span class="navFooterDescText">
+                        Stream millions
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer" style="width: 4%"></td>
+                  <td class="navFooterDescItem">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer third" style="width: 4%"></td>
+                  <td class="navFooterDescItem third">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer forth" style="width: 4%"></td>
+                  <td class="navFooterDescItem forth">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer fivth" style="width: 4%"></td>
+                  <td class="navFooterDescItem fivth">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer sixth" style="width: 4%"></td>
+                  <td class="navFooterDescItem sixth">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer svnth" style="width: 4%"></td>
+                  <td class="navFooterDescItem svnth">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                </tr>
+                <tr>
+                  <td>&nbsp;</td>
+                </tr>
+                <tr>
+                  <td class="navFooterDescItem">
+                    <a href="#" class="nav_a">
+                      Amazon Music
+                      <br />
+                      <span class="navFooterDescText">
+                        Stream millions
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer" style="width: 4%"></td>
+                  <td class="navFooterDescItem">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer third" style="width: 4%"></td>
+                  <td class="navFooterDescItem third">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer forth" style="width: 4%"></td>
+                  <td class="navFooterDescItem forth">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer fivth" style="width: 4%"></td>
+                  <td class="navFooterDescItem fivth">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer sixth" style="width: 4%"></td>
+                  <td class="navFooterDescItem sixth">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                  <td class="navFooterDescSpacer svnth" style="width: 4%"></td>
+                  <td class="navFooterDescItem svnth">
+                    <a href="#" class="nav_a">
+                      Amazon Advertising
+                      <br />
+                      <span class="navFooterDescText">
+                        Find, attract, and
+                        <br />of songs
+                      </span>
+                    </a>
+                  </td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+        </div>
+      </div>
+      <div class="navFooterCopyright">
+        <ul>
+          <li>
+            <a href="#" class="nav_a">Conditions of Use</a>
+          </li>
+          <li>
+            <a href class="nav_a">Privacy Notice</a>
+          </li>
+          <li>
+            <a href class="nav_a">Internet-Based Ads</a>
+          </li>
+          <li class="nav_last">© 1996-2019, Amazon.com, Inc. or its affiliates</li>
+        </ul>
+      </div>
+    </div>
+  </footer>
+  <!--/FOOTER-->
+</template>

+ 33 - 0
client/components/Logo.vue

@@ -0,0 +1,33 @@
+<template>
+  <svg class="NuxtLogo" width="245" height="180" viewBox="0 0 452 342" xmlns="http://www.w3.org/2000/svg">
+    <g fill="none" fill-rule="evenodd">
+      <path
+        d="M139 330l-1-2c-2-4-2-8-1-13H29L189 31l67 121 22-16-67-121c-1-2-9-14-22-14-6 0-15 2-22 15L5 303c-1 3-8 16-2 27 4 6 10 12 24 12h136c-14 0-21-6-24-12z"
+        fill="#00C58E"
+      />
+      <path
+        d="M447 304L317 70c-2-2-9-15-22-15-6 0-15 3-22 15l-17 28v54l39-67 129 230h-49a23 23 0 0 1-2 14l-1 1c-6 11-21 12-23 12h76c3 0 17-1 24-12 3-5 5-14-2-26z"
+        fill="#108775"
+      />
+      <path
+        d="M376 330v-1l1-2c1-4 2-8 1-12l-4-12-102-178-15-27h-1l-15 27-102 178-4 12a24 24 0 0 0 2 15c4 6 10 12 24 12h190c3 0 18-1 25-12zM256 152l93 163H163l93-163z"
+        fill="#2F495E"
+        fill-rule="nonzero"
+      />
+    </g>
+  </svg>
+</template>
+<style>
+.NuxtLogo {
+  animation: 1s appear;
+}
+
+@keyframes appear {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+</style>

+ 122 - 0
client/components/Navbar.vue

@@ -0,0 +1,122 @@
+<template>
+  <div>
+    <header class="nav-opt-sprite nav-locate-us nav-lang-en nav-ssl nav-unrec">
+      <div class="container-fluid desktop-nav">
+        <div class="row">
+          <!-- Logo -->
+          <div class="col-sm-2">
+            <div class="logo-area">
+              <a href="#">
+                <img src="/img/logo.png" alt="Logo" class="img-fluid">
+              </a>
+            </div>
+          </div>
+
+          <!-- Search bar -->
+          <div class="col-sm-6 pt-0">
+            <Search />
+          </div>
+
+          <div class="col-sm-4"></div>
+        </div>
+
+        <div class="row">
+
+          <div class="col-xl-2 col-lg-2 col-md-2 col-sm-2 pl-2">
+            <div class="nav-global-location">
+              <nuxt-link to="/address" class="nav-a nav-a-2">
+                <div id="nav-packard-glow-loc-icon" class="nav-sprite"></div>
+                <div class="glow-ingress-block">
+                  <span id="glow-ingress-line1" class="nav-line-2">Deliver to </span>
+                  <span id="glow-ingress-line2" class="nav-line-2">Califonia</span>
+                </div>
+              </nuxt-link>
+            </div>
+          </div>
+
+          <!-- Shopping -->
+          <div class="col-xl-6 col-lg-5 col-md-4 col-sm-6 p-0">
+           <div class="nav-fill">
+             <div class="nav-shop">
+               <nuxt-link to="/history" class="nav-a nav-a-2 nav-single-row-link">
+                <span class="nav-line-2">
+                  Browsing Hostory
+                  <span class="nav-icon nav-arrow" style="visibility: visible"></span>
+                </span>
+               </nuxt-link>
+             </div>
+           </div>
+
+           <div class="nav-xshop-container">
+             <div class="nav-xshop">
+               <a href="#" class="nav-a">Todas'deal</a>
+               <a href="#" class="nav-a">Todas'deal</a>
+               <a href="#" class="nav-a">Todas'deal</a>
+               <a href="#" class="nav-a">Todas'deal</a>
+               <a href="#" class="nav-a">Todas'deal</a>
+             </div>
+           </div>
+          </div>
+
+          <!--Account and order-->
+          <div class="col-xl-4 col-lg-5 col-md-6 col-sm-4 p-0">
+            <div class="nav-tools">
+              <a href="" id="icp-nav-flyout" class="nav-a nav-a-2 icp-link-style-2">
+                <span class="icp-nav-link-inner">
+                  <span class="nav-line-1">
+                    <span class="icp-nav-globe-img-2"></span>
+                    <span class="icp-nav-language">EN</span>
+                  </span>
+
+                  <span class="nav-line-2">
+                    &nbsp;
+                    <span class="nav-icon nav-arrow" style="visibility: visible"></span>
+                  </span>
+
+                </span>
+              </a>
+              <span class="icp-nav-link-border"></span>
+
+              <nuxt-link
+                to="/register"
+                class="nav-a nav-a-2"
+                id="nav-link-accountList"
+                tabindex="0"
+              >
+                <span class="nav-line-1">Hello, Sign in</span>
+                <span class="nav-line-2">
+                  Account &amp; Lists
+                  <span class="nav-icon nav-arrow" style="visiblity: visible"></span>
+                </span>
+              </nuxt-link>
+
+              <nuxt-link to="/orders" class="nav-a nav-a-2 nav-single-row-link">
+                <span class="nav-line-1"></span>
+                <span class="nav-line-2">Orders</span>
+              </nuxt-link>
+
+              <nuxt-link to="/cart" class="nav-a nav-a-2" id="nav-cart">
+                <span aria-hidden="true" class="nav-line-1"></span>
+                <span aria-hidden="true" class="nav-line-2">Cart</span>
+                <span class="nav-cart-icon nav-sprite"></span>
+                <span aria-hidden="true" class="nav-cart-count nav-cart-0">0</span>
+              </nuxt-link>
+            </div>
+          </div>
+        </div>
+
+
+
+      </div>
+    </header>
+  </div>
+</template>
+
+<script>
+import Search from '~/components/Search'
+export default {
+  components: {
+    Search
+  }
+}
+</script>

+ 7 - 0
client/components/README.md

@@ -0,0 +1,7 @@
+# COMPONENTS
+
+**This directory is not required, you can delete it if you don't want to use it.**
+
+The components directory contains your Vue.js Components.
+
+_Nuxt.js doesn't supercharge these components._

+ 30 - 0
client/components/Search.vue

@@ -0,0 +1,30 @@
+<!--http://shipow.github.io/searchbox/-->
+<template>
+  <div class="">
+    <svg xmlns="http://www.w3.org/2000/svg" style="display:none">
+      <symbol xmlns="http://www.w3.org/2000/svg" id="sbx-icon-search-11" viewBox="0 0 40 40">
+        <path d="M15.553 31.106c8.59 0 15.553-6.963 15.553-15.553S24.143 0 15.553 0 0 6.963 0 15.553s6.963 15.553 15.553 15.553zm0-3.888c6.443 0 11.665-5.222 11.665-11.665 0-6.442-5.222-11.665-11.665-11.665-6.442 0-11.665 5.223-11.665 11.665 0 6.443 5.223 11.665 11.665 11.665zM27.76 31.06c-.78-.78-.778-2.05.004-2.833l.463-.463c.783-.783 2.057-.78 2.834-.003l8.168 8.17c.782.78.78 2.05-.003 2.832l-.463.463c-.783.783-2.057.78-2.833.003l-8.17-8.167z"
+        fill-rule="evenodd" />
+      </symbol>
+      <symbol xmlns="http://www.w3.org/2000/svg" id="sbx-icon-clear-2" viewBox="0 0 20 20">
+        <path d="M8.96 10L.52 1.562 0 1.042 1.04 0l.522.52L10 8.96 18.438.52l.52-.52L20 1.04l-.52.522L11.04 10l8.44 8.438.52.52L18.96 20l-.522-.52L10 11.04l-8.438 8.44-.52.52L0 18.96l.52-.522L8.96 10z" fill-rule="evenodd" />
+      </symbol>
+    </svg>
+
+    <form novalidate="novalidate" onsubmit="return false;" class="searchbox sbx-amazon">
+      <div role="search" class="sbx-amazon__wrapper">
+        <input type="search" name="search" placeholder="Search your Product" autocomplete="off" required="required" class="sbx-amazon__input">
+        <button type="submit" title="Submit your search query." class="sbx-amazon__submit">
+          <svg role="img" aria-label="Search">
+            <use xlink:href="#sbx-icon-search-11"></use>
+          </svg>
+        </button>
+        <button type="reset" title="Clear the search query." class="sbx-amazon__reset">
+          <svg role="img" aria-label="Reset">
+            <use xlink:href="#sbx-icon-clear-2"></use>
+          </svg>
+        </button>
+      </div>
+    </form>
+  </div>
+</template>

+ 12 - 0
client/jsconfig.json

@@ -0,0 +1,12 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "~/*": ["./*"],
+      "@/*": ["./*"],
+      "~~/*": ["./*"],
+      "@@/*": ["./*"]
+    }
+  },
+  "exclude": ["node_modules", ".nuxt", "dist"]
+}

+ 7 - 0
client/layouts/README.md

@@ -0,0 +1,7 @@
+# LAYOUTS
+
+**This directory is not required, you can delete it if you don't want to use it.**
+
+This directory contains your Application Layouts.
+
+More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/views#layouts).

+ 26 - 0
client/layouts/default.vue

@@ -0,0 +1,26 @@
+<template>
+  <div>
+    <Navbar />
+    <nuxt />
+    <Footer />
+  </div>
+</template>
+
+<script>
+import Navbar from '~/components/Navbar'
+import Footer from '~/components/Footer'
+export default {
+  components: {
+    Navbar,
+    Footer
+  }
+}
+</script>
+
+<style>
+body {
+  font-size: 13px;
+  line-height: 19px;
+  color: #111;
+}
+</style>

+ 8 - 0
client/middleware/README.md

@@ -0,0 +1,8 @@
+# MIDDLEWARE
+
+**This directory is not required, you can delete it if you don't want to use it.**
+
+This directory contains your application middleware.
+Middleware let you define custom functions that can be run before rendering either a page or a group of pages.
+
+More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/routing#middleware).

+ 69 - 0
client/nuxt.config.js

@@ -0,0 +1,69 @@
+const URL = 'http://localhost:3000'
+
+export default {
+  mode: 'universal',
+  /*
+  ** Headers of the page
+  */
+  head: {
+    title: process.env.npm_package_name || '',
+    meta: [
+      { charset: 'utf-8' },
+      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
+      { hid: 'description', name: 'description', content: process.env.npm_package_description || '' }
+    ],
+    link: [
+      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' },
+      { rel: 'stylesheet',  href: '/css/font-awesome/css/all.css' },
+      { rel: 'stylesheet',  href: '/css/default.css' }
+
+    ]
+  },
+  /*
+  ** Customize the progress-bar color
+  */
+  loading: { color: '#fff' },
+  /*
+  ** Global CSS
+  */
+  css: [
+  ],
+  /*
+  ** Plugins to load before mounting the App
+  */
+  plugins: [
+  ],
+  /*
+  ** Nuxt.js dev-modules
+  */
+  buildModules: [
+  ],
+  /*
+  ** Nuxt.js modules
+  */
+  modules: [
+    // Doc: https://bootstrap-vue.js.org
+    'bootstrap-vue/nuxt',
+    // Doc: https://axios.nuxtjs.org/usage
+    '@nuxtjs/axios',
+    '@nuxtjs/pwa',
+  ],
+  /*
+  ** Axios module configuration
+  ** See https://axios.nuxtjs.org/options
+  */
+  axios: {
+    proxy:  true,
+    baseURL: URL
+  },
+  /*
+  ** Build configuration
+  */
+  build: {
+    /*
+    ** You can extend webpack config here
+    */
+    extend (config, ctx) {
+    }
+  }
+}

文件差异内容过多而无法显示
+ 9530 - 0
client/package-lock.json


+ 21 - 0
client/package.json

@@ -0,0 +1,21 @@
+{
+  "name": "client",
+  "version": "1.0.0",
+  "description": "My top-notch Nuxt.js project",
+  "author": "",
+  "private": true,
+  "scripts": {
+    "dev": "nuxt",
+    "build": "nuxt build",
+    "start": "nuxt start",
+    "generate": "nuxt generate"
+  },
+  "dependencies": {
+    "nuxt": "^2.0.0",
+    "bootstrap-vue": "^2.0.0",
+    "bootstrap": "^4.1.3",
+    "@nuxtjs/axios": "^5.3.6",
+    "@nuxtjs/pwa": "^3.0.0-0"
+  },
+  "devDependencies": {}
+}

+ 6 - 0
client/pages/README.md

@@ -0,0 +1,6 @@
+# PAGES
+
+This directory contains your Application Views and Routes.
+The framework reads all the `*.vue` files inside this directory and creates the router of your application.
+
+More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/routing).

+ 135 - 0
client/pages/index.vue

@@ -0,0 +1,135 @@
+<template>
+  <main class="listingPage">
+    <div class="container-fluid">
+      <div class="row">
+        <div class="col-xl-2 col-lg-3 md-4 col-sm-4">
+          <!--SideBar -->
+        </div>
+        <!-- main content -->
+        <div class="col-xl-10 col-lg-9 md-8 col-sm-8">
+          <FeatureProduct />
+
+          <div class="mainResuts">
+            <div class="s-result-list">
+              <div v-for="product in products" :key="product._id" class="s-result-item celwidget">
+                <div class="s-item-container">
+                  <div class="a-spacing-micro">
+                    <div class="bestSeller">
+                      <a href="#">Best seller</a>
+                    </div>
+                  </div>
+
+                  <div>
+                    <div class="row">
+                      <!--image-->
+                      <div class="col-sm-3 text-center">
+                        <a href="">
+                          <img :src="product.photo" alt="" class="img-fluid" style="width: 150px">
+                        </a>
+                      </div>
+
+                      <div class="col-sm-9">
+                        <div class="a-row a-spacing-small">
+                          <!-- Title and date -->
+                          <a href="" class="a-link-normal">
+                            <h2 class="a-size-medium">
+                              {{ product.title }}
+                              <span class="a-letter-space"></span>
+                              <span class="a-letter-space"></span>
+                              <span class="a-size-small a-color-secondary">Sep 3, 2019</span>
+                            </h2>
+                          </a>
+                        </div>
+
+                        <!--Author name -->
+                        <div class="a-row a-spacing-small">
+                          <span class="a-size-small a-color-secondary">by</span>
+                          <span class="a-size-small a-color-secondary">
+                            <a href="#" class="a-link-normal a-text-normal">{{ product.owner.name }}</a>
+                          </span>
+                        </div>
+
+                        <!--Author name -->
+                        <div class="a-row">
+                          <span class="a-size-small">Ships to USA</span>
+                        </div>
+
+                        <div class="row">
+                          <div class="col-sm-7">
+                            <div class="a-row a-spacing-none">
+                              <a href="#" class="a-link-normal a-text-normal">Hardcover</a>
+                            </div>
+
+                            <!-- price-->
+                            <div class="a-row a-spacing-none">
+                              <a href="" class="a-link-normal a-text-normal">
+                                <span class="a-offscreen">{{ product.price }}</span>
+                                <span class="a-color-base sx-zero-spacing">
+                                  <span class="sx-price sx-price-large">
+                                    <sup class="sx-price-currency">$</sup>
+                                    <span class="sx-price-wholsup">{{ product.price }}</span>
+                                    <sup class="sx-price-fractional">00</sup>
+                                  </span>
+                                </span>
+                              </a>
+                              <span class="a-letter-space"></span>
+                              <span class="a-size-base-plug a-color-secondary a-text-strike">$28.00</span>
+                            </div>
+
+                            <!-- Audible Trial -->
+                            <div class="a-row a-spacing-none">
+                              <span class="a-size-small a-color-secondary">Free wuith trial </span>
+                            </div>
+                            <hr/>
+
+                            <!-- Other Format -->
+                            <span class="a-size-small a-color-secondray">
+                              other form
+                              <span class="a-letter-space"></span>
+                              <a href="" class="a-size-small a-linkl-normal a-text-normal">Audio CD</a>
+                            </span>
+
+                            <!-- Ratiings -->
+                            <div class="col-sm-5">
+                              <div class="a-row a-spacing-mini">
+                                <!-- star rating -->
+
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+
+                      </div>
+                    </div>
+                  </div>
+
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </main>
+</template>
+
+<script>
+import FeatureProduct from '~/components/FeatureProduct'
+export default {
+  components: {
+    FeatureProduct
+  },
+
+  async asyncData ({ $axios }) {
+    try {
+      let response = await $axios.$get('/api/products')
+      console.log(response)
+      return {
+        products: response.products
+      }
+    } catch (err) {
+      console.log(err)
+    }
+  }
+}
+</script>

+ 366 - 0
client/pages/products/_id.vue

@@ -0,0 +1,366 @@
+<template>
+  <main>
+    <!-- Breadcrumbs -->
+    <div class="a-spacing-top-medium"></div>
+    <div class="container-fluid">
+      <div class="wayfinding-breadcrumbs-container">
+        <ul class="a-unordered-list a-horizontal a-size-small">
+          <li>
+            <span class="a-list-item">
+              <a class="a-link-normal a-color-tertiary" href="#">{{ product.category.title }}</a>
+            </span>
+          </li>
+          <li>
+            <span class="a-list-item">></span>
+          </li>
+          <li>
+            <span class="a-list-item">
+              <a class="a-link-normal a-color-tertiary" href="#">{{ product.title }}</a>
+            </span>
+          </li>
+        </ul>
+      </div>
+    </div>
+    <div class="container-fluid">
+      <div class="dp-container">
+        <div class="row">
+          <!-- First 3 grid - Product Image and Author's section -->
+          <div class="col-lg-3 col-md-3 col-sm-4">
+            <div class="leftCol">
+              <!-- Image -->
+              <div clas="imgBlock">
+                <div class="eBooksimg">
+                  <img :src="product.photo" class="img-fluid" />
+                </div>
+              </div>
+
+              <!-- Follow Author -->
+              <div class="authorFollow">
+                <hr class="a-divider-normal" />
+                <h1 class="authorFollowHeading">Follow The Author</h1>
+                <div class="a-spacing-top-small">
+                  <div class="row">
+                    <!-- Author's image -->
+                    <div class="col-xl-3 col-lg-3 col-md-3 col-sm-3 col-3">
+                      <div class="smallAuthorImageContainer">
+                        <a href="#">
+                          <img :src="product.owner.photo" class="img-fluid" />
+                        </a>
+                      </div>
+                    </div>
+                    <!-- Author's Name -->
+                    <div class="col-xl-4 col-lg-3 col-md-3 col-sm-3 col-3">
+                      <div class="authorNameCol">
+                        <a href="#">{{ product.owner.name }}</a>
+                      </div>
+                    </div>
+                    <!-- Author's Follow Button -->
+                    <div class="col-xl-5 col-lg-6 col-md-6 col-sm-6 col-6">
+                      <div class="authorBtn mt-2">
+                        <a href="#">
+                          <span class="btnFollow">
+                            <span class="a-btn-inner">
+                              <button class="a-btn-text">+ Follow</button>
+                            </span>
+                          </span>
+                        </a>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <!-- Middle 6 grid Description -->
+          <div class="col-lg-6 col-md-6 col-sm-8">
+            <div class="centerCol">
+              <!-- Product Title -->
+              <div class="titleDiv">
+                <h1 class="productTitle">
+                  <span class="largeTitle">{{ product.title }}</span>
+                  <span class="smallTitle">Paperback</span>
+                </h1>
+              </div>
+              <!-- Author's name -->
+              <div class="bylineinfo">
+                by
+                <a href="#" class="authorName">
+                  {{ product.owner.name }}
+                  <i
+                    class="fas fa-chevron-down"
+                    style="font-size: 8px !important; color: #555 !important;"
+                  ></i>
+                </a> (Author)
+              </div>
+              <div class="reviewGroup"></div>
+              <hr style="margin-top: 10px;" />
+              <!-- A tags Dummy Data -->
+              <div class="mediaMatrix">
+                <div class="formats">
+                  <a href="#" class="link-expander">
+                    >
+                    <span class="tmmShowPrompt">See all 18 formats and editions</span>
+                  </a>
+                  <ul>
+                    <!-- Kindle -->
+                    <li class="swatchElement" style="width: 117px;">
+                      <span class="a-list-item">
+                        <span class="a-button-toggle">
+                          <span class="a-button-inner">
+                            <a href="#" class="a-button-text">
+                              <span>Kindle</span>
+                              <br />
+                              <span class="a-color-secondary">-</span>
+                            </a>
+                          </span>
+                        </span>
+                        <span class="tmm-olp-links"></span>
+                        <span class="tmm-olp-links">
+                          <a href="#" class="a-size-mini">
+                            <span class="kcpAppBox">
+                              <span class="a-declarative">
+                                Read with Our
+                                <span class="a-text-bold">Free App</span>
+                              </span>
+                            </span>
+                          </a>
+                        </span>
+                      </span>
+                    </li>
+                    <!-- Audible -->
+                    <li class="swatchElement" style="width: 117px;">
+                      <span class="a-list-item">
+                        <span class="a-button-toggle">
+                          <span class="a-button-inner">
+                            <a href="#" class="a-button-text">
+                              <span>
+                                <img
+                                  src="/img/audibleLogo.png"
+                                  class="img-fluid"
+                                  style="width: 20px;"
+                                />Audible
+                              </span>
+                              <br />
+                              <span class="a-color-secondary">-</span>
+                            </a>
+                          </span>
+                        </span>
+                        <span class="tmm-olp-links"></span>
+                        <span class="tmm-olp-links">
+                          <a href="#" class="a-size-mini">
+                            <span class="kcpAppBox">
+                              <span class="a-declarative">
+                                <span class="a-text-bold">Free App</span> with your Audible Trial
+                              </span>
+                            </span>
+                          </a>
+                        </span>
+                      </span>
+                    </li>
+                    <!-- Paperback -->
+                    <li class="swatchElement" style="width: 117px;">
+                      <span class="a-list-item">
+                        <span class="a-button-toggle">
+                          <span class="a-button-inner">
+                            <a href="#" class="a-button-text">
+                              <span>Paperback</span>
+                              <br />
+                              <span class="a-color-secondary">-</span>
+                            </a>
+                          </span>
+                        </span>
+                      </span>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <!-- Description -->
+              <div class="bookDescription">
+                <div class="bookDescriptionInner">{{ product.description }}</div>
+              </div>
+
+              <!-- Product specification -->
+              <div class="aboutEbooksFeature">
+                <hr />
+                <div class="row">
+                  <div class="col-sm-4 mb-1">
+                    <div class="a-declarative">
+                      Length:
+                      <span>
+                        <a href="#">
+                          386 pages
+                          <i class="a-icon a-icon-popover"></i>
+                        </a>
+                      </span>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <!-- Last 3 grid Buying section -->
+          <div class="col-lg-3 col-md-3 col-sm-6">
+            <div class="combinedBuyBox">
+              <div class="buyBox">
+                <div class="a-section">
+                  <div class="clearfix">
+                    <div class="float-left">
+                      <form>
+                        <input type="radio" id="test1" name="radio-group checked" />
+                        <label for="test1">Buy Now</label>
+                      </form>
+                    </div>
+
+                    <!-- Product Price -->
+                    <div class="float-right">
+                      <span class="a-size-medium a-color-price offer-price a-text-normal">{{ product.price }}</span>
+                    </div>
+                  </div>
+                </div>
+
+                <div class="a-section a-spacing-none">
+                  <div class="row">
+                    <div class="col-sm-5 col-5">
+                      <select>
+                        <option value="1">Qty: &nbsp; 1</option>
+                        <option value="2">Qty: &nbsp; 2</option>
+                        <option value="3">Qty: &nbsp; 3</option>
+                        <option value="4">Qty: &nbsp; 4</option>
+                        <option value="5">Qty: &nbsp; 5</option>
+                      </select>
+                    </div>
+                  </div>
+                </div>
+
+                <div class="a-section a-spacing-small a-spacing-top-micro">
+                  <div class="row">
+                    <span class="a-color-base buyboxShippingLabel"></span>
+                  </div>
+                </div>
+                <div class="a-section a-spacing-small">
+                  <div class="a-section a-spacing-none">
+                    <span class="a-size-medium a-color-success">In Stock</span>
+                  </div>
+                  <div class="a-section a-spacing-mini">Shipts from and sold by Amazon.com</div>
+                </div>
+
+                <div class="a-section">
+                  <div class="a-button-stack">
+                    <span class="a-spacing-small a-button-primary a-button-icon">
+                      <span class="a-button-inner">
+                        <i class="a-icon a-icon-cart"></i>
+                        <input type="submit" name="submit.add-to-cart" class="a-button-input" />
+                        <span class="a-button-text">Add to Cart</span>
+                      </span>
+                    </span>
+                  </div>
+                  <div class="a-button-stack">
+                    <span class="a-spacing-small a-button-primary a-button-icon">
+                      <span class="a-button-inner">
+                        <i class="a-icon a-icon-buynow"></i>
+                        <input type="submit" name="submit.add-to-cart" class="a-button-input" />
+                        <span class="a-button-text">Buy Now</span>
+                      </span>
+                    </span>
+                  </div>
+                </div>
+                <div class="a-row">
+                  <div class="a-spacing-top-small">
+                    <div class="a-section a-spacing-none">
+                      <div class="a-section a-spacing-none a-spacing-top-mini">
+                        This item shipts to
+                        <b>California</b>
+                        <b>Get it by Monday, Sept 23 - Monday, Sept. 30</b>
+                        Choose this date at checkout
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <hr />
+                <span class="a-declarative">
+                  <a href="#" class="a-link-normal">
+                    <div class="a-row a-spacing-mini">
+                      <i class="fal fa-map-market-alt"></i>
+                      <span class="a-size-small">Deliver to California</span>
+                    </div>
+                  </a>
+                </span>
+                <br />
+                <hr />
+                <div class="a-section">
+                  <div class="clearfix">
+                    <div class="float-left">
+                      <form>
+                        <input type="radio" id="test2" name="radio-group" />
+                        <label for="test1">Buy Now</label>
+                      </form>
+                    </div>
+                    <div class="float-right">
+                      <span class="a-color-base offer-price a-text-normal">$39</span>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+
+            <div class="kcpAppBaseBox text-center">
+              <img src="/img/readyondevice.png" class="img-fluid" />
+            </div>
+          </div>
+        </div>
+        <br />
+        <hr />
+        <div class="books-entity-teaser">
+          <div class="bucket">
+            <h2>More about the author</h2>
+            <div class="content">
+              <div class="row">
+                <!-- Author's photo and Button -->
+                <div class="col-md-2 col-sm-4 col-4">
+                  <div class="authorContent">
+                    <div class="authorImageSingle">
+                      <a href="#">
+                        <img :src="product.owner.photo" class="img-fluid" />
+                      </a>
+                    </div>
+                    <div class="authorFollow">
+                      <button class="followButton" type="button">
+                        <span class="pr-fb-icon"></span>
+                        <span class="pr-fb-text">Follow</span>
+                      </button>
+                    </div>
+                  </div>
+                </div>
+                <!-- Author's about -->
+                <div class="col-md-10 col-sm-8 col-8 pl-0">
+                  <div class="mainContent">
+                    <h3>Biography</h3>
+                    <div id="authorBio">{{ product.owner.about }}</div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </main>
+</template>
+
+
+<script>
+export default {
+  async asyncData({ $axios, params }) {
+    try {
+      let response = await $axios.$get(`/api/products/${params.id}`)
+      console.log(response)
+
+      return {
+        product: response.product
+      }
+    } catch (err) {
+      console.log(err)
+    }
+  }
+}
+</script>

+ 7 - 0
client/plugins/README.md

@@ -0,0 +1,7 @@
+# PLUGINS
+
+**This directory is not required, you can delete it if you don't want to use it.**
+
+This directory contains Javascript plugins that you want to run before mounting the root Vue.js application.
+
+More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/plugins).

+ 11 - 0
client/static/README.md

@@ -0,0 +1,11 @@
+# STATIC
+
+**This directory is not required, you can delete it if you don't want to use it.**
+
+This directory contains your static files.
+Each file inside this directory is mapped to `/`.
+Thus you'd want to delete this README.md before deploying to production.
+
+Example: `/static/robots.txt` is mapped as `/robots.txt`.
+
+More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/assets#static).

文件差异内容过多而无法显示
+ 6205 - 0
client/static/css/all.css


文件差异内容过多而无法显示
+ 4723 - 0
client/static/css/default.css


文件差异内容过多而无法显示
+ 6205 - 0
client/static/css/font-awesome/css/all.css


二进制
client/static/css/font-awesome/webfonts/fa-brands-400.eot


文件差异内容过多而无法显示
+ 3459 - 0
client/static/css/font-awesome/webfonts/fa-brands-400.svg


二进制
client/static/css/font-awesome/webfonts/fa-brands-400.ttf


二进制
client/static/css/font-awesome/webfonts/fa-brands-400.woff


二进制
client/static/css/font-awesome/webfonts/fa-brands-400.woff2


二进制
client/static/css/font-awesome/webfonts/fa-light-300.eot


文件差异内容过多而无法显示
+ 9901 - 0
client/static/css/font-awesome/webfonts/fa-light-300.svg


二进制
client/static/css/font-awesome/webfonts/fa-light-300.ttf


二进制
client/static/css/font-awesome/webfonts/fa-light-300.woff


二进制
client/static/css/font-awesome/webfonts/fa-light-300.woff2


二进制
client/static/css/font-awesome/webfonts/fa-regular-400.eot


文件差异内容过多而无法显示
+ 9103 - 0
client/static/css/font-awesome/webfonts/fa-regular-400.svg


二进制
client/static/css/font-awesome/webfonts/fa-regular-400.ttf


二进制
client/static/css/font-awesome/webfonts/fa-regular-400.woff


二进制
client/static/css/font-awesome/webfonts/fa-regular-400.woff2


二进制
client/static/css/font-awesome/webfonts/fa-solid-900.eot


文件差异内容过多而无法显示
+ 7709 - 0
client/static/css/font-awesome/webfonts/fa-solid-900.svg


二进制
client/static/css/font-awesome/webfonts/fa-solid-900.ttf


二进制
client/static/css/font-awesome/webfonts/fa-solid-900.woff


二进制
client/static/css/font-awesome/webfonts/fa-solid-900.woff2


二进制
client/static/favicon.ico


二进制
client/static/font/amazon-ember-regular-webfont.eot


二进制
client/static/font/amazon-ember-regular-webfont.ttf


二进制
client/static/font/amazon-ember-regular-webfont.woff


二进制
client/static/font/amazon-ember-regular-webfont.woff2


二进制
client/static/icon.png


二进制
client/static/img/amazonImg.jpg


二进制
client/static/img/arrow.gif


二进制
client/static/img/audiblelogo.png


二进制
client/static/img/avatar.png


二进制
client/static/img/cart.png


二进制
client/static/img/cartRecent4.png


二进制
client/static/img/cart_06.png


二进制
client/static/img/featuredProduct.jpeg


二进制
client/static/img/gift.png


二进制
client/static/img/globalImg.png


二进制
client/static/img/icons.png


二进制
client/static/img/icons2.png


二进制
client/static/img/icons3.png


二进制
client/static/img/icons4.png


二进制
client/static/img/imageUpload.png


二进制
client/static/img/logo-black.png


二进制
client/static/img/logo-black1.png


二进制
client/static/img/logo.png


二进制
client/static/img/logo1.png


二进制
client/static/img/logo2.png


二进制
client/static/img/navShipping.gif


二进制
client/static/img/placeHeadernav.gif


二进制
client/static/img/readyondevice.png


二进制
client/static/img/search.png


二进制
client/static/img/socialshare.png


二进制
client/static/img/spcBody.jpg


二进制
client/static/img/visa.gif


+ 10 - 0
client/store/README.md

@@ -0,0 +1,10 @@
+# STORE
+
+**This directory is not required, you can delete it if you don't want to use it.**
+
+This directory contains your Vuex Store files.
+Vuex Store option is implemented in the Nuxt.js framework.
+
+Creating a file in this directory automatically activates the option in the framework.
+
+More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/vuex-store).

+ 96 - 0
server/package-lock.json

@@ -52,6 +52,11 @@
         "safe-buffer": "5.1.2"
       }
     },
+    "bcrypt-nodejs": {
+      "version": "0.0.3",
+      "resolved": "https://registry.npmjs.org/bcrypt-nodejs/-/bcrypt-nodejs-0.0.3.tgz",
+      "integrity": "sha1-xgkX8m3CNWYVZsaBBhwwPCsohCs="
+    },
     "bluebird": {
       "version": "3.5.1",
       "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.5.1.tgz",
@@ -89,6 +94,11 @@
         "isarray": "^1.0.0"
       }
     },
+    "buffer-equal-constant-time": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/buffer-equal-constant-time/-/buffer-equal-constant-time-1.0.1.tgz",
+      "integrity": "sha1-+OcRMvf/5uAaXJaXpMbz5I1cyBk="
+    },
     "buffer-from": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.1.tgz",
@@ -212,6 +222,14 @@
       "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-8.2.0.tgz",
       "integrity": "sha512-8sJ78ElpbDJBHNeBzUbUVLsqKdccaa/BXF1uPTw3GrvQTBgrQrtObr2mUrE38vzYd8cEv+m/JBfDLioYcfXoaw=="
     },
+    "ecdsa-sig-formatter": {
+      "version": "1.0.11",
+      "resolved": "https://registry.npmjs.org/ecdsa-sig-formatter/-/ecdsa-sig-formatter-1.0.11.tgz",
+      "integrity": "sha512-nagl3RYrbNv6kQkeJIpt6NJZy8twLB/2vtz6yN9Z4vRKHN4/QZJIEbqohALSgwKdnksuY3k5Addp5lg8sVoVcQ==",
+      "requires": {
+        "safe-buffer": "^5.0.1"
+      }
+    },
     "ee-first": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
@@ -361,11 +379,89 @@
       "resolved": "https://registry.npmjs.org/jmespath/-/jmespath-0.15.0.tgz",
       "integrity": "sha1-o/Iiqarp+Wb10nx5ZRDigJF2Qhc="
     },
+    "jsonwebtoken": {
+      "version": "8.5.1",
+      "resolved": "https://registry.npmjs.org/jsonwebtoken/-/jsonwebtoken-8.5.1.tgz",
+      "integrity": "sha512-XjwVfRS6jTMsqYs0EsuJ4LGxXV14zQybNd4L2r0UvbVnSF9Af8x7p5MzbJ90Ioz/9TI41/hTCvznF/loiSzn8w==",
+      "requires": {
+        "jws": "^3.2.2",
+        "lodash.includes": "^4.3.0",
+        "lodash.isboolean": "^3.0.3",
+        "lodash.isinteger": "^4.0.4",
+        "lodash.isnumber": "^3.0.3",
+        "lodash.isplainobject": "^4.0.6",
+        "lodash.isstring": "^4.0.1",
+        "lodash.once": "^4.0.0",
+        "ms": "^2.1.1",
+        "semver": "^5.6.0"
+      },
+      "dependencies": {
+        "ms": {
+          "version": "2.1.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+          "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
+        }
+      }
+    },
+    "jwa": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/jwa/-/jwa-1.4.1.tgz",
+      "integrity": "sha512-qiLX/xhEEFKUAJ6FiBMbes3w9ATzyk5W7Hvzpa/SLYdxNtng+gcurvrI7TbACjIXlsJyr05/S1oUhZrc63evQA==",
+      "requires": {
+        "buffer-equal-constant-time": "1.0.1",
+        "ecdsa-sig-formatter": "1.0.11",
+        "safe-buffer": "^5.0.1"
+      }
+    },
+    "jws": {
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/jws/-/jws-3.2.2.tgz",
+      "integrity": "sha512-YHlZCB6lMTllWDtSPHz/ZXTsi8S00usEV6v1tjq8tOUZzw7DpSDWVXjXDre6ed1w/pd495ODpHZYSdkRTsa0HA==",
+      "requires": {
+        "jwa": "^1.4.1",
+        "safe-buffer": "^5.0.1"
+      }
+    },
     "kareem": {
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/kareem/-/kareem-2.3.1.tgz",
       "integrity": "sha512-l3hLhffs9zqoDe8zjmb/mAN4B8VT3L56EUvKNqLFVs9YlFA+zx7ke1DO8STAdDyYNkeSo1nKmjuvQeI12So8Xw=="
     },
+    "lodash.includes": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/lodash.includes/-/lodash.includes-4.3.0.tgz",
+      "integrity": "sha1-YLuYqHy5I8aMoeUTJUgzFISfVT8="
+    },
+    "lodash.isboolean": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/lodash.isboolean/-/lodash.isboolean-3.0.3.tgz",
+      "integrity": "sha1-bC4XHbKiV82WgC/UOwGyDV9YcPY="
+    },
+    "lodash.isinteger": {
+      "version": "4.0.4",
+      "resolved": "https://registry.npmjs.org/lodash.isinteger/-/lodash.isinteger-4.0.4.tgz",
+      "integrity": "sha1-YZwK89A/iwTDH1iChAt3sRzWg0M="
+    },
+    "lodash.isnumber": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/lodash.isnumber/-/lodash.isnumber-3.0.3.tgz",
+      "integrity": "sha1-POdoEMWSjQM1IwGsKHMX8RwLH/w="
+    },
+    "lodash.isplainobject": {
+      "version": "4.0.6",
+      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
+      "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs="
+    },
+    "lodash.isstring": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz",
+      "integrity": "sha1-1SfftUVuynzJu5XV2ur4i6VKVFE="
+    },
+    "lodash.once": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/lodash.once/-/lodash.once-4.1.1.tgz",
+      "integrity": "sha1-DdOXEhPHxW34gJd9UEyI+0cal6w="
+    },
     "media-typer": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",

+ 2 - 0
server/package.json

@@ -10,10 +10,12 @@
   "license": "ISC",
   "dependencies": {
     "aws-sdk": "^2.596.0",
+    "bcrypt-nodejs": "0.0.3",
     "body-parser": "^1.19.0",
     "cors": "^2.8.5",
     "dotenv": "^8.2.0",
     "express": "^4.17.1",
+    "jsonwebtoken": "^8.5.1",
     "mongoose": "^5.8.3",
     "morgan": "^1.9.1",
     "multer": "^1.4.2",

+ 2 - 2
server/routes/products.js

@@ -29,7 +29,7 @@ router.post('/products', upload.single('photo'), async (req, res)=> {
 
 router.get('/products', async (req, res) => {
   try {
-    let products = await Product.find()
+    let products = await Product.find().populate('owner category').exec()
     res.json({
       success: true,
       products
@@ -44,7 +44,7 @@ router.get('/products', async (req, res) => {
 
 router.get('/products/:id', async (req, res) => {
   try {
-    let product = await Product.findOne( { _id: req.params.id })
+    let product = await Product.findOne( { _id: req.params.id }).populate('owner category').exec()
     res.json({
       success: true,
       product