# vuejs/vue-hackernews-2.0

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/vuejs-vue-hackernews-2-0).**

10,868 stars · 2,122 forks · JavaScript · MIT

## Links

- GitHub: https://github.com/vuejs/vue-hackernews-2.0
- awesome-repositories: https://awesome-repositories.com/repository/vuejs-vue-hackernews-2-0.md

## Description

This project is a Hacker News clone built with Vue.js. It serves as a demonstration of a server-side rendered application and a progressive web app that supports offline access and mobile installation.

The application showcases the implementation of centralized state management for coordinating global data flow and a routing system that features route-level code splitting and animated view transitions.

It covers broader capabilities in frontend route optimization, server-side rendering for improved initial load speeds, and the use of service workers and app manifests to enable offline functionality.

## Tags

### Web Development

- [News Aggregators](https://awesome-repositories.com/f/web-development/news-aggregators.md) — Provides a full-featured Hacker News clone built with Vue.js.
- [Server-Side Rendering](https://awesome-repositories.com/f/web-development/server-side-rendering.md) — Generates initial HTML on the server to improve page load speeds and search engine indexing.
- [Asset Caching](https://awesome-repositories.com/f/web-development/browser-integration-utilities/browser-infrastructure/service-worker-controls/service-worker-libraries/asset-caching.md) — Intercepts network requests to store assets locally, enabling the application to function without an internet connection.
- [Centralized State Management](https://awesome-repositories.com/f/web-development/hydration-state-management/browser-side-state-management/centralized-state-management.md) — Uses a centralized Vuex store to coordinate global data flow and maintain a single source of truth.
- [Offline Capabilities](https://awesome-repositories.com/f/web-development/offline-capabilities.md) — Maintains application functionality without a network connection using service workers and app manifests. ([source](https://github.com/vuejs/vue-hackernews-2.0#readme))
- [Progressive Web Apps](https://awesome-repositories.com/f/web-development/progressive-web-apps.md) — Implements a progressive web app with service workers and manifests to enable offline access and mobile installation.
- [Server-Side Rendering](https://awesome-repositories.com/f/web-development/rendering-templating/server-side-rendering.md) — Generates dynamic HTML content on the server to improve performance and search engine visibility. ([source](https://github.com/vuejs/vue-hackernews-2.0#readme))
- [Vue.js State Management Libraries](https://awesome-repositories.com/f/web-development/vue-js-state-management-libraries.md) — Uses a centralized Vuex store to coordinate shared data across multiple components and routes.
- [Code Splitting](https://awesome-repositories.com/f/web-development/dynamic-loading-strategies/code-splitting.md) — Divides the application bundle into smaller chunks that load asynchronously based on the active route.
- [Frontend Performance Optimization](https://awesome-repositories.com/f/web-development/frontend-performance-optimization.md) — Optimizes frontend load times by splitting code into route-specific chunks.
- [Client-Side Hydration](https://awesome-repositories.com/f/web-development/rendering-templating/rendering-patterns/client-side-hydration.md) — Attaches interactive behavior to server-rendered HTML to transform static content into a fully reactive client-side application.
- [Server-Rendered Enhancement](https://awesome-repositories.com/f/web-development/rendering-templating/server-side-rendering-utilities/static-html-generators/interactive-html-bootstrapping/server-rendered-enhancement.md) — Enhances server-delivered HTML with client-side interactivity to improve perceived load speed. ([source](https://github.com/vuejs/vue-hackernews-2.0/blob/master/README.md))
- [Routing Implementations](https://awesome-repositories.com/f/web-development/vue-development/routing-implementations.md) — Features a routing system with route-level code splitting and animated view transitions.
- [Web App Manifests](https://awesome-repositories.com/f/web-development/web-app-manifests.md) — Uses a web app manifest to define metadata for native-like installation and integration on mobile devices.

### Development Tools & Productivity

- [Code Loading Optimizations](https://awesome-repositories.com/f/development-tools-productivity/code-loading-optimizations.md) — Optimizes resource loading by fetching only the assets necessary for the current route using code splitting. ([source](https://github.com/vuejs/vue-hackernews-2.0#readme))

### User Interface & Experience

- [Server-Side Data Fetching](https://awesome-repositories.com/f/user-interface-experience/content-rendering-components/server-side-data-fetching.md) — Retrieves required data on the server before page rendering to ensure immediate content display. ([source](https://github.com/vuejs/vue-hackernews-2.0/blob/master/README.md))
- [View Transition Animations](https://awesome-repositories.com/f/user-interface-experience/view-transition-animations.md) — Applies visual animations and motion effects when navigating between different application views. ([source](https://github.com/vuejs/vue-hackernews-2.0/blob/master/README.md))