{"id":30882,"date":"2023-08-22T04:08:24","date_gmt":"2023-08-22T04:08:24","guid":{"rendered":"https:\/\/www.process.st\/templates\/frontend-developer-onboarding\/"},"modified":"2024-03-05T13:44:34","modified_gmt":"2024-03-05T13:44:34","slug":"frontend-developer-onboarding","status":"publish","type":"post","link":"https:\/\/www.process.st\/templates\/frontend-developer-onboarding\/","title":{"rendered":"Frontend Developer Onboarding"},"content":{"rendered":"\n<section id=\"set-up-functional-workstation\"> \n <h2>Set up functional workstation<\/h2>\n <div class=\"text-content\">\n   Ensure that your workstation is set up and ready for work. This task is crucial as it allows you to start your work smoothly and efficiently. Verify that all hardware and software components are functioning correctly and have the necessary configurations. Familiarize yourself with the equipment and its features to maximize productivity. Take this opportunity to customize your workstation to suit your preferences and work style. \n <\/div> \n <div class=\"multi-select-content form-field-content\"> \n  <div class=\"form-group\"> <label> Checklist <\/label> \n  <\/div> \n  <ul class=\"items\"> \n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       1 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Unpack and set up your computer and peripherals \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       2 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Connect to the company's network \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       3 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Verify that all software and hardware are functioning correctly \n    <\/div> <\/li> \n  <\/ul> \n <\/div> \n<\/section> \n<section id=\"install-necessary-software-and-tools\"> \n <h2>Install necessary software and tools<\/h2>\n <div class=\"text-content\">\n   Install the essential software and tools required for your frontend development tasks. This includes code editors, web browsers, version control systems, and any other software that the frontend team relies on. Make sure to follow the provided installation guide or consult with your team members if you encounter any issues during the installation process. \n <\/div> \n <div class=\"multi-select-content form-field-content\"> \n  <div class=\"form-group\"> <label> Checklist <\/label> \n  <\/div> \n  <ul class=\"items\"> \n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       1 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Install code editor (e.g., Visual Studio Code, Sublime Text) \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       2 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Install web browsers (e.g., Google Chrome, Mozilla Firefox) \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       3 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Configure version control system (e.g., Git, SVN) \n    <\/div> <\/li> \n  <\/ul> \n <\/div> \n<\/section> \n<section id=\"provide-access-to-the-company-repositories\"> \n <h2>Provide access to the company repositories<\/h2>\n <div class=\"text-content\">\n   Gain access to the company's repositories on the version control system. This access is essential for collaborating with the team and retrieving codebases for project development. Request the necessary permissions and credentials to ensure seamless access. Familiarize yourself with the repository structure and guidelines to navigate and locate relevant projects effectively. \n <\/div> \n <div class=\"text-field-content form-field-content\"> \n  <div class=\"form-group\"> <label> Username <\/label> \n   <input type=\"text\" placeholder=\"Something will be typed here...\" disabled class=\"form-control\"> \n  <\/div> \n <\/div> \n <div class=\"text-field-content form-field-content\"> \n  <div class=\"form-group\"> <label> Password <\/label> \n   <input type=\"text\" placeholder=\"Something will be typed here...\" disabled class=\"form-control\"> \n  <\/div> \n <\/div> \n<\/section> \n<section id=\"receive-companys-code-style-guide\"> \n <h2>Receive company's code style guide<\/h2>\n <div class=\"text-content\">\n   Get acquainted with the company's code style guide, which defines the coding conventions, best practices, and standards followed by the frontend team. Understanding and adhering to the code style guide ensures consistency and readability across the codebase. Review the guide thoroughly and ask any questions or seek clarifications from senior team members. Consider bookmarking the style guide for easy reference during development. \n <\/div> \n <div class=\"file-field-content form-field-content\"> \n  <div class=\"form-group\"> <label> Upload the code style guide PDF document <\/label> \n   <div class=\"file-container\"> <button type=\"button\" disabled class=\"btn btn-default\"> <i class=\"fa fa-upload btn-icon\"><\/i> File will be uploaded here <\/button> \n   <\/div> \n  <\/div> \n <\/div> \n<\/section> \n<section id=\"approval-code-style-guide\"> \n <h2>Approval: Code Style Guide<\/h2>\n <div class=\"approval-content\"> \n  <div class=\"header\"> \n   <div class=\"list-title\">\n    Will be submitted for approval:\n   <\/div> \n  <\/div> \n  <div class=\"approval-rule-subject-tasks-list\"> \n   <ul class=\"list\"> \n    <li> \n     <div class=\"approval-rule-subject-tasks-list-item\"> \n      <div class=\"item\"> \n       <div class=\"container\"> <span class=\"title\">Receive company's code style guide<\/span> \n        <div class=\"body\">\n         Will be submitted\n        <\/div> \n       <\/div> \n      <\/div> \n     <\/div> <\/li> \n   <\/ul> \n  <\/div> \n <\/div> \n<\/section> \n<section id=\"introduction-to-frontend-team\"> \n <h2>Introduction to frontend team<\/h2>\n <div class=\"text-content\">\n   Get introduced to the frontend team members, including developers, designers, and team leads. This task plays a vital role in fostering collaboration, communication, and teamwork. Take this opportunity to learn about team roles, responsibilities, and areas of expertise. Familiarize yourself with the communication channels used by the team, such as Slack or email. \n <\/div> \n <div class=\"multi-select-content form-field-content\"> \n  <div class=\"form-group\"> <label> Meet the following team members <\/label> \n  <\/div> \n  <ul class=\"items\"> \n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       1 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      John Smith \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       2 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Emily Johnson \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       3 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Michael Brown \n    <\/div> <\/li> \n  <\/ul> \n <\/div> \n<\/section> \n<section id=\"understand-previous-projects\"> \n <h2>Understand previous projects<\/h2>\n <div class=\"text-content\">\n   Gain insights into the frontend projects previously undertaken by the team. This knowledge will provide context and help you understand the team's approach, technological stack, and design patterns. Take the time to review completed projects, documentation, and any relevant feedback. Understanding the successes and challenges of previous projects will enable you to contribute effectively to ongoing projects. \n <\/div> \n <div class=\"select-field-content form-field-content\"> \n  <div class=\"form-group\"> <label> Choose a previous project to review <\/label> <select disabled class=\"form-control\"> <option value=\"An option will be selected here\">An option will be selected here<\/option> <\/select> \n  <\/div> \n  <ul class=\"items\"> \n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       1 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Project A \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       2 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Project B \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       3 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Project C \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       4 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Project D \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       5 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Project E \n    <\/div> <\/li> \n  <\/ul> \n <\/div> \n<\/section> \n<section id=\"get-the-development-environment-ready\"> \n <h2>Get the development environment ready<\/h2>\n <div class=\"text-content\">\n   Prepare your development environment to ensure a seamless coding experience. Set up the necessary frameworks, libraries, and tools required for frontend development. Configure your code editor to match the coding conventions specified in the company's code style guide. Verify that the required dependencies and packages are installed to avoid any compatibility issues. \n <\/div> \n <div class=\"multi-select-content form-field-content\"> \n  <div class=\"form-group\"> <label> Checklist <\/label> \n  <\/div> \n  <ul class=\"items\"> \n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       1 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Install frontend framework (e.g., React, Angular) \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       2 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Set up build tools (e.g., Webpack, Gulp) \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       3 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Configure code editor with ESLint and Prettier extensions \n    <\/div> <\/li> \n  <\/ul> \n <\/div> \n<\/section> \n<section id=\"access-to-project-management-tools\"> \n <h2>Access to project management tools<\/h2>\n <div class=\"text-content\">\n   Obtain access to the project management tools used by the company. These tools facilitate task tracking, issue management, and team collaboration. Request the necessary permissions and credentials to access the project management platform. Familiarize yourself with the user interface and basic functionalities to effectively participate in project management activities. \n <\/div> \n <div class=\"text-field-content form-field-content\"> \n  <div class=\"form-group\"> <label> Username <\/label> \n   <input type=\"text\" placeholder=\"Something will be typed here...\" disabled class=\"form-control\"> \n  <\/div> \n <\/div> \n <div class=\"text-field-content form-field-content\"> \n  <div class=\"form-group\"> <label> Password <\/label> \n   <input type=\"text\" placeholder=\"Something will be typed here...\" disabled class=\"form-control\"> \n  <\/div> \n <\/div> \n<\/section> \n<section id=\"learn-about-the-project-management-workflow\"> \n <h2>Learn about the project management workflow<\/h2>\n <div class=\"text-content\">\n   Understand the project management workflow followed by the frontend team. This knowledge is crucial for effective collaboration, task assignment, and timely project completion. Review the documentation or guidelines provided by the team to familiarize yourself with the project lifecycle, communication channels, and reporting procedures. Ask questions to clarify any aspects that you find unclear. \n <\/div> \n <div class=\"textarea-field-content form-field-content\"> \n  <div class=\"form-group\"> <label> Describe the project management workflow as per the provided guidelines <\/label> <textarea placeholder=\"Something will be typed here...\" rows=\"3\" disabled class=\"form-control\"><\/textarea> \n  <\/div> \n <\/div> \n<\/section> \n<section id=\"approval-project-management-workflow\"> \n <h2>Approval: Project Management Workflow<\/h2>\n <div class=\"approval-content\"> \n  <div class=\"header\"> \n   <div class=\"list-title\">\n    Will be submitted for approval:\n   <\/div> \n  <\/div> \n  <div class=\"approval-rule-subject-tasks-list\"> \n   <ul class=\"list\"> \n    <li> \n     <div class=\"approval-rule-subject-tasks-list-item\"> \n      <div class=\"item\"> \n       <div class=\"container\"> <span class=\"title\">Learn about the project management workflow<\/span> \n        <div class=\"body\">\n         Will be submitted\n        <\/div> \n       <\/div> \n      <\/div> \n     <\/div> <\/li> \n   <\/ul> \n  <\/div> \n <\/div> \n<\/section> \n<section id=\"attend-project-meetings\"> \n <h2>Attend project meetings<\/h2>\n <div class=\"text-content\">\n   Participate in project meetings scheduled by the team. These meetings provide an opportunity to discuss project progress, challenges, and upcoming tasks. Actively engage in the discussions, ask questions, and share your insights or suggestions. Take notes or record minutes of the meeting to refer back to important decisions or action items. Demonstrating your involvement in project meetings fosters teamwork and collaboration. \n <\/div> \n <div class=\"multi-choice-content form-field-content\"> \n  <div class=\"form-group\"> <label> Choose your preferred meeting days <\/label> <select disabled class=\"form-control\"> <option value=\"\">Multiple options can be selected from this list<\/option> <\/select> \n  <\/div> \n  <ul class=\"items\"> \n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       1 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Monday \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       2 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Tuesday \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       3 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Wednesday \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       4 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Thursday \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       5 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Friday \n    <\/div> <\/li> \n  <\/ul> \n <\/div> \n<\/section> \n<section id=\"assign-the-first-tasks\"> \n <h2>Assign the first tasks<\/h2>\n <div class=\"text-content\">\n   Receive your first set of frontend development tasks from your team lead or project manager. These tasks will help you become acclimated with the codebase, development process, and project requirements. Analyze the tasks and seek clarification if needed. Prioritize the tasks based on their dependencies and deadlines. Break down complex tasks into smaller subtasks if necessary to improve manageability. \n <\/div> \n <div class=\"multi-select-content form-field-content\"> \n  <div class=\"form-group\"> <label> First tasks to complete <\/label> \n  <\/div> \n  <ul class=\"items\"> \n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       1 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Implement UI components for homepage \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       2 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Fix responsive layout issues on contact page \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       3 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Optimize image loading on product listing page \n    <\/div> <\/li> \n  <\/ul> \n <\/div> \n<\/section> \n<section id=\"introduction-to-design-team\"> \n <h2>Introduction to design team<\/h2>\n <div class=\"text-content\">\n   Get introduced to the design team responsible for creating user interfaces and user experiences. Establishing a strong relationship with the design team is essential for seamless collaboration and consistent visual aesthetics. Learn about their design process, tools, and any specific considerations for frontend development tasks. Offer your assistance and support in translating design concepts into functional frontend components. \n <\/div> \n <div class=\"members-field-content form-field-content\"> \n  <div class=\"form-group\"> <label> Select a design team member to contact (if needed) <\/label> <select disabled class=\"form-control\"> <option value=\"A member or group will be selected here\">A member or group will be selected here<\/option> <\/select> \n  <\/div> \n <\/div> \n<\/section> \n<section id=\"get-familiar-with-companys-uiux-standards\"> \n <h2>Get familiar with company's UI\/UX standards<\/h2>\n <div class=\"text-content\">\n   Familiarize yourself with the company's UI\/UX standards to maintain consistent user experiences across projects. Review the UI\/UX guidelines and documentation provided by the design team. Pay attention to typography, color schemes, layout principles, and interaction patterns. Ensure that your frontend development aligns with these standards to deliver cohesive and user-friendly interfaces. \n <\/div> \n <div class=\"select-field-content form-field-content\"> \n  <div class=\"form-group\"> <label> Choose a UI\/UX standard topic to review <\/label> <select disabled class=\"form-control\"> <option value=\"An option will be selected here\">An option will be selected here<\/option> <\/select> \n  <\/div> \n  <ul class=\"items\"> \n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       1 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Color palettes \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       2 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Typography guidelines \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       3 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Grid system \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       4 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Iconography \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       5 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Component naming conventions \n    <\/div> <\/li> \n  <\/ul> \n <\/div> \n<\/section> \n<section id=\"approval-uiux-standards\"> \n <h2>Approval: UI\/UX Standards<\/h2>\n <div class=\"approval-content\"> \n  <div class=\"header\"> \n   <div class=\"list-title\">\n    Will be submitted for approval:\n   <\/div> \n  <\/div> \n  <div class=\"approval-rule-subject-tasks-list\"> \n   <ul class=\"list\"> \n    <li> \n     <div class=\"approval-rule-subject-tasks-list-item\"> \n      <div class=\"item\"> \n       <div class=\"container\"> <span class=\"title\">Get familiar with company's UI\/UX standards<\/span> \n        <div class=\"body\">\n         Will be submitted\n        <\/div> \n       <\/div> \n      <\/div> \n     <\/div> <\/li> \n   <\/ul> \n  <\/div> \n <\/div> \n<\/section> \n<section id=\"review-frontend-testing-procedures\"> \n <h2>Review frontend testing procedures<\/h2>\n <div class=\"text-content\">\n   Review the frontend testing procedures followed by the team. Understanding the testing methodologies and tools employed ensures the delivery of high-quality and bug-free code. Familiarize yourself with unit testing, integration testing, and any other applicable testing practices. Identify the required testing frameworks and libraries and ensure that they are correctly set up in your development environment. \n <\/div> \n <div class=\"select-field-content form-field-content\"> \n  <div class=\"form-group\"> <label> Choose a testing procedure to review <\/label> <select disabled class=\"form-control\"> <option value=\"An option will be selected here\">An option will be selected here<\/option> <\/select> \n  <\/div> \n  <ul class=\"items\"> \n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       1 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Unit testing with Jest \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       2 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      End-to-end testing with Cypress \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       3 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Browser compatibility testing \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       4 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Performance testing \n    <\/div> <\/li>\n   <li class=\"item\"> \n    <div class=\"step-number-container\"> \n     <div class=\"step-number\">\n       5 \n     <\/div> \n    <\/div> \n    <div class=\"step-checkbox-container\"> \n     <div class=\"step-checkbox\"><\/div> \n    <\/div> \n    <div class=\"item-name-static\">\n      Accessibility testing \n    <\/div> <\/li> \n  <\/ul> \n <\/div> \n<\/section> \n<section id=\"understand-deployment-procedures\"> \n <h2>Understand deployment procedures<\/h2>\n <div class=\"text-content\">\n   Gain an understanding of the deployment procedures employed by the frontend team. This knowledge is crucial for delivering the developed features to production environments. Review the deployment documentation or guidelines provided by the team. Familiarize yourself with the deployment scripts, version control branching strategies, and any other relevant procedures. Seek guidance from senior team members if needed. \n <\/div> \n <div class=\"text-field-content form-field-content\"> \n  <div class=\"form-group\"> <label> Deployment script location <\/label> \n   <input type=\"text\" placeholder=\"Something will be typed here...\" disabled class=\"form-control\"> \n  <\/div> \n <\/div> \n<\/section> \n<section id=\"approval-deployment-procedures\"> \n <h2>Approval: Deployment Procedures<\/h2>\n <div class=\"approval-content\"> \n  <div class=\"header\"> \n   <div class=\"list-title\">\n    Will be submitted for approval:\n   <\/div> \n  <\/div> \n  <div class=\"approval-rule-subject-tasks-list\"> \n   <ul class=\"list\"> \n    <li> \n     <div class=\"approval-rule-subject-tasks-list-item\"> \n      <div class=\"item\"> \n       <div class=\"container\"> <span class=\"title\">Understand deployment procedures<\/span> \n        <div class=\"body\">\n         Will be submitted\n        <\/div> \n       <\/div> \n      <\/div> \n     <\/div> <\/li> \n   <\/ul> \n  <\/div> \n <\/div> \n<\/section> \n<section id=\"performance-review-of-first-tasks-completed\"> \n <h2>Performance review of first tasks completed<\/h2>\n <div class=\"text-content\">\n   Reflect on the first set of frontend development tasks that you have completed. Evaluate your performance, identify areas of improvement, and celebrate your achievements. Consider the quality, efficiency, and adherence to project requirements in your assessment. Seek feedback from your team lead or project manager to gain valuable insights. Utilize this feedback to enhance your future work and contribute effectively to upcoming projects. \n <\/div> \n <div class=\"textarea-field-content form-field-content\"> \n  <div class=\"form-group\"> <label> Describe your performance and areas of improvement based on the feedback received <\/label> <textarea placeholder=\"Something will be typed here...\" rows=\"3\" disabled class=\"form-control\"><\/textarea> \n  <\/div> \n <\/div> \n<\/section>\n","protected":false},"excerpt":{"rendered":"<p>Set up functional workstation Ensure that your workstation is set up and ready for work. This task is crucial as it allows you to start your work smoothly and efficiently. Verify that all hardware and software components are functioning correctly and have the necessary configurations. Familiarize yourself with the equipment and its features to maximize [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"ep_exclude_from_search":false,"cover_icon_emoji":"\ud83d\udc68\u200d\ud83d\udcbb","cover_icon_url":"","tasks_count":"20","template_description":"","template_id":"gRYgTlGqRsb4TKCivd9GjQ","task_0":"Set up functional workstation","task_slug_0":"set-up-functional-workstation","task_1":"Install necessary software and tools","task_slug_1":"install-necessary-software-and-tools","task_2":"Provide access to the company repositories","task_slug_2":"provide-access-to-the-company-repositories","task_3":"Receive company's code style guide","task_slug_3":"receive-companys-code-style-guide","task_4":"Approval: Code Style Guide","task_slug_4":"approval-code-style-guide","task_5":"Introduction to frontend team","task_slug_5":"introduction-to-frontend-team","task_6":"Understand previous projects","task_slug_6":"understand-previous-projects","task_7":"Get the development environment ready","task_slug_7":"get-the-development-environment-ready","task_8":"Access to project management tools","task_slug_8":"access-to-project-management-tools","task_9":"Learn about the project management workflow","task_slug_9":"learn-about-the-project-management-workflow","task_10":"Approval: Project Management Workflow","task_slug_10":"approval-project-management-workflow","task_11":"Attend project meetings","task_slug_11":"attend-project-meetings","task_12":"Assign the first tasks","task_slug_12":"assign-the-first-tasks","task_13":"Introduction to design team","task_slug_13":"introduction-to-design-team","task_14":"Get familiar with company's UI\/UX standards","task_slug_14":"get-familiar-with-companys-uiux-standards","task_15":"Approval: UI\/UX Standards","task_slug_15":"approval-uiux-standards","task_16":"Review frontend testing procedures","task_slug_16":"review-frontend-testing-procedures","task_17":"Understand deployment procedures","task_slug_17":"understand-deployment-procedures","task_18":"Approval: Deployment Procedures","task_slug_18":"approval-deployment-procedures","task_19":"Performance review of first tasks completed","task_slug_19":"performance-review-of-first-tasks-completed","task_20":"","task_slug_20":"","task_21":"","task_slug_21":"","task_22":"","task_slug_22":"","task_23":"","task_slug_23":"","task_24":"","task_slug_24":"","task_25":"","task_slug_25":"","task_26":"","task_slug_26":"","task_27":"","task_slug_27":"","task_28":"","task_slug_28":"","task_29":"","task_slug_29":"","task_30":"","task_slug_30":"","task_31":"","task_slug_31":"","task_32":"","task_slug_32":"","task_33":"","task_slug_33":"","task_34":"","task_slug_34":"","task_35":"","task_slug_35":"","task_36":"","task_slug_36":"","task_37":"","task_slug_37":"","task_38":"","task_slug_38":"","task_39":"","task_slug_39":"","task_40":"","task_slug_40":"","task_41":"","task_slug_41":"","task_42":"","task_slug_42":"","task_43":"","task_slug_43":"","task_44":"","task_slug_44":"","task_45":"","task_slug_45":"","task_46":"","task_slug_46":"","task_47":"","task_slug_47":"","task_48":"","task_slug_48":"","task_49":"","task_slug_49":"","task_50":"","task_slug_50":"","task_51":"","task_slug_51":"","task_52":"","task_slug_52":"","task_53":"","task_slug_53":"","task_54":"","task_slug_54":"","task_55":"","task_slug_55":"","task_56":"","task_slug_56":"","task_57":"","task_slug_57":"","task_58":"","task_slug_58":"","task_59":"","task_slug_59":"","task_60":"","task_slug_60":"","task_61":"","task_slug_61":"","task_62":"","task_slug_62":"","task_63":"","task_slug_63":"","task_64":"","task_slug_64":"","task_65":"","task_slug_65":"","task_66":"","task_slug_66":"","task_67":"","task_slug_67":"","task_68":"","task_slug_68":"","task_69":"","task_slug_69":"","task_70":"","task_slug_70":"","task_71":"","task_slug_71":"","task_72":"","task_slug_72":"","task_73":"","task_slug_73":"","task_74":"","task_slug_74":"","task_75":"","task_slug_75":"","task_76":"","task_slug_76":"","task_77":"","task_slug_77":"","task_78":"","task_slug_78":"","task_79":"","task_slug_79":"","task_80":"","task_slug_80":"","task_81":"","task_slug_81":"","task_82":"","task_slug_82":"","task_83":"","task_slug_83":"","task_84":"","task_slug_84":"","task_85":"","task_slug_85":"","task_86":"","task_slug_86":"","task_87":"","task_slug_87":"","task_88":"","task_slug_88":"","task_89":"","task_slug_89":"","task_90":"","task_slug_90":"","task_91":"","task_slug_91":"","task_92":"","task_slug_92":"","task_93":"","task_slug_93":"","task_94":"","task_slug_94":"","task_95":"","task_slug_95":"","task_96":"","task_slug_96":"","task_97":"","task_slug_97":"","task_98":"","task_slug_98":"","task_99":"","task_slug_99":"","footnotes":""},"categories":[11,9],"tags":[],"class_list":["post-30882","post","type-post","status-publish","format-standard","hentry","category-employee-onboarding","category-it"],"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.process.st\/templates\/wp-json\/wp\/v2\/posts\/30882","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.process.st\/templates\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.process.st\/templates\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.process.st\/templates\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/www.process.st\/templates\/wp-json\/wp\/v2\/comments?post=30882"}],"version-history":[{"count":0,"href":"https:\/\/www.process.st\/templates\/wp-json\/wp\/v2\/posts\/30882\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.process.st\/templates\/wp-json\/wp\/v2\/media?parent=30882"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.process.st\/templates\/wp-json\/wp\/v2\/categories?post=30882"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.process.st\/templates\/wp-json\/wp\/v2\/tags?post=30882"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}