Code menu tabs in react and create react component with hooks

Some relevant hints and used technologies: React.js (functional base - hooks) only - No JQuerry.

Read everything carefully. Only provide a bid if you are really able and experienced enough to meet the described requirements.

Please code a React component menu tab component for me of the frontend component seen in the screenshot attached.

See it live here [login to view URL] (scroll down).

Always use functional components, so hooks..., where relevant.

It must 100% work and look similar (despite 2 below).

Some important criteria to take care of:

1 Must be responsive - exact as on [login to view URL]

2 Add a (react-router) link for the main content in the middle for each menu type (see screenshot 2 attached).

3 Use bootstrap css classes only where possible and makes sense. Do not integrate bootstrap in total, only used css classes in css file

4 Use self-named classes where bootstrap does not make sense.

5 Timing of change of menu buttons must be same.

6 Change must stop if click on a menu button

7 Take care of same hover effect

8 Data like text (menu buttons and heading below object), links and icons must be served/structured via JSON within the component

Explain to me for each task described below what exactly you did and changed to achieve in case needed from my side.

If the code is clean and follows common conventions, I do not expect that there is a need to ask you that much.

Document the code in the component adding an understandable short description at the respective position.

Some further conditions of the project as a result of my experiences here on freelancer:

Everything must work properly on my machine in my project. Only then I release the entire sum at once.

We can also use anydesk or teamviewer where you can directly check and work in case it does not work on my machine.

I do not use create-react-app; I implemented an own react biotop with babel and webpack.

In case of questions, I can ask you, you can ask me, too.

NO Scammers and NO bargaining and No Asking for tip after contract approval or project finalization!

Please don't ask me to send you my entire project to work on it as this is impossible. I can provide the code which is relevant to my view.

Only efficient JS/JSX solution with the smallest possible performance need. No complicated solutions, or workarounds, no spaghetti code.

No JQuery. No further packages if not needed or wanted.

All indications without engagement, subject to small modifications.

CSS JavaScript HTML5 React.js

Identifikační číslo projektu: #29398633

O projektu