Transpilyzer Online REPL is used for transpiling next generation JavaScript code into a backwards compatible version of JavaScript in real-time.
Check out the deployed site
- Frontend - React
- Code Editor - Codemirror
- Real-time Frontend Transpiler - Babel/Standalone
- Styling - Bootstrap
- Miscellaneous - Lodash
Without adding a transpilation delay feature in the application, the error message / output is displayed immediately while you are still typing. This is introduces bad User Experience (UX). So to fix this, the debounce method provided by lodash was used. This allows you to execute some code after a certain number of milliseconds has passed. Therefore in this application, the conversion/transpile function is called after 1000 milliseconds (after 1 second has passed) once user stops typing.
- Transpilation of modern JavaScript to backward compatible JavaScript
- TypeScript transpilation support
- React (JSX) transpilation support
- Light Mode and Night Mode
- Error display upon invalid syntax
- Remember unsaved changes even when you exit the browser (Code autosave)
At the root of your project run npm i and npm start to start the application.
