DevToys

repository·main·Indexed 12 days ago

https://github.com/devtoys-app/devtoys

A local 'Swiss Army knife' for developers providing a suite of tools for encoding, decoding, formatting, and generating data. Includes a SDK (DevToys.Api) for building extensions, support for CLI-based tools via ICommandLineTool, and a Blazor-integrated Monaco Editor wrapper for code and diff editing.

Tokens
11.1K
Snippets
25
Records
42
Agent score
93%

What's inside DevToys

  1. Overview of DevToys tools and features

    main

    DevToys is a collection of developer utilities designed for quick, specific tasks, serving as a local alternative to untrustworthy web-based tools. It features Smart Detection, which automatically identifies the best tool based on the content currently on your clipboard.

    DevToys 2.0 includes 30 default tools categorized as follows:

    • Converters: JSON ↔ YAML, Date, Number bases, etc.
    • Encoders/Decoders: HTML, URLs, Base64, GZip, JWT, QR Code, etc.
    • Formatters: JSON, SQL, XML, etc.
    • Generators: Hash & Checksum, Lorem Ipsum, Password, etc.
    • Graphics Tools: Color Blindness Simulator, PNG/JPEG Compressor, etc.
    • Testers: JSONPath, RegEx, XML, etc.
    • Text Utilities: Markdown Preview, Text Comparer, Analyzer & Utilities, etc.

    Users can extend functionality by installing extensions or developing their own custom tools.

  2. Understand DevToys data collection and privacy

    main

    DevToys collects anonymous Non-Personal data and health/performance data to improve the service.

    Key privacy guarantees:

    • No Personal Data: The service will never retain or ask you to provide personally identifiable information.
    • Usage Data Isolation: Usage Data (such as error messages, performance metrics, and ordered lists of features used) is collected automatically but is not sent to the Developer or Service Providers.
    • Local Visibility: You can view the collected Usage Data locally within the application in the "Logs" section of the Settings page.
  3. Redistribute work under the Apache License 2.0

    main

    When redistributing work or derivative works under the Apache License 2.0, you must satisfy these conditions:

    1. Include License: Provide a copy of the License to all recipients.
    2. Notice Modifications: Modified files must carry prominent notices stating that changes were made.
    3. Retain Notices: Retain all copyright, patent, trademark, and attribution notices from the original Source form in any Derivative Works you distribute.
    4. Handle NOTICE files: If the original work includes a NOTICE text file, you must include a readable copy of the attribution notices from that file in at least one of these places:
      • Within a NOTICE text file distributed with your Derivative Works.
      • Within the Source form or documentation.
      • Within a display generated by the Derivative Works (where third-party notices normally appear).

    You may add your own copyright statement and different license terms for your modifications, provided your use of the original work complies with the Apache License 2.0.

  4. Generate .nupkg packages using update.ps1

    main

    To generate a .nupkg package for DevToys, use the update.ps1 script which utilizes the Automatic Package Updater Module.

    1. Install the Automatic Package Updater Module (AU).
    2. Run the update.ps1 script.
    3. The script will create a .nupkg package based on the latest GitHub release.

    Recreating a package: If you need to recreate a package for the current version, uncomment the -Force parameter in update.ps1 at the line: update -ChecksumFor 64 #-Force.

    Important Note: You must remove the .Msixbundle file from inside the .nupkg file (it should be placed in the tools folder instead).

  5. Push .nupkg versions to Chocolatey

    main

    To push a generated .nupkg file to the Chocolatey repository, you must be a maintainer and possess a Chocolatey Community API key.

    First, configure your API key:

    choco apikey --key yourapikey --source https://push.chocolatey.org/

    Then, push the specific versioned package:

    choco push .\DevToys.versiongenerated.nupkg --source https://push.chocolatey.org/
    choco apikey --key yourapikey --source https://push.chocolatey.org/
    choco push .\DevToys.versiongenerated.nupkg --source https://push.chocolatey.org/
  6. Add a glyph to the DevToys icon font

    main

    To add a new icon to the DevToys icon font, follow these steps using FontForge and an SVG file:

    1. Setup: Install FontForge and open the project font file: /assets/font/DevToys-Tools-Icons.sfd.
    2. Create Asset: Create your icon in a vector tool (Figma, Inkscape, Adobe Illustrator, etc.) and export it as an SVG.
    3. Prepare Slot: In FontForge, navigate to Encoding > Add Encoding Slots.
    4. Import: Select the newly created slot, then go to File > Import and select your SVG. Crucial: Under Options, uncheck Scale to fit (Misc).
    5. Configure Metadata: Go to Element > Glyph Info to set the glyph name and its corresponding Unicode value (e.g., U+0100).
  7. Apply the Apache License 2.0 to your work

    main

    To apply the Apache License, Version 2.0 to your software, attach the following boilerplate notice to your files. Replace the bracketed fields [YYYY] and [Name of copyright owner] with your actual information. Ensure the text is enclosed in the appropriate comment syntax for your file format.

    Copyright [2010-2021] [Dennis Doomen]
    
    Licensed under the Apache License, Version 2.0 (the "License");
       you may not use this file except in compliance with the License.
       You may obtain a copy of the License at
    
    http://www.apache.org/licenses/LICENSE-2.0
    
    Unless required by applicable law or agreed to in writing, software
       distributed under the License is distributed on an "AS IS" BASIS,
       WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
       See the License for the specific language governing permissions and
       limitations under the License.
  8. Generate a TrueType font from FontForge

    main

    After adding a glyph, you must validate and generate the font file. Follow these steps:

    1. Validate the Glyph

    Go to Element > Validation > Validate.... Resolve common errors using these specific FontForge commands:

    ErrorFix Command
    Self IntersectingElement > Overlap > Remove Overlap (or manual SVG edit)
    Non-Integral CoordinatesElement > Round > To Int
    Missing Points at ExtremaElement > Add Extrema

    2. Export the Font

    Once validation passes:

    1. Go to File > Generate Fonts.
    2. Select TrueType.
    3. Check Validate before saving.
    4. Click Generate.

    3. Verification

    You can verify the generated .ttf file using the Character Map UWP application.

  9. Configure CLI tool metadata and options

    main

    CLI tools in DevToys are configured using attributes applied to the class and its properties:

    Class Attributes

    • [Name("...")]: The human-readable name of the tool.
    • [CommandName(...)]: Defines the command execution identity:
      • Name: The primary command string.
      • Alias: Alternative short commands.
      • DescriptionResourceName: Resource key for the command description.
      • ResourceManagerBaseName: The base name of the resource manager.
    • [TargetPlatform(Platform.X)]: (Optional) Restricts the tool to specific platforms like Platform.Windows or Platform.MacOS.

    Property Attributes (Options)

    • [CommandLineOption(...)]: Applied to properties to define command-line flags/options:
      • Name: The option name (e.g., --file).
      • Alias: The short flag (e.g., -f).
      • IsRequired: Boolean indicating if the option must be provided.
      • DescriptionResourceName: Resource key for the option description.
  10. How Popover positioning and flipping works

    main

    The Popover class automatically manages the position of popover content relative to its anchor. It uses CSS classes to determine intended alignment and handles 'flipping' to prevent the popover from being cut off by the viewport edges.

    Positioning Classes

    The position is determined by classes applied to the popovercontent-{id} element. These include:

    • Anchors: popover-anchor-top-left, popover-anchor-top-center, popover-anchor-top-right, popover-anchor-center-left, popover-anchor-center-center, popover-anchor-center-right, popover-anchor-bottom-left, popover-anchor-bottom-center, popover-anchor-bottom-right.
    • Offsets: popover-top-left, popover-top-center, popover-top-right, popover-center-left, popover-center-center, popover-center-right, popover-bottom-left, popover-bottom-center, popover-bottom-right.

    Automatic Flipping

    If the popover content has the classes popover-overflow-flip-onopen or popover-overflow-flip-always, the system will check if the current position would cause the popover to overflow the viewport. If so, it will attempt to flip the position using flipClassReplacements.

    Z-Index Management

    The system supports manual z-index layering via the data-ticks attribute. When a parent element contains children with data-ticks attributes, the Popover utility calculates and applies a z-index to those children using the formula: calc(var(--popover-zindex) + (sortedTickIndex + 3))