Educational web-based penetration testing tool with modern UI/UX, simulated security scanning, and security awareness best practices for students and professionals learning web security.
This skill has safety concerns that you should review before use. Some patterns were detected that may pose a risk.Safety score: 60/100.
KillerSkills scans all public content for safety. Use caution before installing or executing flagged content.
A web-based penetration testing tool project designed for educational purposes, focusing on creating a user-friendly interface for security testing demonstrations and learning.
When writing or reviewing code for this project:
1. **JavaScript Standards**
- Use modern JavaScript (ES6+) features (arrow functions, destructuring, async/await, classes)
- Follow modular, class-based architecture
- Implement event-driven programming patterns
- Maintain clean, readable code with proper commenting
- Separate concerns between presentation and logic
2. **HTML Best Practices**
- Follow semantic HTML structure
- Use appropriate tags for content hierarchy
- Include proper accessibility attributes (ARIA labels, alt text)
- Ensure proper document structure and validation
3. **CSS Design Patterns**
- Implement responsive design for all device sizes
- Use CSS Grid and Flexbox for layouts
- Apply modern design with glassmorphism effects
- Use dark theme with gradient backgrounds
- Ensure accessible color contrasts (WCAG compliance)
- Create smooth animations and transitions
4. **UI/UX Guidelines**
- Modern, professional design aesthetic
- Clear visual hierarchy and typography
- Smooth, purposeful animations
- Responsive breakpoints for mobile, tablet, desktop
- Intuitive navigation and user flows
This is an educational tool. When implementing features:
1. **Safety First**
- Always include educational disclaimers
- Simulate security tools rather than implementing actual exploitation
- Focus on demonstrating concepts safely
- Include proper authorization reminders before any simulated scans
- Never include actual exploit code or malicious payloads
2. **Best Practices**
- Follow security best practices in all code examples
- Demonstrate secure coding patterns
- Show proper input validation techniques
- Illustrate security concepts through safe simulations
- Include comments explaining security implications
Organize code following these patterns:
1. **Modular Architecture**
- Use JavaScript classes for components
- Separate HTML, CSS, and JavaScript files
- Create reusable, independent modules
- Implement clear interfaces between components
2. **Data Handling**
- Generate mock data for realistic demonstrations
- Use realistic but fake datasets for examples
- Simulate API responses and scanning results
- Avoid any actual network exploitation attempts
3. **Code Organization**
```
- HTML: Semantic structure and layout
- CSS: Styling, themes, responsive design
- JavaScript: Logic, interactions, simulations
```
When suggesting code improvements or new features, prioritize in this order:
1. **Educational Value and Clarity**
- Code should clearly demonstrate security concepts
- Include explanatory comments and documentation
- Use self-documenting variable and function names
- Provide examples that are easy to understand
2. **Security Awareness and Best Practices**
- Demonstrate proper security hygiene
- Show safe coding patterns
- Include warnings and disclaimers
- Teach responsible security practices
3. **Modern Web Development Standards**
- Use current JavaScript features and APIs
- Follow W3C standards for HTML/CSS
- Implement progressive enhancement
- Ensure cross-browser compatibility
4. **User Experience and Accessibility**
- Create intuitive, responsive interfaces
- Support keyboard navigation
- Ensure screen reader compatibility
- Provide clear visual feedback
5. **Code Maintainability and Documentation**
- Write clean, readable code
- Include inline comments for complex logic
- Document component APIs and interfaces
- Maintain consistent coding style
When building a new security tool simulation:
1. Design the UI component with modern, professional styling
2. Create a JavaScript class to manage the tool's logic
3. Generate realistic mock data for demonstrations
4. Add educational comments explaining the security concept
5. Include disclaimers about proper authorization
6. Test responsive behavior across devices
7. Ensure accessibility compliance
8. Document the component's purpose and usage
Leave a review
No reviews yet. Be the first to review this skill!
# Download SKILL.md from killerskills.ai/api/skills/github-copilot-web-pentest-tool/raw