Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

Bit-Developer/text-compare-angular

 
 

Repository files navigation

Text Compare Tool

This app is used to compare text, built with Angular and Monaco Editor. image

Function

This app can determine the different content for the given 'Original Text' and 'Changed Text'. It is based on Monaco Diff Editor and currently supporting the following features:

  • Syntax highlighting for 45+ languages, including c, c++, java, javascript, html, typescript, etc.
  • Three editor themes: Visual Studio, Visual Studio Dark and High Contrast Dark.
  • Diff Mode: Side by Side Diff, Inline Diff.

Technology

  • Frontend Framework: Angular
  • Styling: bootstrap
  • Text Editor: ngx-monaco-editor

Demo

Two available demos:

Note: The demo websites may be slow when you access them for the first time. Be patient!

Setup Locally

git clone https://github.com/jojozhuang/text-compare-angular.git
cd text-compare-angular
npm install
npm start

Access http://localhost:12010/ in web browser and click 'Text Compare' menu, enjoy!

Setup in Docker

git clone https://github.com/jojozhuang/text-compare-angular.git
cd text-compare-angular
npm install
docker build -t text-compare-angular .
docker run --name text-compare-angular -p 8080:80 text-compare-angular

Access http://localhost:8080/ in web browser and click 'Text Compare' menu, enjoy!

Deployment

Read tutorial Deploying Text Compare Angular App to Docker to learn how this angular app is deployed to Docker.

Read tutorial Deploying Text Compare Angular App to Netlify to learn how this angular app is deployed to Netlify.

Portfolio

Read portfolio Text Compare(Angular) to learn the main functions of this text compare tool.

Tutorial

Read tutorial Building Online Text Compare Tool with Angular to learn how this text compare tool is built.

About

A tool used to compare text and show difference, built with Angular and Monaco Editor.

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published
Morty Proxy This is a proxified and sanitized view of the page, visit original site.