Giter VIP home page Giter VIP logo

string-is's Introduction

string-is

eslint jest build codecov

string.is is an open-source, privacy-friendly toolkit for developers. You can see it in action here.

Screenshot

string.is is an opinionated conversion tool, with the following goals:

  • It should be open-source.
  • It should not set any cookies.
  • It should have a strict Content Security Policy.
  • It should be extremely opinionated about dependancies, and only use well-known, well-supported libraries.
  • It should try to detect the format of the input, and intelligently choose output options.

Browser Support

string.is has been confirmed to work on Chrome, Safari, Firefox, and Edge. Internet explorer is not supported.

Running locally

Install dependencies:

yarn install

Set up git hooks:

yarn husky install

Run the development server:

yarn dev

... and then open http://localhost:3000 in your browser.

To run all linting checks, type checks, tests, and build for production:

yarn all

Running with Docker

Build the docker image:

yarn docker-build

or

docker build -t string-is .

... and then run it:

yarn docker-run

or

docker run -p 3000:3000 string-is

Alternatively you can build and run it with docker-compose:

docker-compose up

... or even run it directly from Docker Hub:

docker run -p 3000:3000 daveperrett/string-is:latest

Currently linux/arm64 and linux/amd64 platforms are supported.

Adding a new converter

The src/lib folder contains most of the conversion logic, and is pure TypeScript, with no React knowledge required.

  • src/lib/identities contains identifiers that take an input string and return the confidence level that the input is in a particular format. For example, JwtIdentifier returns a number indicating the confidence level (between 0 and 100) that a given input string is a JWT token.
  • src/lib/inputs contains parsers that load strings from different formats. For example, the JsonInput parses a JSON string and returns an object.
  • src/lib/outputs takes parsed data and formats it into a specific output format. For example, JavaScriptOutput takes a JavaScript string, formats it according to the formatting options provided, and returns the result.
  • src/lib/converters are inputoutput pairs - the glue that performs a conversion between formats. For example, CsvToJsonConverter takes a CSV string as input, feeds it into the CsvInput for parsing, and pipes the result into the JsonOutput for formatting.

To add a new converter:

  1. Decide what formats you are converting from and to. As an example, let's pretend you are writing a converter from plain text to reversed-text.
  2. Check that there is an identity (under src/lib/identities) for the from format. In this case we are converting from plain text, and we already have a PlainIdentity, so we don't need to add a new identity. An identity should export (a) a confidence function which, given an input string, returns a number out of 100 describing the confidence that the given input matches the identity, and (b) an array of converters that the identity can be used with.
  3. If you added a new identity in step (2), make sure to export it in src/lib/identities/index.ts.
  4. Check that there is an output (under src/lib/outputs) for the to format. An output should should export an output function which, given an input string (or possibly object, depending on the conversion taking place) and an options object, will convert the input into the desired output string.
  5. If you added a new output in step (4), make sure to export it in src/lib/outputs/index.ts.
  6. Add a new converter (under src/lib/converters) for the input + output pair. A converter should export (a) an operation function which passes the input string and an options object to the appropriate output, and (b) an outputId, which defines which output is being used.
  7. If you added a new converter in step (6), make sure to export it in src/lib/converters/index.ts. Also make sure to add entries to locales/en/pages-converter.json] so that the auto-generated landing page will have the correct heading, intro text and example.
  8. If you defined a new outputId in step (6), add a React output component (under src/components/domain/convert/outputs) to render the new kind of output. If you are re-using an existing kind of output (eg. converting to JSON or YAML) you can re-use an existing output component here.
  9. If you added a new React component in step (8), make sure to export it in src/components/domain/convert/outputs.

If the appropriate inputs, outputs, converters and React components are in place and exported correctly, you should be able to use your new converter, given the appropriate input string that triggers a non-zero confidence.

Deployment

If you want to be 100% confident that your privacy is protected, you can easily set up a string.is instance for your own personal or organizational use.

