Getting Started with Create React App

This project was bootstrapped with Create React App.

Available Scripts

In the project directory, you can run:

yarn start

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.
You will also see any lint errors in the console.

Project Description

This project was created as a test-task.

I needed:

Develop a SPA with React.js: a text-based note editor with tags. Technical requirements:

1. React.js hooks;
2. Using TypeScript;
3. Using the UI library;
4. Use a state manager.

How it works

► You can create a new note. Just click the "Create a new note" button.

► When you write a note, you can use hashtags. Hashtags are highlighted and shown below the note. Hashtags help you filter your posts.

► You can edit or delete a note.

Challenges and solving

The biggest challenge was to create a text editor that would highlight hashtags in note writing mode. I tried different ways to solve the problem:

• I used the div tag with attribute contenteditable
• I was looking for different ways to create input
• Also I found property dangerouslySetInnerHTML, but of course I didn't use it.
• And I found Draft.js (is a JavaScript rich text editor framework, built for React and backed by an immutable model). I found this method the most convenient, understandable and most suitable. Thus, I settled on this method.