Neditor is a versatile online sandbox playground designed for developers seeking a quick and efficient way to experiment with JavaScript. With code cells and text cells, users can easily write, run, and document their code snippets, creating a hassle-free environment for exploration.
- Flexible Structure: Arrange code cells and text cells in any order and quantity to suit your workflow.
- Persistence: Your data is stored locally, ensuring privacy, and cannot be shared between users.
- Technologies Used: Built with React, TypeScript, Redux, redux-persist, monaco-editor/react, uiw/react-md-editor and Bulmaswatch.
- Deployment: Automated and accelerated development lifecycle, ensuring consistent and reliable deployments - AWS Amplify
- For Markdown documentation style text editor, use the Add Text button
- For JavaScript sandbox code editor, use the Add Code top right corner of each individual cell
- For deleting a cell there is a cross button in the top right corner of each individual cell as well
- For previewing results of your code, there is a built-in "show()" function which allows you to log the results to the preview window
- If you'd like to resize your editors, use the dotted components on each cell to drag and resize as needed.
- Messy code? Don't worry! The Format button inside the code cell should take care of that for you. Just use it as needed!
Built on the single responsibility concept, Neditor leverages TypeScript's strict typing for enhanced code quality and maintainability. The interface is intentionally uncomplicated and user-friendly, providing a polished and seamless experience for developers of all levels.
As the creator of Neditor, this project has been instrumental in honing TypeScript skills and gaining a deeper understanding of React development.
Feel free to contribute, report issues, or suggest improvements. Your feedback is valuable in making Neditor an even more powerful and user-friendly tool.
- Clone the repository
- Install dependencies using
npm install --legacy-peer-deps; - Run the application using
npm run start;
Note: Use
--legacy-peer-depsto restore peerDependency installation behavior from NPM v4 through v6. Issue seems to stem from using react v 17+. See following stackoverflow thread for more info on the matter.
This project was developed as part of Stephen Grinder's: React and Typescript: Build a Portfolio Project Udemy course. Special thanks to Stephen for providing valuable insights and knowledge.
- Udemy Course: React and Typescript: Build a Portfolio Project
- Instructor: Stephen Grinder