Crafting React Excellence: Guide to Creating Front-End Project Questions on Codejudge

Recognizing the pivotal role of React in modern web development, Codejudge introduces the practice of crafting front-end project-based questions. It helps  to evaluate candidates coding skills, problem-solving abilities, and the practical application of React concepts.

Follow these steps to create front-end project questions:

Step 1: Login to the Codejudge recruiter account and navigate to the "Questions" section. Click on the "My Company Questions" tab, and within the filter section, select the category  "Frontend Project". And click on the Create Question button.

‍

Step 2: On clicking the Create Question button, it will display a pop-up showing different question type choices and then select Frontend Project in the Project section.

‍

Step 3: On selecting the Frontend Project type, it will take you to the project information page where you can Select Environment as React and click on Next button.

‍

Step 4: On clicking the Next button, it will take you to the Basic Information page where you can enter the question Title, Short Description and Duration of the question. And click on Save and Next button.

‍

Step 5: On clicking the Next button, it will display the Question Description page where the recruiter can enter the question in the Problem Description. Exercises that the candidates need to be solved with Test Cases & Points.

‍

Step 6: And recruiters can specify the instructions in the Important Notes field and click on the Preview HTML button to view the question. 

‍

Step 7:  On clicking the Next button, it will display the Test Cases and Solution page. Here the recruiters can input solution code in the App.js folder and test cases in the tests.folder as 1.test.js.

‍

Step 8: Recruiters can also add the required dependencies to run the project by clicking on the Add Dependency button. And the right side prompt will show the real time console output for the written code. And click on the “Verify and Save” button to verify the given solution and test cases.

‍

Step 9: On clicking the Next button, it will display the Setup Boilerplate Code page where the recruiter can provide the default code to the candidate by adding all the files when solving this question in a test. It helps the candidate to focus and solve the exercises. And click on the Save Code button.

‍

Step 10: Recruiters can add the Tags to the programming questions, which helps in searching and organizing the questions based on Job Role, Difficulty Level, Experience Level and different skills and concepts as tags like String, Greedy, Heap, Recursion etc.

‍

Finally click on the Publish button to publish the project question.