This project is a rebuild of the original Crux Axul site with Vue 3 in Vite. The goal is / was to create proper dynamic and linkable subpages and an easier way to build the release catalog, w/ the option to connect the whole app to a headless CMS down the line if necessary. I also wanted to re-factor the markup to BEM principles and at least implement basic web accessibility. You can view version changes in the Changelog.
- Built with Vue 3 / Vite
- Data is fetched from multiple JSON files
- Media queries handled /w SASS-mq
- Font scaling via utopia.fyi
- Icons are pulled from Oh, Vue Icons!
- Home template pulls data from newest JSON entry / release
- Releases and Releases detail templates pull data from JSON in general
- Releases page can be filtered by ascending / descending releases
- Mobile puts the nav into an classic overlay /w hamburger
- An ExpandableText component makes it possible to control if and how longer texts can be expanded / collapsed
- "Filter by artist" on Release view
- Still some refactoring of views and CSS needed
- Design could be nicer, though the mindset here is also progressive enhancement and not "from scratch"
npm install --min-release-age 7Note: The flag --min-release-age 7 is set globally in .npmrc to only install packages whose releases are at least 7 days old. On Netlify, this is automatically applied since .npmrc is considered. For manual installations, you can use the flag explicitly or rely on the global setting.
npm run devnpm run buildLint with ESLint
npm run lintnpm run update-safeThis script installs dependencies with a 7-day delay mechanism to protect against recently hijacked NPM packages.