8000 GitHub - boba-milktea/counter: HYF mini tiny project
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

boba-milktea/counter

Repository files navigation

🔢 Simple Counter App

A basic and interactive counter app built using HTML, CSS, and JavaScript.

📑 Table of Contents


📋 General Info

This is a basic counter app that enables users to increase, decrease, or reset a number. The principle of separation of concerns has been applied.


🖼️ Screenshots

Counter Screenshot


💻 Technologies

  • HTML5
  • CSS3
  • JavaScript (Vanilla)
  • Node.js (v14.16.0)
  • Visual Studio Code (IDE)

Setup

  • npm run start
  • npm install

Code Examples

reset.addEventListener('click', () => {
  confirm('Reset the number?') ? (number.value = 0) : null;
});

Features

  • Increment the number.
  • Decrement the number (prevents negative values).
  • Reset the counter with user confirmation.

To-do list

  • N/A

Status

Project is: done

Inspiration

Inspired by HYF. The aim is to practice basic DOM manipulation and event handling.

Contact

By boba-milktea

Instructions for use

Getting Started
  1. git clone git@github.com:HackYourFutureBelgium/template-markdown.git
  2. cd template-markdown
  3. npm install

Code Quality Checks

  • npm run format: Makes sure all the code in this repository is well-formatted (looks good).
  • npm run lint:ls: Checks to make sure all folder and file names match the repository conventions.
  • npm run lint:md: Will lint all of the Markdown files in this repository.
  • npm run lint:css: Will lint all of the CSS files in this repository.
  • npm run validate:html: Validates all HTML files in your project.
  • npm run spell-check: Goes through all the files in this repository looking for words it doesn't recognize. Just because it says something is a mistake doesn't mean it is! It doesn't know every word in the world. You can add new correct words to the ./.cspell.json file so they won't cause an error.
  • npm run accessibility -- ./path/to/file.html: Runs an accessibility analysis on all HTML files in the given path and writes the report to /accessibility_report

Continuous Integration (CI)

When you open a PR to main/master in your repository, GitHub will automatically do a linting check on the code in this repository, you can see this in the./.github/workflows/lint.yml file.

If the linting fails, you will not be able to merge the PR. You can double check that your code will pass before pushing by running the code quality scripts locally.

Repo Setup

  • Give each member write access to the repo (if it's a group project)
  • Turn on GitHub Pages and put a link to your website in the repo's description
  • Go to General Section > check Discussions
  • In the Branches section of your repo's settings make sure the master/main branch must:
    • "Require a pull request before merging"
    • "Require approvals"
    • "Dismiss stale pull request approvals when new commits are pushed"
    • "Require status checks to pass before merging"
    • "Require branches to be up to date before merging"
    • "Do not allow bypassing the above settings"

About

HYF mini tiny project

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published
0