https://github.com/pmg1989/vue-ssr-render

a demo for vue-ssr-render
https://github.com/pmg1989/vue-ssr-render

Last synced: about 22 hours ago
JSON representation

a demo for vue-ssr-render

• Host: GitHub
• URL: https://github.com/pmg1989/vue-ssr-render
• Owner: pmg1989
• License: mit
• Created: 2017-11-01T08:27:26.000Z (about 7 years ago)
• Default Branch: master
• Last Pushed: 2017-11-05T09:22:56.000Z (about 7 years ago)
• Last Synced: 2024-05-21T07:41:59.434Z (6 months ago)
• Language: JavaScript
• Size: 218 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
vue-ssr-render

vue-ssr-render clone built with Vue 2.0 + vue-router + vuex, with server-side rendering.

## Features

> Note: in practice, it is unnecessary to code-split for an app of this size (where each async chunk is only a few kilobytes), nor is it optimal to extract an extra CSS file (which is only 1kb) -- they are used simply because this is a demo app showcasing all the supported features. In real apps, you should always measure and optimize based on your actual app constraints.

- Server Side Rendering

  - Vue + vue-router + vuex working together

  - Server-side data pre-fetching

  - Client-side state & DOM hydration

  - Automatically inlines CSS used by rendered components only

  - Preload / prefetch resource hints

  - Route-level code splitting

- Progressive Web App

  - App manifest

  - Service worker

  - 100/100 Lighthouse score

- Single-file Vue Components

  - Hot-reload in development

  - CSS extraction for production

- Animation

  - Effects when switching route views

  - Real-time list updates with FLIP Animation

## Architecture Overview



**A detailed Vue SSR guide can be found [here](https://ssr.vuejs.org).**

## Build Setup

**Requires Node.js 7+**

``` bash

# install dependencies

npm install # or yarn

# serve in dev mode, with hot reload at localhost:8080

npm run dev

# build for production

npm run build

# serve in production mode

npm start

```

## License

MIT