The quickest way to deploy string.is is to use the Vercel Platform (it's free for non-commercial use). Check out their Next.js deployment documentation for more details. Click the Deploy button below to deploy this application with Vercel:

Deploy with Vercel

Netlify and Heroku are also good options for free hosting. Click the Deploy button below to deploy this application with Heroku:

Deploy with Heroku

Unfortunately string.is doesn't currently support static builds via next export (which would allow hosting on eg. S3), because the i18n feature it uses is not currently supported for static builds.

Deploy string.is under a sub-path of a domain

Set the NEXT_PUBLIC_BASE_PATH environment variable to the sub-path, then build the project before deploying. This value must be set at build time and cannot be changed without re-building as the value is inlined in the client-side bundles.

For example, if you're deploying to https://tools.example.com/string-is, you'll need to set NEXT_PUBLIC_BASE_PATH to /string-is. You don't need to set this variable if you're deploying to the root of a domain.

Build and run with Docker:

docker build -t string-is --build-arg NEXT_PUBLIC_BASE_PATH="/string-is" .
docker run -p 3000:3000 string-is

Or build and run with docker-compose:

export NEXT_PUBLIC_BASE_PATH="/string-is"
docker-compose up --build

Localization

string.is supports full localization. New languages should be added under the locales/ folder in JSON format (see locales/en/ for an example). English is currently the only locale provided, but support for new languages is welcome.

Analytics

string.is includes support for Plausible Analytics, a privacy-friendly, cookie-less analytics service. To enable it, set an environment variable specifying the domain:

NEXT_PUBLIC_ANALYTICS_DOMAIN=string.is

Analytics is disabled by default unless process.env.NODE_ENV === 'production' and a NEXT_PUBLIC_ANALYTICS_DOMAIN domain is set.

Contributing

Once you've made your changes:

  1. Fork string-is
  2. Create a topic branch - git checkout -b feature/add-my-new-converter
  3. Push to your branch - git push origin feature/add-my-new-converter
  4. Create a Pull Request from your branch
  5. That's it!

Author

@davemetrics

Licensing

See the LICENSE for details.

string-is's People

Contributors

dependabot[bot] avatar kevenli8888 avatar recurser avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

string-is's Issues

Reporting a vulnerability

Hello!

I hope you are doing well!

We are a security research team. Our tool automatically detected a vulnerability in this repository. We want to disclose it responsibly. GitHub has a feature called Private vulnerability reporting, which enables security research to privately disclose a vulnerability. Unfortunately, it is not enabled for this repository.

Can you enable it, so that we can report it?

Thanks in advance!

PS: you can read about how to enable private vulnerability reporting here: https://docs.github.com/en/code-security/security-advisories/repository-security-advisories/configuring-private-vulnerability-reporting-for-a-repository

Add HTML, CSS and JS minification

We just had a need to one time minify some HTML. I'm not sure if this is a feature request that aligns with string-is goals or not, but if so then HTML, CSS and JavaScript minification might be good to add.

suspicious characters detecter/remover

New feature motivation

To detect differences between amazon.com and аmаzon.com. (and similiar)

New feature description

Find suspicious characters (like invisible character, cyrillic character).

New feature implementation

I know that symfony has a constraint for this but I am not familiar if there is something similiar in the js world, but I pretty sure there is as there is an npm package for everything.

Exec format error in arm64 docker images

all the docker image builds of arm64 are currently failing (exec format error, trying to run amd64 image in arm64)
the images are wrongly built due to an error in Dockerfile

my guess is fixing this line should address the problem

FROM --platform=$TARGETPLATFORM node:20-alpine AS runner

$BUILDPLATFORM is currently amd64 (64-bit runners of github), so amd64 builds are working as intended
$TARGETPLATFORM in target stage should correctly target for cross builds

Environment

  • string-is version: daveperrett/string-is:* [all the existing arm64 images]

Page share link wrong

Current behavior

hello ,i setup string-is with docker,and set a env value for NEXT_PUBLIC_ANALYTICS_DOMAIN AS mydomain.xyz ,when i use share button,it always copy to clipboard as http://localhost:3000/json-formatter?i=xxxx
what is worng ?,
i guest process.env.NEXT_PUBLIC_ANALYTICS_DOMAIN can't compile to a sure value when dockerfile build.
in my domain with docker
 my domain with docker js
in https://string.is/
string.is is

Environment

docker image daveperrett/string-is:v1.35.1

JSON to Table / Tree

New feature motivation

For large json data its good to be able to visualize in Table or Tree format as observed here: http://json2table.com/

New feature description

Ability to convert JSON to Table
Ability to convert JSON to Tree

Would be great to have this feature with already so many conversions available for JSON.

SQL format won't allow change of dialect on error

Current behavior

  1. Select SQL format action
  2. At this stage, SQL Dialect is greyed out
  3. Enter valid T-SQL code
  4. Error - not a valid code in default dialect
  5. SQL Dialect is greyed out (due to an error, presumably)
  6. Clear your input, enter valid code for default dialect
  7. Change the dialect to T-SQL
  8. Clear input and enter the T-SQL code
  9. Output is not formatted T-SQL code

Likewise, inserting functional code and changing dialect which causes parse error will lock user out of the dialect change:
stringis

Expected behavior

It should be possible to change the dialect on parse error, considering the target dialect may not result in an error.
Alternatively, it should be possible to change dialect while the input is blank.
Preferrably both.

Environment

  • string-is version: v1.37.3 027b426
  • Share link: please use below examples

Example code

  • Valid SQL: select yourfield
  • Valid T-SQL but invalid SQL: select [yourfield]

String Diff Feature

New feature motivation

Adding the ability to see a string diff.

New feature description

String difference is a common utility is one that I often turn to online functions for.

Two flows to do this:

  1. Have the input and output box on the sides of each other, and highlight the changes

image

  1. Take the two strings on the left side as input and show the output on the right

image

New feature implementation

I may not have the time to take a crack at building this, but poking around at the codebase, it seems that the usage is an Evergreen TextArea with a few styles applied for code formatting. I don't think the HTML text area natively supports highlighting, so that makes this a little more challenging.

The first option seems a little more difficult with the current components.

However, for the second design, the output, on the left side can be HTML, and for all the changes in string 2, you would calculate the "additions" and "diffs", and then add extra HTML wrap them with either a mark or span tag, with red for deletes, and green for additions with the changes from string 2, and render the output.

Great project so far!

textbox cannot be resized vertically

Current behavior

When attempting to resize the textbox, it only grows horizontally. This makes editing large documents tedious.

bugreport

Expected behavior

Resize should work along both axis

Environment

Tested on Chrome 121.0.6167.184 (Official Build) (x86_64) and Safari, on latest release

Chaining operations

New feature motivation

I use these kinds of tools in CFT challenges. Commonly strings are converted and manipulated in several steps. An ability to chain different string operations would be greatly helpful.

New feature description

Basically add the ability to spawn more operations below the first one, where the result of the first operation is used as input in the second operation, result of second operation is input for the third operation, and so forth.

https://onlinestringtools.com/ has this feature, and it is really useful.

To make it user friendly I suggest making it possible to change type, add, and remove operations even after adding chains.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.