This is an application where user can input employee data (annual salary, super rate, etc.) and get a payslip on a separate page. The application is a single page application made on top of React and Next.js.

The complete task is located here: https://docs.google.com/document/d/1gSB-NJh4yIPLnEMNVBTawo7444rZkfIVyq0icxWEv9s

1. Install Node.js.
2. Open a terminal and go to an empty directory where you want to install the application.
3. Download the code

   git clone https://github.com/Finesse/test-task-employee-payslip.git .

4. Install the dependencies

   npm install

5. Start the application

   npm run build
   npm run start

6. Open http://localhost:3000 in your browser.
7. Press Ctrl+C in the terminal to stop the application.

The application architecture fully inherits the suggested Next.js architecture. The pages root React components are located in the pages directory. All the other React components are located in the components directory. The pure business logic code is located in the models directory.

The form input data is passed to the result page using the React Context API. The pages/_app.js file, which contains a parent React component for all the pages, creates a context provider. The form on the index page consumes the context, calls it's function to set an employee data to the context and just redirects the user. In its turn, the result page consumes the context and uses it's data to display a payslip.

The form component uses the React Form package to control the inputs state.

To start a development version of the application, run

npm run dev

It will enable hot reload so when you edit a file, changes will appear on the browser page without a page reload.