webdev-site/CONTRIBUTING.md

Contributing to d@n tech Portfolio

Thank you for your interest in contributing to this web development portfolio project! This document provides guidelines for contributing.

How to Contribute

1. Fork the Repository - Click the "Fork" button on GitHub to create your own copy.
2. Clone Your Fork - git clone https://github.com/YOUR-USERNAME/webdev-site.git
3. Create a Feature Branch - git checkout -b feature/your-feature-name
4. Make Your Changes - Follow the code style guidelines below.
5. Test Your Changes - Ensure the site builds and works across browsers.
6. Commit Your Changes - git commit -m "Add your descriptive message"
7. Push to Your Fork - git push origin feature/your-feature-name
8. Open a Pull Request - Navigate to the original repository and open a PR.

Code Style Guidelines

Please adhere to the existing code style to maintain consistency:

JavaScript

• Use ES6+ modules with type="module" in HTML
• Prefer const over let; avoid var
• Arrow functions for callbacks; named functions for top-level declarations
• CamelCase for variables/functions; PascalCase for classes
• Check element existence before DOM manipulation
• Use section headers: // ===== SECTION NAME =====

CSS

• Use CSS Custom Properties defined in :root with semantic names
• CSS Nesting with & for nested selectors (modern browsers)
• Mobile-first media queries with min-width
• Support prefers-color-scheme: dark with variable overrides
• Kebab-case for class names

HTML

• Semantic HTML5 elements (<header>, <main>, <section>)
• Include ARIA attributes where needed; proper heading hierarchy
• Use Bootstrap classes alongside custom styles
• data-* attributes for JavaScript hooks
• Lazy loading for images; defer non-critical scripts

Testing

Before submitting a pull request, please verify:

1. Build Success - Run npm run build to ensure no errors
2. Cross-Browser Compatibility - Test in at least Firefox and Chrome
3. Responsive Design - Check mobile (375px) and desktop (1200px) views
4. No Console Errors - Open browser developer tools and ensure no errors
5. Lighthouse Audit - Run npx lighthouse http://localhost:4173 for performance, accessibility, SEO, and best practices

Reporting Issues

When reporting issues, please include:

• Steps to reproduce the issue
• Expected vs. actual behavior
• Browser and operating system information
• Screenshots if applicable

Questions?

If you have questions, please open an issue or contact the maintainer via the portfolio site: dev.dustin.coffee

---

Thank you for contributing!