GitLab Incubation Guide - Migrating a Haml Page to a vue component

TL;DR

Learn how to convert Hammer components to View components, allowing for code reuse and easier updates.

Transcript

hello everyone uh this will be a recording uh with a tutorial on how to migrate a component a patients written in Hammer to a view component first of all why would you want to do that the component we're gonna convert over here the page is very simple it doesn't have any extra user interactions but uh and doesn't have any API calls anything else it... Read More

Key Insights

• 👨‍💻 Converting Hammer components to View components allows for code reuse and reduces the amount of code that needs to be reviewed.
• 🫵 By passing data through JSON and using helper functions, information can be seamlessly transferred from Ruby/Hammer to View components.
• 💁 Pagination can be easily implemented in View components using the key_set_paginate method and passing pagination info to the component.

Questions & Answers

Q: Why would you want to migrate a Hammer component to a View component?

Migrating to a View component allows for code reuse, reducing the amount of code that needs to be written and reviewed. It also makes updating and adding interactions easier in the future.

Q: What are the key steps involved in converting a Hammer component to a View component?

The key steps include creating a new View component file, updating the controller to build the component, passing data from Ruby/Hammer to View, and including any necessary incubation components.

Q: How can data be passed from Ruby/Hammer to a View component?

Data can be passed through a JSON format. The controller can generate the JSON using the json.generate method, and then it can be accessed in the View component using a helper function.

Q: How can pagination be implemented in a View component?

Pagination can be implemented using the key_set_paginate method. It involves fetching the cursor from params, setting the desired limit, and passing the pagination info to the View component.

Key Insights:

• Converting Hammer components to View components allows for code reuse and reduces the amount of code that needs to be reviewed.
• By passing data through JSON and using helper functions, information can be seamlessly transferred from Ruby/Hammer to View components.
• Pagination can be easily implemented in View components using the key_set_paginate method and passing pagination info to the component.
• The incubation alert component can be used to improve communication with users and provide clear expectations for features being developed.

Summary & Key Takeaways

• This tutorial demonstrates the process of converting a Hammer component to a View component for code reuse and easier updates.

• The tutorial covers the location of files, passing data between Ruby/Hammer and View, and introduces incubation components.

• The tutorial also explains how to create a View component, build a controller, and handle pagination.

• Additionally, it showcases the use of an alert component for better communication with users.