web-dev-cheatsheets

Web Developer Cheatsheet Library

A curated collection of modern, visually appealing cheatsheets for web development technologies, designed to help developers quickly reference key concepts, syntax, and best practices. This library includes cheatsheets for HTML, CSS, JavaScript, and more, with a focus on clean design and practical examples.

Table of Contents

• Available Cheatsheets
• Features
• Installation
• Usage
• Contributing
• License

Available Cheatsheets

• JavaScript Cheatsheet: 👉 Visit

  Covers variables, functions, arrays, objects, loops, conditionals, and ES6+ features.

• React.js v19 Cheatsheet: 👉 Visit

  Modern Cheatsheet • React js tailored for v19

• Tailwind CSS Cheatsheet: 👉 Visit

  v4 and v4. New Features added

• More cheatsheets coming soon (e.g., HTML, CSS, React, etc.)!

For example: To view the JavaScript cheatsheet, open javascript-cheatsheet/index.html in your browser or visit the hosted version at JavaScript Cheatsheet.

Preview:

Features

• Modern Design: Dark-themed, trendy UI with responsive layouts for easy reading.
• Comprehensive Content: Covers essential web development topics with concise code snippets.
• Open Source: Hosted on GitHub, open for contributions and improvements.
• Developer-Friendly: Structured for quick reference during coding sessions.

Installation

To use the cheatsheets locally or contribute to the project, follow these steps:

1. Clone the Repository:

   git clone https://github.com/pawan-maurya/web-dev-cheatsheets.git
   

2. Navigate to the Project Directory:

   cd web-dev-cheatsheets
   

3. Open Cheatsheets:
   • Open any cheatsheet (e.g., javascript-cheatsheet/index.html) in a web browser to view locally.
   • No additional dependencies are required as the cheatsheets are built with vanilla HTML and CSS.

Usage

• Browse Cheatsheets: Access the cheatsheets directly via the GitHub Pages site (if hosted) or locally by opening the HTML files in a browser.
• Searchable Content: Each cheatsheet is organized into sections (e.g., Variables, Functions, Arrays) for quick navigation.
• Responsive Design: Viewable on desktop, tablet, or mobile devices.
• Contribute: Add new cheatsheets or improve existing ones by following the Contributing guidelines.

Contributing

We welcome contributions to expand and improve this library! To contribute:

1. Fork the Repository: Click the “Fork” button on GitHub to create your own copy.
2. Create a New Branch:

   git checkout -b feature/new-cheatsheet
   

3. Add or Update Cheatsheets:
   • Follow the existing structure (HTML/CSS with a dark theme).
   • Ensure code snippets are accurate and concise.
   • Use the same color scheme and typography for consistency (see javascript-cheatsheet/index.html for reference).
4. Commit Changes:

   git commit -m "Add new cheatsheet for [Technology]"
   

5. Push to Your Fork:

   git push origin feature/new-cheatsheet
   

6. Submit a Pull Request: Open a PR on GitHub with a clear description of your changes.

Please adhere to the following guidelines:

• Maintain the dark-themed, modern UI design.
• Test your cheatsheet in multiple browsers for compatibility.
• Include clear, commented code snippets.
• Update this README if adding new cheatsheets.

License

This project is licensed under the MIT License. See the LICENSE file for details.

---

Built with ❤️ for web developers. Contributions and feedback are welcome!