https://github.com/danielmlc/vue-ssr-template

vue-ssr-template
https://github.com/danielmlc/vue-ssr-template

bulma ssr vue

Last synced: 3 days ago
JSON representation

vue-ssr-template

• Host: GitHub
• URL: https://github.com/danielmlc/vue-ssr-template
• Owner: danielmlc
• License: mit
• Created: 2019-01-04T09:51:59.000Z (about 6 years ago)
• Default Branch: master
• Last Pushed: 2019-01-22T08:00:38.000Z (about 6 years ago)
• Last Synced: 2024-11-24T06:12:50.681Z (2 months ago)
• Topics: bulma, ssr, vue
• Language: JavaScript
• Size: 108 KB
• Stars: 2
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# vue-hackernews-2.0

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



  

    

    


    Live Demo

  



## 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