исправил комментарии

dergunovs · Mar 16, 2021 · 111115b · 111115b
1 parent 97e758f
commit 111115b
Show file tree

Hide file tree

Showing 11 changed files with 48 additions and 108 deletions.
diff --git a/.editorconfig b/.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
diff --git a/.gitignore b/.gitignore
@@ -1,87 +1,4 @@
-.editorconfig
-.prettierrc
-jsconfig.json
-*.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
-
-# nuxt.js build output
 .nuxt
-
-# Nuxt generate
+node_modules/
 dist
-
-# vuepress build output
-.vuepress/dist
-
-# Serverless directories
-.serverless
-
-# IDE / Editor
-.idea
-.editorconfig
-
-# Service worker
-sw.*
-
-# Mac OSX
-.DS_Store
-
-# Vim swap files
-*.swp
diff --git a/.prettierrc b/.prettierrc
@@ -0,0 +1,5 @@
+{
+  "semi": true,
+  "singleQuote": false,
+  "printWidth": 120
+}
diff --git a/components/PageForm.vue b/components/PageForm.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="form">
     <div class="form-element">
-      <label for="url">Адрес страницы Url</label>
+      <label for="url">Адрес страницы URL</label>
       <input type="text" v-model="page.url" id="url" />
     </div>
     <div class="form-element">
@@ -29,11 +29,9 @@
 
 <script>
 export default {
-  name: "PageForm",
-
   // Это переиспользуемый компонент с формой для создания/редактирования/удаления страницы.
   // В зависимости от поступаемых пропсов меняется отображение кнопок.
-  // При редактировании данных в пропсах передаётся контент конкретной страницы.
+  // Если компонент используется для редактирования текущей страницы, то в него передаются её данные.
   props: { page: { type: Object, default: () => ({}) }, action: { type: String } },
 
   // Нам потребуется текущий URL страницы, которые не будет связан с input формы.
@@ -48,15 +46,20 @@ export default {
       this.$axios
         .post(`/api/page`, this.page)
         .then(() => {
+          // После успешного создания новой страницы происходит перенаправление на неё.
           this.$router.push(`/page/${this.page.url}`);
         })
-        .catch((err) => console.log(err.response.data.message));
+        .catch((err) => {
+          // Если страница не создана, то в консоль выводим ошибку из бэкенда.
+          console.log(err.response.data.message);
+        });
     },
     updatePage() {
       // При обновлении текущей страницы нужен исходный URL для запроса в API.
       this.$axios
         .patch(`/api/page/${this.currentUrl}`, this.page)
         .then(() => {
+          // После обновления контента происходит перенаправление на страницу со списком страниц.
           this.$router.push(`/page`);
         })
         .catch((err) => console.log(err.response.data.message));

diff --git a/components/TheHeader.vue b/components/TheHeader.vue
@@ -9,12 +9,6 @@
   </header>
 </template>
 
-<script>
-export default {
-  name: "TheHeader",
-};
-</script>
-
 <style>
 header {
   display: flex;

diff --git a/jsconfig.json b/jsconfig.json
@@ -0,0 +1,12 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "~/*": ["./*"],
+      "@/*": ["./*"],
+      "~~/*": ["./*"],
+      "@@/*": ["./*"]
+    }
+  },
+  "exclude": ["node_modules", ".nuxt", "dist"]
+}
diff --git a/pages/index.vue b/pages/index.vue
@@ -2,10 +2,7 @@
   <main>
     <h1>Контент главной страницы</h1>
 
-    <div class="content">
-      <p>Шаблон связки Nuxt + Express.</p>
-      <p>База MognoDB, ORM Mongoose.</p>
-    </div>
+    <p>Базовый шаблон для работы Nuxt в качестве middleware для Express.</p>
   </main>
 </template>
 

diff --git a/pages/page/_url.vue b/pages/page/_url.vue
@@ -4,7 +4,7 @@
     <div v-html="page.content"></div>
 
     <button @click="showPageForm = true">Редактировать</button>
-    <PageForm v-if="showPageForm" :page="page" action="update" />
+    <LazyPageForm v-if="showPageForm" :page="page" action="update" />
   </main>
 </template>
 
@@ -20,7 +20,9 @@ export default {
     return {
       page: { url: "", h1: "", title: "", description: "", content: "" },
 
-      // При нажатии на кнопку "Редактировать" показывается форма. По-умолчанию она скрыта.
+      // При нажатии на кнопку "Редактировать" показывается форма. По-умолчанию её нет в DOM.
+      // На этой странице форма подключена асинхронно, то есть её нет в чанке этой страницы.
+      // Код асинхронных компонентов Nuxt при сборке вырезает в отдельные js и css файлы.
       showPageForm: false,
     };
   },

diff --git a/readme.md b/readme.md
@@ -1,7 +1,6 @@
 # Nuxt-Express
 
 Базовый шаблон для работы Nuxt в качестве middleware для Express.
-Приложение работает в едином процессе.
 
 ### Используемые технологии
 

diff --git a/server/index.js b/server/index.js
@@ -1,14 +1,12 @@
-// Основной файл запуска приложения.
-
 require("dotenv").config();
 
 // Подключаем бэкенд на Express.
 const express = require("express");
 const app = express();
 app.use(express.json());
 
-// Подключаем Mongoose и делаем коннект к базе.
-// Прописывает стандартные настройки Mongoose.
+// Подключаем Mongoose и делаем коннект к базе данных.
+// Прописываем стандартные настройки Mongoose.
 const mongoose = require("mongoose");
 mongoose.Schema.Types.Boolean.convertToFalse.add("");
 mongoose.connect(`mongodb://localhost/${process.env.DATABASE}`, {

diff --git a/server/model/page.js b/server/model/page.js
@@ -4,7 +4,7 @@ const pageSchema = new mongoose.Schema({
   // Описываем модель Page. То есть из чего состоит динамическая страница сайта.
 
   url: {
-    // Адрес страницы является строкой. Он обязателен и должен быть уникальным.
+    // Например, адрес страницы является строкой. Он обязателен и должен быть уникальным.
     type: String,
     unique: true,
     required: true,
@@ -28,7 +28,7 @@ const pageSchema = new mongoose.Schema({
     required: true,
   },
   createdDate: {
-    // У каждой страницы автоматически создаётся дата создания.
+    // У каждой страницы автоматически сохраняется дата создания.
     type: Date,
     default: Date.now,
   },