gitmyhub

vue2-happyfri

JavaScript ★ 11k updated 3y ago

vue2 + vue-router + vuex 入门项目

A tiny beginner-level Vue 2 quiz app written in Chinese that demonstrates how routing, a shared data store, and component actions fit together in a minimal, readable codebase.

JavaScriptVue 2Node.jssetup: easycomplexity 1/5

This is a small beginner-level web project written in Chinese and built with Vue 2, a popular JavaScript framework for building browser-based interfaces. The author describes it as intentionally simple, meant to be a learning exercise where someone new to Vue can read through the entire codebase and understand what is happening from start to finish.

The app itself is a short mobile-style quiz. Users answer a series of questions, and the app tracks which answer they selected and how long they took. At the end, they see a score. The interface is designed to be viewed in a phone-sized browser window, and a live demo was available at the author's personal site.

The code walks through the main building blocks of a Vue project: routing between pages (a home screen, a question page, and a results page), a shared data store that keeps track of quiz state like the current question number and elapsed time, and the actions that update that store when the user taps an answer.

For someone learning Vue who wants a real but very small working example, the repository shows how all the pieces connect without the noise of a large application. It requires Node.js to run locally, and the setup is a standard install-then-serve sequence.

The author also mentions a separate, much larger Vue 2 project in another repository for those who want a more complete reference after finishing this one. The README and all code comments are in Chinese, so readers who do not read Chinese may find the explanatory notes harder to follow, though the code structure itself is short enough to read through directly.

Where it fits