https://github.com/veliovgroup/best-practices
Software development best practices
https://github.com/veliovgroup/best-practices
javascript pwa webdev
Last synced: 3 months ago
JSON representation
Software development best practices
- Host: GitHub
- URL: https://github.com/veliovgroup/best-practices
- Owner: veliovgroup
- Created: 2022-04-03T18:02:36.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2023-06-21T09:21:43.000Z (almost 2 years ago)
- Last Synced: 2025-01-11T17:49:00.630Z (5 months ago)
- Topics: javascript, pwa, webdev
- Language: JavaScript
- Homepage:
- Size: 12.7 KB
- Stars: 1
- Watchers: 4
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Web Development Best Practices
By @veliovgroup and @dr-dimitru
- [For HTML](https://github.com/veliovgroup/best-practices/tree/main/html)
- [For SASS/CSS](https://github.com/veliovgroup/best-practices/tree/main/css)
- [For JavaScript](https://github.com/veliovgroup/best-practices/tree/main/js)
## Front end
- [`normalize.min.css`](https://github.com/veliovgroup/best-practices/blob/main/css/normalize.min.css) — Reset browser's default CSS styles
- [`copy-to-clipboard.js`](https://github.com/veliovgroup/best-practices/blob/main/js/copy-to-clipboard.js) — Copy text into system clipboard programmatically without user interaction or upon a click, this script works on iOS, mobile devices, and when document is not in the focus
- To avoid "style leaking" between different pages or elments wrap SASS/SCSS/CSS code into a parent class. "CSS scoping" by page, element, or component is vital when working in a team. Otherwise, your CSS can "leak" affecting global styles, or styles of other pages, elements, and components. Enclosing CSS rules within a parent container helps to create more modular, maintainable code and prevent conflicts between different parts of the page.
### PWA
- Use [realfavicongenerator](https://realfavicongenerator.net) to generate all necessary icons assets, webmanifest, and related meta-tags
- Use [Lighthouse](https://developers.google.com/web/tools/lighthouse) to run "best practices" tests and audits locally from Chrome DevTools
- Use [web.dev/measure](https://web.dev/measure/) to run "best practices" tests and audits on a remote host online