一個大學生的我的建站

這是我第一次作本身網站，不算是博客單但能夠那麼理解，主要是想擁有一個屬於本身的我的網站但不知道作什麼，只能跟博客有關了。作這個網站的目的主要是提高本身的能力和綜合技能看看上線之後跟在本地有什麼區別還有也能裝一下，畢竟本身仍是學生並且仍是一名自學前端的大學生。

• 網站歸納
  • 前端 vue
  • 後端尚未寫呢，由於用的tomcat，本人有學過java、jsp等，因此纔有了tomcat。

1. 網站地址

Code Xiu's Web（還備有備案因此不能用域名呢）

2.網站目錄結構

• 不規範或之後難維護的地方請大神們指出並批評，我必定虛心接受。

3. App.vue代碼

<template>
  <div id="app">
    <Header></Header>
    <div class="navbar">
      <ul class="nav">
        <li class="item">
          <router-link :to="{name: 'Blog'}" class="nav-link" active-class="router-link-active">
            <span class="skew">技術博客</span>
          </router-link>
        </li>
        <li class="item">
          <router-link :to="{name: 'Cool'}" class="nav-link" active-class="router-link-active">
            <span class="skew">效果</span>
          </router-link>
        </li>
        <li class="item">
          <router-link :to="{name: 'notice'}" class="nav-link" active-class="router-link-active">
            <span class="skew">公告</span>
          </router-link>
        </li>
        <li class="item">
          <router-link :to="{name: 'About'}" class="nav-link" active-class="router-link-active">
            <span class="skew">關於</span>
          </router-link>
        </li>
      </ul>
    </div>
    <router-view></router-view>
    <Footer></Footer>
  </div>
</template>
複製代碼

• 我總感受這裏好像不能寫這些，但暫時尚未調整，但願大神們能指出不對的地方，若是能給出建議更好。

4.router.js

export default new Router({
  mode: 'history',
  base: process.env.BASE_URL,
  routes: [{
      path: '/',
      redirect: '/index/techArticle'
    },
    {
      path: '/index',
      redirect: '/index/techArticle'
    },
    {
      path: '*',
      redirect: '/index/techArticle'
    },
    {
      path: '/index/techArticle',
      name: 'techArticle',
      component: () => import('./components/mainView/techArticle.vue'),
      redirect: '/index/techArticle/Blog',
      children: [{
        path: '/index/techArticle/Blog',
        name: 'Blog',
        component: () => import('./components/toolsComponents/Blog.vue')
      }]
    },
    {
      path: '/index/cool',
      name: 'Cool',
      component: () => import('./components/mainView/cool.vue'),
      redirect: '/index/cool/Round',
      children: [{
          path: '/index/cool/Round',
          name: 'Round',
          component: () => import('./components/toolsComponents/Round.vue')
        },
        {
          path: '/index/cool/Scale',
          name: 'Scale',
          component: () => import('./components/toolsComponents/Scale.vue')
        },
        {
          path: '/index/cool/Glass',
          name: 'Glass',
          component: () => import('./components/toolsComponents/Glass.vue')
        }, {
          path: '/index/cool/WebCarousel',
          name: 'WebCarousel',
          component: () => import('./components/toolsComponents/WebCarousel.vue')
        },
        {
          path: '/index/cool/TurnBook',
          name: 'TurnBook',
          component: () => import('./components/toolsComponents/TurnBook.vue')
        }, {
          path: '/index/cool/Panoramic',
          name: 'Panoramic',
          component: () => import('./components/toolsComponents/Panoramic.vue')
        }, {
          path: '/index/cool/Eyeshield',
          name: 'Eyeshield',
          component: () => import('./components/toolsComponents/Eyeshield.vue')
        }
      ]
    },
    {
      path: '/index/notice',
      name: 'notice',
      component: () => import('./components/mainView/notice.vue'),
      redirect: '/index/notice/Notice',
      children: [{
          path: '/index/notice/Notice',
          name: 'Notice',
          component: () => import('./components/toolsComponents/Notice.vue')
        },
        {
          path: '/index/notice/Exception',
          name: 'Exception',
          component: () => import('./components/toolsComponents/Exception.vue')
        }
      ]
    },
    {
      path: '/index/about',
      name: 'About',
      component: () => import('./components/mainView/about.vue'),
      redirect: '/index/about/Bloger',
      children: [{
        path: '/index/about/Bloger',
        name: 'Bloger',
        component: () => import('./components/toolsComponents/Bloger.vue')
      }]
    }
  ]
})
複製代碼

• 我感受這裏還能夠，但我是個小白，有不少不規範或錯誤的地方，但願大神們能指出錯誤。

總結： 但願大神們能給出指導意見，能讓一個小白更加規範的開發，避免之後走更多的彎路和錯誤。