Simple project that displays the Key and KeyCode of the pressed key, based on project idea from app-ideas repo. Depolyed on Github Pages here.
Node.js with npm with the following npm packages installed locally or globally-
Parcel (devDependency)
Used to enable usage of node modules (tone in this case) in browser. Browserify not used because it takes some config for HMR. And Webpack no longer polyfills node modules.
Tone.js (prodDependency)
Used to make sound on keypress.
$ git clone https://github.com/ranmerc/implement-app-ideas
$ cd implement-app-ideas/beginner/Key-Value-App
$ npm install
I had parcel installed globally so it is not included in package.json file so if you do not have parcel installed you may also want to do -
$ npm install parcel-bundler --save-dev
$ npm run dev
Targets src/index.html outputs to dist/ and starts a dev server on port 1234.
$ npm run build
Builds the production version of the app and outputs to build/. Cache folder is deleted because of this issue and public url is used because of this issue.
-
Design on Figma.
-
How to code CSS media queries targeting ALL mobile devices and tablets? on Stack Overflow.
-
KeyboardEvent on MDN.
-
Tone.js docs.