Wine & Cheese Map
This is an app to view wine and cheese pairings through a Cytoscape.js visualisation.
This app is a demo of the sort of functionality that Cytoscape.js allows you to easily add to your webapp. This repository is MIT-licensed, like Cytoscape.js itself.
The data was generated from recommendations in Max McCalman's book, Cheese: A Connoisseur's Guide to the World's Best.
This app can be used as an example of how you might structure your modern webapp. While this repository may act as a good general reference, you would probably want to tailor and optimise the build configuration files for your project.
The technologies used for this project include:
- Webpack: Bundle JS
- PostCSS: Bundle CSS
- Babel: Compile newer JS to older JS to support older browsers
- CSSNext: Compile newer CSS to older CSS to support older browsers
- Preact: Basic component support
- Cytoscape: Graph/network visualisation
- ESLint: Identify common problems in JS
- Stylelint: Identify common problems in CSS
Building the project
The project's build targets are specified as npm scripts. Use
npm run <target> for one of the following targets:
watch: Do a debug build of the app, which automatically rebuilds and reloads as the code changes
prod: Do a production build of the app
clean: Delete all files under the dist directory
lint: Run linters on the JS and CSS files