Guide · Open source

How to use vue-hackernews-2.0: install, run and understand it

Updated 2026-10-29 · written with AI from the project's own documentation and checked against our catalogue data

vue-hackernews-2.0 is a working copy of the Hacker News website built with Vue 2.0, vue-router and vuex, with server-side rendering. It is mainly a demo that shows how to build a server-rendered Vue app. This guide walks you through cloning it, installing dependencies, running it locally and finding the parts worth studying.

Vue Hacker Newsvuejs/vue-hackernews-2.0 · ★ 10.8k · MIT Install options & downloads

Quick start

1Clone the repository. Run git clone on the vuejs/vue-hackernews-2.0 GitHub repository and enter the folder.
2Install dependencies. Run npm install in the project folder. Yarn also works, according to the README.
3Start dev mode. Run npm run dev and open localhost:8080 in your browser to see the app with hot reload.
4Build for production. Run npm run build to produce a production build.
5Serve production mode. Run npm start to serve the app in production mode.
6Study the structure. Read the source to see how Vue, vue-router and vuex work together with server-side rendering. The README points to the Vue SSR guide at ssr.vuejs.org for background.

What is vue-hackernews-2.0 and who is it for?

The project is a Hacker News clone. Pages are rendered on the server before being sent to the browser, which is called server-side rendering. The README presents it as a demo of how to build such an app with Vue, vue-router and vuex.

It suits developers learning how Vue server-side rendering works, developers who want a reference structure for a Vue 2 app with vue-router and vuex, and students studying a full example of a server-rendered single-page app.

What do you need before you start?

The README says the project requires Node.js 7 or higher. Install method is clone-and-build: you copy the repository from GitHub, then install its dependencies with npm.

Node.js 7+ (the README's stated requirement)
git, to clone the repository
npm, to install dependencies

Install vue-hackernews-2.0 by cloning and installing dependencies

Clone the repository from GitHub, move into the project folder, then install the dependencies with npm. The README also notes you can use yarn instead of npm.

git clone https://github.com/vuejs/vue-hackernews-2.0.git
cd vue-hackernews-2.0
npm install

Run vue-hackernews-2.0 in dev mode or build for production

For development, run the dev command. The README says it serves the app with hot reload at localhost:8080. To build for production, run the build command. To serve the production build, the README lists a start command.

Dev mode with hot reload: open localhost:8080 after starting
Production build: builds the app for production
Production serve: runs the app in production mode

npm run dev
npm run build
npm start

What features can you explore in the code?

The README lists server-side rendering with Vue, vue-router and vuex working together, server-side data pre-fetching, client-side state and DOM hydration, and route-level code splitting. It also covers progressive web app features such as an app manifest and a service worker.

Single-file Vue components, hot reload in development, and animation (route view transitions and FLIP animation for real-time list updates) are also included.

Server-side rendering and data pre-fetching
Client-side state and DOM hydration
App manifest and service worker
Single-file components with hot reload
Route view transition effects

Know the performance limits before reusing it

The README says this is not optimized for performance and is not recommended as a reference for Vue SSR performance. It notes that the Firebase-based HN API adds bundle size and does not batch-fetch pages efficiently, which hurts cold starts and cache misses. Do your own benchmarking before relying on it.

The project targets Vue 2.0, not Vue 3. Its last push was in December 2022, so treat it as a learning reference rather than a maintained codebase.

What people use it for

Learning how server-side rendering works in a Vue 2 app
Using the project as a reference layout for vue-router and vuex
Studying how a service worker and app manifest are wired into a Vue app
Exploring real-time list updates with FLIP animation
Comparing a Vue 2 SSR app against Nuxt.js or Next.js approaches

Frequently asked questions

Is vue-hackernews-2.0 free to use?

The project is released under the MIT licence, as stated in the README. You can read, use and modify the code under the terms of that licence.

What do I need to run vue-hackernews-2.0?

The README says it requires Node.js 7 or higher. You also need npm (or yarn) to install dependencies and git to clone the repository.

How do I start vue-hackernews-2.0 locally?

Clone the repository, run npm install, then run npm run dev. The README says the app is served at localhost:8080 with hot reload.

Does vue-hackernews-2.0 work with Vue 3?

The repository targets Vue 2.0. The README does not cover Vue 3, so if you start a new project on Vue 3 you should look for other resources. Forks updated for Vue 3 exist, according to our analysis.

Is vue-hackernews-2.0 fast enough for production?

No. The README says it is not optimized for performance and recommends your own benchmarking. It is meant as a demo, not a performance reference.

What are alternatives to vue-hackernews-2.0?

Comparable options include forks of this project updated for Vue 3, and frameworks such as Nuxt.js and Next.js, which provide server-side rendering as a core feature.

New agent skills, repos and AI tools — every week

The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.

Our verdict

Use vue-hackernews-2.0 if you want to learn Vue 2 server-side rendering through a complete, readable example with vue-router, vuex and PWA features. Pick something else if you need a production-ready performance reference, a Vue 3 starting point, or a codebase that is actively maintained.

Install options & downloads