What is a Frontend Framework Test? A Frontend Framework Test assesses a developer's proficiency in working with frontend frameworks like React. It evaluates skills related to building user interfaces, managing state, and integrating APIs.

Step by step on how to create a front-end module #

Our frontend test’s core idea is to offer participants a template project for them to either build upon or use. This enables us to automate the grading process by setting specific milestones that determine participants’ success.

You can opt to create a “Front End Framework” which will lead you to the following page:

This module has already been automatically generated but has not been completed yet! Every component here is crucial, so please review each element meticulously.

1. Module name _^IMPORTANT
   Initially, we will populate it with the title “Untitled Module” by default.
2. Module detail bar
   You can configure specific details for this particular module.
   • Module duration _^IMPORTANT
     You can select the maximum duration within which participants are allowed to work on this assessment. The range varies from 5 minutes to a maximum of 1 hour.
   • Module language
     You have the option to choose English, Bahasa Indonesia, or both languages. Simply click on the desired language(s) until they turn blue.
   • Description
     Provide a description to inform other users about the content and purpose of this module.
   • Instruction
     Change the instructions to guide participants on what to expect and any specific preparations they need to make before starting the test. Rest assured, we have already provided default content by default. Therefore, there’s no need to worry about making changes.
   • Difficulty level
     You can choose from options such as ‘No Difficulty,’ ‘Easy,’ ‘Medium,’ and ‘Complex’ to indicate the level of difficulty for this module.”
   • Category _^IMPORTANT
     Tagging under the appropriate category that best suits this test.
   • Suitable Position _^IMPORTANT
     Tagging under the appropriate job category that best suits this test.

1. Activated Framework _^IMPORTANT
   You have the flexibility to choose a specific framework for this module. You can only choose 1 framework per module.
2. Maximum test run _^IMPORTANT
   Defining the maximum number of test runs allowed per participant. We have imposed a limit on this due to the resource-intensive nature of running such assessments.
3. Question description _^IMPORTANT
   Enter the question description in this space. You are welcome to include images or files to enhance the content.
4. Participant limitation
   Check them if you’re allowing the participant to create files or folders.
5. Components
   • First, you will need to add or configure your component
   • Add the component name and its React path.
   • Repeat this step for each additional component you want to add.
6. Test Cases
   Unlike traditional programming logic or spreadsheets, we employ unit testing to assess this module.
   • Add the name of the selected test case
   • Choose the component related to this test case
   • Add action events such as click, change, etc.
   • Put the expected result for the input of the specific action above.
   • Repeat this step to add more test cases.
7. Generate the test case by pressing the “Generate” button.
8. Initial file _^IMPORTANT
   The initial file is where you can set up the boilerplate for this module.
9. To complete the process, click ‘Save’ to submit your final changes. If you’d like to see a preview of the module, click on ‘Preview’.

Pro Tip: It's always a good practice to test your solution before assigning the test to participants. Once you've added all the test cases, you can use the "Run Solution" feature to test your code.

FAQ On Front End Module #

Can I add multiple questions to this module type? #

No, Algobash 2.0 does not support multiple questions within this module type. Each module is designed to focus on a single question.

What occurs if I activate multiple languages? #

If you activate more than one language, participants will be able to view and interact with the assessment in their preferred language. However, it’s important to note that you’ll need to input translations for question descriptions and options in each of the activated languages to ensure a seamless experience for participants.

Can I preview the module before finalizing it? #

Yes, you can preview the module by clicking the “Preview” button. This enables you to review how the module will appear to participants before saving the changes.

What if I want to make changes after creating the module? #

You can always edit and modify the module by accessing it from your module list:

Click the ‘Details’ button and click the “Edit” button.

Can I reuse the same module for different assessments? #

Yes, you can reuse the same module for different assessments within your organization. This feature streamlines the creation process and ensures consistency.

Can I tailor the test to specific roles or industries? #

Absolutely, you can customize the programming test to align with the specific skills and tasks relevant to roles within your organization.

Alternatively, we can create a custom module tailored to your specific requirements.

Are Online Resources Allowed During the Test? #

It depends on your testing approach. Open-book tests might encourage candidates to refer to resources, while closed-book tests evaluate their independent knowledge.

Which Frontend Frameworks Can I Cover? #

At present, our support is limited to React JS.