🎲 Companion Dice For Tabletop Games

https://companiondice.netlify.app/

Features

• Select from 4, 6, 8, 10, 12, 20 sided dice
• Supports rolling multiple dice of one type
• Responsive Mobile friendly layout
• PWA Download as an offline Progressive Web App onto your phone
• NEW in 1.1 You can Now roll 100 sided, and roll for Ability Scores

Acknowledgement

Created in collaboration with Nathan Goullete

Built With

• ParcelJS Blazing fast, zero configuration web application bundler
• Preact Fast 3kB alternative to React with the same modern API
• postCSS tool for transforming CSS with JavaScript
• TailwindCSS A utility-first CSS framework for rapidly building custom designs
• Netlify - All-in-one platform for automating modern web projects
• Reach Router - Accessible Routing for React by managing the focus of your app on route transitions.
• Polished - lightweight toolset for writing styles in JavaScript
• PrettierJS - opinionated code formatter
• ESlint - Pluggable JavaScript linter

Contributing

Local Development Setup

• Clone project
• Navigate to project directory
• Open terminal in project directory and run npm install
• Run npm start a dev server will open at localhost:1234
• Edit && Save will live update and refresh the page on the dev server
• Push to Remote after verifying functionality locally

Commit Guidelines

• commit subject lines should be 50 characters or less
• begin with an emoji write them with a keyword wrapped in colons :book: 📖
• followed by a verb in the imperative ie: add, remove, compile
• ending with a reference to the relevant issue number with a hashtag and in parentheses ie: (#24)

Example:

# emoji 50-character subject line (#25)
#
# Why:
# 

Emojis to be used:

• 🐛 :bug:fix a bug
• 🔥 :fire: remove file or code
• 📦 :package: bundle, compile build process code/files
• ✨ :sparkles: add feature
• 😎 :sunglasses: improve styles
• 🚧 :construction: Work in progress
• ♻️ :recycle: reformat or refactor code
• 📖 :book: documentation
• 🚚 :truck: move files/change folders

Resources on emoji based commits

• gitmoji
• emoji-log

References && Resources

• Andre's DND Dice Tool - Old project created in early 2019 during college
• ParcelJS - Blazing fast, zero configuration web application bundler
• PostCSS - Tool for transforming CSS with JavaScript
• Number animation - By Dave Beshero

Using Tailwind

• Introduction to Tailwind
• Tailwind Docs
• Extracting Components append tailwind classes to other css classes
• Default Tailwind colors
• Display Utilities quickly add flex